@import url("/themes/macos.css");

:root[data-os-theme="windows"] {
  --theme-font-serif: Georgia, "Times New Roman", serif;
  --theme-font-sans: "Segoe UI Variable", "Segoe UI", system-ui, sans-serif;
  --theme-font-mono: Cascadia Mono, Consolas, ui-monospace, monospace;
  --native-control-duration: 100ms;
  --native-focus-shadow: 0 0 0 1px color-mix(in srgb, var(--accent) 70%, transparent), 0 0 0 4px color-mix(in srgb, var(--accent) 16%, transparent);
  --native-button-active-transform: translateY(1px);
  --native-button-active-filter: brightness(0.94);
  --native-button-shadow: inset 0 1px 0 rgb(255 255 255 / 0.18);
  --native-button-hover-shadow: inset 0 1px 0 rgb(255 255 255 / 0.26), 0 2px 8px rgb(0 0 0 / 0.12);
  --native-control-shadow: inset 0 1px 0 rgb(255 255 255 / 0.14);
  --native-control-hover-shadow: inset 0 1px 0 rgb(255 255 255 / 0.2), 0 1px 4px rgb(0 0 0 / 0.08);
  --native-overlay-filter: blur(18px) saturate(1.25);
  --native-card-filter: none;
  --native-row-hover-transform: none;
}

:root[data-os-theme="windows"],
:root[data-os-theme="windows"][data-theme-mode="light"] {
  --bg: #f3f3f3; --surface: #ffffff; --surface-soft: #f9f9f9; --surface-strong: #e9e9e9;
  --text: #1b1b1b; --text-muted: #5f5f5f; --text-inverse: #ffffff;
  --border: #d6d6d6; --border-soft: #e6e6e6; --border-strong: #bdbdbd;
  --accent: #0067c0; --accent-strong: #005a9e; --accent-alt: #0078d4; --focus: #ffb900;
  --danger: #c42b1c; --success: #107c10; --warning: #f7630c; --on-accent: #ffffff;
  --decision-imbox: #107c10; --decision-block: #c42b1c; --decision-feed: #0067c0;
  --decision-papertrail: #ffb900; --decision-mistakes: #f7630c; --decision-mailing_list: #8764b8;
  --overlay-bg: #ffffff; --overlay-border: #d6d6d6; --overlay-backdrop: rgb(0 0 0 / 0.32);
  --info-bg: color-mix(in srgb, var(--accent) 12%, var(--bg)); --info-text: var(--accent-strong);
  --warning-bg: color-mix(in srgb, var(--warning) 13%, var(--bg)); --warning-text: #a33d00;
  --danger-bg: color-mix(in srgb, var(--danger) 10%, var(--bg)); --danger-text: var(--danger);
  --success-bg: color-mix(in srgb, var(--success) 11%, var(--bg)); --success-text: var(--success);
  --note-bg: #fff4ce; --note-text: #1b1b1b; --note-border: #ffd335;
  --note-pill-bg: #ffec99; --note-pill-text: #8a6100;
  --shadow: 0 2px 4px rgb(0 0 0 / 0.08), 0 8px 20px rgb(0 0 0 / 0.08);
  --shadow-lg: 0 16px 40px rgb(0 0 0 / 0.18), 0 4px 10px rgb(0 0 0 / 0.12);
  --native-overlay-bg: rgb(255 255 255 / 0.86);
  --native-card-bg: color-mix(in srgb, var(--surface) 88%, var(--bg));
  --native-list-bg: color-mix(in srgb, var(--surface) 88%, var(--bg));
  --native-primary-bg: linear-gradient(180deg, color-mix(in srgb, var(--accent) 94%, white), var(--accent));
  --native-primary-hover-bg: linear-gradient(180deg, color-mix(in srgb, var(--accent-strong) 92%, white), var(--accent-strong));
  --native-secondary-bg: color-mix(in srgb, var(--surface-soft) 86%, transparent);
  --native-secondary-hover-bg: color-mix(in srgb, var(--surface-strong) 82%, transparent);
  --native-input-bg: #ffffff;
  --native-input-hover-bg: #ffffff;
  --native-row-hover-bg: color-mix(in srgb, var(--accent) 8%, var(--surface-soft));
  --native-row-hover-shadow: inset 2px 0 0 color-mix(in srgb, var(--accent) 70%, transparent);
}

