/* ═══════════════════════════════════════════════════════
   AUREA Insights Report — Brand Override Layer
   Replaces "Sovereign Intelligence" dark theme
   with Aurea Design & Estate light brand identity.
   
   Load order:
     1. style-v10.css  (Aurea global)
     2. insights-report.css  (this file)
     3. [optional] insights-report-zh-hant.css / zh-cn.css
   
   Created: 2026-03-15
   ═══════════════════════════════════════════════════════ */

/* ───────────────────────────────────────────────────────
   A) CSS VARIABLE OVERRIDE — Dark → Light
   Map old Sovereign Intelligence tokens → Aurea tokens
   ─────────────────────────────────────────────────────── */
:root {
    /* === Background === */
    --sovereign-ink:    var(--white);           /* #0A0E1A → #FFFFFF */
    --central-blue:     var(--offwhite);        /* #1B2B4D → #FAFAF8 */
    --obsidian:         var(--white);           /* #060810 → #FFFFFF */

    /* === Text === */
    --signal-white:     var(--dark);            /* #E8ECF1 → #2C2A26 */
    --titanium:         var(--warm-gray);       /* #8E95A3 → #595959 */

    /* === Accent === */
    --bauhinia-gold:    var(--gold);            /* #C9A84C → #B8A88A */

    /* === Semantic === */
    --seal-vermillion:  #9A4040;               /* #C43A31 → muted red */
    --jade-circuit:     var(--color-success);   /* #2EC4A0 → #4A7A3E */

    /* === Borders === */
    --steel-wire:       rgba(212, 207, 198, 0.35);  /* #2A3142 → warm border */

    /* === Glows (reduced for light theme) === */
    --gold-glow:        rgba(184, 168, 138, 0.10);
    --jade-glow:        rgba(74, 122, 62, 0.08);
    --vermillion-glow:  rgba(154, 64, 64, 0.08);

    /* === Layout (keep sidebar/header dims) === */
    --sidebar-w:        260px;
    --header-h:         56px;

    /* === Report-specific tokens === */
    --report-accent:       var(--gold);
    --report-accent-hover: var(--gold-dark);
    --report-accent-light: var(--gold-light);
    --report-surface:      var(--white);
    --report-surface-alt:  var(--offwhite);
    --report-border:       rgba(212, 207, 198, 0.3);
    --report-text:         var(--dark);
    --report-text-muted:   var(--warm-gray);
    --report-text-subtle:  var(--charcoal);
}


/* ───────────────────────────────────────────────────────
   B) BASE OVERRIDES
   ─────────────────────────────────────────────────────── */
body {
    background: var(--white) !important;
    color: var(--dark) !important;
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
}

/* Remove watermark pseudo-element */
body::after {
    display: none !important;
}


/* ───────────────────────────────────────────────────────
   C–D) REMOVED — Old #top-header, #main/.main-content,
   #sidebar/.sidebar aliases no longer exist in report HTML.
   Reports now use report-shell / report-sidebar selectors
   styled via insights-nav.css.
   ─────────────────────────────────────────────────────── */


/* ───────────────────────────────────────────────────────
   E) TYPOGRAPHY — Aurea-aligned
   ─────────────────────────────────────────────────────── */
h1.section-title {
    font-family: var(--serif);
    color: var(--dark);
    border-bottom-color: var(--report-border);
    letter-spacing: 0.5px;
}

h2 {
    color: var(--dark);
    border-left-color: var(--gold);
}

h3 {
    color: var(--charcoal);
}

h4 {
    color: var(--warm-gray);
}

p {
    color: var(--charcoal);
}

strong {
    color: var(--dark);
}

em {
    color: var(--gold-dark);
    font-style: italic;
}

a {
    color: var(--gold-dark);
}

a:hover {
    color: var(--gold-text);
}

li {
    color: var(--charcoal);
}

li::marker {
    color: var(--gold);
}

hr {
    border-top-color: var(--report-border);
}


/* ───────────────────────────────────────────────────────
   F) BLOCKQUOTE
   ─────────────────────────────────────────────────────── */
blockquote {
    border-left: 3px solid var(--gold);
    background: var(--gold-bg);
    color: var(--warm-gray);
}


/* ───────────────────────────────────────────────────────
   G) CODE
   ─────────────────────────────────────────────────────── */
code {
    background: var(--offwhite);
    color: var(--gold-dark);
    border: 1px solid var(--report-border);
}


/* ───────────────────────────────────────────────────────
   H) TABLES — Aurea light style
   ─────────────────────────────────────────────────────── */
