/* === macOS system appearance (dark default · light) ========================= */

html[data-theme="dark"],
html:not([data-theme]) {
  color-scheme: dark;

  --mac-red: #ff5f57;
  --mac-yellow: #febc2e;
  --mac-green: #28c840;
  --mac-accent: #ffffff;
  --mac-accent-hover: #e5e5e5;
  --mac-accent-muted: rgba(255, 255, 255, 0.12);

  --mac-desktop: #000000;
  --mac-bg: #1e1e1e;
  --mac-bg-elevated: #2a2a2a;
  --mac-window: #2c2c2e;
  --mac-window-border: rgba(255, 255, 255, 0.09);
  --mac-titlebar: #323234;
  --mac-titlebar-border: rgba(255, 255, 255, 0.07);
  --mac-text: #f5f5f7;
  --mac-text-secondary: #aeaeb2;
  --mac-text-tertiary: #6e6e73;
  --mac-separator: rgba(255, 255, 255, 0.11);
  --mac-fill: rgba(255, 255, 255, 0.06);
  --mac-input-bg: #1c1c1e;
  --mac-input-border: rgba(255, 255, 255, 0.14);
  --mac-shadow: 0 18px 50px rgba(0, 0, 0, 0.45), 0 0 0 0.5px rgba(255, 255, 255, 0.07);
  --mac-shadow-sm: 0 6px 20px rgba(0, 0, 0, 0.35), 0 0 0 0.5px rgba(255, 255, 255, 0.06);
  --mac-menu-bg: rgba(44, 44, 46, 0.78);
  --mac-menu-blur: blur(22px) saturate(190%);
  --mac-radius-window: 10px;
  --mac-radius-control: 7px;
  --mac-danger: #ff453a;
  --mac-success: #30d158;
}

html[data-theme="light"] {
  color-scheme: light;

  --mac-red: #ff5f57;
  --mac-yellow: #febc2e;
  --mac-green: #28c840;
  --mac-accent: #000000;
  --mac-accent-hover: #333333;
  --mac-accent-muted: rgba(0, 0, 0, 0.08);

  --mac-desktop: #e8e8e8;
  --mac-bg: #ececec;
  --mac-bg-elevated: #ffffff;
  --mac-window: #ffffff;
  --mac-window-border: rgba(0, 0, 0, 0.1);
  --mac-titlebar: #ebebeb;
  --mac-titlebar-border: rgba(0, 0, 0, 0.08);
  --mac-text: #1d1d1f;
  --mac-text-secondary: #6e6e73;
  --mac-text-tertiary: #8e8e93;
  --mac-separator: rgba(0, 0, 0, 0.11);
  --mac-fill: rgba(0, 0, 0, 0.04);
  --mac-input-bg: #ffffff;
  --mac-input-border: rgba(0, 0, 0, 0.14);
  --mac-shadow: 0 18px 50px rgba(0, 0, 0, 0.12), 0 0 0 0.5px rgba(0, 0, 0, 0.06);
  --mac-shadow-sm: 0 6px 20px rgba(0, 0, 0, 0.08), 0 0 0 0.5px rgba(0, 0, 0, 0.05);
  --mac-menu-bg: rgba(251, 251, 253, 0.8);
  --mac-menu-blur: blur(22px) saturate(190%);
  --mac-radius-window: 10px;
  --mac-radius-control: 7px;
  --mac-danger: #ff3b30;
  --mac-success: #34c759;
}

