/* [HS9] Sajt je svijetla tema: isključi automatsko tamnjenje (Chrome Android auto-dark, Samsung Internet) koje je pravilo bijeli tekst na bijelom. */
:root{color-scheme:light only}
/* ═══════════════════════════════════════════════════════════════════════════
   InvestConnect — design tokens (single source of truth for the whole platform)
   ───────────────────────────────────────────────────────────────────────────
   Three layers, top to bottom: primitive scales → semantic roles → Bootstrap
   variables. Components (ic.css, admin.css, metronic.css) only ever read the
   semantic layer. Nothing below this file may introduce a raw colour, size or
   duration.

   Brand (from 2026-10-09): AIM 2026 Mini Brand Book v1.1 — dark-led, premium.
   Ink / Bay grounds, Future Lime for rules + CTA + key figures (on dark only),
   Adriatic for labels + links on dark, Deep Lime / Deep Adriatic as their
   stand-ins on light grounds, Karst instead of white, Mist for info panels and
   tables. Square corners, 1px hairlines, no gradients between brand colours,
   no glows or shadows. Montserrat (display, labels) + Inter (body).
   The same values drive the conference site (aim-conference/src/styles/tokens.css).

   Spec: docs/superpowers/specs/2026-09-23-design-upgrade-plan.md (system),
         docs/client-feedback/2026-10-07-anthony-feedback-II.md §1 (brand).
   ═══════════════════════════════════════════════════════════════════════════ */

