/* Overrides for the official HeroUI components, using the dashboard palette. */
:root, .light {
  --accent: #13785c;
  --accent-foreground: #fff;
  --focus: #13785c;
  --background: #f5f7fa;
  --foreground: #1b2b40;
  --surface: #fff;
  --surface-secondary: #fff;
  --surface-tertiary: #eef3f7;
  --field-background: #f5f7fa;
  --radius: .75rem;
}
.brand-description { font-size: 11px; line-height: 1.6; }
.brand-description>span { white-space: nowrap; }
.offline-badge { max-width: 245px; white-space: normal; line-height: 1.4; }
.offline-badge>span { flex-shrink: 0; }
.offline-badge strong { display: block; color: #13785c; font-size: 11px; font-weight: 600; }
.offline-badge small { display: block; font-size: 10px; color: #62748a; }
@media (max-width: 1180px) {
  .controls-area { width: 100%; flex-wrap: wrap; }
  .offline-badge { display: flex; max-width: none; flex: 1; }
}
@media (max-width: 600px) { .offline-badge { flex-basis: 100%; } }
.card.kpi-card { gap: 0; border-radius: 16px; box-shadow: 0 2px 8px #1b2b4005; }
.card.kpi-card:hover { box-shadow: 0 4px 14px #1b2b400a; }
.turno-switch { border-radius: 14px; }
.turno-switch .button-group { gap: 4px; background: transparent; }
.turno-switch .button { border-radius: 10px; height: 36px; font-size: 12px; padding: 0 12px; }
.turno-switch .button.active { color: #13785c; background: #fff; box-shadow: 0 2px 5px #1b2b4012; }
.analysis-tabs { gap: 8px; align-items: center; flex: 1 1 auto; overflow: visible; position: relative; padding: 4px; }
.analysis-tabs-list { display: flex; gap: 8px; width: max-content; flex-shrink: 0; }
.analysis-tabs-list.is-collapsed { position: absolute; top: 0; left: 0; width: 0; height: 0; visibility: hidden; pointer-events: none; overflow: hidden; clip-path: inset(50%); }
.analysis-tabs .analysis-menu-trigger { min-width: 220px; max-width: 100%; width: 100%; border-radius: 999px; background: #e5f3ed; color: #13785c; justify-content: flex-start; }
.analysis-menu-chevron { margin-left: auto; }
.analysis-menu-popover { z-index: 2000; min-width: 260px; max-width: calc(100vw - 32px); background: #fff; border: 1px solid #e1e7ee; border-radius: 16px; padding: 6px; box-shadow: 0 12px 35px #1b2b4026; }
.analysis-menu-popover .dropdown__menu { display: flex; flex-direction: column; gap: 4px; padding: 0; outline: none; }
.analysis-menu-popover .menu-item {
  display: grid; grid-template-columns: 20px minmax(0, 1fr) 18px; align-items: center;
  gap: 10px; min-height: 44px; width: 100%; padding: 10px 12px;
  border-radius: 10px; outline: none; color: #1b2b40; font-size: 13px;
}
.analysis-menu-popover .analysis-option-icon { display: grid; place-items: center; width: 20px; height: 20px; color: #62748a; }
.analysis-menu-popover .analysis-option-label { min-width: 0; line-height: 1.4; white-space: normal; }
.analysis-menu-popover .menu-item .analysis-option-check { position: static; inset: auto; transform: none; margin: 0; width: 18px; height: 18px; justify-self: end; color: #13785c; }
.analysis-menu-popover .analysis-option-check svg { width: 16px; height: 16px; }
.analysis-menu-popover .menu-item:hover { background: #f1f6f3; }
.analysis-menu-popover .menu-item:focus-visible,
.analysis-menu-popover .menu-item[data-focus-visible="true"] { outline: none; box-shadow: inset 0 0 0 2px #13785c; background: #eef7f3; }
.analysis-menu-popover .menu-item[aria-checked="true"] .analysis-option-icon { color: #13785c; }
.analysis-menu-popover .menu-item[aria-checked="true"] { background: #e5f3ed; color: #13785c; }
.analysis-tabs .button { height: 42px; padding: 0 14px; border-radius: 999px; border-bottom: 0; font-size: 12px; flex-shrink: 0; }
.analysis-tabs .button.active { background: #e5f3ed; color: #13785c; }
.nav-tabs { gap: 16px; padding: 6px 12px; border-radius: 16px; overflow: visible; }
.input { border-radius: 10px; }
.input:focus { border-color: #13785c; box-shadow: 0 0 0 3px #13785c18; }
.map-search-input-box { min-height: 48px; padding: 0 14px; border-radius: 12px; }
.map-search-input-box .map-search-input,
.map-search-input-box .map-search-input:focus,
.map-search-input-box .map-search-input:focus-visible {
  flex: 1; width: 100%; min-width: 0; min-height: 44px; padding: 0;
  background: transparent; border: 0; border-radius: 0;
  outline: none; box-shadow: none;
}
.map-search-input-box:focus-within { border-color: #13785c; box-shadow: 0 0 0 3px #13785c18; }
.tag.chip { height: auto; width: fit-content; min-height: 21px; border-radius: 7px; line-height: 1.4; padding: 3px 7px; white-space: normal; }
.surface { border-radius: 16px; }
.button:focus-visible, .button[data-focus-visible="true"] { outline: 3px solid #13785c; outline-offset: 3px; }
#kpi-estados-placar { display: flex; gap: 7px; align-items: baseline; flex-wrap: wrap; font-size: clamp(23px, 2vw, 30px); }
.score-lula { color: #b62a3d; }
.legend-dot.capital-dot { background: #111; }
.panel-motion-layer { position: fixed; inset: 0; pointer-events: none; z-index: 1800; overflow: hidden; }
.kpi-balance-details { interpolate-size: allow-keywords; }
.kpi-balance-details::details-content {
  block-size: 0; overflow: hidden; opacity: 0;
  transition: block-size 300ms cubic-bezier(.22,1,.36,1), opacity 200ms ease, content-visibility 300ms allow-discrete;
}
.kpi-balance-details[open]::details-content { block-size: auto; opacity: 1; }
.sticky-table-heading { position: fixed; z-index: 1250; overflow: hidden; pointer-events: none; background: #f7f9fb; border-bottom: 1px solid #dce5ee; box-shadow: 0 3px 9px #1b2b4012; }
.sticky-table-heading table { margin: 0; table-layout: fixed; }
.sticky-table-heading th { background: #f7f9fb; }
@media (prefers-reduced-motion: reduce) { .kpi-balance-details::details-content { transition: none; } }
.winner-badge.lula, .winner-badge.bolsonaro { background: #fff; border: 1px solid #e1e7ee; padding: 5px; }
.winner-badge .party-logo { width: 28px; height: 28px; object-fit: contain; }
.pop-card-uf-badge.state-flag-badge { display: inline-flex; align-items: center; justify-content: center; padding: 0; border: 0; background: transparent; min-width: 44px; overflow: hidden; border-radius: 5px; }
.state-flag-badge img { display: block; width: 44px; height: 30px; object-fit: contain; }
.score-bolsonaro { color: #1858b5; }
.score-separator { color: #62748a; font-size: .6em; font-weight: 500; }
.score-round { display: flex; align-items: baseline; gap: 7px; white-space: nowrap; }
.score-round small { font-size: 11px; color: #62748a; font-weight: 500; width: 19px; }
.state-turnover-change { display: flex; flex-direction: column; gap: 4px; font-size: 12px; color: #93620d; }
.state-turnover-entry { display: flex; flex-direction: column; gap: 3px; }
.state-turnover-entry strong { color: #13785c; font-weight: 600; }
.state-turnover-entry small { font-size: 10px; color: #62748a; }
#kpi-estados-placar:has(.score-round) { flex-direction: column; gap: 0; }
.logo-badge { padding: 0; overflow: hidden; background: transparent; flex-shrink: 0; }
.logo-badge img { width: 100%; height: 100%; object-fit: cover; border-radius: 12px; }
.candidate-kpi.lula { background: #b62a3d; border-color: #b62a3d; }
.candidate-kpi.bolsonaro { background: #1858b5; border-color: #1858b5; }
.candidate-kpi, .candidate-kpi * { color: #fff !important; }
.candidate-kpi .tag { background: #ffffff1f; border-color: #ffffff66; }
.candidate-kpi .eyebrow, .candidate-kpi .party-label, .candidate-kpi .kpi-sub { color: #ffffffeb !important; }
.candidate-kpi .party-logo { background: #fff; padding: 2px; border-radius: 4px; }
.candidate-kpi .kpi-portrait { border-color: #ffffffaa; }
.candidate-kpi .progress-bar-wrap { background: #ffffff40; }
.candidate-kpi .progress-bar-fill { background: #fff; }
.kpi-change-lines { display: flex; flex-direction: column; align-items: flex-start; font-size: 12px; font-weight: 500; line-height: 1.6; margin-top: 6px; }
.kpi-change-lines>strong { font-weight: 700; white-space: nowrap; }
@media (prefers-reduced-motion: reduce) { .button, .card { transition: none; } }
@media (max-width: 1180px) {
  .analysis-tabs { flex: 1 1 100%; }
  .nav-tabs { gap: 10px; padding: 12px; }
  .analysis-turno { margin: 0 0 0 auto; }
}
@media (max-width: 600px) { .analysis-turno .button-group { width: 100%; } }
.nav-tabs .analysis-tabs .analysis-menu-trigger {
  display: inline-flex; align-items: center; gap: 12px; width: auto; min-width: 260px;
  max-width: 100%; height: 52px; padding: 8px 14px 8px 8px; border: 1px solid #d8e5df;
  border-radius: 14px; background: #fff; color: #1b2b40; box-shadow: 0 2px 5px #1b2b4008;
  transition: background-color 160ms, border-color 160ms, box-shadow 160ms;
}
.nav-tabs .analysis-tabs .analysis-menu-trigger:hover,
.nav-tabs .analysis-tabs .analysis-menu-trigger[aria-expanded="true"] { background: #f5faf7; border-color: #91b9a7; box-shadow: 0 3px 12px #13785c12; }
.analysis-menu-icon { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; background: #e5f3ed; color: #13785c; font-size: 19px; flex-shrink: 0; }
.analysis-menu-copy { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; min-width: 0; gap: 2px; line-height: 1.35; text-align: left; }
.analysis-menu-copy small { color: #62748a; font-size: 9px; letter-spacing: 1.1px; font-weight: 600; }
.analysis-menu-copy strong { font-size: 13px; font-weight: 600; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.analysis-menu-chevron { margin-left: auto; color: #62748a; transition: transform 180ms; }
[aria-expanded="true"]>.analysis-menu-chevron { transform: rotate(180deg); }
@media (max-width: 600px) { .nav-tabs .analysis-tabs .analysis-menu-trigger { width: 100%; min-width: 0; } }