/* ==========================================================================
   Global Escolta — identidade visual (tema claro e escuro)
   Cores e fonte tiradas de globalescolta.com.br
   ========================================================================== */
html[data-theme] {
  --g-gold: #C9A227;
  --g-gold-dark: #8F711A;
  --g-gold-soft: #E9D48F;
  --g-navy: #0D1420;
  --g-navy-2: #17202F;
  --g-navy-3: #242F42;
}
html[data-theme="light"] {
  --g-bg: #F4F5F7;
  --g-card: #FFFFFF;
  --g-surface2: #F7F8FA;
  --g-hover: #FBF7EA;
  --g-input: #FFFFFF;
  --g-ink: #0D1420;
  --g-muted: #5E6778;
  --g-line: #E3E6EB;
  --g-accent-text: #8F711A;
  --g-active-bg: #17202F;
  --g-active-fg: #FFFFFF;
  --g-shadow: 0 1px 2px rgba(13,20,32,.05), 0 8px 24px rgba(13,20,32,.06);
}
html[data-theme="dark"] {
  --g-bg: #0D1420;
  --g-card: #17202F;
  --g-surface2: #1C2638;
  --g-hover: #1F2A3D;
  --g-input: #242F42;
  --g-ink: #EDF1F8;
  --g-muted: #8A93A3;
  --g-line: #2A3548;
  --g-accent-text: #E0BC45;
  --g-active-bg: #C9A227;
  --g-active-fg: #0D1420;
  --g-shadow: 0 1px 2px rgba(0,0,0,.3), 0 8px 24px rgba(0,0,0,.35);
}

/* variáveis antigas (GuardCenter) passam a apontar para a paleta Global */
html[data-theme] {
  --gc-bg: var(--g-bg); --gc-card: var(--g-card); --gc-ink: var(--g-ink);
  --gc-muted: var(--g-muted); --gc-line: var(--g-line);
  --gc-green-900: var(--g-navy); --gc-green-800: var(--g-navy-2); --gc-green-700: var(--g-gold-dark);
  --gc-green-dark: var(--g-navy); --gc-green: var(--g-navy-2);
  --gc-teal-700: var(--g-accent-text); --gc-teal-600: var(--g-gold); --gc-teal-500: var(--g-gold);
  --gc-shadow: var(--g-shadow);
  --bs-body-bg: var(--g-bg); --bs-body-color: var(--g-ink);
  --bs-border-color: var(--g-line); --bs-secondary-color: var(--g-muted);
  --bs-link-color: var(--g-accent-text); --bs-link-hover-color: var(--g-gold);
  --bs-link-color-rgb: 143,113,26;
}
html[data-theme="dark"] { --bs-link-color-rgb: 224,188,69; }

body {
  font-family: 'Montserrat', 'Segoe UI', system-ui, sans-serif !important;
  background: var(--g-bg) !important;
  color: var(--g-ink) !important;
}
a { color: var(--g-accent-text); }
a:hover { color: var(--g-gold); }
h1, h2, h3, .page-title, .h3 { font-weight: 800 !important; letter-spacing: -.02em; }
.page-sub, .text-muted, .form-label, .stat-label { color: var(--g-muted) !important; }

