/* =============================================================
 * ORIENTE PORTAL · pele 2026 (07/10/2026) — Fase 1 da nova identidade
 * -------------------------------------------------------------
 * Carregado por ÚLTIMO. É só aparência, por cima do styles.css, do
 * liquid-glass.css (og.glass, legado a descontinuar) e da casca.css:
 *  - fundo chapado claro, sem gradientes nem anéis;
 *  - barra superior CLARA (branca) como no protótipo "Oriente CRM no centro";
 *  - cartões/painéis brancos de borda suave (sem vidro, sem blur, sem brilho);
 *  - botões, campos, pílulas, tabelas e abas no desenho do e-mail/Equipe novos;
 *  - cabeçalho de título das telas some: fica só a linha de ações.
 * Os tokens --og-* são redefinidos aqui para o og.glass virar "plano" em
 * todas as 120 telas de uma vez, sem mexer no markup. Fase 2 ajusta tela a tela.
 * ============================================================= */

:root{
  --bg:#f7f8f7; --panel:#ffffff; --card:#ffffff;
  --ink:#17221e; --ink-2:#5b6b65; --ink-3:#8a9893; --muted:#5b6b65;
  --line:#e4e8e6; --line-soft:#eef1f0;
  --accent:#0a9492; --accent-deep:#06716f; --accent-ink:#06716f; --accent-soft:#e0f5f4; --accent-50:#effaf9;
  --lime:#bbe52a; --marca:#01b3b2;
  --side:#ffffff; --side-sel:#e3f3ee; --side-ink:#2c3e38;
  --red:#c43d3d; --red-soft:#fdeeee; --amber:#c47a16; --amber-soft:#fff4e3; --good:#1d7f47; --good-soft:#ddf1e4;
  --shadow:0 10px 30px -14px rgba(14,35,29,.18); --shadow-soft:0 1px 2px rgba(14,35,29,.05),0 6px 18px -10px rgba(14,35,29,.12);
  --r:12px; --r-lg:14px; --r-pill:999px;
  --font-body:'Manrope',system-ui,sans-serif; --font-display:'Manrope',system-ui,sans-serif;

  /* og.glass vira plano: sem vidro, sem blur, sem gradiente de marca */
  --og-bg:#ffffff; --og-bg-strong:#ffffff; --og-bg-input:#ffffff; --og-bg-dark:#0b2b26;
  --og-border:var(--line); --og-border-soft:var(--line);
  --og-blur:none; --og-blur-strong:none;
  --og-shadow:var(--shadow-soft); --og-shadow-hover:var(--shadow); --og-shadow-modal:0 30px 80px -30px rgba(0,0,0,.45);
  --og-inset:0 0 0 0 transparent; --og-inset-dark:0 0 0 0 transparent;
  --og-topbar-grad:var(--accent); --og-brand-grad:var(--accent);
  --og-green:var(--accent);
}

/* ---------- fundo da página: chapado, sem anéis ---------- */
html, body{ background:var(--bg) !important; background-image:none !important; }
body::before, body::after{ display:none !important; content:none !important; }
body, .app, .main, .content{ font-family:var(--font-body) !important; color:var(--ink); }
h1,h2,h3,h4{ font-family:var(--font-display) !important; letter-spacing:-.01em; }

