/* Theme: intelego (IIO unified schema, based on b2b solution-provider) */
@import url('../../../b2b/solution-provider/assets/style.css');

:root,
[data-theme="light"] {
  --color-navy: #132a46;
  --color-blue-dark: #1d4b7a;
  --color-blue-mid: #2a6aa8;
  --color-blue-light: #4d8ed0;
  --color-info: #2f6ea9;

  --iio-bg:           #edf4fb;
  --iio-bg-subtle:    #f5f9fd;
  --iio-bg-raised:    #ffffff;
  --iio-bg-sunken:    #dde8f5;

  --iio-surface:      #ffffff;
  --iio-surface-soft: #f5f9fe;
  --iio-surface-mid:  #e8f0f8;

  --iio-ink:          #162538;
  --iio-ink-soft:     #23415c;
  --iio-muted:        #506b88;
  --iio-muted-light:  #7f95ae;

  --iio-line:         #c6d6e8;
  --iio-line-strong:  #9bb3ce;
  --iio-line-subtle:  #dbe6f1;

  --iio-accent:       #1d4b7a;
  --iio-accent-mid:   #2a6aa8;
  --iio-accent-light: #e3edf8;
  --iio-accent-hover: #163a5d;

  --iio-ok:           #1f7a5a;
  --iio-ok-bg:        #d9f3ea;
  --iio-ok-line:      #8fd3b8;
  --iio-warn:         #a96a16;
  --iio-warn-bg:      #fbeecf;
  --iio-warn-line:    #e9c16a;
  --iio-risk:         #b34646;
  --iio-risk-bg:      #f9e0e0;
  --iio-risk-line:    #e7aaaa;
  --iio-info:         #2f6ea9;
  --iio-info-bg:      #ddecfb;
  --iio-info-line:    #9fc6ea;

  --iio-h-bg:         #f7fbff;
  --iio-h-ink:        #162538;
  --iio-h-muted:      #5d7790;
  --iio-h-line:       #cfdceb;

  --iio-thead-bg:     #e5eef8;
  --iio-tr-hover:     #f0f6fc;
  --iio-tr-active:    #e2ebf6;

  --iio-tab-bg:         #e8eff8;
  --iio-tab-active-bg:  #d8e5f4;
  --iio-tab-active-ink: #1d4b7a;

  --iio-shadow-sm:    0 2px 8px rgba(19, 42, 70, 0.10);
  --iio-shadow-md:    0 14px 30px rgba(19, 42, 70, 0.16);
  --iio-shadow-lg:    0 24px 48px rgba(19, 42, 70, 0.20);
}

[data-theme="dark"] {
  --iio-bg:           #0d1622;
  --iio-bg-subtle:    #111c2c;
  --iio-bg-raised:    #162538;
  --iio-bg-sunken:    #09111a;

  --iio-surface:      #162538;
  --iio-surface-soft: #1a2d43;
  --iio-surface-mid:  #122033;

  --iio-ink:          #dce8f5;
  --iio-ink-soft:     #c2d6ea;
  --iio-muted:        #88a3c0;
  --iio-muted-light:  #5e7a98;

  --iio-line:         #28405c;
  --iio-line-strong:  #3b5b80;
  --iio-line-subtle:  #1a2f46;

  --iio-accent:       #69a1dd;
  --iio-accent-mid:   #4d8ed0;
  --iio-accent-light: #17314d;
  --iio-accent-hover: #87b8ea;

  --iio-ok:           #52d2a0;
  --iio-ok-bg:        #103d30;
  --iio-ok-line:      #185844;
  --iio-warn:         #f0bf63;
  --iio-warn-bg:      #442b08;
  --iio-warn-line:    #714b12;
  --iio-risk:         #ef8f8f;
  --iio-risk-bg:      #451616;
  --iio-risk-line:    #743030;
  --iio-info:         #79b6f0;
  --iio-info-bg:      #133250;
  --iio-info-line:    #1d517e;

  --iio-h-bg:         #111c2c;
  --iio-h-ink:        #dce8f5;
  --iio-h-muted:      #88a3c0;
  --iio-h-line:       #28405c;

  --iio-thead-bg:     #15273d;
  --iio-tr-hover:     #1a2d43;
  --iio-tr-active:    #1b3452;

  --iio-tab-bg:         #132238;
  --iio-tab-active-bg:  #17314d;
  --iio-tab-active-ink: #87b8ea;

  --iio-shadow-sm:    0 2px 8px rgba(0, 0, 0, 0.28);
  --iio-shadow-md:    0 14px 30px rgba(0, 0, 0, 0.34);
  --iio-shadow-lg:    0 24px 48px rgba(0, 0, 0, 0.40);
}

/* ═══ TYPOGRAPHY ════════════════════════════════════════════
   Inter: intelego-grade precision, clean readability.
   JetBrains Mono for code — matches intelego engineering standard.
   ════════════════════════════════════════════════════════════ */
html,
body {
  font-family: 'Inter', 'Segoe UI', system-ui, -apple-system, sans-serif;
}

code,
pre,
.mono {
  font-family: 'JetBrains Mono', 'Consolas', 'Liberation Mono', monospace;
}

/* ═══ PORTAL BRIDGE ═════════════════════════════════════════════════════
   Maps --iio-* tokens to portal CSS vars (--accent, --bg etc.)
   This makes the theme work in the IIO Portal without JS.
   ═══════════════════════════════════════════════════════════════════════ */
:root,
[data-theme="light"],
[data-theme="dark"] {
  --accent:        var(--iio-accent);
  --accent-fg:     var(--iio-on-accent, #ffffff);
  --tenant-accent: var(--iio-accent);
  --bg:            var(--iio-bg);
  --surface:       var(--iio-surface);
  --surface-2:     var(--iio-surface-soft, var(--iio-surface));
  --text:          var(--iio-ink);
  --text-1:        var(--iio-ink);
  --text-2:        var(--iio-muted);
  --text-3:        var(--iio-muted-light, var(--iio-muted));
  --border:        var(--iio-line);
  --border-hover:  var(--iio-line-strong, var(--iio-line));
  --green:         var(--iio-ok);
  --amber:         var(--iio-warn);
  --red:           var(--iio-risk);
}

/* ═══ PORTAL BRIDGE — maps --iio-* to portal --* vars ═══════════════
   This allows the theme to work in both Manual shell (--iio-*)
   and Portal (--accent, --bg etc.) without JS bridging.
   ════════════════════════════════════════════════════════════════════ */
:root,
[data-theme="light"],
[data-theme="dark"] {
  --accent:        var(--iio-accent);
  --accent-fg:     var(--iio-on-accent, #ffffff);
  --tenant-accent: var(--iio-accent);
  --bg:            var(--iio-bg);
  --surface:       var(--iio-surface);
  --surface-2:     var(--iio-surface-soft);
  --text:          var(--iio-ink);
  --text-1:        var(--iio-ink);
  --text-2:        var(--iio-muted);
  --text-3:        var(--iio-muted-light);
  --border:        var(--iio-line);
  --border-hover:  var(--iio-line-strong);
  --green:         var(--iio-ok);
  --amber:         var(--iio-warn);
  --red:           var(--iio-risk);
}
