/*
 * Disprz Engineering Co-worker theme system.
 *
 * This file is intentionally loaded after the legacy feature styles. The
 * semantic variables power the modern UI while the compatibility rules at the
 * end keep older Razor surfaces readable until each feature stylesheet is
 * fully expressed in tokens.
 */

:root,
html[data-sre-theme="cloud"] {
  color-scheme: light;
  --sre-background: #f5f7fb;
  --sre-background-rgb: 245, 247, 251;
  --sre-surface: #ffffff;
  --sre-surface-rgb: 255, 255, 255;
  --sre-surface-raised: #ffffff;
  --sre-surface-soft: #eef2f8;
  --sre-surface-hover: #f3f0fb;
  --sre-text: #162033;
  --sre-text-rgb: 22, 32, 51;
  --sre-muted: #5b6678;
  --sre-muted-rgb: 91, 102, 120;
  --sre-border: #d9e0ea;
  --sre-border-rgb: 217, 224, 234;
  --sre-border-strong: #8693a4;
  --sre-accent: #6f3ccf;
  --sre-accent-rgb: 111, 60, 207;
  --sre-accent-strong: #4f2aa6;
  --sre-accent-soft: #eee7ff;
  --sre-on-accent: #ffffff;
  --sre-focus: #7c3aed;
  --sre-glass: rgba(255, 255, 255, 0.84);
  --sre-overlay: rgba(11, 16, 32, 0.58);
  --sre-shadow-color: 31, 22, 74;
  --sre-canvas-gradient:
    radial-gradient(950px circle at 7% -10%, rgba(111, 60, 207, 0.16), transparent 54%),
    radial-gradient(760px circle at 103% 2%, rgba(37, 99, 235, 0.1), transparent 50%),
    var(--sre-background);
  --sre-surface-gloss: linear-gradient(145deg, rgba(255, 255, 255, 0.98), rgba(248, 246, 255, 0.94));
  --sre-hero-gradient: linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(238, 231, 255, 0.9));
  --sre-sidebar-background: linear-gradient(180deg, #211643 0%, #30205f 54%, #211643 100%);
  --sre-sidebar-surface: rgba(13, 8, 31, 0.34);
  --sre-sidebar-text: #fbfaff;
  --sre-sidebar-muted: #cfc7e6;
  --sre-sidebar-border: rgba(255, 255, 255, 0.12);
  --sre-sidebar-hover: rgba(255, 255, 255, 0.09);
  --sre-sidebar-active: rgba(196, 181, 253, 0.22);
  --sre-success: #16794a;
  --sre-success-soft: #ecfdf3;
  --sre-success-border: #72c79a;
  --sre-warning: #8a5208;
  --sre-warning-soft: #fff7df;
  --sre-warning-border: #d8a742;
  --sre-danger: #b42318;
  --sre-danger-soft: #fff1f2;
  --sre-danger-border: #e1848b;
  --sre-info: #175cd3;
  --sre-info-soft: #eff8ff;
  --sre-info-border: #76a9ea;
  --sre-chart-text: var(--sre-text);
  --sre-chart-muted: var(--sre-muted);
  --sre-chart-grid: rgba(var(--sre-text-rgb), 0.12);
  --sre-chart-surface: var(--sre-surface-raised);
  --sre-chart-primary: #6f3ccf;
  --sre-chart-secondary: #2563eb;
  --sre-chart-tertiary: #0f766e;
  --sre-chart-series-1: #6f3ccf;
  --sre-chart-series-2: #2563eb;
  --sre-chart-series-3: #0f766e;
  --sre-chart-series-4: #b45309;
  --sre-chart-series-5: #b42318;
  --sre-chart-series-6: #7c3aed;
  --sre-chart-series-7: #475569;
}

