/* v79.73 — logo da Studio Simões 25% maior (menu, topo e login) e trilha de navegação clicável.
   Carregado depois de app.css e studio-themes.css: vence as regras antigas de tamanho. */

/* Logo: topo 30 → 38 px, ícone do menu 34 → 42 px, login 55 → 69 px */
.topbar-brand { height: 38px !important; max-width: 275px !important; }
.app-sidebar .brand-lockup img.brand-icon,
.brand-lockup img.brand-icon { height: 42px !important; max-height: 42px !important; max-width: 50px !important; }
.auth-brand .brand-logo { height: 69px !important; max-height: 69px !important; max-width: 280px !important; width: auto !important; }
@media (max-width: 575.98px) {
    .topbar-brand { height: 30px !important; max-width: 150px !important; }
    .topbar-brand-link { margin-left: 8px !important; }
}

/* Trilha: faixa própria logo abaixo do topo, alinhada à esquerda (o centro do topo não tinha espaço) */
.trilha-faixa { padding: 10px 24px 6px; min-width: 0; }
.trilha { min-width: 0; max-width: 100%; }
.trilha ol { display: flex; flex-wrap: wrap; align-items: center; row-gap: 2px; margin: 0; padding: 0; list-style: none; min-width: 0; }
.trilha li { display: flex; align-items: center; min-width: 0; font-size: .82rem; color: #5b6570; }
.trilha li + li::before { content: "\203A" / ""; margin: 0 .45rem; color: #8a939c; font-size: 1rem; line-height: 1; }
.trilha a { color: #3d4650; text-decoration: none; border-radius: 4px; padding: 2px 3px; display: inline-flex; align-items: center; gap: .3rem; min-height: 24px; }
.trilha a:hover { color: #b3141e; text-decoration: underline; }
.trilha a:focus-visible { outline: 2px solid #c43530; outline-offset: 2px; }
.trilha a i { color: #c43530; }
.trilha-atual { min-width: 0; flex: 1 1 100%; }
.trilha-atual::before { display: none; }
.trilha-atual h1 { margin: 2px 0 0; font-size: 1.35rem; font-weight: 800; line-height: 1.25; color: var(--ink, #1a1a1a); overflow-wrap: anywhere; }
html[data-theme="dark"] .trilha li, html[data-theme="dark"] .trilha a { color: #c3c9d0; }
html[data-theme="dark"] .trilha-atual h1 { color: #e6e8eb; }
html[data-theme="dark"] .trilha a i { color: #ff8a8f; }
@media (max-width: 575.98px) { .trilha-faixa { padding: 8px 16px 4px; } .trilha-atual h1 { font-size: 1.15rem; } }
/* hub: a faixa fica dentro do conteúdo */
.trilha-hub { margin: 0 0 14px; }
.trilha-hub .trilha-atual h1 { font-size: 1.35rem; }

/* W4 · Trilha em todas as telas (docs/W4-TRILHA.md) */
.trilha-reticencias { display: none !important; }
.trilha li > span { display: inline-flex; align-items: center; gap: .3rem; padding: 2px 3px; }
.trilha li.trilha-atual.trilha-atual-texto { flex: 0 1 auto; gap: 0; align-items: center; font-size: .82rem; font-weight: 600; color: var(--ink, #1a1a1a); }
.trilha li.trilha-atual.trilha-atual-texto::before { display: inline; font-weight: 400; } /* a tela tem o próprio h1: a página atual fica na linha da trilha */
html[data-theme="dark"] .trilha li.trilha-atual.trilha-atual-texto { color: #e6e8eb; }
@media (max-width: 575.98px) {
    /* celular: Início › … › passo anterior, e o título; o meio fica só para o leitor de tela */
    .trilha-reticencias { display: flex !important; }
    .trilha li.trilha-meio { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
    .trilha li:not(.trilha-atual) { max-width: 48vw; }
    .trilha li:not(.trilha-atual) a, .trilha li:not(.trilha-atual) > span { min-width: 0; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: inline-block; }
}

/* W4 — PDV (layouts/pos.php): a trilha no topo escuro, no lugar do nome "Frente de Caixa" */
.pdv-top .brand { min-width: 0; }
.trilha-pdv li, .trilha-pdv a, .trilha-pdv li.trilha-atual.trilha-atual-texto { color: var(--pdv-ink, #e8eef5); font-size: 13px; }
.trilha-pdv li + li::before { color: var(--pdv-mute, #7a8896); }
.trilha-pdv a:hover { color: #fff; }
@media (max-width: 575.98px) { /* no celular a trilha cabe ao lado de "Sair do PDV" (logo, relógio e "Dashboard" saem; Início já leva lá) */
    .pdv-top { gap: 8px; padding: 0 10px !important; }
    .pdv-top .brand img, .pdv-top .meta, .pdv-top .actions a:not(.exit) { display: none !important; }
    .pdv-top .actions a { padding: 6px 8px; white-space: nowrap; }
    .trilha-pdv ol { flex-wrap: nowrap; }
}

/* W4 — Central de Ajuda (layouts/help.php): a trilha logo abaixo do cabeçalho */
.help-shell .help-header { margin-bottom: 12px; }
.trilha-ajuda { margin: 0 0 14px; }

/* login: "CRM" ao lado do logo com contraste AA (antes #9aa0a6 sobre branco) */
.auth-brand em { color: #5b6570 !important; }