html[data-theme="dark"],
html:not([data-theme]),
html[data-theme="light"] {
  --color-accent: var(--mac-accent);
  --color-accent-dim: var(--mac-accent-hover);
  --color-accent-glow: var(--mac-accent-muted);
  --color-primary: var(--mac-accent);
  --color-primary-hover: var(--mac-accent-hover);
  --color-primary-muted: var(--mac-accent-muted);
  --color-bg-deep: var(--mac-desktop);
  --color-bg: var(--mac-bg);
  --color-surface: var(--mac-window);
  --color-surface-elevated: var(--mac-bg-elevated);
  --color-surface-hover: var(--mac-fill);
  --color-border: var(--mac-separator);
  --color-border-strong: var(--mac-window-border);
  --color-text: var(--mac-text);
  --color-text-secondary: var(--mac-text-secondary);
  --color-text-darker: var(--mac-text-tertiary);
  --ops-bg-deep: var(--mac-desktop);
  --ops-bg: var(--mac-bg);
  --ops-surface: var(--mac-window);
  --ops-surface-up: var(--mac-bg-elevated);
  --ops-blue: var(--mac-accent);
  --ops-blue-dim: var(--mac-accent-hover);
  --ops-violet: #a3a3a3;
  --ops-mint: #c7c7c7;
  --ops-text: var(--mac-text);
  --ops-muted: var(--mac-text-secondary);
  --ops-glass: var(--mac-menu-bg);
  --ops-glass-border: var(--mac-window-border);
  --radius: var(--mac-radius-control);
  --radius-input: var(--mac-radius-control);
  --font: -apple-system, BlinkMacSystemFont, "SF Pro Text", "SF Pro Display", "Segoe UI", system-ui, sans-serif;
  --surface: var(--mac-window);
  --border: var(--mac-separator);
  --bg: var(--mac-bg);
  --text: var(--mac-text);
  --muted: var(--mac-text-secondary);
  --accent: var(--mac-accent);
}

html {
  background: var(--mac-desktop);
}

body.macos-ui {
  font-family: var(--font);
  color: var(--mac-text);
  background: var(--mac-desktop) !important;
}

body.macos-ui .otac-scene,
body.macos-ui .otac-aurora,
body.macos-ui .ops-grid {
  display: none !important;
}

body.macos-ui.ops-ui {
  background: var(--mac-desktop) !important;
}

/* Menu bar */
body.macos-ui .top {
  background: var(--mac-menu-bg);
  backdrop-filter: var(--mac-menu-blur);
  -webkit-backdrop-filter: var(--mac-menu-blur);
  border-bottom: 1px solid var(--mac-titlebar-border);
  box-shadow: none;
}

body.macos-ui .logo__tick {
  color: var(--mac-text);
  font-weight: 700;
  letter-spacing: -0.02em;
  text-transform: none;
}

body.macos-ui .logo__ac {
  color: var(--mac-text-secondary);
  letter-spacing: normal;
  text-transform: none;
  font-weight: 500;
}

body.macos-ui .nav a:not(.btn) {
  font-size: 0.8125rem;
  font-weight: 500;
  letter-spacing: normal;
  text-transform: none;
  border-radius: var(--mac-radius-control);
  color: var(--mac-text-secondary);
}

body.macos-ui .nav a:not(.btn):hover {
  background: var(--mac-fill);
  border-color: transparent;
  color: var(--mac-text);
}

body.macos-ui .nav a:not(.btn).is-active {
  background: var(--mac-text);
  color: var(--mac-desktop);
  border-color: transparent;
  box-shadow: none;
}

body.macos-ui .nav a:not(.btn).nav-buy {
  color: var(--mac-text);
}

body.macos-ui .nav a:not(.btn).nav-buy.is-active {
  color: var(--mac-desktop);
}

body.macos-ui .btn--primary {
  background: var(--mac-text);
  border-color: transparent;
  color: var(--mac-desktop);
  border-radius: var(--mac-radius-control);
  box-shadow: none;
  font-weight: 500;
  letter-spacing: normal;
  text-transform: none;
}

body.macos-ui .btn--primary:hover {
  background: var(--mac-accent-hover);
  color: var(--mac-desktop);
  filter: none;
}

body.macos-ui .btn--ghost {
  background: var(--mac-fill);
  border: 1px solid var(--mac-input-border);
  color: var(--mac-text);
  border-radius: var(--mac-radius-control);
  text-transform: none;
  letter-spacing: normal;
}

.nav__utilities {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-right: 6px;
}

.theme-picker__trigger,
body.macos-ui .lang-picker__trigger {
  border: none;
  border-radius: var(--mac-radius-control);
  color: var(--mac-text-secondary);
}

.theme-picker__trigger:hover,
body.macos-ui .lang-picker__trigger:hover,
body.macos-ui .lang-picker.is-open .lang-picker__trigger {
  background: var(--mac-fill);
  border-color: transparent;
  box-shadow: none;
  color: var(--mac-text);
}

