/* BRSip brand — sobrepõe o tema vermelho do wg-easy pela paleta violeta da BRSip.
   Carregado depois do app.css (ver index.html rebrandado). Classes exatas extraídas do app.css. */

/* violeta: 600=#7c3aed  700=#6d28d9  800=#5b21b6  300=#c4b5fd  100=#ede9fe */

/* --- light --- */
.bg-red-100 { background-color:#ede9fe !important; }
.bg-red-600 { background-color:#7c3aed !important; }
.bg-red-800 { background-color:#5b21b6 !important; }
.border-red-800 { border-color:#5b21b6 !important; }
.text-red-600 { color:#7c3aed !important; }
.text-red-800 { color:#5b21b6 !important; }
.hover\:bg-red-700:hover { background-color:#6d28d9 !important; }
.hover\:bg-red-800:hover { background-color:#5b21b6 !important; }
.hover\:border-red-800:hover { border-color:#5b21b6 !important; }
.focus\:border-red-800:focus { border-color:#5b21b6 !important; }

/* --- dark (scoped sob .dark) --- */
.dark .dark\:bg-red-100 { background-color:#ede9fe !important; }
.dark .dark\:bg-red-600 { background-color:#7c3aed !important; }
.dark .dark\:bg-red-800 { background-color:#5b21b6 !important; }
.dark .dark\:border-red-600 { border-color:#7c3aed !important; }
.dark .dark\:text-red-300 { color:#c4b5fd !important; }
.dark .dark\:text-red-600 { color:#7c3aed !important; }
.dark .dark\:hover\:bg-red-600:hover { background-color:#7c3aed !important; }
.dark .dark\:hover\:bg-red-700:hover { background-color:#6d28d9 !important; }
.dark .dark\:hover\:bg-red-800:hover { background-color:#5b21b6 !important; }
.dark .dark\:hover\:border-red-600:hover { border-color:#7c3aed !important; }
.dark .dark\:hover\:text-red-100:hover { color:#ede9fe !important; }
.dark .dark\:focus\:border-red-800:focus { border-color:#5b21b6 !important; }

/* --- Download dos apps (capa de login) — estilo próprio, não depende de classes do app.css --- */
.dl-apps { max-width:24rem; margin-top:3.5rem; }   /* respiro maior entre a caixa de login e os downloads */
.dl-title { color:#6b7280; }                 /* gray-500 */
.dl-sub   { color:#9ca3af; }                 /* gray-400 */
.dark .dl-title { color:#d4d4d4; }
.dark .dl-sub   { color:#a3a3a3; }
.dl-grid { display:grid; grid-template-columns:1fr; gap:.5rem; }            /* mobile estreito: 1 coluna */
@media (min-width:400px) { .dl-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }  /* >=400px: 2 colunas */
.dl-full { grid-column:1 / -1; justify-content:center; }   /* botão largura total: conteúdo centralizado */
.dl-btn span { white-space:nowrap; }
.dl-btn {
  display:flex; align-items:center; gap:.5rem;
  padding:.5rem .75rem;
  border:2px solid #f3f4f6; border-radius:.5rem;   /* gray-100 */
  background:#fff; color:#4b5563;                   /* gray-600 */
  text-decoration:none;
  transition:border-color .15s ease, color .15s ease, background-color .15s ease;
}
.dl-btn:hover { border-color:#5b21b6; color:#5b21b6; }        /* violeta 800 */
.dl-btn svg  { width:1.25rem; height:1.25rem; flex-shrink:0; }
.dark .dl-btn        { background:#404040; border-color:#525252; color:#e5e5e5; }  /* neutral-700/600/200 */
.dark .dl-btn:hover  { border-color:#7c3aed; color:#fff; }    /* violeta 600 */

/* --- Capa de login: centralizar verticalmente no desktop (>=768px). No mobile fica em fluxo normal. --- */
@media (min-width: 768px) {
  .login-wrap {
    display:flex; flex-direction:column;
    align-items:center; justify-content:center;
    min-height:calc(100vh - 11rem);   /* deixa folga p/ o rodapé de atribuição */
  }
  .login-wrap > h1 { margin-top:0 !important; }   /* remove o empurrão do topo (mt-16) ao centralizar */
}