:root {
  /* ── 1. primitive colour — the brand palette ────────────────────────── */
  --ic-brand-ink:#0a1e2b;           /* primary ground, text on light */
  --ic-brand-bay:#0e3b4c;           /* secondary dark surface, supergraphics */
  --ic-brand-lime:#a2ce3b;          /* Future Lime: rules, arrows, figures, CTA, the mark — on dark only */
  --ic-brand-adriatic:#00a0d2;      /* labels, tags, data, links — on dark only */
  --ic-brand-deep-lime:#56741a;     /* Lime's stand-in on light (4.6:1 on Karst) */
  --ic-brand-deep-adriatic:#006f93; /* Adriatic's stand-in on light; brand #00759b darkened a step (4.9:1 on Karst and Mist) */
  --ic-brand-slate:#52646d;         /* secondary text on light (5.3:1 on Karst) */
  --ic-brand-fog:#a9b7bc;           /* secondary text on dark (8.3:1 on Ink, 5.8:1 on Bay) */
  --ic-brand-karst:#ecf0e4;         /* light ground, type on dark — replaces white */
  --ic-brand-mist:#e1f0f5;          /* info panels, tables, agenda grounds */
  --ic-brand-pale-lime:#ecf39e;     /* small highlight behind Ink text only, never next to Lime */
  --ic-brand-white:#ffffff;         /* only behind partner / company logos and inside inputs */

  /* tonal scales: charts, data and states — never new backgrounds */
  --ic-adriatic-900:#003e52; --ic-adriatic-700:#00759b; --ic-adriatic-500:#00a0d2; --ic-adriatic-300:#66c6e4; --ic-adriatic-100:#e1f0f5;
  --ic-lime-900:#34470f;     --ic-lime-700:#56741a;     --ic-lime-500:#a2ce3b;     --ic-lime-300:#c8e38a;     --ic-lime-100:#ecf39e;

  /* derived tones (Ink / Karst / Fog blends, used for text steps and tints) */
  --ic-ink-85:#253741;              /* Ink 88% on Karst — body text on light, 10.7:1 */
  --ic-fog-75:#819198;              /* Fog 75% on Ink — tertiary text on Ink only, 5.2:1 */
  --ic-mist-2:#d0dfe5;              /* Mist + 8% Ink — second tint step */
  --ic-karst-2:#dfe4d6;             /* Karst + 5% Ink — pressed surfaces */

  /* hairlines (brand §05): 1px Fog at 30% on dark, Ink at ~22% on light */
  --ic-hairline:rgba(169,183,188,.30);
  --ic-hairline-strong:rgba(169,183,188,.50);
  --ic-hairline-light:rgba(10,30,43,.22);
  --ic-hairline-light-strong:rgba(10,30,43,.40);

  /* functional red — not a brand colour; errors and destructive actions only */
  --ic-red-600:#b42318; --ic-red-100:#f3e2de;

  /* ── legacy primitive names ─────────────────────────────────────────────
     Older rules (map.js, admin.css, page-level CSS) still read the navy /
     neutral scales. They are re-bound to the brand so nothing paints the old
     slate-blue. New code reads the semantic layer, not these. */
  --ic-navy-50:var(--ic-brand-karst);  --ic-navy-100:var(--ic-brand-mist); --ic-navy-200:var(--ic-mist-2);
  --ic-navy-300:var(--ic-brand-fog);   --ic-navy-400:var(--ic-brand-slate); --ic-navy-500:var(--ic-brand-slate);
  --ic-navy-600:var(--ic-ink-85);      --ic-navy-700:var(--ic-brand-bay);  --ic-navy-800:var(--ic-brand-bay);
  --ic-navy-900:var(--ic-brand-ink);   --ic-navy-950:var(--ic-brand-ink);
  --ic-neutral-0:var(--ic-brand-karst); --ic-neutral-50:var(--ic-brand-karst); --ic-neutral-100:var(--ic-brand-mist);
  --ic-neutral-150:var(--ic-brand-mist); --ic-neutral-200:var(--ic-mist-2); --ic-neutral-300:var(--ic-hairline-light);
  --ic-neutral-400:var(--ic-hairline-light-strong); --ic-neutral-500:var(--ic-brand-fog); --ic-neutral-600:var(--ic-brand-slate);
  --ic-neutral-700:var(--ic-ink-85); --ic-neutral-800:var(--ic-brand-ink);
  --ic-green-600:var(--ic-brand-deep-lime); --ic-green-100:var(--ic-brand-pale-lime);
  --ic-blue-600:var(--ic-brand-deep-adriatic); --ic-blue-100:var(--ic-brand-mist);
  --ic-gold-700:var(--ic-lime-900); --ic-gold-100:var(--ic-brand-pale-lime);

  /* "amber" = the citrus orange inside the InvestConnect logo (#f9ab2f, Darko /
     Spec.Art). Per the brand book institutional colours live only inside the
     logo, so from 2026-10-09 these are NOT used by any component — kept for
     the logo file and docs. Lime carries the accent role. */
  --ic-amber-600:#f9ab2f; --ic-amber-800:#99620a;
  --ic-amber-50:var(--ic-brand-pale-lime); --ic-amber-100:var(--ic-brand-pale-lime); --ic-amber-200:var(--ic-lime-300);
  --ic-amber-300:var(--ic-lime-300); --ic-amber-400:var(--ic-brand-lime); --ic-amber-500:var(--ic-brand-lime);
  --ic-amber-700:var(--ic-brand-deep-lime); --ic-amber-900:var(--ic-lime-900);

  /* sectors are told apart by label text, not by colour (brand §05) —
     every pair resolves to the one label colour. Names kept for markup. */
  --ic-sector-ict-fg:var(--ic-brand-deep-adriatic);       --ic-sector-ict-bg:var(--ic-brand-mist);
  --ic-sector-agri-fg:var(--ic-brand-deep-adriatic);      --ic-sector-agri-bg:var(--ic-brand-mist);
  --ic-sector-renew-fg:var(--ic-brand-deep-adriatic);     --ic-sector-renew-bg:var(--ic-brand-mist);
  --ic-sector-transport-fg:var(--ic-brand-deep-adriatic); --ic-sector-transport-bg:var(--ic-brand-mist);
  --ic-sector-tourism-fg:var(--ic-brand-deep-adriatic);   --ic-sector-tourism-bg:var(--ic-brand-mist);
  --ic-sector-finance-fg:var(--ic-brand-deep-adriatic);   --ic-sector-finance-bg:var(--ic-brand-mist);
  --ic-sector-government-fg:var(--ic-brand-deep-adriatic); --ic-sector-government-bg:var(--ic-brand-mist);

  /* ── 2. semantic colour (light grounds: Karst / Mist) ───────────────── */
  --ic-bg:var(--ic-brand-karst);
  --ic-bg-alt:var(--ic-brand-mist);
  --ic-surface:var(--ic-brand-karst);         /* cards sit on the ground, framed by a hairline */
  --ic-surface-tint:var(--ic-brand-mist);
  --ic-surface-tint-2:var(--ic-mist-2);
  --ic-surface-input:var(--ic-brand-white);   /* inputs and logo wells are the only white */
  --ic-rule:var(--ic-hairline-light);
  --ic-rule-strong:var(--ic-hairline-light-strong);
  --ic-ink:var(--ic-brand-ink);
  --ic-ink-2:var(--ic-ink-85);
  --ic-ink-3:var(--ic-brand-slate);
  --ic-ink-disabled:var(--ic-brand-fog);
  --ic-accent:var(--ic-brand-ink);            /* primary action fill on light (Ink on Karst) */
  --ic-accent-hover:var(--ic-brand-bay);
  --ic-accent-active:var(--ic-brand-ink);
  --ic-accent-text:var(--ic-brand-deep-lime); /* key words, figures, markers on light */
  --ic-accent-tint:var(--ic-brand-pale-lime);
  --ic-accent-tint-2:var(--ic-lime-300);
  --ic-accent-ring:rgba(0,160,210,.30);       /* focus ring: Adriatic */
  --ic-on-accent:var(--ic-brand-karst);
  --ic-bar:var(--ic-brand-lime);              /* the anchor rule and every 4px rail — a graphic, not text */
  --ic-label:var(--ic-brand-deep-adriatic);   /* caps labels, tags, kickers on light */
  --ic-success:var(--ic-brand-deep-lime); --ic-success-tint:var(--ic-brand-pale-lime);
  --ic-warning:var(--ic-lime-900);        --ic-warning-tint:var(--ic-brand-pale-lime);
  --ic-danger:var(--ic-red-600);          --ic-danger-tint:var(--ic-red-100);
  --ic-info:var(--ic-brand-deep-adriatic); --ic-info-tint:var(--ic-brand-mist);
  --ic-link:var(--ic-brand-deep-adriatic);
  --ic-link-hover:var(--ic-adriatic-900);
  --ic-focus:var(--ic-brand-deep-adriatic);

  /* dark bands (header, hero, footer, CTA) — read by .ic-dark / [data-bs-theme=dark] */
  --ic-dark-bg:var(--ic-brand-ink);
  --ic-dark-bg-2:var(--ic-brand-bay);
  --ic-dark-surface:var(--ic-brand-bay);
  --ic-dark-rule:var(--ic-hairline);
  --ic-dark-rule-strong:var(--ic-hairline-strong);
  --ic-dark-ink:var(--ic-brand-karst);
  --ic-dark-ink-2:var(--ic-brand-fog);
  --ic-dark-ink-3:var(--ic-fog-75);
  --ic-dark-accent:var(--ic-brand-lime);       /* CTA fill on dark: Ink on Lime 9.3:1 */
  --ic-dark-accent-text:var(--ic-brand-lime);  /* key words, figures on Ink 9.3:1 */
  --ic-dark-label:var(--ic-brand-adriatic);    /* labels, tags, links on Ink 5.6:1 (on Bay use Lime) */

  /* ── 3. typography ──────────────────────────────────────────────────── */
  --ic-font-display:"Montserrat","Gotham","Helvetica Neue",Arial,sans-serif;
  --ic-font-body:Inter,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --ic-font-mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;

  --ic-fs-display:clamp(2.375rem,4.8vw,3.5rem);
  --ic-fs-h1:clamp(2rem,3.4vw,2.75rem);
  --ic-fs-h2:clamp(1.625rem,2.6vw,2.125rem);
  --ic-fs-h3:1.3125rem;
  --ic-fs-h4:1.0625rem;
  --ic-fs-lead:1.125rem;
  --ic-fs-body:0.96875rem;
  --ic-fs-small:0.84375rem;
  --ic-fs-micro:0.75rem;
  --ic-fs-label:0.7rem;             /* hairline-framed caps labels */
  --ic-fs-figure:clamp(2.5rem,4.5vw,3.75rem);

  --ic-lh-tight:0.98;
  --ic-lh-heading:1.1;
  --ic-lh-body:1.6;
  --ic-track-display:-0.005em;      /* brand: no tight negative tracking, no letter-spaced body */
  --ic-track-h1:-0.005em;
  --ic-track-h2:0;
  --ic-track-h3:0;
  --ic-track-label:0.14em;          /* caps labels +14% */
  --ic-track-btn:0.12em;

  --ic-fw-light:300; --ic-fw-regular:400; --ic-fw-medium:500; --ic-fw-semibold:600; --ic-fw-bold:700;

  /* ── 4. spacing ─────────────────────────────────────────────────────── */
  --ic-sp-1:4px;  --ic-sp-2:8px;  --ic-sp-3:12px; --ic-sp-4:16px; --ic-sp-5:20px;
  --ic-sp-6:24px; --ic-sp-7:32px; --ic-sp-8:40px; --ic-sp-9:48px; --ic-sp-10:64px;
  --ic-sp-11:80px; --ic-sp-12:96px; --ic-sp-13:128px;
  /* section rhythm (pass 2, Porto P5): three sizes, strict alternation */
  --ic-band-sm:48px; --ic-band:80px; --ic-band-lg:112px; --ic-band-lg-bottom:48px;
  --ic-section:var(--ic-band);
  --ic-section-sm:56px;
  --ic-gutter:24px;
  --ic-container:1200px;
  --ic-container-wide:1400px;
  --ic-measure:64ch;

  /* ── 5. radius — square corners everywhere (brand §05) ─────────────── */
  --ic-r-sm:0; --ic-r-md:0; --ic-r-lg:0; --ic-r-xl:0; --ic-r-pill:0;

  /* ── 6. elevation — hairline rings only, no blur, no glow ───────────── */
  --ic-elev-0:none;
  --ic-elev-1:0 0 0 1px var(--ic-rule);
  --ic-elev-2:0 0 0 1px var(--ic-rule-strong);
  --ic-elev-3:0 0 0 1px var(--ic-rule-strong);
  --ic-elev-dark-1:0 0 0 1px var(--ic-dark-rule);
  --ic-elev-dark-2:0 0 0 1px var(--ic-dark-rule-strong);

  /* ── 7. motion ──────────────────────────────────────────────────────── */
  --ic-dur-1:120ms; --ic-dur-2:180ms; --ic-dur-3:260ms; --ic-dur-4:420ms;
  --ic-dur-hover:var(--ic-dur-2);   /* every hover on the site */
  --ic-dur-dock:var(--ic-dur-3);    /* header dock, FAQ, agenda details */
  --ic-ease-out:cubic-bezier(.2,.7,.2,1);
  --ic-ease-in:cubic-bezier(.4,0,1,1);
  --ic-ease-spring:cubic-bezier(.2,.9,.3,1.2);

  /* ── 8. z-index ─────────────────────────────────────────────────────── */
  --ic-z-base:0; --ic-z-raised:2; --ic-z-dropdown:1000; --ic-z-sticky:1020;
  --ic-z-header:1030; --ic-z-offcanvas:1045; --ic-z-modal:1055; --ic-z-toast:1080;

  /* ── 9. component sizes ─────────────────────────────────────────────── */
  --ic-header-h:72px; --ic-header-h-stuck:60px; --ic-header-h-compact:60px;
  --ic-logo-h:34px; --ic-logo-h-stuck:28px; --ic-logo-h-compact:28px; --ic-logo-h-xs:26px; --ic-logo-h-footer:38px;
  --ic-accent-rule:4px;             /* the anchor rule thickness: kicker bar, rails, nav line */
  --ic-anchor-w:56px;               /* anchor rule length (8% of a 700px column) */
  --ic-step:40px; --ic-timeline-dot:10px;
  --ic-control-h:44px; --ic-control-h-sm:36px; --ic-control-h-lg:50px;
  --ic-icon-sm:16px; --ic-icon:20px; --ic-icon-lg:24px; --ic-icon-xl:28px;
  --ic-tile:48px; --ic-tile-lg:64px; --ic-logo:64px; --ic-logo-lg:96px;

  /* ── 10. photo rule (brand §06): saturation −20%, Ink overlay from the text side ── */
  --ic-photo-sat:.8;
  --ic-scrim:linear-gradient(180deg,rgba(10,30,43,0) 30%,rgba(10,30,43,.72) 100%);                       /* tile on photo */
  --ic-scrim-text:linear-gradient(180deg,rgba(10,30,43,.08) 0%,rgba(10,30,43,.45) 45%,rgba(10,30,43,.88) 100%); /* text on photo (portrait: bottom-up) */
  --ic-scrim-band:linear-gradient(90deg,rgba(10,30,43,.92) 0%,rgba(10,30,43,.72) 45%,rgba(10,30,43,.30) 100%),
                  linear-gradient(0deg,rgba(10,30,43,.78) 0%,rgba(10,30,43,0) 40%);                     /* hero band (landscape: left→right) */
}