body.macos-ui .lang-picker__menu {
  background: var(--mac-window);
  border: 1px solid var(--mac-window-border);
  border-radius: var(--mac-radius-window);
  box-shadow: var(--mac-shadow-sm);
}

body.macos-ui .lang-picker__option.is-active {
  background: var(--mac-text);
  color: var(--mac-desktop);
}

/* Windows (site-wide B&W — not AUTO CONFIG cyber zone) */
body.macos-ui:not(.page-autoconfig) .ops-screen,
body.macos-ui:not(.page-autoconfig):not(.page-panel-ws) main .card,
body.macos-ui .panel-shell,
body.macos-ui:not(.page-autoconfig) .ops-screen--shell,
body.macos-ui:not(.page-autoconfig) .support-policies__card {
  border-radius: var(--mac-radius-window) !important;
  border: 1px solid var(--mac-window-border) !important;
  background: var(--mac-window) !important;
  box-shadow: var(--mac-shadow-sm) !important;
  backdrop-filter: none !important;
}

body.macos-ui .ops-screen--shell {
  box-shadow: var(--mac-shadow) !important;
  overflow: hidden;
}

body.macos-ui .ops-win__bar,
body.macos-ui .ops-screen > .ops-win__bar {
  display: grid;
  grid-template-columns: minmax(72px, 1fr) auto minmax(72px, 1fr);
  align-items: center;
  gap: 0.5rem;
  padding: 0.55rem 0.85rem;
  min-height: 38px;
  background: var(--mac-titlebar);
  border-bottom: 1px solid var(--mac-titlebar-border);
  font-family: var(--font);
  font-size: 0.8125rem;
  font-weight: 590;
  letter-spacing: -0.01em;
  text-transform: none;
  color: var(--mac-text-secondary);
}

body.macos-ui .ops-win__dots {
  grid-column: 1;
  justify-self: start;
  gap: 7px;
}

body.macos-ui .ops-win__dots span {
  width: 12px;
  height: 12px;
  border: 0.5px solid rgba(0, 0, 0, 0.15);
}

body.macos-ui .ops-win__dots span:nth-child(1) { background: var(--mac-red); }
body.macos-ui .ops-win__dots span:nth-child(2) { background: var(--mac-yellow); }
body.macos-ui .ops-win__dots span:nth-child(3) { background: var(--mac-green); }

body.macos-ui .ops-win__title {
  grid-column: 2;
  text-align: center;
  color: var(--mac-text);
}

body.macos-ui .ops-win__status {
  grid-column: 3;
  justify-self: end;
  color: var(--mac-text-secondary);
  font-size: 0.75rem;
}

body.macos-ui .ops-screen__body {
  background: var(--mac-window);
  color: var(--mac-text);
}

body.macos-ui .ops-stage__grid,
body.macos-ui .ops-workstation__grid,
body.macos-ui .ops-workstation__scan,
body.macos-ui .ops-stage__scan {
  display: none;
}

body.macos-ui .ops-stage--hero {
  display: block;
  background: var(--mac-window);
  border: 1px solid var(--mac-window-border);
  box-shadow: var(--mac-shadow);
}

body.macos-ui .ops-eyebrow {
  color: var(--mac-text-secondary);
  letter-spacing: normal;
  text-transform: none;
  font-size: 0.875rem;
}

body.macos-ui .ops-hero h1,
body.macos-ui .ops-section__title,
body.macos-ui .panel-head h1 {
  font-family: var(--font) !important;
  background: none !important;
  -webkit-background-clip: unset !important;
  background-clip: unset !important;
  color: var(--mac-text) !important;
  letter-spacing: -0.03em !important;
  font-weight: 700 !important;
  text-transform: none !important;
}

body.macos-ui .lead,
body.macos-ui .muted {
  color: var(--mac-text-secondary);
}

body.macos-ui .price {
  color: var(--mac-text);
  font-weight: 700;
}

body.macos-ui .ops-terminal-head {
  background: var(--mac-window);
  border: 1px solid var(--mac-window-border);
  border-radius: var(--mac-radius-window);
  box-shadow: var(--mac-shadow-sm);
}

