/* ===== FORÇAR ESTILOS DOS CARDS ===== */

/* Reset e forçar grid */
.plataforma-cards,
.aulas-cards {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(400px, 1fr)) !important;
    gap: 2rem !important;
    margin: 2rem 0 !important;
    padding: 1rem !important;
    width: 100% !important;
    max-width: none !important;
}

/* Forçar estilos dos cards */
.plataforma-card,
.aula-card {
    background: #ffffff !important;
    border-radius: 20px !important;
    box-shadow: 
        0 10px 30px rgba(0, 0, 0, 0.1),
        0 4px 10px rgba(0, 0, 0, 0.05),
        0 0 0 1px rgba(26, 51, 83, 0.08) !important;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1) !important;
    overflow: hidden !important;
    border: 2px solid rgba(26, 51, 83, 0.1) !important;
    position: relative !important;
    min-height: 400px !important;
    margin-bottom: 2rem !important;
    width: 100% !important;
    max-width: none !important;
    isolation: isolate !important;
    contain: layout style paint !important;
}

/* Forçar barra superior */
.plataforma-card::before,
.aula-card::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 6px !important;
    background: linear-gradient(90deg, #1a3353 0%, #e0bf5e 50%, #ce0001 100%) !important;
    z-index: 2 !important;
    display: block !important;
}

/* Forçar hover */
.plataforma-card:hover,
.aula-card:hover {
    transform: translateY(-12px) scale(1.02) !important;
    box-shadow: 
        0 25px 50px rgba(0, 0, 0, 0.15),
        0 10px 20px rgba(0, 0, 0, 0.1),
        0 0 0 1px rgba(26, 51, 83, 0.15) !important;
    border-color: rgba(26, 51, 83, 0.2) !important;
}

/* Forçar header */
.plataforma-card-header,
.aula-card-header {
    background: linear-gradient(135deg, #1a3353 0%, #2a4a7a 50%, #1a3353 100%) !important;
    color: #ffffff !important;
    padding: 1.5rem 2rem !important;
    border-bottom: 2px solid rgba(255, 255, 255, 0.1) !important;
    position: relative !important;
    overflow: hidden !important;
    min-height: 80px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    margin: 0 !important;
}

/* Forçar shimmer */
.plataforma-card-header::before,
.aula-card-header::before {
    content: '' !important;
    position: absolute !important;
    top: -50% !important;
    right: -50% !important;
    width: 100% !important;
    height: 100% !important;
    background: radial-gradient(circle, rgba(224, 191, 94, 0.2) 0%, transparent 70%) !important;
    animation: shimmer 4s ease-in-out infinite !important;
    display: block !important;
}

/* Forçar corpo */
.plataforma-card-body,
.aula-card-body {
    padding: 2rem !important;
    background: linear-gradient(145deg, #ffffff 0%, #f8f9fa 100%) !important;
    min-height: 320px !important;
    display: flex !important;
    flex-direction: column !important;
    position: relative !important;
    z-index: 1 !important;
    margin: 0 !important;
}

/* Forçar campos */
.plataforma-field,
.aula-field {
    margin-bottom: 1.5rem !important;
    position: relative !important;
    padding: 0.5rem 0 !important;
    border-bottom: 1px solid rgba(26, 51, 83, 0.05) !important;
    width: 100% !important;
}

/* Forçar ações */
.plataforma-actions,
.aula-actions {
    display: flex !important;
    gap: 1rem !important;
    flex-wrap: wrap !important;
    margin-top: auto !important;
    padding-top: 1.5rem !important;
    border-top: 2px solid rgba(26, 51, 83, 0.08) !important;
    background: linear-gradient(145deg, rgba(26, 51, 83, 0.03) 0%, rgba(224, 191, 94, 0.03) 100%) !important;
    border-radius: 12px !important;
    padding: 1.5rem !important;
    margin: 1.5rem -1rem -1rem -1rem !important;
    position: relative !important;
    z-index: 2 !important;
    width: calc(100% + 2rem) !important;
}

/* Forçar responsividade */
@media (max-width: 768px) {
    .plataforma-cards,
    .aulas-cards {
        grid-template-columns: 1fr !important;
        gap: 1.5rem !important;
        padding: 0.5rem !important;
    }
    
    .plataforma-card,
    .aula-card {
        margin-bottom: 1.5rem !important;
    }
}

/* Forçar animação shimmer */
@keyframes shimmer {
    0%, 100% { 
        transform: translateX(-100%) translateY(-100%) rotate(45deg) !important; 
        opacity: 0 !important;
    }
    50% { 
        transform: translateX(100%) translateY(100%) rotate(45deg) !important; 
        opacity: 1 !important;
    }
}