/* =========================================================
   1. FUNDO E CORES GERAIS
   ========================================================= */
html, body, #app {
    background-color: #f4f6f8 !important;
    background-image: none !important;
}

.bg-white { background-color: #ffffff !important; }

/* Botões */
button[type="submit"], .button.primary {
    background-color: #000080 !important;
    border-color: #000080 !important;
    font-weight: bold !important;
}
button[type="submit"]:hover { background-color: #000060 !important; }
/* Links azuis apenas no login */
main.min-h-screen a { color: #000080 !important; }

/* Seleciona o título H2 específico da tela de login */
h2.text-3xl.text-center {
    /* 1. Torna o texto original invisível */
    font-size: 0 !important;
    color: transparent !important;
}

/* Cria o novo texto "Bem-vindo a Actus" */
h2.text-3xl.text-center::after {
    content: 'Bem-vindo à Actus!'; /* O TEXTO NOVO FICA AQUI */
    
    /* 2. Restaura o tamanho e visibilidade para o novo texto */
    font-size: 24px !important;
    display: block !important;
    
    /* 3. Estilização */
    color: #000080 !important; /* Azul marinho (sua marca) */
    /* Se preferir cinza escuro igual ao original, use: #1f2937 */
    
    font-weight: 600 !important;
    margin-top: 10px !important;
}


/* =========================================================
   2. TRATAMENTO DO LOGIN (CORREÇÃO DE DUPLICIDADE)
   ========================================================= */

/* PASSO A: Esconde a logo do "Modo Escuro" para não duplicar */
section img[src*="logo_dark.svg"],
form img[src*="logo_dark.svg"] {
    display: none !important;
}

/* PASSO B: Transforma a logo do "Modo Claro" na sua logo Actus */
section img[src*="logo.png"],
form img[src*="logo.png"] {
    
    /* 1. Remove restrições de altura/visibilidade */
    max-height: none !important;
    height: auto !important;
    
    /* 2. Empurra a imagem original invisível */
    box-sizing: border-box !important;
    padding-left: 100% !important;
    overflow: hidden !important;
    
    /* 3. Carrega o SEU arquivo: login-cover.png */
    background-image: url('/brand/login-cover.png') !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
    background-size: contain !important;
    
    /* 4. Define o tamanho da sua imagem na tela */
    display: block !important;
    width: 320px !important;    
    height: 100px !important;   
    
    /* 5. Centraliza */
    margin: 0 auto 20px auto !important;
}


/* =========================================================
   3. PROTEÇÃO DA SIDEBAR
   ========================================================= */

/* Garante que o logo.png pequeno da barra lateral (sidebar) 
   NÃO seja afetado pela regra acima.
*/
nav img[src*="logo"],
aside img[src*="logo"],
.sidebar-logo img {
    padding-left: 0 !important;
    background-image: none !important;
    height: auto !important;
    max-height: 40px !important;
    width: auto !important;
    margin: 0 !important;
}


/* Sidebar / Navbar logo: não deixar estourar o container */
.sidebar-logo,
.sidebar--logo,
aside .sidebar-logo,
nav .sidebar-logo {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;
}

/* A imagem em si (logo) */
.sidebar-logo img,
nav img[src*="brand-assets/logo"],
nav img[src*="logo_thumbnail"],
aside img[src*="brand-assets/logo"],
aside img[src*="logo_thumbnail"] {
  display: block !important;
  width: 100% !important;        /* ocupa o espaço do container */
  max-width: 140px !important;   /* TRAVA a largura */
  height: auto !important;
  max-height: 36px !important;   /* TRAVA a altura */
  object-fit: contain !important;
  margin: 0 auto !important;
}

/* Quando a sidebar fica estreita/compacta, reduz mais */
body.sidebar--collapsed .sidebar-logo img,
body.sidebar-collapsed .sidebar-logo img {
  max-width: 36px !important;
  max-height: 36px !important;
}