/* ---------- barra superior clara ---------- */
.topbar{
  background:#ffffff !important; background-image:none !important;
  border-bottom:1px solid var(--line) !important; box-shadow:none !important;
  color:var(--ink) !important;
}
.topbar .breadcrumb{ color:var(--ink-3) !important; }
.topbar .page-title{ color:var(--ink) !important; }
.topbar .topbar-search{ background:#f3f6f5 !important; border:1px solid var(--line) !important; box-shadow:none !important; border-radius:var(--r-pill) !important; }
.topbar .topbar-search:hover{ box-shadow:none !important; border-color:#d3dcd9 !important; }
.topbar .topbar-search:focus-within{ background:#fff !important; border-color:var(--accent) !important; box-shadow:0 0 0 3px var(--accent-soft) !important; }
.topbar .topbar-search-input{ color:var(--ink) !important; }
.topbar .topbar-search-input::placeholder{ color:var(--ink-3) !important; }
.topbar .topbar-search-icone{ color:var(--ink-3) !important; }
.topbar .topbar-icon-btn, .topbar .sidebar-toggle{
  background:#ffffff !important; border:1px solid var(--line) !important; color:var(--ink-2) !important; box-shadow:none !important; border-radius:10px !important;
}
.topbar .topbar-icon-btn:hover, .topbar .sidebar-toggle:hover{ background:var(--accent-50) !important; border-color:#cfe6e4 !important; color:var(--accent-ink) !important; }
.modulo-switcher-top{ background:#ffffff !important; border:1px solid var(--line) !important; border-radius:12px !important; }
.modulo-switcher-top:hover{ background:var(--accent-50) !important; }
.modulo-switcher-top .mst-txt small{ color:var(--ink-3) !important; }
.modulo-switcher-top .mst-txt strong{ color:var(--ink) !important; }
.modulo-switcher-top .mst-chev{ color:var(--ink-3) !important; }
.topbar-perfil{ background:#ffffff !important; border:1px solid var(--line) !important; border-radius:12px !important; }
.topbar-perfil:hover{ background:var(--accent-50) !important; }
.topbar-perfil-who strong{ color:var(--ink) !important; }
.topbar-perfil-who small{ color:var(--ink-3) !important; }
.topbar-perfil-chev{ color:var(--ink-3) !important; }
.topbar .logo-img{ filter:none !important; }

/* ---------- rail / barra lateral ---------- */
.sidebar, .rail, .drawer{ background:var(--side) !important; border-color:var(--line) !important; box-shadow:none !important; }
.nav-item{ border-radius:10px !important; color:var(--side-ink) !important; }
.nav-item:hover{ background:#f1f5f4 !important; }
.nav-item.active, .nav-item[aria-current="page"]{ background:var(--side-sel) !important; color:var(--accent-ink) !important; }
.nav-module{ color:var(--ink-3) !important; font-size:10.5px !important; letter-spacing:.12em !important; text-transform:uppercase !important; font-weight:700 !important; }
.nav-divisor{ border-color:var(--line) !important; }

/* ---------- abas da casca (Início | Produtos ×) ---------- */
.tabs-bar, .tabsbar, #tabsBar{ background:#ffffff !important; border-bottom:1px solid var(--line) !important; }
.tabs-bar .tab, .tabsbar .tab{ border-radius:10px 10px 0 0 !important; font-weight:600; color:var(--ink-2); }
.tabs-bar .tab.active, .tabsbar .tab.active{ color:var(--accent-ink) !important; border-bottom-color:var(--accent) !important; }

/* ---------- títulos de tela: somem; sobra a linha de ações ---------- */
.prod-header .prod-titulo, .prod-header .prod-sub, .page-title, .page-header h1, .page-header .sub, .page-header p,
section.page > h1, section.page > div:first-child > h1, section.page > div:first-child > div:first-child > h1,
section.page > div:first-child > div:first-child > p:first-of-type:not(.muted):not([class*="aviso"]):not([class*="fb"]),
.cat-vit-titulo, .cat-mat-titulo, .kn-titulo, .tm-titulo, .ph-titulo, .cmv-titulo, .mk-title, .cp-page-titulo,
#tarefasApp > div:first-child > div:first-child > h2{ display:none !important; }
/* Tarefas: os modos (Meu Dia, Kanban…) viram pílulas, sem o verde escuro */
.tar-modos .tar-modo{ border-radius:var(--r-pill) !important; border:1px solid var(--line) !important; background:#fff !important; color:var(--ink-2) !important; font-weight:600 !important; box-shadow:none !important; }
.tar-modos .tar-modo.on{ background:var(--accent) !important; border-color:var(--accent) !important; color:#fff !important; }
.prod-header{ margin-bottom:10px !important; padding:0 !important; min-height:0 !important; justify-content:flex-end !important; }
.prod-header:empty{ display:none !important; }
.prod-header > div:first-child:empty{ display:none; }
.prod-det-voltar{ border-radius:var(--r-pill) !important; }

/* ---------- cartões e painéis ---------- */
.panel, .card, .kpi, .ed-card, .sgc-painel, .orc-sk-card, .cat-kpi, .cred-card, .serie-card, .compras-card, .cot-card, .audit-card,
.prod-kpi-card, .mod-card, .dash-card, .og-glass, .prod-det-secao, .painel{
  background:var(--panel) !important; background-image:none !important;
  border:1px solid var(--line) !important; border-radius:var(--r-lg) !important;
  box-shadow:var(--shadow-soft) !important; backdrop-filter:none !important; -webkit-backdrop-filter:none !important;
}
.kpi::before, .panel::before, .card::before{ display:none !important; }
.kpi:hover{ transform:none !important; box-shadow:var(--shadow-soft) !important; }
.panel-header, .ed-card-head, .sgc-painel-head, .orc-sk-card-head, .painel-head{ background:transparent !important; border-bottom:1px solid var(--line-soft) !important; }
.panel-title, .painel-head h3{ font-size:14px !important; font-weight:700 !important; color:var(--ink) !important; }
.kpi .kpi-label, .kpi span:first-child, .kpi small{ color:var(--ink-3) !important; font-size:11px !important; letter-spacing:.04em; text-transform:uppercase; font-weight:600; }

/* ---------- botões ---------- */
.btn, .og-btn, .kn-btn, button.btn{
  border-radius:10px !important; font-weight:600 !important; font-family:var(--font-body) !important;
  box-shadow:none !important; backdrop-filter:none !important; -webkit-backdrop-filter:none !important;
}
.btn:not(.btn-primary):not(.btn-secondary):not(.btn-danger):not([style*="background"]), .og-btn:not(.og-btn--primary), .kn-btn:not(.kn-btn--primary){
  background:#ffffff !important; border:1px solid var(--line) !important; color:var(--ink) !important;
}
.btn:not(.btn-primary):not(.btn-secondary):not(.btn-danger):not([style*="background"]):hover, .og-btn:not(.og-btn--primary):hover, .kn-btn:not(.kn-btn--primary):hover{
  background:var(--accent-50) !important; border-color:#cfe6e4 !important; color:var(--accent-ink) !important; box-shadow:none !important;
}
.btn-primary, .og-btn--primary, .kn-btn--primary{
  background:var(--accent) !important; background-image:none !important; border:1px solid var(--accent) !important; color:#fff !important; box-shadow:none !important; filter:none !important;
}
.btn-primary:hover, .og-btn--primary:hover, .kn-btn--primary:hover{ background:var(--accent-ink) !important; border-color:var(--accent-ink) !important; filter:none !important; box-shadow:none !important; }
.btn-primary:active{ transform:none !important; }
.btn-secondary{ background:var(--accent-soft) !important; border:1px solid transparent !important; color:var(--accent-ink) !important; }
.btn-danger{ background:var(--red-soft) !important; border:1px solid #f0c9c9 !important; color:var(--red) !important; }
.btn-xs{ border-radius:8px !important; }
.kn-btn{ border-radius:var(--r-pill) !important; }

/* ---------- campos ---------- */
.field-input, .input, input[type="text"], input[type="search"], input[type="number"], input[type="date"], input[type="email"], input[type="password"], input[type="tel"], select, textarea{
  background:#ffffff !important; border:1px solid var(--line) !important; border-radius:10px !important; box-shadow:none !important;
  backdrop-filter:none !important; -webkit-backdrop-filter:none !important; color:var(--ink) !important; font-family:var(--font-body) !important;
}
.field-input:focus, .input:focus, input:focus, select:focus, textarea:focus{ border-color:var(--accent) !important; box-shadow:0 0 0 3px var(--accent-soft) !important; outline:none !important; }
::placeholder{ color:var(--ink-3) !important; }
.field-label, label.field-label{ color:var(--ink-2) !important; font-size:11px !important; letter-spacing:.04em; text-transform:uppercase; font-weight:600 !important; }

/* ---------- barra de ferramentas do painel: pílulas ---------- */
.prod-toolbar{ background:transparent !important; border:0 !important; box-shadow:none !important; padding:0 !important; gap:8px !important; margin-bottom:12px !important; }
.prod-toolbar-input, .prod-toolbar input[type="text"], .prod-toolbar input[type="search"]{ border-radius:var(--r-pill) !important; background:#ffffff !important; border:1px solid var(--line) !important; height:36px; }
.prod-toolbar-select, .prod-toolbar select, .prod-toolbar .kn-btn, .prod-toolbar .og-dropdown-btn{ border-radius:var(--r-pill) !important; background:#ffffff !important; border:1px solid var(--line) !important; color:var(--ink-2) !important; font-weight:600 !important; height:36px; }
.prod-toolbar-icon{ color:var(--ink-3) !important; }

/* ---------- tabelas ---------- */
.prod-tabela-wrap{ border:1px solid var(--line) !important; border-radius:var(--r-lg) !important; background:#fff !important; box-shadow:var(--shadow-soft) !important; overflow:hidden; }
.prod-tabela thead{ background:#f7faf9 !important; border-bottom:1px solid var(--line) !important; }
.prod-tabela th{ color:var(--ink-3) !important; font-size:11px !important; letter-spacing:.06em !important; text-transform:uppercase !important; font-weight:700 !important; }
.prod-tabela td{ font-size:13px !important; color:var(--ink); border-bottom:1px solid var(--line-soft) !important; }
.prod-tabela tbody tr:hover td{ background:var(--accent-50) !important; }
table.tabela, table.data{ border-color:var(--line) !important; }

/* ---------- abas internas (detalhe) ---------- */
.prod-det-tabs{ background:transparent !important; border:0 !important; border-bottom:1px solid var(--line) !important; border-radius:0 !important; padding:0 !important; gap:18px !important; box-shadow:none !important; }
.prod-det-tab{ background:transparent !important; border:0 !important; border-bottom:2px solid transparent !important; border-radius:0 !important; color:var(--ink-2) !important; font-weight:600 !important; font-size:12.5px !important; letter-spacing:.02em; padding:8px 2px 10px !important; text-transform:none !important; box-shadow:none !important; }
.prod-det-tab.active{ color:var(--accent-ink) !important; border-bottom-color:var(--accent) !important; background:transparent !important; }

/* ---------- pílulas e selos ---------- */
.badge, .badge-status, .pill, .tag, .chip, .rk, .tg{ border-radius:var(--r-pill) !important; font-weight:600 !important; box-shadow:none !important; }

/* ---------- modais e dropdowns (og) ---------- */
.og-modal, .modal-overlay .modal, .modal-content, .popup, .dialog, .og-dropdown, .og-pop, .cmv-pop{
  background:#ffffff !important; background-image:none !important; border:1px solid var(--line) !important; border-radius:16px !important;
  box-shadow:var(--og-shadow-modal) !important; backdrop-filter:none !important; -webkit-backdrop-filter:none !important;
}
.og-modal-overlay, .modal-overlay{ background:rgba(23,34,30,.42) !important; backdrop-filter:none !important; -webkit-backdrop-filter:none !important; }
.og-modal-head, .modal-header{ border-bottom:1px solid var(--line-soft) !important; background:transparent !important; }
.og-modal-foot, .modal-footer{ border-top:1px solid var(--line-soft) !important; background:transparent !important; }
.og-modal-title, .modal-title{ font-size:16px !important; font-weight:700 !important; }

/* ---------- empty states / avisos ---------- */
.empty, .vazio, .sem-dados{ color:var(--ink-3) !important; }

/* ---------- login/splash não entram aqui (têm identidade própria) ---------- */
#appSplash, .splash{ font-family:var(--font-body); }