/* v16.3 (03/10/2026) — Modelo B (prancha) nos sistemas.
   Mesmo modelo das landings: fundo branco, Instrument Sans + JetBrains Mono, cartões com
   cantos de 16px e a cor de cada sistema. As cores vêm de variáveis definidas por sistema em
   includes/modelo_b.php; a cor da marca do escritório (página Marca) continua valendo por cima. */

@font-face{font-family:'Instrument Sans';src:url('../fonts/instrument-sans-latin-400-normal.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Instrument Sans';src:url('../fonts/instrument-sans-latin-500-normal.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'Instrument Sans';src:url('../fonts/instrument-sans-latin-600-normal.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:'Instrument Sans';src:url('../fonts/instrument-sans-latin-700-normal.woff2') format('woff2');font-weight:700 900;font-style:normal;font-display:swap}
@font-face{font-family:'JetBrains Mono';src:url('../fonts/jetbrains-mono-latin-400-normal.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'JetBrains Mono';src:url('../fonts/jetbrains-mono-latin-500-normal.woff2') format('woff2');font-weight:500 900;font-style:normal;font-display:swap}

/* ---------- base ---------- */
body{background:#fff;color:var(--mb-ink);font-family:var(--font-body);letter-spacing:-.005em}
body.client-shell::before,body.admin-shell::before{display:none}
h1,h2,h3,h4{font-family:var(--font-display);font-weight:500;letter-spacing:-.02em;color:var(--mb-ink)}
::selection{background:var(--mb-acc-soft2)}
:focus-visible{outline:2px solid var(--mb-acc-ink);outline-offset:2px}
a{text-underline-offset:3px}

/* ---------- menu lateral ---------- */
body.sop-module-ui .sidebar{background:#fff!important;border-right:1px solid var(--mb-line)}
body.sop-module-ui .logo-row strong{font-family:var(--font-display);font-weight:500;font-size:15.5px;color:var(--mb-ink);letter-spacing:-.01em}
body.sop-module-ui .sidebar .logo-row small{color:var(--mb-muted)!important;font-size:10.5px}
body.sop-module-ui .sidebar .nav-acc-sum{font-family:var(--font-mono);font-weight:400;font-size:10px;letter-spacing:.08em;color:var(--mb-muted)}
body.sop-module-ui .sidebar details.nav-acc + details.nav-acc > .nav-acc-sum{border-top-color:var(--mb-line-soft)}
body.sop-module-ui .menu a{color:var(--mb-ink-soft)!important;font-weight:500;font-size:13px;border-radius:10px}
body.sop-module-ui .menu a svg{color:var(--mb-muted)}
body.sop-module-ui .menu a:hover,body.sop-module-ui .sidebar .nav-acc:first-of-type .menu a:hover{background:var(--mb-wash);color:var(--mb-ink)!important}
body.sop-module-ui .menu a:hover svg{color:var(--mb-ink)}
body.sop-module-ui .menu a.active,body.sop-module-ui .sidebar .nav-acc:first-of-type .menu a.active{background:var(--mb-ink);color:#fff!important}
body.sop-module-ui .menu a.active svg{color:var(--mb-acc-light)}
body.sop-module-ui .sidebar .nav-acc:first-of-type .nav-label span::before{color:var(--mb-acc)!important}
body.sop-module-ui .menu-foot{border-top-color:var(--mb-line-soft)}
body.sop-module-ui .menu-foot a{color:var(--mb-muted)!important}
body.sop-module-ui .user-chip{background:#fff!important;border-color:var(--mb-line)!important}
body.sop-module-ui .user-chip .avatar{background:var(--mb-ink);color:var(--mb-acc-light);font-family:var(--font-mono);font-weight:500}
body.sop-module-ui .user-chip .who strong{color:var(--mb-ink)!important;font-weight:500}
body.sop-module-ui .user-chip .who small{color:var(--mb-muted)!important}
body.sop-module-ui .profile-mini-card,body.sop-module-ui .admin-mini-card{background:#fff!important;border-color:var(--mb-line)!important}
body.sop-module-ui .profile-mini-card span{font-family:var(--font-mono);font-weight:400;color:var(--mb-acc-ink)}
body.sop-module-ui .gsearch-trigger,body.sop-module-ui .menu-search{background:var(--mb-wash)!important;border-color:var(--mb-line)!important;color:var(--mb-muted)!important}
body.sop-module-ui .gsearch-trigger span{font-family:var(--font-mono)}
body.sop-module-ui .sop-mode-switch{background:var(--mb-wash);border-color:var(--mb-line)}
body.sop-module-ui .sop-mode-switch button.on{background:var(--mb-ink)}
body.sop-module-ui .sidebar-close{background:#fff!important;border-color:var(--mb-line)!important;color:var(--mb-ink)!important}

/* barra do celular e menu de baixo */
body.sop-module-ui .topbar{background:rgba(255,255,255,.92);border-bottom-color:var(--mb-line)}
body.sop-module-ui .topbar .brand{color:var(--mb-ink);font-family:var(--font-display);font-weight:500}
body.sop-module-ui .menu-toggle{background:#fff;border-color:var(--mb-line)}
.mobile-bottom-nav{background:rgba(255,255,255,.96);border-color:var(--mb-line)}
.mobile-bottom-nav a,.mobile-bottom-nav button{font-weight:500}
.mobile-bottom-nav .active{background:var(--mb-ink)}
.mobile-bottom-nav .active svg{color:var(--mb-acc-light)}

/* ---------- área principal e cabeçalho da tela ---------- */
body.sop-module-ui .app,body.sop-module-ui .main{background:#fff}
body.sop-module-ui .top.sop-module-head{border-bottom-color:var(--mb-line-soft)}
body.sop-module-ui .sop-title-row h1{font-family:var(--font-display);font-weight:500;font-size:clamp(24px,2.6vw,32px);letter-spacing:-.028em;line-height:1.05;color:var(--mb-ink)}
body.sop-module-ui .sop-head-copy p{color:var(--mb-muted)}
.sop-page-status,body.sop-module-ui .sop-page-status{font-family:var(--font-mono);font-weight:500;font-size:10px;letter-spacing:.06em;text-transform:uppercase;background:var(--mb-acc-soft)!important;color:var(--mb-acc-ink)!important;border-color:var(--mb-acc-border)!important}
body.sop-module-ui .trial-bar{background:#fff;border-color:var(--mb-line);border-radius:12px;color:var(--mb-muted)}
body.sop-module-ui .trial-bar b{color:var(--mb-acc-ink)}
body.sop-module-ui .trial-float{background:var(--mb-ink)}

/* ---------- cartões ---------- */
.card,body.sop-module-ui .card{background:#fff;border:1px solid var(--mb-line);border-radius:16px;box-shadow:0 1px 2px rgba(var(--mb-shadow-rgb),.04)}
body.sop-module-ui .card.glow{border-color:var(--mb-acc-border);box-shadow:0 10px 30px -18px rgba(var(--mb-shadow-rgb),.35)}
.kpi,body.sop-module-ui .kpi{background:#fff;border-color:var(--mb-line);border-radius:14px}
.kpi span,body.sop-module-ui .kpi span{font-family:var(--font-mono);font-weight:400;font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--mb-muted)}
.kpi strong,body.sop-module-ui .kpi strong{font-family:var(--font-display);font-weight:500;letter-spacing:-.03em;color:var(--mb-ink)}
.kpi small,body.sop-module-ui .kpi small{color:var(--mb-muted)}
body.sop-module-ui .kpi.accent,.kpi.accent{background:var(--mb-ink);border-color:transparent}
body.sop-module-ui .kpi.accent span svg,.kpi.accent span svg{color:var(--mb-acc-light)}

/* blocos do painel */
.db-next-card{background:var(--mb-acc-tint)!important;border:1px solid var(--mb-acc-border)!important;border-radius:16px!important}
.db-next-kicker,.db-command-kpi span,.db-command-status{font-family:var(--font-mono)!important;font-weight:500!important;letter-spacing:.06em!important}
.db-next-kicker{color:var(--mb-acc-ink)!important}
.db-next-title,.db-command-head h2{font-family:var(--font-display);font-weight:500;color:var(--mb-ink)}
.db-command{background:#fff!important;border-color:var(--mb-line)!important;border-radius:16px!important}
.db-command-kpi{background:var(--mb-wash)!important;border-color:var(--mb-line-soft)!important;border-radius:12px!important}
.db-command-kpi strong{font-family:var(--font-display);font-weight:500;color:var(--mb-ink)}
.db-command-status.warn{background:var(--mb-acc-soft2)!important;color:var(--mb-acc-ink)!important}
.sop-cards-title{font-family:var(--font-mono);font-weight:400;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--mb-acc-ink)}
body.sop-module-ui .sop-card{background:#fff;border:1px solid var(--mb-line);border-radius:16px;box-shadow:0 1px 2px rgba(var(--mb-shadow-rgb),.04);transition:border-color .2s,box-shadow .2s,transform .2s}
body.sop-module-ui .sop-card:hover{border-color:var(--mb-acc-border);box-shadow:0 14px 34px -22px rgba(var(--mb-shadow-rgb),.45);transform:translateY(-2px)}
body.sop-module-ui .sop-card-ico{background:var(--mb-acc-soft2);color:var(--mb-acc-ink);border-radius:10px}
body.sop-module-ui .sop-card strong{font-weight:500;color:var(--mb-ink)}
body.sop-module-ui .sop-card small{color:var(--mb-muted)}

/* ---------- botões ---------- */
.btn{border-radius:12px;font-weight:600;letter-spacing:0}
body.sop-module-ui .btn{border-radius:12px}
body.sop-module-ui .btn-sm{border-radius:9px}
.btn-primary,.btn-gold{background:var(--b-olive);color:#fff;box-shadow:0 10px 22px -16px rgba(var(--mb-shadow-rgb),.9)}
.btn-primary:hover,.btn-gold:hover{background:var(--b-olive-2);filter:none}
/* botões principais do painel: na versão anterior eram dourados com texto escuro (module-ui.css) */
html body.sop-module-ui .sop-primary-action,html body.sop-module-ui.client-shell .btn-primary,html body.sop-module-ui.client-shell .btn-gold{background:var(--b-olive)!important;color:#fff!important;border-color:transparent!important;box-shadow:0 10px 22px -16px rgba(var(--mb-shadow-rgb),.9)!important}
html body.sop-module-ui .sop-primary-action:hover,html body.sop-module-ui.client-shell .btn-primary:hover,html body.sop-module-ui.client-shell .btn-gold:hover{background:var(--b-olive-2)!important}
html body.sop-module-ui .sop-secondary-action,html body.sop-module-ui.client-shell .btn-secondary,html body.sop-module-ui.client-shell .btn-soft{background:#fff!important;color:var(--mb-ink)!important;border-color:var(--mb-line2)!important}
html body.sop-module-ui .sop-secondary-action:hover,html body.sop-module-ui.client-shell .btn-secondary:hover,html body.sop-module-ui.client-shell .btn-soft:hover{background:var(--mb-wash)!important;border-color:var(--mb-ink)!important}
body.sop-module-ui .btn-secondary{background:#fff!important;border-color:var(--mb-line2)!important;color:var(--mb-ink)!important}
body.sop-module-ui .btn-secondary:hover{border-color:var(--mb-ink)!important;background:#fff!important}
body.sop-module-ui .btn-soft{background:var(--mb-acc-soft2)!important;color:var(--mb-acc-ink)!important}
.feedback-float,body.sop-module-ui .feedback-float{background:var(--mb-ink);color:#fff;border:0;border-radius:999px;font-weight:500}
body.sop-module-ui .feedback-float svg{color:var(--mb-acc-light)}
body.sop-module-ui .feedback-float:hover{background:var(--mb-ink-soft)}

/* ---------- formulários ---------- */
input,select,textarea,body.sop-module-ui input,body.sop-module-ui select,body.sop-module-ui textarea{background:#fff;border-color:var(--mb-line2);border-radius:12px;color:var(--mb-ink)}
input:focus,select:focus,textarea:focus{border-color:var(--mb-acc);box-shadow:0 0 0 4px var(--mb-acc-soft2);background:#fff}
input::placeholder,textarea::placeholder{color:var(--mb-faint)}
label,body.sop-module-ui label{color:var(--mb-ink-soft)}

/* ---------- tabelas, selos e avisos ---------- */
th,body.sop-module-ui th{font-family:var(--font-mono);font-weight:500;font-size:10px;letter-spacing:.07em;text-transform:uppercase;color:var(--mb-muted);background:transparent}
td,body.sop-module-ui td{border-bottom-color:var(--mb-line-soft);color:var(--mb-ink-soft)}
body.sop-module-ui tr:hover td{background:var(--mb-wash)}
.badge{background:var(--mb-wash);color:var(--mb-ink-soft);border-color:var(--mb-line-soft);font-weight:500}
.badge.gold{background:var(--mb-acc-soft2);color:var(--mb-acc-ink)}
.notice{border-radius:12px;background:#fff;border-color:var(--mb-line)}

/* busca rápida */
.go-pal-box{background:#fff!important;border-radius:16px!important}

/* ---------- entrar e cadastro ---------- */
body.login-body{background:#fff}
.auth-hero{background:var(--mb-ink)!important}
.auth-hero::after{opacity:1;background:none;background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:48px 48px;-webkit-mask-image:radial-gradient(ellipse 80% 70% at 30% 40%,#000 25%,transparent 80%);mask-image:radial-gradient(ellipse 80% 70% at 30% 40%,#000 25%,transparent 80%)}
.auth-hero .logo-row strong{font-family:var(--font-display);font-weight:500;color:#fff}
.auth-hero h2{font-family:var(--font-display);font-weight:500;font-size:clamp(36px,4.4vw,64px);line-height:.95;letter-spacing:-.03em;max-width:12ch}
.auth-hero .feat div{font-size:14.5px}
.auth-hero .feat svg{color:var(--mb-acc-light)}
.login-card{background:#fff;border:1px solid var(--mb-line);border-radius:16px;box-shadow:0 24px 60px -36px rgba(var(--mb-shadow-rgb),.45)}
.login-card .logo-row strong{font-family:var(--font-display);font-weight:500;color:var(--mb-ink)}
.login-card a{color:var(--mb-acc-ink)}
.login-card a.btn-primary,.login-card a.btn-gold{color:#fff}
.login-card .notice{background:var(--mb-acc-tint);border-color:var(--mb-acc-border);color:var(--mb-ink)}

/* ---------- tipografia monoespaçada para rótulos pequenos ---------- */
.eyebrow,.kicker,.sop-kicker{font-family:var(--font-mono);font-weight:400;letter-spacing:.08em}

/* v16.4 — Render IA na cor do sistema (o módulo tinha verde-petróleo fixo em --ri-accent) */
html body #ri-app{--ri-ink:var(--mb-ink);--ri-muted:var(--mb-muted);--ri-line:var(--mb-line);--ri-soft:var(--mb-wash);--ri-accent:var(--mb-btn);--ri-accent-dark:var(--mb-btn-hover)}