/* ---------- barra superior ---------- */
.topbar, .navbar {
  background: var(--g-navy) !important;
  border-bottom: 3px solid var(--g-gold);
  color: #fff !important;
  box-shadow: 0 2px 14px rgba(0,0,0,.25) !important;
}
.topbar .brand-sub, .topbar .small { color: rgba(255,255,255,.7) !important; opacity: 1 !important; }
.topbar .brand-mark { background: rgba(201,162,39,.18) !important; color: var(--g-gold-soft) !important; }
.g-brand { display: inline-flex; align-items: center; gap: .6rem; color: #fff !important; text-decoration: none; }
.g-brand img, .g-brand .g-logo-fallback { width: 40px; height: 40px; object-fit: contain; }
.g-brand .g-logo-fallback { font-size: 1.9rem; color: var(--g-gold); line-height: 40px; text-align: center; }
.g-word { font-weight: 800; letter-spacing: .04em; font-size: 1.05rem; line-height: 1.05; }
.g-word b { color: var(--g-gold); font-weight: 800; }
.g-word small { display: block; font-size: .62rem; font-weight: 600; letter-spacing: .12em; color: rgba(255,255,255,.6); text-transform: uppercase; margin-top: 2px; }

.g-theme-btn {
  border: 1px solid rgba(201,162,39,.5); background: transparent; color: var(--g-gold-soft);
  border-radius: 999px; height: 36px; padding: 0 .8rem; display: inline-flex; align-items: center; gap: .4rem;
  font-size: .8rem; font-weight: 600; cursor: pointer; transition: all .15s ease;
}
.g-theme-btn:hover { background: var(--g-gold); color: var(--g-navy); border-color: var(--g-gold); }

/* ---------- menu lateral ---------- */
.sidebar { background: var(--g-navy-2) !important; border-right: 1px solid rgba(255,255,255,.04); }
html[data-theme="dark"] .sidebar { background: #111A29 !important; }
.sidebar .nav-link { color: rgba(237,241,248,.72) !important; }
.sidebar .nav-link:hover { background: rgba(255,255,255,.06) !important; color: #fff !important; }
.sidebar .nav-link.active {
  background: rgba(201,162,39,.15) !important; color: var(--g-gold-soft) !important;
  box-shadow: inset 3px 0 0 var(--g-gold) !important;
}
.sidebar .nav-link.active i { color: var(--g-gold); opacity: 1; }
.sidebar .side-label { color: rgba(201,162,39,.65) !important; }

/* ---------- cartões, tabelas ---------- */
.card, .table-card, .modal-content, .dropdown-menu, .list-group-item {
  background: var(--g-card) !important; border-color: var(--g-line) !important;
  color: var(--g-ink); box-shadow: var(--g-shadow);
}
.table {
  --bs-table-bg: transparent; --bs-table-color: var(--g-ink);
  --bs-table-border-color: var(--g-line); --bs-table-hover-bg: var(--g-hover);
  --bs-table-hover-color: var(--g-ink); --bs-table-striped-bg: var(--g-surface2);
  color: var(--g-ink);
}
.table thead th { background: var(--g-surface2) !important; color: var(--g-muted) !important; border-color: var(--g-line) !important; }
.table tbody td { border-color: var(--g-line) !important; }
.table-hover tbody tr:hover, .table-hover tbody tr:hover > * { background: var(--g-hover) !important; }
.stat-value, .stat-card .stat-value { color: var(--g-accent-text) !important; }
.stat-card:hover { box-shadow: 0 12px 28px rgba(201,162,39,.12) !important; }

/* faixas de destaque */
.kpi-tile, .partner-banner {
  background: linear-gradient(135deg, var(--g-navy-2), var(--g-navy)) !important;
  border: 1px solid rgba(201,162,39,.35); color: #fff !important;
  box-shadow: 0 10px 28px rgba(13,20,32,.25) !important;
}
.kpi-tile .kpi-num { color: var(--g-gold-soft); }

/* ---------- botões ---------- */
.btn-gc, .btn-primary, .btn-success {
  background: var(--g-gold) !important; border-color: var(--g-gold) !important;
  color: var(--g-navy) !important; font-weight: 700 !important; border-radius: 999px !important;
}
.btn-gc:hover, .btn-primary:hover, .btn-success:hover {
  background: var(--g-gold-dark) !important; border-color: var(--g-gold-dark) !important;
  color: #fff !important; box-shadow: 0 6px 16px rgba(201,162,39,.3) !important;
}
.btn-ghost, .tab-btn, .btn-outline-secondary {
  background: var(--g-card) !important; color: var(--g-ink) !important; border-color: var(--g-line) !important;
}
.btn-ghost:hover, .tab-btn:hover { border-color: var(--g-gold) !important; color: var(--g-accent-text) !important; }
.tab-btn.active { background: var(--g-active-bg) !important; border-color: var(--g-active-bg) !important; color: var(--g-active-fg) !important; }

/* ---------- abas ---------- */
.nav-tabs { border-bottom-color: var(--g-line) !important; }
.nav-tabs .nav-link { color: var(--g-muted) !important; background: transparent !important; }
.nav-tabs .nav-link.active { color: var(--g-accent-text) !important; border-bottom: 2px solid var(--g-gold) !important; }
.nav-pills .nav-link.active { background: var(--g-active-bg) !important; color: var(--g-active-fg) !important; }

/* ---------- formulários ---------- */
.form-control, .form-select {
  background-color: var(--g-input) !important; color: var(--g-ink) !important; border-color: var(--g-line) !important;
}
.form-control::placeholder { color: var(--g-muted); }
.form-control:focus, .form-select:focus { border-color: var(--g-gold) !important; box-shadow: 0 0 0 .2rem rgba(201,162,39,.2) !important; }
.form-check-input:checked { background-color: var(--g-gold); border-color: var(--g-gold); }

/* ---------- etiquetas ---------- */
.pill-info { background: rgba(201,162,39,.15) !important; color: var(--g-accent-text) !important; }
html[data-theme="dark"] .pill-ok { background: rgba(31,138,76,.2) !important; color: #6fd39a !important; }
html[data-theme="dark"] .pill-warn { background: rgba(196,127,23,.2) !important; color: #f0b45a !important; }
html[data-theme="dark"] .pill-off, html[data-theme="dark"] .btn-danger-soft { background: rgba(192,57,43,.2) !important; color: #f08a7e !important; }
.thumb { background: var(--g-surface2) !important; border-color: var(--g-line) !important; }

/* ---------- cores fixas escritas direto nas telas (modo escuro) ---------- */
html[data-theme="dark"] [style*="background:#f7faf8"], html[data-theme="dark"] [style*="background: #f7faf8"],
html[data-theme="dark"] [style*="background:#eef1f0"], html[data-theme="dark"] [style*="background: #eef1f0"],
html[data-theme="dark"] [style*="background:#f0f4f2"], html[data-theme="dark"] [style*="background:#f6fbf8"],
html[data-theme="dark"] [style*="background:#fff"], html[data-theme="dark"] [style*="background: #fff"],
html[data-theme="dark"] [style*="background:#eef3f0"], html[data-theme="dark"] [style*="background:#d8f0e0"],
html[data-theme="dark"] .bg-white, html[data-theme="dark"] .bg-light {
  background: var(--g-surface2) !important; color: var(--g-ink) !important;
}
html[data-theme="dark"] [style*="color:#1c2420"], html[data-theme="dark"] [style*="color: #1c2420"] { color: var(--g-ink) !important; }
html[data-theme="dark"] [style*="color:#6b7a72"] { color: var(--g-muted) !important; }
html[data-theme="dark"] .text-dark { color: var(--g-ink) !important; }

/* ---------- login ---------- */
.g-login-bg {
  background: radial-gradient(ellipse at 20% 0%, rgba(201,162,39,.12), transparent 55%), var(--g-navy) !important;
}
html[data-theme="light"] .g-login-bg {
  background: radial-gradient(ellipse at 20% 0%, rgba(201,162,39,.18), transparent 55%), #E9ECF1 !important;
}

/* ---------- botões de aba (Cliente | Parceiro) — valem em todos os portais ---------- */
.tab-btn {
  display: inline-flex; align-items: center; gap: .4rem;
  border: 1px solid var(--g-line); border-radius: 999px;
  padding: .5rem 1.05rem; font-weight: 600; font-size: .86rem;
  text-decoration: none !important; line-height: 1.2; white-space: nowrap;
  transition: all .15s ease;
}
.btn-danger-soft { border: 0; border-radius: 8px; font-weight: 600; }
html[data-theme="light"] .btn-danger-soft { background: #fdecea; color: #c0392b; }
.input-group > .btn-gc { border-radius: 0 10px 10px 0 !important; padding-left: .9rem; padding-right: .9rem; }
.input-group > .form-control:first-child { border-top-right-radius: 0 !important; border-bottom-right-radius: 0 !important; }

/* ---------- mensagens do sistema: flutuam no canto, visíveis mesmo com a página rolada ---------- */
.g-toasts {
  position: fixed; top: 76px; right: 20px; z-index: 1080;
  width: min(460px, calc(100vw - 40px)); display: flex; flex-direction: column; gap: .5rem;
}
.g-toasts .alert { margin: 0 !important; box-shadow: 0 10px 30px rgba(0,0,0,.25) !important; animation: g-toast-in .25s ease; }
@keyframes g-toast-in { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: none; } }

/* ---------- Execução da OS: faixa colorida por marco (igual ao Wardon) ---------- */
.g-exec .g-marco td:first-child { border-left: 3px solid transparent; }
.g-exec .g-marco-1 td:first-child { border-left-color: #3fa9f5; }
.g-exec .g-marco-2 td:first-child { border-left-color: #f5a623; }
.g-exec .g-marco-3 td:first-child { border-left-color: #e8742f; }
.g-exec .g-marco-4 td:first-child { border-left-color: #a35ce0; }
.g-exec .g-marco-5 td:first-child { border-left-color: #2fbf71; }

/* ---------- formulário estreito em blocos (estilo Wardon) ---------- */
.g-narrow { max-width: 760px; margin: 0 auto; padding-bottom: 80px; }
.g-sec {
  background: var(--g-card); border: 1px solid var(--g-line); border-left: 3px solid var(--g-sec-c, var(--g-gold));
  border-radius: 12px; margin-bottom: 14px; overflow: hidden; box-shadow: var(--g-shadow);
}
.g-sec > header {
  display: flex; align-items: center; gap: .5rem; padding: .7rem 1rem;
  font-size: .72rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase;
  color: var(--g-sec-c, var(--g-gold));
  background: linear-gradient(90deg, color-mix(in srgb, var(--g-sec-c, #C9A227) 14%, transparent), transparent 70%);
  border-bottom: 1px solid var(--g-line);
}
.g-sec > header .ms-auto { font-size: .7rem; letter-spacing: .02em; text-transform: none; font-weight: 700; }
.g-sec-body { padding: 1rem; margin: 0; }
.g-sec .form-label { font-size: .68rem !important; text-transform: uppercase; letter-spacing: .06em; font-weight: 700; }
.g-sec .form-control, .g-sec .form-select { padding: .5rem .75rem; font-size: .88rem; }
.g-sec-blue   { --g-sec-c: #3fa9f5; }
.g-sec-amber  { --g-sec-c: #f5a623; }
.g-sec-green  { --g-sec-c: #2fbf71; }
.g-sec-purple { --g-sec-c: #a35ce0; }
.g-sec-gold   { --g-sec-c: #C9A227; }
.g-actionbar {
  position: fixed; left: 240px; right: 0; bottom: 0; z-index: 50;
  display: flex; justify-content: space-between; align-items: center; gap: 1rem;
  padding: .7rem 1.5rem; background: var(--g-card); border-top: 1px solid var(--g-line);
  box-shadow: 0 -6px 20px rgba(0,0,0,.15);
}
@media (max-width: 768px) { .g-actionbar { left: 0; } }

/* ---------- campos de busca (Tom Select) no tema Global ---------- */
.ts-wrapper .ts-control, .ts-dropdown { background: var(--g-input) !important; color: var(--g-ink) !important; border-color: var(--g-line) !important; }
.ts-wrapper .ts-control { border-radius: 10px !important; min-height: 40px; padding: .45rem .75rem !important; }
.ts-wrapper.focus .ts-control { border-color: var(--g-gold) !important; box-shadow: 0 0 0 .2rem rgba(201,162,39,.2) !important; }
.ts-wrapper .ts-control input { color: var(--g-ink) !important; }
.ts-dropdown { border-radius: 10px !important; box-shadow: var(--g-shadow) !important; }
.ts-dropdown .option { padding: .5rem .75rem; border-bottom: 1px solid var(--g-line); }
.ts-dropdown .active { background: rgba(201,162,39,.15) !important; color: var(--g-ink) !important; }
.ts-dropdown .option.disabled, .ts-dropdown [data-disabled] { opacity: .55; }