th {
    background: var(--offwhite);
    color: var(--dark);
    border-bottom: 1px solid var(--stone);
    font-weight: 600;
}

td {
    color: var(--charcoal);
    border-bottom: 1px solid var(--report-border);
}

tr:hover td {
    background: rgba(184, 168, 138, 0.06) !important;
}

tr:nth-child(even) td {
    background: rgba(250, 250, 248, 0.5);
}

.table-wrap {
    border: 1px solid var(--report-border);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-1);
}


/* ───────────────────────────────────────────────────────
   I) COVER SECTION
   ─────────────────────────────────────────────────────── */
.cover-section {
    background: linear-gradient(180deg, var(--white) 0%, var(--offwhite) 50%, #F5F3EF 100%) !important;
    animation: none !important;
}

.cover-section h1 {
    color: var(--dark);
    letter-spacing: 2px;
}

.cover-section .cover-sub {
    color: var(--warm-gray);
}

.cover-section .cover-divider {
    background: linear-gradient(90deg, transparent, var(--gold), transparent);
}

.cover-section .cover-title2 {
    color: var(--gold-dark);
}

.cover-section .cover-meta {
    color: var(--warm-gray);
}

/* Remove coverPulse animation */
@keyframes coverPulse {
    0%, 100% { opacity: 1; }
}


/* ───────────────────────────────────────────────────────
   J) CARDS — Light Aurea style
   ─────────────────────────────────────────────────────── */
.plot-card {
    background: var(--white);
    border: 1px solid var(--report-border);
    box-shadow: var(--shadow-1);
}

.plot-card .card-label {
    color: var(--warm-gray);
}

.plot-card .card-value {
    color: var(--gold-dark);
}

.plot-card .card-sub {
    color: var(--warm-gray);
}


/* ───────────────────────────────────────────────────────
   K) TABS
   ─────────────────────────────────────────────────────── */
.plot-tabs,
.sim-tabs,
.dd-plot-tabs {
    border-bottom-color: var(--report-border);
}

.plot-tab,
.sim-tab {
    color: var(--warm-gray);
}

.plot-tab:hover,
.sim-tab:hover {
    color: var(--dark);
    background: var(--gold-bg);
}

.plot-tab.active,
.sim-tab.active {
    color: var(--gold-dark);
    background: var(--white);
    border-color: var(--report-border);
    border-bottom-color: var(--white);
}

.dd-plot-tab {
    color: var(--warm-gray);
}

.dd-plot-tab.active {
    color: var(--gold-dark);
    border-bottom-color: var(--gold);
}


/* ───────────────────────────────────────────────────────
   L) COMPARISON GRID
   ─────────────────────────────────────────────────────── */
.compare-col {
    background: var(--white);
    border: 1px solid var(--report-border);
    box-shadow: var(--shadow-1);
    border-radius: var(--radius-lg);
}

.compare-col .col-header {
    color: var(--dark);
    border-bottom-color: var(--report-border);
}

.compare-col .metric .m-label {
    color: var(--warm-gray);
}

.compare-col .metric .m-value {
    color: var(--dark);
}

.compare-col .metric {
    border-bottom-color: var(--report-border);
}


/* ───────────────────────────────────────────────────────
   M) SCORE BADGES — Aurea semantic colors
   ─────────────────────────────────────────────────────── */
.score-badge.high {
    background: var(--color-success-bg);
    color: var(--color-success);
    border-color: var(--color-success);
}

.score-badge.mid {
    background: var(--gold-bg);
    color: var(--gold-dark);
    border-color: var(--gold);
}

.score-badge.low {
    background: rgba(154, 64, 64, 0.08);
    color: #9A4040;
    border-color: #9A4040;
}


/* ───────────────────────────────────────────────────────
   N) RISK BARS
   ─────────────────────────────────────────────────────── */
.risk-bar-label .risk-id {
    color: var(--warm-gray);
}

.risk-bar-label .risk-name {
    color: var(--dark);
}

.risk-bar-track {
    background: var(--stone);
}


/* ───────────────────────────────────────────────────────
   O) HIGHLIGHT CLASSES
   ─────────────────────────────────────────────────────── */
.hl-euro {
    color: var(--gold-dark);
}

.hl-pct {
    color: var(--color-success);
}

.hl-area {
    color: var(--aegean, #2E5D6C);
}

.hl-risk-high {
    color: #9A4040;
}

.hl-risk-mid {
    color: var(--color-warning);
}

.hl-risk-low {
    color: var(--color-success);
}


/* ───────────────────────────────────────────────────────
   P) ROI SIMULATOR — Gold accent
   ─────────────────────────────────────────────────────── */
.sim-kpi {
    background: var(--offwhite);
    border: 1px solid var(--report-border);
    box-shadow: var(--shadow-1);
}

.sim-kpi .kpi-label {
    color: var(--warm-gray);
}

.sim-kpi .kpi-value {
    color: var(--gold-dark);
}

.sim-slider-wrap label {
    color: var(--charcoal);
}

.sim-slider-wrap input[type="range"] {
    background: var(--stone);
}

.sim-slider-wrap input[type="range"]::-webkit-slider-thumb {
    background: var(--gold);
    box-shadow: 0 0 8px rgba(184, 168, 138, 0.4);
}

.sim-slider-wrap input[type="range"]::-moz-range-thumb {
    background: var(--gold);
    border: none;
}

.sim-price-display {
    color: var(--gold-dark);
}

.sim-note {
    color: var(--warm-gray);
    border-left-color: var(--stone);
}

/* Waterfall chart labels */
.sim-wf-bar .wf-label {
    color: var(--warm-gray);
}

.sim-wf-bar .wf-val {
    color: var(--dark);
}


/* ───────────────────────────────────────────────────────
   Q) COST DRILL-DOWN
   ─────────────────────────────────────────────────────── */
.cost-drilldown-btn {
    border-color: var(--gold);
    color: var(--gold-dark);
}

.cost-drilldown-btn:hover {
    background: var(--gold-bg);
}

.dd-category summary {
    color: var(--dark);
    background: var(--offwhite);
}

.dd-category summary:hover {
    background: var(--gold-bg);
}

.dd-category summary .cat-arrow {
    color: var(--warm-gray);
}

.dd-category summary .cat-total {
    color: var(--gold-dark);
}


/* ───────────────────────────────────────────────────────
   R) DECISION CARDS
   ─────────────────────────────────────────────────────── */
.decision-card {
    background: var(--white);
    border: 1px solid var(--report-border);
    box-shadow: var(--shadow-1);
}

.decision-card .dc-header {
    border-bottom-color: var(--report-border);
}

.decision-card .dc-header:hover {
    background: var(--gold-bg);
}

.decision-card .dc-title {
    color: var(--dark);
}

.decision-card .dc-subtitle {
    color: var(--warm-gray);
}

.decision-card .dc-toggle {
    color: var(--warm-gray);
}

.decision-card .dc-content li {
    color: var(--charcoal);
}

.decision-card .dc-content li strong {
    color: var(--dark);
}

.decision-card .dc-content .dc-highlight {
    color: var(--gold-dark);
}


/* ───────────────────────────────────────────────────────
   S) FLOATING CTA — Aurea btn-primary style
   ─────────────────────────────────────────────────────── */
#floating-cta {
    background: var(--gold);
    border: none;
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-2);
}