body.macos-ui .ops-terminal-head__line {
  font-family: var(--font);
  font-size: 0.75rem;
  letter-spacing: normal;
  color: var(--mac-text-tertiary);
}

body.macos-ui .panel-shell__aside {
  background: var(--mac-bg-elevated);
  border-color: var(--mac-separator);
}

body.macos-ui .panel-shell__nav a {
  border-radius: var(--mac-radius-control);
  font-size: 0.8125rem;
  text-transform: none;
  letter-spacing: normal;
  color: var(--mac-text-secondary);
}

body.macos-ui .panel-shell__nav a:hover {
  background: var(--mac-fill);
  color: var(--mac-text);
}

body.macos-ui .panel-shell__nav a.is-active {
  background: var(--mac-text);
  color: var(--mac-desktop);
}

body.macos-ui input,
body.macos-ui select,
body.macos-ui textarea {
  background: var(--mac-input-bg) !important;
  border: 1px solid var(--mac-input-border) !important;
  border-radius: var(--mac-radius-control) !important;
  color: var(--mac-text) !important;
}

body.macos-ui code {
  background: var(--mac-fill);
  border-color: var(--mac-input-border);
  color: var(--mac-text);
}

body.macos-ui .otac-dialog__box {
  border-radius: var(--mac-radius-window) !important;
  border: 1px solid var(--mac-window-border) !important;
  box-shadow: var(--mac-shadow) !important;
  background: var(--mac-window) !important;
}

body.macos-ui .otac-dialog__head {
  background: var(--mac-titlebar);
  border-bottom: 1px solid var(--mac-titlebar-border);
}

body.macos-ui .otac-dialog__title {
  font-family: var(--font) !important;
  color: var(--mac-text) !important;
  letter-spacing: -0.02em !important;
  text-transform: none !important;
}

body.macos-ui .otac-ban-detail-content,
body.macos-ui .otac-ban-detail-actions {
  background: var(--mac-window);
}

body.macos-ui .table-wrap,
body.macos-ui .cfg-editor__panel,
body.macos-ui .otac-modal__card {
  background: var(--mac-window);
  border-color: var(--mac-window-border);
}

body.macos-ui .cfg-editor__tab.is-active {
  background: var(--mac-text);
  color: var(--mac-desktop);
}

body.macos-ui .cfg-editor__tab:hover {
  background: var(--mac-fill);
  color: var(--mac-text);
}

/* Kill legacy cyber / purple tints on config UI */
body.macos-ui:not(.page-autoconfig) .cfg-editor__panel,
body.macos-ui:not(.page-autoconfig) #cfg-editor {
  background: var(--mac-window) !important;
  border-color: var(--mac-window-border) !important;
}

body.macos-ui .footer {
  color: var(--mac-text-secondary);
  border-top: 1px solid var(--mac-separator);
}

body.macos-ui .ops-meter__fill {
  background: var(--mac-text);
}

body.macos-ui .features li::marker {
  color: var(--mac-text-secondary);
}

/* Home — lightweight payment logos (no marquee) */
body.page-home .payment-logos {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.75rem 1.25rem;
  max-width: 52rem;
  margin: 0.75rem auto 0;
}

body.page-home .payment-logos__item {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.4rem 0.65rem;
  min-height: 2.75rem;
  border-radius: var(--mac-radius-control);
  background: var(--mac-fill);
  border: 1px solid var(--mac-window-border);
}

body.page-home .payment-logos__img {
  display: block;
  height: 28px;
  width: auto;
  max-width: 88px;
  object-fit: contain;
  opacity: 0.88;
}

body.page-home .card--ops {
  box-shadow: var(--mac-shadow-sm) !important;
}

body.page-home main .card {
  content-visibility: auto;
  contain-intrinsic-size: auto 420px;
}

@media (prefers-reduced-motion: reduce) {
  body.macos-ui .ops-screen {
    animation: none !important;
  }
}

@media (max-width: 900px) {
  body.macos-ui .ops-screen--shell > .panel-shell {
    flex-direction: column;
  }
}