/* ── 11. Bootstrap variable bridge ──────────────────────────────────────
   Bootstrap components read these; our components read --ic-*. Keeping the
   bridge here means Bootstrap never paints its own blue/grey defaults. */
:root,
[data-bs-theme="light"] {
  --bs-primary:var(--ic-accent);
  --bs-primary-rgb:10,30,43;
  --bs-primary-text-emphasis:var(--ic-accent-text);
  --bs-primary-bg-subtle:var(--ic-accent-tint);
  --bs-primary-border-subtle:var(--ic-lime-300);
  --bs-body-color:var(--ic-ink-2);
  --bs-body-color-rgb:37,55,65;
  --bs-body-bg:var(--ic-bg);
  --bs-body-bg-rgb:236,240,228;
  --bs-emphasis-color:var(--ic-ink);
  --bs-emphasis-color-rgb:10,30,43;
  --bs-heading-color:var(--ic-ink);
  --bs-secondary-color:var(--ic-ink-3);
  --bs-secondary-color-rgb:82,100,109;
  --bs-secondary-bg:var(--ic-surface-tint);
  --bs-tertiary-bg:var(--ic-bg-alt);
  --bs-tertiary-color:var(--ic-ink-3);
  --bs-border-color:var(--ic-rule);
  --bs-border-color-translucent:var(--ic-rule);
  --bs-dark:var(--ic-brand-ink); --bs-dark-rgb:10,30,43;
  --bs-secondary-rgb:82,100,109;
  --bs-success:var(--ic-success); --bs-success-rgb:86,116,26;
  --bs-success-bg-subtle:var(--ic-success-tint); --bs-success-text-emphasis:var(--ic-success);
  --bs-info:var(--ic-info); --bs-info-rgb:0,111,147;
  --bs-info-bg-subtle:var(--ic-info-tint); --bs-info-text-emphasis:var(--ic-info);
  --bs-warning:var(--ic-warning); --bs-warning-rgb:52,71,15;
  --bs-warning-bg-subtle:var(--ic-warning-tint); --bs-warning-text-emphasis:var(--ic-warning);
  --bs-danger:var(--ic-danger); --bs-danger-rgb:180,35,24;
  --bs-danger-bg-subtle:var(--ic-danger-tint); --bs-danger-text-emphasis:var(--ic-danger);
  --bs-light:var(--ic-surface-tint); --bs-light-rgb:225,240,245;
  --bs-white:var(--ic-brand-karst); --bs-white-rgb:236,240,228;
  --bs-font-sans-serif:var(--ic-font-body);
  --bs-body-font-size:var(--ic-fs-body);
  --bs-body-line-height:var(--ic-lh-body);
  --bs-border-radius:0;
  --bs-border-radius-sm:0;
  --bs-border-radius-lg:0;
  --bs-border-radius-xl:0;
  --bs-border-radius-xxl:0;
  --bs-border-radius-pill:0;
  --bs-box-shadow:var(--ic-elev-2);
  --bs-box-shadow-sm:var(--ic-elev-1);
  --bs-box-shadow-lg:var(--ic-elev-3);
  --bs-link-color:var(--ic-link);
  --bs-link-color-rgb:0,111,147;
  --bs-link-hover-color:var(--ic-link-hover);
  --bs-link-hover-color-rgb:0,62,82;
  --bs-focus-ring-color:var(--ic-accent-ring);

  /* legacy aliases still read by map.js and older rules */
  --ic-muted:var(--ic-ink-3);
  --ic-line:var(--ic-rule);
  --ic-dark:var(--ic-brand-ink);
}

