/* =====================================================================
   Xingu Hermes — CSS de override (NOSSO arquivo, não é do template)

   Carregado DEPOIS do material-dashboard.css, então por cascata/especificidade
   ele sobrescreve o estilo do template sem precisar editar o template. É o
   mesmo arquivo, com a mesma função, que o Atlas mantém em public/css/custom.css
   — a única diferença entre os dois sistemas é a paleta declarada aqui.

   PALETA DA MARCA (Xingu Hermes). O accent PRIMÁRIO do Material (originalmente
   rosa #e91e63) foi trocado pelo VERMELHO da marca; a sidebar escura, pelo
   GRAFITE.
     - primário (vermelho): #B10F23 (= rgb 177,15,35). Gradiente: vivo -> profundo.
     - grafite (marca):     #252A34 — sidebar, superfícies escuras, títulos.
   Verde/vermelho SEMÂNTICOS (sucesso/erro) continuam vindo do tema. Atenção: o
   vermelho da MARCA e o vermelho de ERRO convivem nesta tela. Por isso o erro de
   formulário nunca é só cor — vem com texto ao lado do campo.

   Dica: se um dia mudar a cor da marca, troque os valores abaixo (ou use as
   variáveis --hermes-* logo a seguir).
   ===================================================================== */

/* Variáveis da identidade Xingu Hermes (kit de identidade, 25/08/2026). */
:root {
    --hermes-red-deep: #B10F23;
    --hermes-red: #E1172D;
    --hermes-coral: #FF4B45;
    --hermes-coral-soft: #E99A8F;
    --hermes-blue-gray: #6E7B8A;
    --hermes-graphite: #252A34;
    --hermes-white: #F8F9F9;
}

/* ---- Sidebar / superfícies escuras: cinza do tema -> GRAFITE da marca ---- */
.bg-gradient-dark {
    background-image: linear-gradient(195deg, #3A4152 0%, #252A34 100%) !important;
}

/* ---- Gradiente primário (botões cheios, item ativo do menu, badges,
        ícones de card, swatch "primary" do painel de config) ---- */
.bg-gradient-primary {
    background-image: linear-gradient(195deg, #E1172D 0%, #B10F23 100%) !important;
}

/* ---- Cor sólida primária ---- */
.bg-primary {
    background-color: #B10F23 !important;
}

/* ---- Texto primário (links e rótulos que usavam rosa) ---- */
.text-primary {
    color: #B10F23 !important;
}

/* ---- Texto com gradiente (ícones/números "text-gradient text-primary").
        O template já faz o recorte no texto; aqui só trocamos a cor. ---- */
.text-primary.text-gradient,
.text-gradient.text-primary {
    background-image: linear-gradient(310deg, #FF4B45 0%, #B10F23 100%) !important;
}

/* ---- Sombra primária (cards/ícones com "shadow-primary") ---- */
.shadow-primary {
    box-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.14),
                0 7px 10px -5px rgba(177, 15, 35, 0.4) !important;
}

/* ---- Botão preenchido primário: sombra e estados ---- */
.btn.bg-gradient-primary {
    box-shadow: 0 3px 3px 0 rgba(177, 15, 35, 0.15),
                0 3px 1px -2px rgba(177, 15, 35, 0.2),
                0 1px 5px 0 rgba(177, 15, 35, 0.15) !important;
}
.btn.bg-gradient-primary:hover {
    box-shadow: 0 14px 26px -12px rgba(177, 15, 35, 0.4),
                0 4px 23px 0 rgba(0, 0, 0, 0.12),
                0 8px 10px -5px rgba(177, 15, 35, 0.2) !important;
}

/* ---- Botão contornado primário ---- */
.btn-outline-primary {
    color: #B10F23 !important;
    border-color: #B10F23 !important;
}
.btn-outline-primary:hover,
.btn-outline-primary:focus,
.btn-outline-primary:active,
.btn-outline-primary.active {
    background-color: #B10F23 !important;
    border-color: #B10F23 !important;
    color: #fff !important;
}

/* ---- Item ativo da barra lateral ---- */
.sidenav .navbar-nav .nav-link.active {
    box-shadow: 0 3px 5px 0 rgba(177, 15, 35, 0.2) !important;
}

/* ---- Checkboxes e switches marcados (ficavam rosa quando ligados) ---- */
.form-check-input:checked {
    background-color: #B10F23 !important;
    border-color: #B10F23 !important;
}

/* ---- Campos de texto em foco (rótulo e borda do input-group-outline) ---- */
.input-group-outline.is-focused .form-label,
.input-group-outline .form-control:focus ~ .form-label {
    color: #B10F23 !important;
}
.input-group-outline.is-focused .form-control,
.input-group-outline .form-control:focus {
    border-color: #B10F23 !important;
}

/* ---- Paginação ---- */
.pagination .page-item.active .page-link,
.pagination.pagination-primary .page-item.active .page-link {
    background-image: linear-gradient(195deg, #E1172D 0%, #B10F23 100%) !important;
    border: none !important;
    color: #fff !important;
}

/* =====================================================================
   Tela de acesso

   O Atlas usa uma foto do Unsplash como fundo do login. Aqui o fundo é um
   gradiente da própria paleta: uma imagem hospedada fora significa uma
   requisição a terceiro na ÚNICA tela que todo mundo abre, inclusive quem
   ainda não autenticou — e uma tela de login que depende de CDN alheio é uma
   tela de login que fica cinza quando o CDN cai.
   ===================================================================== */
.hermes-acesso-fundo {
    background-image: linear-gradient(195deg, #3A4152 0%, #252A34 60%, #14171D 100%);
}
