/* DANCE SCORE — Estilos globais */

/* ============================================================
   Cores SEMÂNTICAS do domínio (não confundir com cores da marca).
   Condutor = azul denim sóbrio · Conduzida = bordô sóbrio.
   Usar SEMPRE a variável, nunca o hex direto.
   ============================================================ */
:root {
    --cor-condutor: #1E3A8A;        /* azul denim sóbrio */
    --cor-condutor-claro: #2D4FB3;  /* hover */
    --cor-conduzida: #8B2E3F;       /* borgonha/vinho sóbrio */
    --cor-conduzida-claro: #A8425A; /* hover */
    --cor-header-card: #050F1E;     /* neutro: headers de cards padrão (= header da app) */
    /* Versões claras para TEXTO sobre fundo escuro (mantêm o matiz, mas legíveis) */
    --cor-condutor-texto: #5B8DEF;  /* azul claro */
    --cor-conduzida-texto: #D77A8C; /* borgonha claro */
}

@keyframes spin-once {
    from { transform: rotate(0deg); }
    to   { transform: rotate(360deg); }
}
.spin-once {
    display: inline-block;
    animation: spin-once 0.6s ease-in-out;
}

body {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

/* Navbar fixa com sombra */
.navbar {
    box-shadow: 0 2px 8px rgba(0,0,0,0.3);
}

/* Card hover suave */
.card {
    border-radius: 10px;
    transition: box-shadow 0.2s;
}

/* Campos de nota com destaque */
.campo-nota {
    font-size: 1.4rem !important;
    font-weight: bold !important;
    letter-spacing: 2px;
}

/* Badge de status */
.badge {
    font-size: 0.8rem;
}

/* Linha zebrada nas tabelas */
.table-hover tbody tr:hover {
    background-color: rgba(255, 193, 7, 0.08);
}

/* Card do par no resumo ADM */
#containerResumo .card {
    border-left: 4px solid #ffc107;
}

/* Avatar placeholder (quando não tem foto) */
.avatar-placeholder {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    background-color: #dee2e6;
    color: #6c757d;
    border-radius: 6px;
    font-size: 1.1rem;
    flex-shrink: 0;
}
.avatar-placeholder.avatar-sm {
    width: 32px;
    height: 32px;
    font-size: 0.95rem;
}

/* Preview de foto nos modais */
.foto-preview {
    width: 180px;
    height: 180px;
    border: 2px dashed #ccc;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    background: #f5f5f5;
}
.foto-preview img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Responsivo mobile — botão de enviar maior */
@media (max-width: 576px) {
    .campo-nota {
        font-size: 1.8rem !important;
    }

    .btn-lg {
        font-size: 1.1rem;
    }
}

/* ============================================================
   MODAIS — identidade Dance Score
   Tipos: .dsm-criar (dourado) · .dsm-editar (azul) · .dsm-info (dourado sutil)
   Exclusão = SweetAlert (vermelho), estilizado mais abaixo.
   ============================================================ */
.modal-content {
    --bs-modal-border-radius: 12px;   /* faz o header arredondar junto, sem overflow:hidden */
    border-radius: 12px;
    border: 1px solid rgba(216, 154, 31, .2);
    box-shadow: 0 20px 60px rgba(0, 0, 0, .4);
    animation: dsmIn .2s ease;
}
@keyframes dsmIn {
    from { opacity: 0; transform: scale(.95); }
    to   { opacity: 1; transform: scale(1); }
}
/* Backdrop azul profundo translúcido (em vez de preto puro) */
.modal-backdrop.show { background-color: #0A1F3D; opacity: .7; }

/* Header por tipo */
.modal-header.dsm-criar,
.modal-header.dsm-editar,
.modal-header.dsm-info {
    background: #050F1E !important;
    color: #fff;
}
.modal-header.dsm-criar  { border-bottom: 2px solid #D89A1F; }
.modal-header.dsm-editar { border-bottom: 2px solid #4A9EFF; }
.modal-header.dsm-info   { border-bottom: 1px solid rgba(216, 154, 31, .2); }
.modal-header.dsm-criar  .modal-title,
.modal-header.dsm-editar .modal-title,
.modal-header.dsm-info   .modal-title { color: #fff; }
.modal-header.dsm-criar  .modal-title i { color: #D89A1F; }  /* troféu, pessoa, etc. dourado */
.modal-header.dsm-editar .modal-title i { color: #D89A1F; }  /* ícone dourado (acento azul fica na borda/botão) */
.modal-header.dsm-info   .modal-title i { color: #D89A1F; }

/* Footer + botões */
.modal-footer { background: #F8F9FA; }
.modal-footer .btn-warning {            /* botão primário de "criar/salvar" -> dourado */
    background: #D89A1F; border-color: #D89A1F; color: #1A1A1A; font-weight: 600;
}
.modal-footer .btn-warning:hover { background: #F5C24A; border-color: #F5C24A; color: #1A1A1A; }
.btn-dsm-editar {                       /* botão primário dos modais de edição -> azul */
    background: #4A9EFF; border-color: #4A9EFF; color: #fff; font-weight: 600;
}
.btn-dsm-editar:hover { background: #3a8eef; border-color: #3a8eef; color: #fff; }

/* Placeholder de upload de imagem */
.foto-preview { border-color: #ccc; background: #F8F9FA; transition: border-color .15s; }
.foto-preview:hover { border-color: #D89A1F; }

/* SweetAlert — popup padronizado (exclusão usa confirmButtonColor vermelho no JS) */
.swal2-popup { border-radius: 12px; }
.swal2-actions { gap: 8px; }
.swal2-styled { font-weight: 600; }
.swal2-styled.swal2-cancel {
    background: transparent !important;
    border: 1px solid #aaa !important;
    color: #555 !important;
}

/* Tipo "alerta" (ação excepcional — âmbar) para modais Bootstrap */
.modal-header.dsm-alerta {
    background: #050F1E !important;
    color: #fff;
    border-bottom: 3px solid #F59E0B;
}
.modal-header.dsm-alerta .modal-title i { color: #F59E0B; }
.btn-dsm-alerta {
    background: #F59E0B; border-color: #F59E0B; color: #1A1A1A; font-weight: 700;
}
.btn-dsm-alerta:hover { background: #e08e0a; border-color: #e08e0a; color: #1A1A1A; }

/* Equivalente "alerta" no SweetAlert (modal Inserir Nota Manualmente) */
.swal-alerta .swal2-title { border-bottom: 3px solid #F59E0B; padding-bottom: 12px; }
.swal-alerta .form-control:focus,
.swal-alerta .form-select:focus {
    border-color: #F59E0B;
    box-shadow: 0 0 0 .2rem rgba(245, 158, 11, .25);
}
.swal-btn-alerta {
    background: #F59E0B !important; border-color: #F59E0B !important;
    color: #1A1A1A !important; font-weight: 700 !important;
}

/* Switches do Sistema de Cálculo (Olímpico) — dourado quando ligado, p/ combinar com o tema */
#catCalculoBox .form-check-input:checked {
    background-color: #D89A1F !important;
    border-color: #D89A1F !important;
}
#catCalculoBox .form-check-input:focus {
    border-color: #F5C24A;
    box-shadow: 0 0 0 .2rem rgba(216,154,31,.25);
}