/* Dark bands: header, hero, footer, CTA panels. Same semantic names re-bound. */
[data-bs-theme="dark"],
.ic-dark {
  --ic-bg:var(--ic-dark-bg);
  --ic-bg-alt:var(--ic-dark-bg-2);
  --ic-surface:var(--ic-dark-surface);
  --ic-surface-tint:rgba(169,183,188,.08);
  --ic-surface-tint-2:rgba(169,183,188,.14);
  --ic-rule:var(--ic-dark-rule);
  --ic-rule-strong:var(--ic-dark-rule-strong);
  --ic-ink:var(--ic-dark-ink);
  --ic-ink-2:var(--ic-dark-ink-2);
  --ic-ink-3:var(--ic-dark-ink-3);
  --ic-accent:var(--ic-dark-accent);
  --ic-accent-hover:var(--ic-lime-300);
  --ic-accent-active:var(--ic-dark-accent);
  --ic-accent-text:var(--ic-dark-accent-text);
  --ic-accent-tint:rgba(162,206,59,.12);
  --ic-accent-ring:rgba(162,206,59,.35);
  --ic-on-accent:var(--ic-brand-ink);
  --ic-label:var(--ic-dark-label);
  --ic-success:var(--ic-brand-lime); --ic-success-tint:rgba(162,206,59,.12);
  --ic-info:var(--ic-brand-adriatic); --ic-info-tint:rgba(0,160,210,.12);
  --ic-link:var(--ic-dark-label);
  --ic-link-hover:var(--ic-adriatic-300);
  --ic-focus:var(--ic-dark-accent);
  --ic-elev-1:var(--ic-elev-dark-1);
  --ic-elev-2:var(--ic-elev-dark-2);
  --ic-elev-3:var(--ic-elev-dark-2);

  --bs-primary:var(--ic-dark-accent); --bs-primary-rgb:162,206,59;
  --bs-body-color:var(--ic-dark-ink-2);
  --bs-body-color-rgb:169,183,188;
  --bs-body-bg:var(--ic-dark-bg);
  --bs-body-bg-rgb:10,30,43;
  --bs-emphasis-color:var(--ic-dark-ink);
  --bs-heading-color:var(--ic-dark-ink);
  --bs-secondary-color:var(--ic-dark-ink-3);
  --bs-secondary-bg:var(--ic-dark-surface);
  --bs-tertiary-color:var(--ic-dark-ink-3);
  --bs-tertiary-bg:var(--ic-dark-bg-2);
  --bs-border-color:var(--ic-dark-rule);
  --bs-border-color-translucent:var(--ic-dark-rule);
  --bs-link-color:var(--ic-dark-label);
  --bs-link-color-rgb:0,160,210;
  --bs-link-hover-color:var(--ic-adriatic-300);
  --bs-primary-text-emphasis:var(--ic-dark-accent-text);
}

/* Bay surfaces: Adriatic is not an approved text pair on Bay (4.0:1) — labels
   and links become Lime, tertiary text becomes Fog. */
.ic-bay {
  --ic-bg:var(--ic-brand-bay);
  --ic-ink-3:var(--ic-brand-fog);
  --ic-label:var(--ic-brand-lime);
  --ic-link:var(--ic-brand-lime);
  --ic-link-hover:var(--ic-lime-300);
  --ic-dark-ink-3:var(--ic-brand-fog);
  --bs-link-color:var(--ic-brand-lime);
  --bs-secondary-color:var(--ic-brand-fog);
  --bs-tertiary-color:var(--ic-brand-fog);
}

/* Reduced motion: every duration collapses; transforms stay at rest. */
@media (prefers-reduced-motion:reduce){
  :root{--ic-dur-1:0.01ms;--ic-dur-2:0.01ms;--ic-dur-3:0.01ms;--ic-dur-4:0.01ms}
}
