@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800;900&family=Outfit:wght@400;500;600;700;800;900&display=swap');

* { box-sizing: border-box; }

html, body {
  overflow-x: hidden !important;
  width: 100% !important;
  margin: 0;
  padding: 0;
}

/* =========================================================
   DESIGN SYSTEM - VARIAVEIS GLOBAIS
   ========================================================= */
:root {
  --brand-red: #df3b48;
  --brand-green: #9fc32d;
  --brand-blue: #45a8d3;
  --brand-yellow: #f2cb2c;
  --primary: #d53242;
  --primary-hover: #b72534;
  --accent: #45a8d3;
  --dark: #0f172a;
  --dark-light: #1e293b;
  --bg: #f8fafc;
  --surface: #ffffff;
  
  --border: #e2e8f0;
  --border-hover: #cbd5e1;
  
  --text-main: #0f172a;
  --text-muted: #64748b;
  
  --success: #769f1f;
  --success-lt: #dcfce7;
  --warning: #d6aa00;
  --warning-lt: #fef9c3;
  --danger: #ef4444;
  --danger-lt: #fee2e2;
  
  --shadow: 0 4px 18px rgba(15, 23, 42, 0.04);
  --shadow-hover: 0 12px 30px rgba(15, 23, 42, 0.08);
  
  --radius-lg: 16px;
  --radius-md: 12px;
  --radius-sm: 8px;
  
  --transition: background-color 0.15s cubic-bezier(0.4, 0, 0.2, 1), border-color 0.15s cubic-bezier(0.4, 0, 0.2, 1), transform 0.15s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.15s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Dark mode theme tokens mapping for Tabler */
[data-bs-theme="dark"] {
  --bg: #090d16;
  --surface: #0f172a;
  --border: #1e293b;
  --border-hover: #334155;
  --text-main: #f8fafc;
  --text-muted: #94a3b8;
  --shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
  --shadow-hover: 0 12px 36px rgba(0, 0, 0, 0.25);
}

body {
  font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif !important;
  background-color: var(--bg) !important;
  color: var(--text-main) !important;
  transition: background-color 0.2s ease, color 0.2s ease;
}

/* =========================================================
   DASHBOARD — CENTRAL DE OPERAÇÃO OOH
   ========================================================= */
.ops-dashboard { --ops-ink:#111827; --ops-blue:#1457ff; --ops-yellow:#ffd84d; --ops-line:#dfe4eb; padding-bottom:24px; }
.ops-hero { position:relative; overflow:hidden; min-height:260px; margin:-24px -20px 44px; padding:48px clamp(24px,5vw,70px) 42px; display:flex; align-items:center; justify-content:space-between; gap:36px; color:#fff; background:#101827; border-radius:0 0 28px 28px; }
.ops-hero::before { content:""; position:absolute; inset:0; opacity:.1; background-image:linear-gradient(rgba(255,255,255,.3) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.3) 1px,transparent 1px); background-size:26px 26px; mask-image:linear-gradient(90deg,transparent,#000 55%); }
.ops-hero__copy,.ops-hero__actions { position:relative; z-index:1; }
.ops-eyebrow,.ops-kicker { display:flex; align-items:center; gap:9px; color:#526072; font:800 11px/1.2 'Plus Jakarta Sans',sans-serif; letter-spacing:.14em; text-transform:uppercase; }
.ops-eyebrow { color:#afbdd0; }
.ops-eyebrow span { width:28px; height:3px; background:var(--ops-yellow); }
.ops-hero h1 { max-width:720px; margin:14px 0 8px; color:#fff!important; font-size:clamp(2.45rem,5vw,4.5rem); line-height:.98; letter-spacing:-.055em; text-wrap:balance; }
.ops-hero p { max-width:650px; margin:0; color:#b7c3d4; font-size:clamp(1rem,1.7vw,1.18rem); line-height:1.65; }
.ops-hero__actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:10px; min-width:330px; }
.ops-button { min-height:46px; padding:0 18px; display:inline-flex; align-items:center; justify-content:center; gap:9px; border:1px solid transparent; border-radius:10px; font-weight:800; text-decoration:none; transition:transform .18s ease,background-color .18s ease,border-color .18s ease; touch-action:manipulation; }
.ops-button:hover { transform:translateY(-2px); text-decoration:none; }
.ops-button--light { color:#fff; border-color:#465269; background:#202a3a; }
.ops-button--light:hover { color:#fff; background:#2a3649; }
.ops-button--accent { color:#171b24; background:var(--ops-yellow); }
.ops-button--accent:hover { color:#171b24; background:#ffe273; }
.ops-button--primary { color:#fff; background:var(--ops-blue); }
.ops-signal { position:absolute; right:5%; bottom:-3px; display:grid; grid-template-columns:repeat(8,10px); gap:7px; transform:skewX(-12deg); opacity:.85; }
.ops-signal span { width:10px; height:34px; background:var(--ops-yellow); }
.ops-signal span:nth-child(2),.ops-signal span:nth-child(7){height:19px;margin-top:15px}.ops-signal span:nth-child(3),.ops-signal span:nth-child(6){height:27px;margin-top:7px}.ops-signal span:nth-child(4),.ops-signal span:nth-child(5){height:12px;margin-top:22px}
.ops-section { margin-bottom:44px; }
.ops-module-rail { margin:-24px 0 42px; padding:10px; display:grid; grid-template-columns:repeat(8,minmax(0,1fr)); gap:5px; background:var(--surface); border:1px solid var(--ops-line); border-radius:12px; box-shadow:0 10px 30px rgba(21,32,52,.08); }
.ops-module-rail a { position:relative; min-width:0; min-height:66px; padding:10px 7px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; color:#59667a; border-radius:8px; font-size:11px; font-weight:800; text-decoration:none; transition:background-color .16s ease,color .16s ease,transform .16s ease; }
.ops-module-rail a:hover { color:var(--ops-blue); background:#edf3ff; transform:translateY(-2px); }
.ops-module-rail i { font-size:20px; }.ops-module-rail b{position:absolute;top:6px;right:10px;min-width:18px;height:18px;padding:0 5px;display:grid;place-items:center;color:#fff;background:#df4855;border-radius:9px;font-size:9px;font-variant-numeric:tabular-nums}
.ops-section__heading { display:flex; align-items:end; justify-content:space-between; gap:18px; margin-bottom:18px; }
.ops-section__heading h2,.ops-pulse h2 { margin:7px 0 0; font-size:clamp(1.45rem,2vw,2rem); letter-spacing:-.035em; }
.ops-attention-count { padding:6px 10px; color:#4b5563; background:#eef1f5; border-radius:7px; font-size:12px; font-weight:800; font-variant-numeric:tabular-nums; }
.ops-attention-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.ops-attention-card { position:relative; min-width:0; min-height:156px; padding:20px; display:flex; align-items:flex-start; gap:16px; color:var(--ops-ink); background:var(--surface); border:1px solid var(--ops-line); border-top:4px solid var(--ops-card-color); border-radius:12px; text-decoration:none; box-shadow:0 8px 28px rgba(21,32,52,.06); transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease; }
.ops-attention-card:hover { color:var(--ops-ink); transform:translateY(-3px); border-color:var(--ops-card-color); box-shadow:0 14px 34px rgba(21,32,52,.11); text-decoration:none; }
.ops-attention-card--amber{--ops-card-color:#dc9d00;--ops-card-soft:#fff5cf}.ops-attention-card--red{--ops-card-color:#df4855;--ops-card-soft:#ffeaec}.ops-attention-card--blue{--ops-card-color:#2468f2;--ops-card-soft:#e9f0ff}
.ops-attention-card--green{--ops-card-color:#16885a;--ops-card-soft:#e4f7ee}.ops-attention-card--purple{--ops-card-color:#7553c7;--ops-card-soft:#f0ebff}
.ops-card-icon { width:42px; height:42px; flex:0 0 auto; display:grid; place-items:center; border-radius:9px; color:var(--ops-card-color); background:var(--ops-card-soft); font-size:21px; }
.ops-card-content { min-width:0; display:flex; flex-direction:column; }
.ops-card-content strong { color:var(--ops-card-color); font:800 2rem/1 'Outfit',sans-serif; font-variant-numeric:tabular-nums; }
.ops-card-content b { margin-top:10px; font-size:14px; }
.ops-card-content small { margin-top:4px; color:#6c7787; line-height:1.45; }
.ops-card-arrow { position:absolute; top:18px; right:18px; color:#8b95a3; }
.ops-pulse { margin:0 0 44px; padding:32px; display:grid; grid-template-columns:1.05fr 2fr; gap:44px; color:#fff; background:#151f31; border-radius:16px; }
.ops-kicker--dark { color:#91a0b6; }
.ops-pulse h2 { color:#fff!important; }
.ops-pulse__intro p { max-width:420px; margin:10px 0 18px; color:#aab6c7; line-height:1.55; }
.ops-pulse__intro a { color:#fff; font-weight:800; text-decoration:none; }
.ops-pulse__metrics { display:grid; grid-template-columns:repeat(3,1fr); margin:0; }
.ops-pulse__metrics div { padding:6px 28px; border-left:1px solid #334056; }
.ops-pulse__metrics dt { color:#9eabbd; font-size:12px; font-weight:700; }
.ops-pulse__metrics dd { margin:12px 0 7px; color:#fff; font:800 clamp(2.5rem,4vw,4.3rem)/.9 'Outfit',sans-serif; letter-spacing:-.05em; font-variant-numeric:tabular-nums; }
.ops-pulse__metrics span { color:#8593a8; font-size:11px; font-weight:700; }
.ops-deadlines { grid-column:1/-1; display:grid; grid-template-columns:1fr 1fr; gap:1px; overflow:hidden; background:#334056; border:1px solid #334056; border-radius:9px; }
.ops-deadlines a { padding:12px 16px; display:flex; align-items:center; justify-content:space-between; gap:12px; color:#fff; background:#1c283b; text-decoration:none; }
.ops-deadlines a:hover{background:#243149}.ops-deadlines span{color:#91a0b6;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.08em}.ops-deadlines strong{font-size:12px}
.ops-pulse__metrics .ops-live-dot { color:#8ee0aa; }
.ops-live-dot::before { content:""; display:inline-block; width:7px; height:7px; margin-right:7px; border-radius:50%; background:#4dd77d; box-shadow:0 0 0 4px rgba(77,215,125,.12); }
.ops-text-link { color:var(--ops-blue); font-size:13px; font-weight:800; text-decoration:none; }
.ops-campaign-list { overflow:hidden; background:var(--surface); border:1px solid var(--ops-line); border-radius:14px; }
.ops-campaign { position:relative; min-width:0; min-height:84px; padding:16px 20px 16px 24px; display:grid; grid-template-columns:minmax(220px,2fr) minmax(90px,.65fr) minmax(210px,1.35fr) auto 24px; align-items:center; gap:24px; color:var(--ops-ink); border-bottom:1px solid var(--ops-line); text-decoration:none; transition:background-color .16s ease; }
.ops-campaign:last-child { border-bottom:0; }
.ops-campaign:hover { color:var(--ops-ink); background:#f7f9fc; text-decoration:none; }
.ops-campaign__marker { position:absolute; left:0; top:20px; bottom:20px; width:4px; border-radius:0 4px 4px 0; background:#d7a216; }
.ops-campaign__marker.is-success{background:#20a66a}.ops-campaign__marker.is-danger{background:#df4855}
.ops-campaign__name,.ops-campaign__meta { min-width:0; display:flex; flex-direction:column; gap:4px; }
.ops-campaign__name strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:14px; }
.ops-campaign__name small,.ops-campaign__meta small { overflow:hidden; color:#778292; text-overflow:ellipsis; white-space:nowrap; font-size:11px; }
.ops-campaign__meta strong { font-size:12px; font-weight:700; font-variant-numeric:tabular-nums; }
.ops-status { padding:6px 9px; color:#916300; background:#fff2c4; border-radius:6px; font-size:10px; font-weight:800; text-transform:uppercase; white-space:nowrap; }
.ops-status.is-success{color:#087244;background:#dff7ea}.ops-status.is-danger{color:#a72232;background:#ffe5e8}
.ops-campaign__arrow { color:#9099a6; }
.ops-empty { padding:32px; display:flex; align-items:center; gap:18px; }
.ops-empty>i { font-size:32px; color:#788597; }.ops-empty div{flex:1}.ops-empty p{margin:4px 0 0;color:#778292}
[data-bs-theme="dark"] .ops-dashboard{--ops-ink:#f1f5f9;--ops-line:#29364a}[data-bs-theme="dark"] .ops-attention-count{color:#c3cfdf;background:#202c3e}[data-bs-theme="dark"] .ops-attention-card{background:#111b2c}[data-bs-theme="dark"] .ops-card-content small,[data-bs-theme="dark"] .ops-campaign__name small,[data-bs-theme="dark"] .ops-campaign__meta small{color:#98a6b9}[data-bs-theme="dark"] .ops-campaign-list{background:#111b2c}[data-bs-theme="dark"] .ops-campaign:hover{background:#182438}
@media (max-width:980px){.ops-hero{align-items:flex-start;flex-direction:column}.ops-hero__actions{min-width:0;justify-content:flex-start}.ops-module-rail{grid-template-columns:repeat(4,1fr)}.ops-attention-grid{grid-template-columns:1fr 1fr}.ops-pulse{grid-template-columns:1fr}.ops-campaign{grid-template-columns:minmax(180px,2fr) 90px auto 20px}.ops-campaign__meta:nth-of-type(3){display:none}}
@media (max-width:640px){.ops-hero{margin:-24px -20px 32px;padding:36px 20px 48px;border-radius:0 0 20px 20px}.ops-hero__actions{width:100%}.ops-button{flex:1}.ops-module-rail{grid-template-columns:repeat(2,1fr);margin-top:-18px}.ops-section__heading{align-items:flex-start}.ops-attention-grid{grid-template-columns:1fr}.ops-pulse{padding:24px 20px}.ops-pulse__metrics{grid-template-columns:1fr}.ops-pulse__metrics div{padding:18px 0;border-left:0;border-top:1px solid #334056}.ops-deadlines{grid-template-columns:1fr}.ops-campaign{grid-template-columns:1fr auto;padding:16px 18px 16px 22px;gap:10px}.ops-campaign__meta,.ops-status{display:none}.ops-empty{align-items:flex-start;flex-wrap:wrap}.ops-empty .ops-button{flex-basis:100%}}
@media (prefers-reduced-motion:reduce){.ops-button,.ops-attention-card,.ops-campaign{transition:none!important}.ops-button:hover,.ops-attention-card:hover{transform:none}}

/* Acessibilidade de Foco */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 2px solid var(--primary) !important;
  outline-offset: 2px !important;
}

/* =========================================================
   LAYOUT E CONTENT CONTAINER
   ========================================================= */
.wrap, .page-body .container-xl, .container-xl, .v-main, .q-container, .v-container {
  width: 100% !important;
  max-width: 1240px !important;
  margin: 0 auto !important;
  padding: 24px 20px 48px !important;
  box-sizing: border-box !important;
}

/* =========================================================
   TYPOGRAPHY
   ========================================================= */
h1, h2, h3, .stat {
  font-family: 'Outfit', 'Plus Jakarta Sans', sans-serif !important;
  color: var(--text-main) !important;
  letter-spacing: -0.01em;
}
h1 { font-size: 1.85rem; font-weight: 800; margin-bottom: 6px; }
h2 { font-size: 1.35rem; font-weight: 800; margin-bottom: 14px; }
h3 { font-size: 1.1rem; font-weight: 700; margin-bottom: 8px; }

.muted, p.muted, small.muted, div.muted, span.muted {
  color: var(--text-muted) !important;
  font-size: 13.5px;
}

.stat {
  font-size: 2.6rem !important;
  font-weight: 900 !important;
  line-height: 1.05 !important;
  letter-spacing: -0.03em !important;
  margin: 6px 0 2px !important;
  display: block !important;
  color: var(--text-main) !important;
}

/* =========================================================
   GRID SYSTEM
   ========================================================= */
.grid {
  display: grid !important;
  grid-template-columns: repeat(12, 1fr) !important;
  gap: 24px !important;
  margin-bottom: 24px !important;
}

.grid > .col-12 { grid-column: span 12 !important; width: 100% !important; max-width: 100% !important; flex: none !important; margin: 0 !important; }
.grid > .col-11 { grid-column: span 11 !important; width: 100% !important; max-width: 100% !important; flex: none !important; margin: 0 !important; }
.grid > .col-10 { grid-column: span 10 !important; width: 100% !important; max-width: 100% !important; flex: none !important; margin: 0 !important; }
.grid > .col-9  { grid-column: span 9  !important; width: 100% !important; max-width: 100% !important; flex: none !important; margin: 0 !important; }
.grid > .col-8  { grid-column: span 8  !important; width: 100% !important; max-width: 100% !important; flex: none !important; margin: 0 !important; }
.grid > .col-7  { grid-column: span 7  !important; width: 100% !important; max-width: 100% !important; flex: none !important; margin: 0 !important; }
.grid > .col-6  { grid-column: span 6  !important; width: 100% !important; max-width: 100% !important; flex: none !important; margin: 0 !important; }
.grid > .col-5  { grid-column: span 5  !important; width: 100% !important; max-width: 100% !important; flex: none !important; margin: 0 !important; }
.grid > .col-4  { grid-column: span 4  !important; width: 100% !important; max-width: 100% !important; flex: none !important; margin: 0 !important; }
.grid > .col-3  { grid-column: span 3  !important; width: 100% !important; max-width: 100% !important; flex: none !important; margin: 0 !important; }
.grid > .col-2  { grid-column: span 2  !important; width: 100% !important; max-width: 100% !important; flex: none !important; margin: 0 !important; }
.grid > .col-1  { grid-column: span 1  !important; width: 100% !important; max-width: 100% !important; flex: none !important; margin: 0 !important; }

@media (max-width: 768px) {
  .grid { gap: 16px !important; }
  .grid > [class*="col-"] { grid-column: span 12 !important; width: 100% !important; max-width: 100% !important; flex: none !important; }
  .grid > .col-sm-6 { grid-column: span 6 !important; width: 100% !important; max-width: 100% !important; flex: none !important; }
}

/* =========================================================
   PREMIUM CARDS (.card)
   ========================================================= */
.card {
  background: var(--surface) !important;
  color: var(--text-main) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius-lg) !important;
  padding: 24px !important;
  margin-bottom: 24px !important;
  box-shadow: var(--shadow) !important;
  transition: var(--transition) !important;
  position: relative;
  overflow: hidden;
}
.card:hover {
  box-shadow: var(--shadow-hover) !important;
  border-color: var(--border-hover) !important;
}

/* =========================================================
   BOTÕES DO SISTEMA (.btn)
   ========================================================= */
.btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius-md) !important;
  min-height: 42px !important;
  padding: 8px 20px !important;
  text-decoration: none !important;
  cursor: pointer !important;
  background: var(--dark) !important;
  color: #ffffff !important;
  font-weight: 700 !important;
  font-size: 13.5px !important;
  font-family: inherit !important;
  transition: var(--transition) !important;
  gap: 8px !important;
  box-shadow: 0 2px 6px rgba(0,0,0,0.03) !important;
}

.btn:hover {
  background: var(--dark-light) !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 4px 12px rgba(15,23,42,0.12) !important;
  color: #ffffff !important;
  text-decoration: none !important;
}
.btn.primary {
  background: var(--primary) !important;
  border-color: var(--primary) !important;
  color: #ffffff !important;
}
.btn.primary:hover {
  background: var(--primary-hover) !important;
  border-color: var(--primary-hover) !important;
}
.btn.secondary {
  background: var(--surface) !important;
  color: var(--text-main) !important;
  border-color: var(--border) !important;
}
.btn.secondary:hover {
  background: var(--bg) !important;
  border-color: var(--border-hover) !important;
  color: var(--text-main) !important;
}
.btn.success {
  background: var(--success) !important;
  border-color: var(--success) !important;
  color: #ffffff !important;
}
.btn.success:hover {
  background: #059669 !important;
}
.btn.danger {
  background: var(--danger) !important;
  border-color: var(--danger) !important;
  color: #ffffff !important;
}
.btn.danger:hover {
  background: #dc2626 !important;
}
.btn.ghost {
  background: transparent !important;
  border-color: rgba(255,255,255,0.15) !important;
  color: var(--text-main) !important;
}
.btn.ghost:hover {
  background: rgba(0,0,0,0.02) !important;
}
.btn.big {
  min-height: 48px !important;
  padding: 10px 28px !important;
  font-size: 14.5px !important;
  border-radius: var(--radius-md) !important;
}
.btn.sm {
  min-height: 32px !important;
  padding: 4px 12px !important;
  font-size: 12px !important;
  border-radius: var(--radius-sm) !important;
}

/* =========================================================
   FORMULÁRIOS (.field)
   ========================================================= */
.field {
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
  margin-bottom: 16px !important;
}

.field label {
  font-weight: 800 !important;
  font-size: 11px !important;
  color: var(--text-muted) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  display: block !important;
}

.field input:not([type="checkbox"]):not([type="radio"]),
.field select,
.field textarea {
  width: 100% !important;
  min-height: 44px !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius-md) !important;
  padding: 10px 14px !important;
  background: var(--surface) !important;
  color: var(--text-main) !important;
  font-family: inherit !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  transition: var(--transition) !important;
  box-shadow: none !important;
}

.field textarea {
  min-height: 100px !important;
  padding: 12px 14px !important;
  resize: vertical !important;
}

.field input:focus, .field select:focus, .field textarea:focus {
  outline: 0 !important;
  border-color: var(--primary) !important;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.12) !important;
  background: var(--surface) !important;
}

.field .help {
  font-size: 11.5px !important;
  color: var(--text-muted) !important;
  margin-top: 2px !important;
}

.inline-input {
  display: flex !important;
  gap: 10px !important;
  align-items: center !important;
}
.inline-input input {
  flex: 1 !important;
}

/* =========================================================
   TABELAS MODERNAS
   ========================================================= */
.tablewrap {
  overflow-x: auto !important;
  border-radius: var(--radius-lg) !important;
  border: 1px solid var(--border) !important;
  background: var(--surface) !important;
  margin-bottom: 24px !important;
  box-shadow: var(--shadow) !important;
}

.table {
  width: 100% !important;
  border-collapse: collapse !important;
  font-size: 13.5px !important;
  color: var(--text-main) !important;
}

.table th {
  background: var(--bg) !important;
  border-bottom: 1.5px solid var(--border) !important;
  text-align: left !important;
  padding: 14px 18px !important;
  font-weight: 800 !important;
  font-size: 11px !important;
  color: var(--text-muted) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
}

.table td {
  border-bottom: 1px solid var(--border) !important;
  padding: 14px 18px !important;
  color: var(--text-main) !important;
  vertical-align: middle !important;
}

.table tr:last-child td { border-bottom: 0 !important; }
.table tr:hover td { background: var(--bg) !important; }

/* Responsive tables to stack on mobile */
@media (max-width: 768px) {
  .tablewrap { border: 0 !important; box-shadow: none !important; background: transparent !important; }
  .table, .table thead, .table tbody, .table th, .table td, .table tr {
    display: block !important;
    width: 100% !important;
  }
  .table thead { display: none !important; }
  .table tr {
    background: var(--surface) !important;
    border: 1px solid var(--border) !important;
    border-radius: var(--radius-lg) !important;
    padding: 16px !important;
    margin-bottom: 16px !important;
    box-shadow: var(--shadow) !important;
  }
  .table td {
    border-bottom: 1px solid var(--border) !important;
    padding: 8px 0 !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    text-align: right !important;
  }
  .table td::before {
    content: attr(data-label);
    font-weight: 800;
    color: var(--text-muted);
    text-transform: uppercase;
    font-size: 10.5px;
    text-align: left;
    margin-right: 12px;
  }
  .table td:last-child { border-bottom: 0 !important; }
}

/* =========================================================
   KPI INDICATORS
   ========================================================= */
.kpi-container {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 20px;
  margin-bottom: 24px;
}
.kpi-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 20px;
  box-shadow: var(--shadow);
  display: flex;
  align-items: center;
  gap: 16px;
  transition: var(--transition);
  border-left: 4px solid var(--border);
}
.kpi-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-hover);
}
.kpi-icon-box {
  width: 48px;
  height: 48px;
  border-radius: var(--radius-md);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  background: rgba(37, 99, 235, 0.08);
  color: var(--primary);
}
.kpi-details {
  flex: 1;
}
.kpi-title {
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
  color: var(--text-muted);
  letter-spacing: 0.05em;
  margin: 0;
}
.kpi-value {
  font-size: 26px;
  font-weight: 900;
  color: var(--text-main);
  margin-top: 2px;
  font-family: 'Outfit', sans-serif;
  font-variant-numeric: tabular-nums;
}

/* =========================================================
   BADGES & STATUS
   ========================================================= */
.badge {
  display: inline-flex !important;
  align-items: center !important;
  padding: 4px 10px !important;
  border-radius: 99px !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  letter-spacing: 0.03em !important;
  line-height: 1.3 !important;
  white-space: nowrap !important;
}
.badge.approved { background: var(--success-lt) !important; color: #047857 !important; border: 1px solid rgba(16,185,129,0.2) !important; }
.badge.pending  { background: var(--warning-lt) !important; color: #b45309 !important; border: 1px solid rgba(245,158,11,0.2) !important; }
.badge.sample   { background: #dbeafe !important; color: #1d4ed8 !important; border: 1px solid rgba(37,99,235,0.2) !important; }
.badge.changes  { background: var(--danger-lt) !important; color: #b91c1c !important; border: 1px solid rgba(239,68,68,0.2) !important; }
.badge.briefing { background: #ede9fe !important; color: #6d28d9 !important; border: 1px solid rgba(139,92,246,0.2) !important; }
.badge.briefing_pendente { background: #ffedd5 !important; color: #c2410c !important; border: 1px solid rgba(249,115,22,0.2) !important; }

/* =========================================================
   GRID DE CAMPANHAS (.campaign-grid & .campaign-card)
   ========================================================= */
.campaign-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)) !important;
  gap: 20px !important;
  margin-bottom: 24px !important;
}

.campaign-card {
  background: var(--surface) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius-lg) !important;
  padding: 24px !important;
  box-shadow: var(--shadow) !important;
  display: flex !important;
  flex-direction: column !important;
  transition: var(--transition) !important;
  margin-bottom: 0 !important;
}

.campaign-card:hover {
  transform: translateY(-2px) !important;
  box-shadow: var(--shadow-hover) !important;
}

.campaign-meta {
  display: flex !important;
  gap: 12px !important;
  flex-wrap: wrap !important;
  font-size: 12.5px !important;
  color: var(--text-muted) !important;
  margin-bottom: 16px !important;
}

/* =========================================================
   SELEÇÃO DE PAINÉIS (.checkgrid & .checkcard)
   ========================================================= */
.checkgrid {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)) !important;
  gap: 12px !important;
  margin-bottom: 16px !important;
}

.checkcard {
  display: flex !important;
  align-items: flex-start !important;
  gap: 12px !important;
  padding: 16px !important;
  border: 2px solid var(--border) !important;
  border-radius: var(--radius-md) !important;
  cursor: pointer !important;
  transition: var(--transition) !important;
  background: var(--surface) !important;
  font-size: 13.5px !important;
}

.checkcard:hover {
  border-color: var(--primary) !important;
  background: rgba(37,99,235,0.03) !important;
}

.checkcard input[type="checkbox"]:checked + span {
  color: var(--primary) !important;
  font-weight: 700;
}

.checkcard:has(input:checked) {
  border-color: var(--primary) !important;
  background: rgba(37,99,235,0.05) !important;
}

/* =========================================================
   LISTA DE PONTOS DE MÍDIA (.mp-list-card)
   ========================================================= */
.mp-list-card {
  display: flex !important;
  background: var(--surface) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius-lg) !important;
  padding: 20px !important;
  margin-bottom: 20px !important;
  gap: 20px !important;
  box-shadow: var(--shadow) !important;
  transition: var(--transition) !important;
  align-items: center !important;
}
.mp-list-card:hover {
  transform: translateY(-2px) !important;
  box-shadow: var(--shadow-hover) !important;
  border-color: var(--border-hover) !important;
}

.mp-thumb-box {
  width: 140px !important;
  height: 100px !important;
  border-radius: var(--radius-md) !important;
  overflow: hidden !important;
  background: var(--bg) !important;
  border: 1px solid var(--border) !important;
  flex-shrink: 0 !important;
}
.mp-thumb-box img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

.mp-info-box {
  flex: 1 !important;
  min-width: 0 !important;
}

.mp-actions-box {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  align-self: stretch !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
  width: 150px !important;
}
.mp-actions-box .btn {
  width: 100% !important;
  min-height: 36px !important;
  padding: 6px 12px !important;
  font-size: 12.5px !important;
}

@media (max-width: 768px) {
  .mp-list-card {
    flex-direction: column !important;
    align-items: flex-start !important;
  }
  .mp-thumb-box {
    width: 100% !important;
    height: 160px !important;
  }
  .mp-actions-box {
    width: 100% !important;
    flex-direction: row !important;
  }
}

/* =========================================================
   SOBREPOSIÇÃO DO NAV MENU (TABLER OVERRIDES)
   ========================================================= */
.navbar-dark.topbar-premium,
.topbar-premium {
  background-color: #0f172a !important; /* Midnight Deep */
  border-bottom: 1px solid #1e293b !important;
  padding: 8px 0 !important;
}

.sec-navbar-premium,
.navbar-light.sec-navbar-premium,
.navbar.sec-navbar-premium {
  background-color: var(--surface) !important;
  border-bottom: 1px solid var(--border) !important;
  box-shadow: var(--shadow) !important;
}

/* Links do menu */
.sec-navbar-premium .navbar-nav .nav-link,
.navbar-light .navbar-nav .nav-link {
  color: var(--text-muted) !important;
  font-weight: 700 !important;
  font-size: 13.5px !important;
  font-family: 'Outfit', sans-serif !important;
  border: 1px solid transparent !important;
  transition: var(--transition) !important;
  background: transparent !important;
  padding: 12px 16px !important;
}

.sec-navbar-premium .navbar-nav .nav-link:hover,
.navbar-light .navbar-nav .nav-link:hover {
  color: var(--text-main) !important;
  background: rgba(0,0,0,0.02) !important;
  border-radius: var(--radius-sm);
}

.sec-navbar-premium .navbar-nav .nav-item.active .nav-link,
.navbar-light .navbar-nav .nav-item.active .nav-link {
  color: #fff !important;
  border-color: #172033 !important;
  background: #172033 !important;
}
.sec-navbar-premium .navbar-nav .nav-item.active::after { display:none !important; content:none !important; }

/* Corrigir caixas brancas nos dropdowns do menu */
.sec-navbar-premium .dropdown-menu {
  background: var(--surface) !important;
  border: 1px solid var(--border) !important;
  box-shadow: var(--shadow-hover) !important;
}

.sec-navbar-premium .dropdown-item {
  color: var(--text-main) !important;
  transition: var(--transition) !important;
}
.sec-navbar-premium .dropdown-item:hover,
.sec-navbar-premium .dropdown-item.active {
  background: var(--bg) !important;
  color: var(--primary) !important;
}