:root[data-os-theme="gnome"] {
  --theme-font-serif: Cantarell, ui-serif, Georgia, serif;
  --theme-font-sans: Cantarell, Adwaita Sans, system-ui, sans-serif;
  --theme-font-mono: Adwaita Mono, Cantarell Mono, ui-monospace, monospace;
  --native-control-duration: 120ms;
  --native-focus-shadow: 0 0 0 4px color-mix(in srgb, var(--accent) 22%, transparent);
  --native-button-active-transform: translateY(1px);
  --native-button-active-filter: brightness(0.92);
  --native-button-shadow: none;
  --native-button-hover-shadow: none;
  --native-control-shadow: none;
  --native-control-hover-shadow: none;
  --native-overlay-filter: none;
  --native-card-filter: none;
  --native-row-hover-transform: none;
}

:root[data-os-theme="gnome"],
:root[data-os-theme="gnome"][data-theme-mode="light"] {
  --bg: #f6f5f4; --surface: #ffffff; --surface-soft: #f6f5f4; --surface-strong: #deddda;
  --text: #241f31; --text-muted: #5e5c64; --text-inverse: #ffffff;
  --border: #c0bfbc; --border-soft: #deddda; --border-strong: #9a9996;
  --accent: #3584e4; --accent-strong: #1c71d8; --accent-alt: #1a5fb4; --focus: #f6d32d;
  --danger: #c01c28; --success: #2ec27e; --warning: #e66100; --on-accent: #ffffff;
  --decision-imbox: #2ec27e; --decision-block: #c01c28; --decision-feed: #3584e4;
  --decision-papertrail: #f6d32d; --decision-mistakes: #e66100; --decision-mailing_list: #9141ac;
  --overlay-bg: #ffffff; --overlay-border: #c0bfbc; --overlay-backdrop: rgb(0 0 0 / 0.36);
  --info-bg: color-mix(in srgb, var(--accent) 13%, var(--bg)); --info-text: var(--accent-strong);
  --warning-bg: color-mix(in srgb, var(--warning) 13%, var(--bg)); --warning-text: #a34700;
  --danger-bg: color-mix(in srgb, var(--danger) 10%, var(--bg)); --danger-text: var(--danger);
  --success-bg: color-mix(in srgb, var(--success) 12%, var(--bg)); --success-text: #1b8553;
  --note-bg: #fef6d5; --note-text: #241f31; --note-border: #f6d32d;
  --note-pill-bg: #fae875; --note-pill-text: #7d5700;
  --shadow: 0 1px 2px rgb(0 0 0 / 0.08), 0 6px 18px rgb(0 0 0 / 0.08);
  --shadow-lg: 0 12px 36px rgb(0 0 0 / 0.2), 0 3px 8px rgb(0 0 0 / 0.12);
  --native-overlay-bg: var(--surface);
  --native-card-bg: var(--surface);
  --native-list-bg: var(--surface);
  --native-primary-bg: var(--accent);
  --native-primary-hover-bg: color-mix(in srgb, var(--accent) 88%, black);
  --native-secondary-bg: var(--surface-soft);
  --native-secondary-hover-bg: var(--surface-strong);
  --native-input-bg: var(--surface);
  --native-input-hover-bg: color-mix(in srgb, var(--surface) 86%, var(--accent));
  --native-row-hover-bg: color-mix(in srgb, var(--accent) 10%, var(--surface));
  --native-row-hover-shadow: none;
}

