/* ============================================================
   TEMA FLOWBIX — Vaultwarden (FlowVault)
   ------------------------------------------------------------
   >>> Para trocar a cor da marca, altere SÓ a linha abaixo. <<<
   Formato: três números RGB separados por espaço (padrão do web-vault).
   NOTA: o Vaultwarden injeta css/vaultwarden.css DEPOIS deste arquivo,
   então usamos !important para vencer a cascata.
   ============================================================ */
:root {
  --flowbix-navy: 14 58 94;   /* #0E3A5E — azul-marinho Flowbix */
}

/* Cor primária (botões, links, foco) → navy Flowbix, nos dois temas. */
:root,
.theme_light,
.theme_dark {
  --color-primary-500: var(--flowbix-navy) !important;
  --color-primary-600: var(--flowbix-navy) !important;
  --color-primary-700: var(--flowbix-navy) !important;
}

/* ===================== LOGO (por tema) =====================
   O web-vault desenha o logo como SVG inline em
   <bit-svg aria-label*="Bitwarden"> (login e tela de bloqueio)
   e no ::before de bit-nav-logo (cabeçalho logado).
   Tema CLARO → logo navy | Tema ESCURO → logo branco. */

/* esconde o SVG original do Vaultwarden onde quer que ele apareça */
bit-svg[aria-label*="Bitwarden"] svg {
  display: none !important;
}

/* login / tela de bloqueio (anonymous layout) */
bit-svg[aria-label*="Bitwarden"] {
  display: inline-block !important;
  width: 170px !important;
  height: 45px !important;
  background: url("images/flowbix-logo.png") center / contain no-repeat !important;
}
.theme_dark bit-svg[aria-label*="Bitwarden"] {
  background-image: url("images/flowbix-logo-white.png") !important;
}

/* cabeçalho do COFRE LOGADO: o logo é um <bit-svg aria-hidden="true"> SEM
   aria-label, dentro de <bit-nav-logo>. Mira pela hierarquia, não pelo label. */
bit-nav-logo bit-svg svg {
  display: none !important;
}
bit-nav-logo bit-svg {
  display: inline-block !important;
  width: 180px !important;
  height: 46px !important;
  background: url("images/flowbix-logo.png") center / contain no-repeat !important;
}
.theme_dark bit-nav-logo bit-svg {
  background-image: url("images/flowbix-logo-white.png") !important;
}

/* logo grande (.new-logo-themed) */
.new-logo-themed {
  -webkit-mask: none !important;
          mask: none !important;
  background: url("images/flowbix-logo.png") center / contain no-repeat !important;
  width: 200px !important;
  height: 56px !important;
}
.theme_dark .new-logo-themed {
  background-image: url("images/flowbix-logo-white.png") !important;
}

/* Logo da tela de CARREGAMENTO (splash, <img alt="FlowVault"> no shell):
   navy no claro (src padrão) e branco no escuro. */
.theme_dark img[alt="FlowVault"] {
  content: url("images/flowbix-logo-white.png") !important;
}

/* Rodapé da tela de login: remove "Vaultwarden Web / modified version of
   Bitwarden..." e coloca uma assinatura Flowbix. */
bit-landing-footer > * {
  display: none !important;
}
bit-landing-footer::after {
  content: "FlowVault · Flowbix";
  display: block;
  text-align: center;
  padding: 1.25rem;
  font-size: 0.8rem;
  color: rgb(var(--flowbix-navy));
}

/* === FIX tema ESCURO (2026-06-27) ===
   O navy (#0E3A5E) é escuro demais para servir de cor de TEXTO-link no tema
   escuro (ex.: "Collections", breadcrumbs ficavam apagados). Aqui usamos um
   tom Flowbix mais claro só p/ a cor primária no dark. Botões ficam um azul
   levemente mais claro no escuro (boa prática em fundo escuro). */
.theme_dark {
  --color-primary-500: 93 148 200 !important;
  --color-primary-600: 93 148 200 !important;
  --color-primary-700: 93 148 200 !important;
}