/* ============================================================
   Contador One — Patrimônio: RIBBON (abas que trocam a faixa)
   pat-ribbon.js constrói a faixa a partir do menu (.side); este CSS
   estiliza. Sem dropdown flutuante: abas em cima, faixa contextual
   (sub-itens) logo abaixo. Estética clara, padrão da marca.
   ============================================================ */
.shell { display: block !important; }
.side { display: none !important; }                 /* menu lateral escondido — vira ribbon */
.main { margin-left: 0 !important; }
.side.pinned ~ .main, .shell:has(.side.pinned) .main { margin-left: 0 !important; }

.pat-ribbon { position: sticky; top: 58px; z-index: 40; background: var(--surface); border-bottom: 1px solid var(--border); }
.pr-top { display: flex; align-items: stretch; gap: 10px; }

/* seletor de pessoa (escopo persistente) morando no ribbon */
.pr-scope { flex: none; display: flex; align-items: center; padding: 7px 14px 7px 6px; margin-left: auto; }
.pat-ribbon .pb-switch { display: flex; align-items: center; gap: 8px; background: var(--bg-soft); border: 1px solid var(--border); border-radius: var(--radius-pill); padding: 6px 10px 6px 12px; max-width: 320px; }
.pat-ribbon .pb-switch svg { color: var(--brand); flex: none; }
.pat-ribbon .pb-switch select { background: transparent; border: 0; color: var(--fg); font-size: 13px; font-weight: 600; outline: none; max-width: 250px; cursor: pointer; }
.pat-ribbon .pb-switch select option, .pat-ribbon .pb-switch select optgroup { color: #222; }

/* linha de abas */
.pr-tabs { flex: 1 1 auto; min-width: 0; display: flex; align-items: stretch; gap: 2px; padding: 0 14px; overflow-x: auto; scrollbar-width: none; }
.pr-tabs::-webkit-scrollbar { display: none; }
.pr-tab {
  flex: none; display: inline-flex; align-items: center; gap: 8px;
  background: none; border: 0; font-family: inherit; font-size: 14px; font-weight: 500;
  color: var(--fg-muted); padding: 13px 15px; border-bottom: 2.5px solid transparent;
  cursor: pointer; white-space: nowrap; text-decoration: none;
  transition: color .15s, background .15s, border-color .15s;
}
.pr-tab svg { width: 18px; height: 18px; }
.pr-tab:hover { background: var(--bg-muted); color: var(--fg); }
.pr-tab.active { color: var(--brand); border-bottom-color: var(--brand); }
.pr-tab .cnt { font-size: 11px; color: var(--fg-subtle); }

/* faixa contextual (sub-itens da aba ativa) */
.pr-row2 { display: none; align-items: center; gap: 8px; flex-wrap: wrap; padding: 9px 14px; background: var(--bg-soft); border-top: 1px solid var(--border); }
.pr-row2.show { display: flex; }
.pr-sub {
  display: inline-flex; align-items: center; gap: 8px;
  background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-pill);
  padding: 7px 14px; font-size: 13.5px; font-weight: 500; color: var(--fg-muted);
  text-decoration: none; cursor: pointer; transition: border-color .15s, color .15s, background .15s;
  white-space: nowrap;
}
.pr-sub svg { width: 16px; height: 16px; }
.pr-sub:hover { border-color: var(--border-strong); color: var(--fg); }
.pr-sub.active { background: var(--brand-soft); border-color: var(--brand); color: var(--brand); }
.pr-sub .cnt { font-size: 11px; color: var(--fg-subtle); background: var(--bg-muted); border-radius: 20px; padding: 1px 7px; }