html[data-sre-theme="aurora"] {
  color-scheme: light;
  --sre-background: #f8f6ff;
  --sre-background-rgb: 248, 246, 255;
  --sre-surface: #ffffff;
  --sre-surface-rgb: 255, 255, 255;
  --sre-surface-raised: #ffffff;
  --sre-surface-soft: #f1edfb;
  --sre-surface-hover: #f7f1ff;
  --sre-text: #21183d;
  --sre-text-rgb: 33, 24, 61;
  --sre-muted: #655d77;
  --sre-muted-rgb: 101, 93, 119;
  --sre-border: #ded7eb;
  --sre-border-rgb: 222, 215, 235;
  --sre-border-strong: #998dab;
  --sre-accent: #7c3aed;
  --sre-accent-rgb: 124, 58, 237;
  --sre-accent-strong: #5b21b6;
  --sre-accent-soft: #f0e7ff;
  --sre-on-accent: #ffffff;
  --sre-focus: #7c3aed;
  --sre-glass: rgba(255, 255, 255, 0.84);
  --sre-shadow-color: 74, 35, 115;
  --sre-canvas-gradient:
    radial-gradient(980px circle at 5% -12%, rgba(124, 58, 237, 0.18), transparent 54%),
    radial-gradient(780px circle at 102% 4%, rgba(219, 39, 119, 0.11), transparent 51%),
    var(--sre-background);
  --sre-surface-gloss: linear-gradient(145deg, rgba(255, 255, 255, 0.99), rgba(249, 242, 255, 0.94));
  --sre-hero-gradient: linear-gradient(135deg, rgba(255, 255, 255, 0.97), rgba(241, 226, 255, 0.91));
  --sre-sidebar-background: linear-gradient(180deg, #28154d 0%, #48206f 54%, #28154d 100%);
  --sre-sidebar-surface: rgba(24, 10, 48, 0.34);
  --sre-sidebar-text: #fff9ff;
  --sre-sidebar-muted: #dac7e7;
  --sre-sidebar-active: rgba(232, 181, 255, 0.2);
  --sre-chart-primary: #7c3aed;
  --sre-chart-secondary: #db2777;
  --sre-chart-tertiary: #2563eb;
  --sre-chart-series-1: #7c3aed;
  --sre-chart-series-2: #db2777;
  --sre-chart-series-3: #2563eb;
  --sre-chart-series-4: #0f766e;
  --sre-chart-series-5: #c2410c;
  --sre-chart-series-6: #9333ea;
  --sre-chart-series-7: #5b6475;
}

html[data-sre-theme="sandstone"] {
  color-scheme: light;
  --sre-background: #faf6ed;
  --sre-background-rgb: 250, 246, 237;
  --sre-surface: #fffdf8;
  --sre-surface-rgb: 255, 253, 248;
  --sre-surface-raised: #ffffff;
  --sre-surface-soft: #f2eadb;
  --sre-surface-hover: #faf1df;
  --sre-text: #342d23;
  --sre-text-rgb: 52, 45, 35;
  --sre-muted: #70675a;
  --sre-muted-rgb: 112, 103, 90;
  --sre-border: #e0d4bf;
  --sre-border-rgb: 224, 212, 191;
  --sre-border-strong: #94846d;
  --sre-accent: #946424;
  --sre-accent-rgb: 148, 100, 36;
  --sre-accent-strong: #704815;
  --sre-accent-soft: #f5e6c9;
  --sre-on-accent: #ffffff;
  --sre-focus: #9a6b28;
  --sre-glass: rgba(255, 253, 248, 0.86);
  --sre-overlay: rgba(50, 38, 23, 0.58);
  --sre-shadow-color: 83, 62, 29;
  --sre-canvas-gradient:
    radial-gradient(940px circle at 5% -12%, rgba(184, 132, 57, 0.16), transparent 54%),
    radial-gradient(760px circle at 102% 2%, rgba(119, 90, 50, 0.09), transparent 52%),
    var(--sre-background);
  --sre-surface-gloss: linear-gradient(145deg, rgba(255, 254, 250, 0.99), rgba(249, 241, 225, 0.95));
  --sre-hero-gradient: linear-gradient(135deg, rgba(255, 254, 250, 0.98), rgba(245, 230, 201, 0.91));
  --sre-sidebar-background: linear-gradient(180deg, #342b20 0%, #493a2a 54%, #342b20 100%);
  --sre-sidebar-surface: rgba(28, 22, 16, 0.3);
  --sre-sidebar-text: #fffaf0;
  --sre-sidebar-muted: #ded0ba;
  --sre-sidebar-active: rgba(231, 196, 133, 0.2);
  --sre-chart-primary: #946424;
  --sre-chart-secondary: #b54708;
  --sre-chart-tertiary: #237a50;
  --sre-chart-series-1: #946424;
  --sre-chart-series-2: #b54708;
  --sre-chart-series-3: #237a50;
  --sre-chart-series-4: #075985;
  --sre-chart-series-5: #a61b1b;
  --sre-chart-series-6: #7c3aed;
  --sre-chart-series-7: #70675a;
}

html[data-sre-theme="midnight"] {
  color-scheme: dark;
  --sre-background: #0b1020;
  --sre-background-rgb: 11, 16, 32;
  --sre-surface: #131a2d;
  --sre-surface-rgb: 19, 26, 45;
  --sre-surface-raised: #19233b;
  --sre-surface-soft: #202a43;
  --sre-surface-hover: #26314d;
  --sre-text: #f5f7ff;
  --sre-text-rgb: 245, 247, 255;
  --sre-muted: #aeb9d0;
  --sre-muted-rgb: 174, 185, 208;
  --sre-border: #34405a;
  --sre-border-rgb: 52, 64, 90;
  --sre-border-strong: #697794;
  --sre-accent: #a78bfa;
  --sre-accent-rgb: 167, 139, 250;
  --sre-accent-strong: #c4b5fd;
  --sre-accent-soft: #2a2147;
  --sre-on-accent: #17112b;
  --sre-focus: #c4b5fd;
  --sre-glass: rgba(19, 26, 45, 0.86);
  --sre-overlay: rgba(2, 5, 14, 0.72);
  --sre-shadow-color: 0, 0, 0;
  --sre-canvas-gradient:
    radial-gradient(960px circle at 5% -12%, rgba(124, 91, 220, 0.22), transparent 54%),
    radial-gradient(760px circle at 102% 2%, rgba(44, 133, 191, 0.15), transparent 52%),
    var(--sre-background);
  --sre-surface-gloss: linear-gradient(145deg, rgba(31, 42, 70, 0.97), rgba(19, 26, 45, 0.99));
  --sre-hero-gradient: linear-gradient(135deg, rgba(31, 42, 70, 0.96), rgba(42, 33, 71, 0.91));
  --sre-sidebar-background: linear-gradient(180deg, #080c18 0%, #11182a 54%, #080c18 100%);
  --sre-sidebar-surface: rgba(2, 5, 12, 0.42);
  --sre-sidebar-text: #f5f7ff;
  --sre-sidebar-muted: #aeb9d0;
  --sre-sidebar-active: rgba(167, 139, 250, 0.2);
  --sre-chart-primary: #a78bfa;
  --sre-chart-secondary: #60a5fa;
  --sre-chart-tertiary: #2dd4bf;
  --sre-chart-series-1: #a78bfa;
  --sre-chart-series-2: #60a5fa;
  --sre-chart-series-3: #2dd4bf;
  --sre-chart-series-4: #fbbf24;
  --sre-chart-series-5: #fb7185;
  --sre-chart-series-6: #c084fc;
  --sre-chart-series-7: #94a3b8;
}

html[data-sre-theme="graphite"] {
  color-scheme: dark;
  --sre-background: #16181d;
  --sre-background-rgb: 22, 24, 29;
  --sre-surface: #20232a;
  --sre-surface-rgb: 32, 35, 42;
  --sre-surface-raised: #292d36;
  --sre-surface-soft: #2f3440;
  --sre-surface-hover: #383e4b;
  --sre-text: #f3f4f6;
  --sre-text-rgb: 243, 244, 246;
  --sre-muted: #b7bdc8;
  --sre-muted-rgb: 183, 189, 200;
  --sre-border: #3e4552;
  --sre-border-rgb: 62, 69, 82;
  --sre-border-strong: #7f8998;
  --sre-accent: #c4cad4;
  --sre-accent-rgb: 196, 202, 212;
  --sre-accent-strong: #e5e7eb;
  --sre-accent-soft: #343a45;
  --sre-on-accent: #111318;
  --sre-focus: #d8dde5;
  --sre-glass: rgba(32, 35, 42, 0.88);
  --sre-overlay: rgba(4, 5, 7, 0.74);
  --sre-shadow-color: 0, 0, 0;
  --sre-canvas-gradient:
    radial-gradient(960px circle at 5% -12%, rgba(182, 190, 204, 0.15), transparent 54%),
    radial-gradient(760px circle at 102% 2%, rgba(111, 123, 141, 0.13), transparent 52%),
    var(--sre-background);
  --sre-surface-gloss: linear-gradient(145deg, rgba(48, 52, 62, 0.97), rgba(31, 34, 41, 0.99));
  --sre-hero-gradient: linear-gradient(135deg, rgba(48, 52, 62, 0.97), rgba(40, 43, 52, 0.93));
  --sre-sidebar-background: linear-gradient(180deg, #101216 0%, #1a1d23 54%, #101216 100%);
  --sre-sidebar-surface: rgba(4, 5, 7, 0.38);
  --sre-sidebar-text: #f3f4f6;
  --sre-sidebar-muted: #b7bdc8;
  --sre-sidebar-active: rgba(196, 202, 212, 0.17);
  --sre-chart-primary: #e5e7eb;
  --sre-chart-secondary: #93c5fd;
  --sre-chart-tertiary: #6ee7b7;
  --sre-chart-series-1: #e5e7eb;
  --sre-chart-series-2: #93c5fd;
  --sre-chart-series-3: #6ee7b7;
  --sre-chart-series-4: #f3c96d;
  --sre-chart-series-5: #f09aa5;
  --sre-chart-series-6: #c4b5fd;
  --sre-chart-series-7: #b7bdc8;
}

html[data-sre-theme="oceanic"] {
  color-scheme: dark;
  --sre-background: #07191f;
  --sre-background-rgb: 7, 25, 31;
  --sre-surface: #0c2730;
  --sre-surface-rgb: 12, 39, 48;
  --sre-surface-raised: #123540;
  --sre-surface-soft: #173f4b;
  --sre-surface-hover: #1b4c59;
  --sre-text: #ecfeff;
  --sre-text-rgb: 236, 254, 255;
  --sre-muted: #a5c8cd;
  --sre-muted-rgb: 165, 200, 205;
  --sre-border: #28545e;
  --sre-border-rgb: 40, 84, 94;
  --sre-border-strong: #62909a;
  --sre-accent: #22d3ee;
  --sre-accent-rgb: 34, 211, 238;
  --sre-accent-strong: #67e8f9;
  --sre-accent-soft: #123d49;
  --sre-on-accent: #03262d;
  --sre-focus: #67e8f9;
  --sre-glass: rgba(12, 39, 48, 0.88);
  --sre-overlay: rgba(1, 12, 16, 0.74);
  --sre-shadow-color: 0, 7, 10;
  --sre-canvas-gradient:
    radial-gradient(960px circle at 5% -12%, rgba(34, 211, 238, 0.19), transparent 54%),
    radial-gradient(760px circle at 102% 2%, rgba(45, 212, 191, 0.14), transparent 52%),
    var(--sre-background);
  --sre-surface-gloss: linear-gradient(145deg, rgba(18, 53, 64, 0.97), rgba(10, 34, 42, 0.99));
  --sre-hero-gradient: linear-gradient(135deg, rgba(18, 53, 64, 0.96), rgba(12, 62, 68, 0.91));
  --sre-sidebar-background: linear-gradient(180deg, #041217 0%, #09252c 54%, #041217 100%);
  --sre-sidebar-surface: rgba(1, 8, 11, 0.4);
  --sre-sidebar-text: #ecfeff;
  --sre-sidebar-muted: #9ccbd0;
  --sre-sidebar-active: rgba(34, 211, 238, 0.18);
  --sre-chart-primary: #22d3ee;
  --sre-chart-secondary: #2dd4bf;
  --sre-chart-tertiary: #60a5fa;
  --sre-chart-series-1: #22d3ee;
  --sre-chart-series-2: #2dd4bf;
  --sre-chart-series-3: #60a5fa;
  --sre-chart-series-4: #fbbf24;
  --sre-chart-series-5: #fb7185;
  --sre-chart-series-6: #a78bfa;
  --sre-chart-series-7: #a5c8cd;
}

html[data-sre-theme="ember"] {
  color-scheme: dark;
  --sre-background: #1d0f0b;
  --sre-background-rgb: 29, 15, 11;
  --sre-surface: #2b1711;
  --sre-surface-rgb: 43, 23, 17;
  --sre-surface-raised: #3b2118;
  --sre-surface-soft: #48291e;
  --sre-surface-hover: #563225;
  --sre-text: #fff7ed;
  --sre-text-rgb: 255, 247, 237;
  --sre-muted: #d7b8a6;
  --sre-muted-rgb: 215, 184, 166;
  --sre-border: #654033;
  --sre-border-rgb: 101, 64, 51;
  --sre-border-strong: #a67560;
  --sre-accent: #fb923c;
  --sre-accent-rgb: 251, 146, 60;
  --sre-accent-strong: #fdba74;
  --sre-accent-soft: #512b1b;
  --sre-on-accent: #2a1004;
  --sre-focus: #fdba74;
  --sre-glass: rgba(43, 23, 17, 0.88);
  --sre-overlay: rgba(12, 4, 2, 0.76);
  --sre-shadow-color: 8, 2, 0;
  --sre-canvas-gradient:
    radial-gradient(960px circle at 5% -12%, rgba(251, 146, 60, 0.21), transparent 54%),
    radial-gradient(760px circle at 102% 2%, rgba(239, 68, 68, 0.14), transparent 52%),
    var(--sre-background);
  --sre-surface-gloss: linear-gradient(145deg, rgba(59, 33, 24, 0.97), rgba(41, 21, 16, 0.99));
  --sre-hero-gradient: linear-gradient(135deg, rgba(67, 35, 24, 0.97), rgba(78, 31, 21, 0.92));
  --sre-sidebar-background: linear-gradient(180deg, #160906 0%, #32150e 54%, #160906 100%);
  --sre-sidebar-surface: rgba(12, 4, 2, 0.4);
  --sre-sidebar-text: #fff7ed;
  --sre-sidebar-muted: #d7b8a6;
  --sre-sidebar-active: rgba(251, 146, 60, 0.19);
  --sre-chart-primary: #fb923c;
  --sre-chart-secondary: #f87171;
  --sre-chart-tertiary: #fbbf24;
  --sre-chart-series-1: #fb923c;
  --sre-chart-series-2: #f87171;
  --sre-chart-series-3: #fbbf24;
  --sre-chart-series-4: #2dd4bf;
  --sre-chart-series-5: #fb7185;
  --sre-chart-series-6: #c084fc;
  --sre-chart-series-7: #d7b8a6;
}

:is(
  html[data-sre-theme="midnight"],
  html[data-sre-theme="graphite"],
  html[data-sre-theme="oceanic"],
  html[data-sre-theme="ember"]
) {
  --sre-success: #6ee7b7;
  --sre-success-soft: #12342a;
  --sre-success-border: #3c9b78;
  --sre-warning: #fcd34d;
  --sre-warning-soft: #3a2b12;
  --sre-warning-border: #a77f26;
  --sre-danger: #fda4af;
  --sre-danger-soft: #401b23;
  --sre-danger-border: #b95666;
  --sre-info: #7dd3fc;
  --sre-info-soft: #102d39;
  --sre-info-border: #3a89aa;
}

/* Bridge the existing SRE and legacy RM vocabularies to one semantic palette. */
html[data-sre-theme] {
  --sre-slate-950: var(--sre-text);
  --sre-slate-900: var(--sre-text);
  --sre-slate-700: var(--sre-muted);
  --sre-slate-600: var(--sre-muted);
  --sre-slate-500: var(--sre-muted);
  --sre-slate-300: var(--sre-border-strong);
  --sre-slate-200: var(--sre-border);
  --sre-slate-100: var(--sre-surface-soft);
  --sre-slate-50: var(--sre-background);
  --sre-white: var(--sre-surface);
  --sre-purple-700: var(--sre-accent-strong);
  --sre-purple-600: var(--sre-accent);
  --sre-purple-100: var(--sre-accent-soft);
  --sre-purple-50: var(--sre-accent-soft);
  --sre-focus-ring: 0 0 0 3px rgba(var(--sre-accent-rgb), 0.28);
  --sre-shadow-sm: 0 4px 14px rgba(var(--sre-shadow-color), 0.11);
  --sre-shadow-md: 0 16px 42px rgba(var(--sre-shadow-color), 0.18);
  --sre-shadow-lg: 0 28px 72px rgba(var(--sre-shadow-color), 0.24);

  --rm-background: var(--sre-background);
  --rm-surface: var(--sre-surface);
  --rm-surface-raised: var(--sre-surface-raised);
  --rm-surface-soft: var(--sre-surface-soft);
  --rm-surface-hover: var(--sre-surface-hover);
  --rm-text: var(--sre-text);
  --rm-text-muted: var(--sre-muted);
  --rm-ink: var(--sre-text);
  --rm-muted: var(--sre-muted);
  --rm-border: var(--sre-border);
  --rm-border-strong: var(--sre-border-strong);
  --rm-accent: var(--sre-accent);
  --rm-accent-strong: var(--sre-accent-strong);
  --rm-accent-soft: var(--sre-accent-soft);
  --rm-on-accent: var(--sre-on-accent);
  --rm-warn-soft: var(--sre-warning-soft);
  --rm-warn-border: var(--sre-warning-border);
  --rm-danger-soft: var(--sre-danger-soft);
  --rm-danger-border: var(--sre-danger-border);
  --rm-success-soft: var(--sre-success-soft);
  --rm-success-border: var(--sre-success-border);
  --rm-info-soft: var(--sre-info-soft);
  --rm-info-border: var(--sre-info-border);
  --rm-shadow: var(--sre-shadow-sm);
  --rm-lift: var(--sre-shadow-md);
  --text: var(--sre-text);
  --muted: var(--sre-muted);
  --border: var(--sre-border);
  --surface: var(--sre-surface);
  --accent: var(--sre-accent);
}

body {
  background: var(--sre-canvas-gradient);
  color: var(--sre-text);
}

::selection {
  background: rgba(var(--sre-accent-rgb), 0.25);
  color: var(--sre-text);
}

html[data-sre-theme] :where(h1, h2, h3, h4, h5, h6, legend, label, dt, th) {
  color: var(--sre-text);
}

html[data-sre-theme] :where(p, dd, figcaption, caption, .text-muted, [class*="-muted"], [class*="-hint"], [class*="-meta"]) {
  color: var(--sre-muted);
}

html[data-sre-theme] :where(input, select, textarea) {
  border-color: var(--sre-border-strong);
  background-color: var(--sre-surface-raised);
  color: var(--sre-text);
}

html[data-sre-theme] :where(input, textarea)::placeholder {
  color: var(--sre-muted);
  opacity: 0.82;
}

html[data-sre-theme] :where(input, select, textarea):disabled {
  background-color: var(--sre-surface-soft);
  color: var(--sre-muted);
}

html[data-sre-theme] :where(pre, code, kbd, samp) {
  border-color: var(--sre-border);
  background-color: var(--sre-surface-soft);
  color: var(--sre-text);
}

html[data-sre-theme] :where(hr, fieldset, [class*="-divider"], [class*="-separator"]) {
  border-color: var(--sre-border);
}

/* Shared cards and operational panels receive the same dimensional material. */
html[data-sre-theme] :is(
  .rm-card,
  .rm-stat-card,
  .rm-auth-card,
  .rm-subcard
) {
  border-color: var(--sre-border);
  background: var(--sre-surface);
  color: var(--sre-text);
}

html[data-sre-theme] :is(
  .rm-card,
  .rm-stat-card,
  .rm-auth-card
) {
  background-image: var(--sre-surface-gloss);
  box-shadow: var(--sre-shadow-sm);
}

html[data-sre-theme] .rm-subcard {
  background-image: none;
}

/* Low-specificity fallbacks let feature variants keep their own semantic tone. */
:where([class$="-card"], [class$="-panel"]) {
  border-color: var(--sre-border);
  background-color: var(--sre-surface);
  color: var(--sre-text);
}

:where([class$="-card"]) {
  background-image: var(--sre-surface-gloss);
  box-shadow: var(--sre-shadow-sm);
}

html[data-sre-theme] .rm-hero {
  border-color: var(--sre-border);
  background: var(--sre-hero-gradient);
  color: var(--sre-text);
  box-shadow: var(--sre-shadow-md);
}

:where([class$="-hero"]) {
  border-color: var(--sre-border);
  color: var(--sre-text);
}

html[data-sre-theme] :is(.rm-modal-card, .qa-dialog-card, [role="dialog"], dialog) {
  border-color: var(--sre-border);
  background: var(--sre-surface-raised);
  color: var(--sre-text);
  box-shadow: var(--sre-shadow-lg);
}

html[data-sre-theme] :is(.rm-action-menu-panel, .rm-row-menu-panel, [class*="dropdown-menu"], [class*="popover"]) {
  border-color: var(--sre-border);
  background: var(--sre-surface-raised);
  color: var(--sre-text);
  box-shadow: var(--sre-shadow-md);
}

html[data-sre-theme] :is(table, .rm-table, [class$="-table"]) {
  border-color: var(--sre-border);
  background-color: var(--sre-surface);
  color: var(--sre-text);
}

html[data-sre-theme] :is(table, .rm-table, [class$="-table"]) :where(th, td) {
  border-color: var(--sre-border);
  color: inherit;
}

html[data-sre-theme] :is(table, .rm-table, [class$="-table"]) thead :where(th, td) {
  background-color: var(--sre-surface-soft);
  color: var(--sre-text);
}

html[data-sre-theme] :is(table, .rm-table, [class$="-table"]) tbody tr:hover :where(th, td) {
  background-color: var(--sre-surface-hover);
}

html[data-sre-theme] :is(.rm-button-primary, .qa-start-run-button, .qa-hotfix-button) {
  border-color: var(--sre-accent);
  background: var(--sre-accent);
  color: var(--sre-on-accent);
}

html[data-sre-theme] :is(.rm-button-secondary, .rm-icon-button, .qa-popup-button, .qa-cancel-button) {
  border-color: var(--sre-border-strong);
  background: var(--sre-surface-raised);
  color: var(--sre-text);
}

html[data-sre-theme] :is(.rm-button-secondary, .rm-icon-button, .qa-popup-button, .qa-cancel-button):hover {
  border-color: var(--sre-accent);
  background: var(--sre-accent-soft);
  color: var(--sre-accent-strong);
}

html[data-sre-theme] :is(.rm-alert, .rm-banner-info, .rm-badge-info) {
  border-color: var(--sre-info-border);
  background-color: var(--sre-info-soft);
  color: var(--sre-info);
}

html[data-sre-theme] :is(.rm-alert-danger, .rm-banner-danger, .rm-badge-danger, .rm-progress-error) {
  border-color: var(--sre-danger-border);
  background-color: var(--sre-danger-soft);
  color: var(--sre-danger);
}

html[data-sre-theme] :is(.rm-alert-warning, .rm-banner-warn, .rm-badge-warning, .rm-deep-answer-warning) {
  border-color: var(--sre-warning-border);
  background-color: var(--sre-warning-soft);
  color: var(--sre-warning);
}

html[data-sre-theme] :is(.rm-badge-success, .rm-banner-success) {
  border-color: var(--sre-success-border);
  background-color: var(--sre-success-soft);
  color: var(--sre-success);
}

html[data-sre-theme] .rm-badge-muted {
  border-color: var(--sre-border);
  background-color: var(--sre-surface-soft);
  color: var(--sre-muted);
}

html[data-sre-theme] :where(progress) {
  accent-color: var(--sre-accent);
}

html[data-sre-theme] :is([class*="progress-track"], [class*="progress-bar"]:not([class*="fill"])) {
  background-color: var(--sre-surface-soft);
}

/* Dark themes need a firm final override for legacy light-only page rules. */
:is(
  html[data-sre-theme="midnight"],
  html[data-sre-theme="graphite"],
  html[data-sre-theme="oceanic"],
  html[data-sre-theme="ember"]
) :where(
  .rm-shell,
  .sre-main,
  .rm-kc-chat-surface,
  .rm-kc-tab-panel,
  .qa-tab-panel,
  .ob-section,
  .ob-compact-section,
  .ia-panel
) {
  color: var(--sre-text);
}

@media (max-width: 40rem) {
  html[data-sre-theme] :is(.rm-card, .rm-stat-card, .rm-auth-card, [class$="-card"], [class$="-panel"]) {
    box-shadow: var(--sre-shadow-sm);
  }
}

@media print {
  html[data-sre-theme] {
    color-scheme: light;
    --sre-background: #ffffff;
    --sre-surface: #ffffff;
    --sre-surface-raised: #ffffff;
    --sre-surface-soft: #f4f4f5;
    --sre-text: #111827;
    --sre-muted: #4b5563;
    --sre-border: #d1d5db;
    --sre-border-strong: #9ca3af;
  }

  body {
    background: #ffffff;
  }
}