#floating-cta:hover {
    background: var(--gold-dark);
    box-shadow: var(--shadow-3);
    border-color: transparent;
}

#floating-cta .cta-text {
    color: var(--white);
}

#floating-cta .cta-arrow {
    color: var(--white);
}


/* T) REMOVED — #progress-bar alias; reports use #report-progress
   U) REMOVED — .confidential-badge / #top-header; not in report HTML */


/* ───────────────────────────────────────────────────────
   V) SOURCE CHIPS & TOOLTIPS
   ─────────────────────────────────────────────────────── */
.source-chip {
    background: var(--offwhite);
    border-color: var(--report-border);
    color: var(--warm-gray);
}

.source-chip:hover {
    border-color: var(--gold);
    color: var(--dark);
}

.source-chip .chip-num {
    background: var(--gold-bg);
    color: var(--gold-dark);
}

.src-icon {
    color: var(--warm-gray);
    border-color: var(--stone);
}

.src-icon:hover {
    color: var(--gold-dark);
    border-color: var(--gold);
}

.src-icon .src-tip {
    background: var(--white);
    color: var(--dark);
    border-color: var(--report-border);
    box-shadow: var(--shadow-2);
}

.src-icon .src-tip::after {
    border-top-color: var(--white);
}


/* ───────────────────────────────────────────────────────
   W) LEAFLET MAP — Light adaptation
   ─────────────────────────────────────────────────────── */
#map-section .leaflet-container {
    background: var(--offwhite);
}

#kifisia-map {
    border-color: var(--report-border);
}

.map-legend {
    color: var(--warm-gray);
}

.leaflet-popup-content-wrapper {
    background: var(--white) !important;
    color: var(--dark) !important;
    border: 1px solid var(--report-border) !important;
    box-shadow: var(--shadow-2) !important;
}