@media (prefers-color-scheme: dark) {
  :root[data-os-theme="windows"]:not([data-theme-mode="light"]) {
    --bg: #202020; --surface: #2b2b2b; --surface-soft: #242424; --surface-strong: #3a3a3a;
    --text: #f3f3f3; --text-muted: #c7c7c7; --text-inverse: #111111;
    --border: #4d4d4d; --border-soft: #3a3a3a; --border-strong: #6b6b6b;
    --accent: #60cdff; --accent-strong: #8cddff; --accent-alt: #4cc2ff; --focus: #ffb900;
    --danger: #ff99a4; --success: #6ccb5f; --warning: #ffb900; --on-accent: #00324d;
    --decision-imbox: #6ccb5f; --decision-block: #ff99a4; --decision-feed: #60cdff;
    --decision-papertrail: #ffb900; --decision-mistakes: #ff8c00; --decision-mailing_list: #b4a0ff;
    --overlay-bg: #2b2b2b; --overlay-border: #4d4d4d; --overlay-backdrop: rgb(0 0 0 / 0.58);
    --info-bg: color-mix(in srgb, var(--accent) 22%, var(--bg)); --info-text: var(--accent);
    --warning-bg: color-mix(in srgb, var(--warning) 20%, var(--bg)); --warning-text: var(--warning);
    --danger-bg: color-mix(in srgb, var(--danger) 18%, var(--bg)); --danger-text: var(--danger);
    --success-bg: color-mix(in srgb, var(--success) 18%, var(--bg)); --success-text: var(--success);
    --note-bg: color-mix(in srgb, #ffb900 28%, var(--bg)); --note-text: #f3f3f3;
    --note-border: color-mix(in srgb, #ffb900 50%, var(--border));
    --note-pill-bg: color-mix(in srgb, #ffb900 24%, var(--bg)); --note-pill-text: #ffcf4d;
    --shadow: 0 2px 4px rgb(0 0 0 / 0.42), 0 8px 20px rgb(0 0 0 / 0.28);
    --shadow-lg: 0 18px 48px rgb(0 0 0 / 0.6), 0 4px 12px rgb(0 0 0 / 0.35);
    --native-overlay-bg: rgb(43 43 43 / 0.82);
    --native-card-bg: color-mix(in srgb, var(--surface) 90%, var(--bg));
    --native-list-bg: color-mix(in srgb, var(--surface) 90%, var(--bg));
    --native-primary-bg: linear-gradient(180deg, color-mix(in srgb, var(--accent) 84%, white), var(--accent));
    --native-primary-hover-bg: linear-gradient(180deg, color-mix(in srgb, var(--accent-strong) 78%, white), var(--accent-strong));
    --native-secondary-bg: color-mix(in srgb, var(--surface-strong) 42%, transparent);
    --native-secondary-hover-bg: color-mix(in srgb, var(--surface-strong) 66%, transparent);
    --native-input-bg: color-mix(in srgb, var(--surface-soft) 78%, black);
    --native-input-hover-bg: color-mix(in srgb, var(--surface-strong) 58%, black);
    --native-row-hover-bg: color-mix(in srgb, var(--accent) 12%, var(--surface-soft));
    --native-row-hover-shadow: inset 2px 0 0 color-mix(in srgb, var(--accent) 70%, transparent);
  }

  :root[data-os-theme="gnome"]:not([data-theme-mode="light"]) {
    --bg: #1e1e1e; --surface: #2e3436; --surface-soft: #242424; --surface-strong: #3d4446;
    --text: #f6f5f4; --text-muted: #c0bfbc; --text-inverse: #241f31;
    --border: #555753; --border-soft: #3d4446; --border-strong: #77767b;
    --accent: #62a0ea; --accent-strong: #99c1f1; --accent-alt: #3584e4; --focus: #f8e45c;
    --danger: #f66151; --success: #57e389; --warning: #ffa348; --on-accent: #1a3f6f;
    --decision-imbox: #57e389; --decision-block: #f66151; --decision-feed: #62a0ea;
    --decision-papertrail: #f8e45c; --decision-mistakes: #ffa348; --decision-mailing_list: #dc8add;
    --overlay-bg: #2e3436; --overlay-border: #555753; --overlay-backdrop: rgb(0 0 0 / 0.6);
    --info-bg: color-mix(in srgb, var(--accent) 22%, var(--bg)); --info-text: var(--accent-strong);
    --warning-bg: color-mix(in srgb, var(--warning) 20%, var(--bg)); --warning-text: var(--warning);
    --danger-bg: color-mix(in srgb, var(--danger) 18%, var(--bg)); --danger-text: var(--danger);
    --success-bg: color-mix(in srgb, var(--success) 18%, var(--bg)); --success-text: var(--success);
    --note-bg: color-mix(in srgb, #f8e45c 30%, var(--bg)); --note-text: #f6f5f4;
    --note-border: color-mix(in srgb, #f8e45c 52%, var(--border));
    --note-pill-bg: color-mix(in srgb, #f8e45c 24%, var(--bg)); --note-pill-text: #f8e45c;
    --shadow: 0 1px 2px rgb(0 0 0 / 0.42), 0 6px 18px rgb(0 0 0 / 0.28);
    --shadow-lg: 0 16px 46px rgb(0 0 0 / 0.62), 0 4px 10px rgb(0 0 0 / 0.36);
    --native-overlay-bg: var(--surface);
    --native-card-bg: var(--surface);
    --native-list-bg: var(--surface);
    --native-primary-bg: var(--accent);
    --native-primary-hover-bg: color-mix(in srgb, var(--accent) 82%, white);
    --native-secondary-bg: var(--surface-soft);
    --native-secondary-hover-bg: var(--surface-strong);
    --native-input-bg: var(--surface-soft);
    --native-input-hover-bg: color-mix(in srgb, var(--surface-strong) 86%, var(--accent));
    --native-row-hover-bg: color-mix(in srgb, var(--accent) 13%, var(--surface));
    --native-row-hover-shadow: none;
  }
}

:root[data-os-theme="windows"][data-theme-mode="dark"] {
  --bg: #202020; --surface: #2b2b2b; --surface-soft: #242424; --surface-strong: #3a3a3a;
  --text: #f3f3f3; --text-muted: #c7c7c7; --text-inverse: #111111;
  --border: #4d4d4d; --border-soft: #3a3a3a; --border-strong: #6b6b6b;
  --accent: #60cdff; --accent-strong: #8cddff; --accent-alt: #4cc2ff; --focus: #ffb900;
  --danger: #ff99a4; --success: #6ccb5f; --warning: #ffb900; --on-accent: #00324d;
  --decision-imbox: #6ccb5f; --decision-block: #ff99a4; --decision-feed: #60cdff;
  --decision-papertrail: #ffb900; --decision-mistakes: #ff8c00; --decision-mailing_list: #b4a0ff;
  --overlay-bg: #2b2b2b; --overlay-border: #4d4d4d; --overlay-backdrop: rgb(0 0 0 / 0.58);
  --info-bg: color-mix(in srgb, var(--accent) 22%, var(--bg)); --info-text: var(--accent);
  --warning-bg: color-mix(in srgb, var(--warning) 20%, var(--bg)); --warning-text: var(--warning);
  --danger-bg: color-mix(in srgb, var(--danger) 18%, var(--bg)); --danger-text: var(--danger);
  --success-bg: color-mix(in srgb, var(--success) 18%, var(--bg)); --success-text: var(--success);
  --note-bg: color-mix(in srgb, #ffb900 28%, var(--bg)); --note-text: #f3f3f3;
  --note-border: color-mix(in srgb, #ffb900 50%, var(--border));
  --note-pill-bg: color-mix(in srgb, #ffb900 24%, var(--bg)); --note-pill-text: #ffcf4d;
  --shadow: 0 2px 4px rgb(0 0 0 / 0.42), 0 8px 20px rgb(0 0 0 / 0.28);
  --shadow-lg: 0 18px 48px rgb(0 0 0 / 0.6), 0 4px 12px rgb(0 0 0 / 0.35);
  --native-overlay-bg: rgb(43 43 43 / 0.82);
  --native-card-bg: color-mix(in srgb, var(--surface) 90%, var(--bg));
  --native-list-bg: color-mix(in srgb, var(--surface) 90%, var(--bg));
  --native-primary-bg: linear-gradient(180deg, color-mix(in srgb, var(--accent) 84%, white), var(--accent));
  --native-primary-hover-bg: linear-gradient(180deg, color-mix(in srgb, var(--accent-strong) 78%, white), var(--accent-strong));
  --native-secondary-bg: color-mix(in srgb, var(--surface-strong) 42%, transparent);
  --native-secondary-hover-bg: color-mix(in srgb, var(--surface-strong) 66%, transparent);
  --native-input-bg: color-mix(in srgb, var(--surface-soft) 78%, black);
  --native-input-hover-bg: color-mix(in srgb, var(--surface-strong) 58%, black);
  --native-row-hover-bg: color-mix(in srgb, var(--accent) 12%, var(--surface-soft));
  --native-row-hover-shadow: inset 2px 0 0 color-mix(in srgb, var(--accent) 70%, transparent);
}

:root[data-os-theme="gnome"][data-theme-mode="dark"] {
  --bg: #1e1e1e; --surface: #2e3436; --surface-soft: #242424; --surface-strong: #3d4446;
  --text: #f6f5f4; --text-muted: #c0bfbc; --text-inverse: #241f31;
  --border: #555753; --border-soft: #3d4446; --border-strong: #77767b;
  --accent: #62a0ea; --accent-strong: #99c1f1; --accent-alt: #3584e4; --focus: #f8e45c;
  --danger: #f66151; --success: #57e389; --warning: #ffa348; --on-accent: #1a3f6f;
  --decision-imbox: #57e389; --decision-block: #f66151; --decision-feed: #62a0ea;
  --decision-papertrail: #f8e45c; --decision-mistakes: #ffa348; --decision-mailing_list: #dc8add;
  --overlay-bg: #2e3436; --overlay-border: #555753; --overlay-backdrop: rgb(0 0 0 / 0.6);
  --info-bg: color-mix(in srgb, var(--accent) 22%, var(--bg)); --info-text: var(--accent-strong);
  --warning-bg: color-mix(in srgb, var(--warning) 20%, var(--bg)); --warning-text: var(--warning);
  --danger-bg: color-mix(in srgb, var(--danger) 18%, var(--bg)); --danger-text: var(--danger);
  --success-bg: color-mix(in srgb, var(--success) 18%, var(--bg)); --success-text: var(--success);
  --note-bg: color-mix(in srgb, #f8e45c 30%, var(--bg)); --note-text: #f6f5f4;
  --note-border: color-mix(in srgb, #f8e45c 52%, var(--border));
  --note-pill-bg: color-mix(in srgb, #f8e45c 24%, var(--bg)); --note-pill-text: #f8e45c;
  --shadow: 0 1px 2px rgb(0 0 0 / 0.42), 0 6px 18px rgb(0 0 0 / 0.28);
  --shadow-lg: 0 16px 46px rgb(0 0 0 / 0.62), 0 4px 10px rgb(0 0 0 / 0.36);
  --native-overlay-bg: var(--surface);
  --native-card-bg: var(--surface);
  --native-list-bg: var(--surface);
  --native-primary-bg: var(--accent);
  --native-primary-hover-bg: color-mix(in srgb, var(--accent) 82%, white);
  --native-secondary-bg: var(--surface-soft);
  --native-secondary-hover-bg: var(--surface-strong);
  --native-input-bg: var(--surface-soft);
  --native-input-hover-bg: color-mix(in srgb, var(--surface-strong) 86%, var(--accent));
  --native-row-hover-bg: color-mix(in srgb, var(--accent) 13%, var(--surface));
  --native-row-hover-shadow: none;
}