.leaflet-popup-tip {
    background: var(--white) !important;
}

.leaflet-popup-content strong {
    color: var(--gold-dark);
}

.leaflet-popup-close-button {
    color: var(--warm-gray) !important;
}


/* ───────────────────────────────────────────────────────
   X) STACKED BAR CHART
   ─────────────────────────────────────────────────────── */
.stacked-bar {
    border: 1px solid var(--report-border);
}


/* ───────────────────────────────────────────────────────
   Y) REPORT SECTION BORDERS
   ─────────────────────────────────────────────────────── */
.report-section {
    border-bottom-color: var(--report-border);
}


/* ───────────────────────────────────────────────────────
   Z) RESPONSIVE OVERRIDES
   ─────────────────────────────────────────────────────── */
/* 1024px #sidebar / #sidebar-overlay.active — REMOVED (dead aliases) */

@media (max-width: 768px) {
    .report-section {
        padding: 40px 20px;
    }

    .cover-section {
        padding: 60px 24px;
    }

    .sim-kpi-grid {
        grid-template-columns: 1fr 1fr;
    }

    .compare-grid {
        grid-template-columns: 1fr;
    }
}

/* REMOVED — #hamburger, #sidebar-toggle, #sidebar-overlay
   (dead legacy aliases; reports use report-sidebar-toggle/overlay) */

/* KPI cards — light */
.kpi-card {
    background: var(--white) !important;
    border-color: var(--report-border) !important;
}

/* Comp cards — light */
.comp-card {
    background: var(--offwhite) !important;
    border-color: var(--report-border) !important;
}

/* Sim controls — light */
.sim-controls {
    background: var(--offwhite) !important;
    border-color: var(--report-border) !important;
}

/* Sim results — light */
.sim-result {
    background: var(--white) !important;
    border-color: var(--report-border) !important;
}

/* Stress cards — light */
.stress-card {
    background: var(--white) !important;
    border-color: var(--report-border) !important;
}

/* Accordion — light */
.accordion-header {
    background: var(--offwhite) !important;
    color: var(--dark) !important;
}

.accordion-header:hover {
    background: var(--gold-bg) !important;
}

/* Letter box — light */
.letter-box {
    background: var(--offwhite) !important;
    border-color: var(--report-border) !important;
}

/* Cover section — light gradient (merged into section I above) */

.cover-section::before {
    background: radial-gradient(ellipse at 50% 30%, rgba(184, 168, 138, 0.06) 0%, transparent 70%) !important;
}

/* Section borders — warm */
section {
    border-bottom-color: var(--report-border) !important;
}

/* SWOT cards — light */
.swot-card {
    background: var(--white);
    border-color: var(--report-border);
}

/* Matrix table — light */
.matrix-table th {
    background: var(--offwhite) !important;
    color: var(--dark) !important;
}

.matrix-table td {
    border-color: var(--report-border) !important;
}

.matrix-table td.positive {
    background: rgba(74, 122, 62, 0.10) !important;
    color: var(--color-success) !important;
}

.matrix-table td.negative {
    background: rgba(154, 64, 64, 0.10) !important;
    color: #9A4040 !important;
}

.matrix-table td.base {
    background: rgba(184, 168, 138, 0.15) !important;
}

.matrix-table td.marginal {
    background: rgba(89, 89, 89, 0.08) !important;
    color: var(--warm-gray) !important;
}

/* Data table — light */
.data-table th {
    background: var(--offwhite) !important;
    color: var(--dark) !important;
    border-bottom-color: var(--gold) !important;
}

.data-table td {
    color: var(--charcoal) !important;
    border-bottom-color: var(--report-border) !important;
}

.data-table tr:hover td {
    background: rgba(184, 168, 138, 0.06) !important;
}

.data-table .highlight {
    background: rgba(184, 168, 138, 0.08) !important;
}

/* Scrollbar — light */
::-webkit-scrollbar-track {
    background: var(--offwhite) !important;
}

::-webkit-scrollbar-thumb {
    background: var(--stone) !important;
}

/* Selection — Aurea gold */
::selection {
    background: var(--gold) !important;
    color: var(--white) !important;
}

/* ───────────────────────────────────────────────────────
   PRINT
   ─────────────────────────────────────────────────────── */
@media print {
    .report-sidebar, .report-header,
    .report-progress, #floating-cta,
    #report-sidebar-toggle, #report-sidebar-overlay,
    nav[aria-label="Primary"], .mobile-menu {
        display: none !important;
    }
    .report-main { margin-left: 0 !important; margin-top: 0 !important; }
    body { background: #fff !important; }
}