/* ── Theme: Apple Glass ──────────────────────────────────────────────────── */
/* Faithful to iOS 18 / macOS Sequoia — Apple Human Interface Guidelines    */

[data-theme="apple-glass"] {
  /* Grouped background — exact iOS systemGroupedBackground */
  --bg:              #f2f2f7;
  --bg2:             #ffffff;
  --bg3:             #e5e5ea;

  /* Surfaces — clean white, like iOS cards */
  --surface:         #ffffff;
  --surface2:        #f9f9fb;

  /* Primary — iOS systemBlue */
  --cyan:            #007aff;
  --cyan-dim:        rgba(0, 122, 255, 0.10);
  --cyan-glow:       none;

  /* Secondary — iOS systemPink */
  --magenta:         #ff3b30;
  --magenta-dim:     rgba(255, 59, 48, 0.10);
  --magenta-glow:    none;

  /* Tertiary — iOS systemOrange */
  --yellow:          #ff9500;
  --yellow-dim:      rgba(255, 149, 0, 0.10);

  /* Text — exact iOS label hierarchy */
  --text:            #000000;
  --text2:           #3c3c43;
  --text3:           #8e8e93;

  /* Chrome */
  --border:          rgba(60, 60, 67, 0.12);
  --overlay-bg:      rgba(0, 0, 0, 0.30);
  --scanline:        transparent;
  --row-hover:       rgba(0, 122, 255, 0.06);
  --row-stripe:      rgba(0, 0, 0, 0.015);

  /* Typography — SF system stack */
  --font-head:       -apple-system, BlinkMacSystemFont, "SF Pro Display", "Helvetica Neue", system-ui, sans-serif;
  --font-body:       -apple-system, BlinkMacSystemFont, "SF Pro Text", "Helvetica Neue", system-ui, sans-serif;
  --font-mono:       "SF Mono", ui-monospace, "Fira Code", Menlo, monospace;

  /* Geometry — iOS standard corner radius */
  --radius:          10px;
}

/* ── Body — clean grouped background, no effects ────────────────────────── */
[data-theme="apple-glass"] body {
  background: #f2f2f7;
}

[data-theme="apple-glass"] body::after,
[data-theme="apple-glass"] body::before {
  display: none;
}

/* ── Cards — white, elevated, rounded ───────────────────────────────────── */
[data-theme="apple-glass"] .card {
  background: #ffffff;
  border: none;
  border-left: none;
  border-radius: 12px;
  box-shadow:
    0 0 0 0.5px rgba(0, 0, 0, 0.04),
    0 1px 3px rgba(0, 0, 0, 0.06),
    0 4px 12px rgba(0, 0, 0, 0.04);
}

[data-theme="apple-glass"] .card-label {
  text-shadow: none;
  font-weight: 600;
  letter-spacing: 0.5px;
  color: var(--text);
  font-size: 13px;
}

[data-theme="apple-glass"] .card-label::before {
  color: var(--cyan);
}

/* ── Header — clean Apple style ─────────────────────────────────────────── */
[data-theme="apple-glass"] .header h1 {
  text-shadow: none;
  color: #000000;
  font-weight: 800;
  letter-spacing: 2px;
}

[data-theme="apple-glass"] .header h1::after {
  display: none;
}

[data-theme="apple-glass"] .header p {
  color: var(--text3);
  letter-spacing: 0.5px;
}

[data-theme="apple-glass"] .header p span {
  color: var(--cyan);
}

/* ── Divider — subtle iOS separator ─────────────────────────────────────── */
[data-theme="apple-glass"] .divider {
  background: rgba(60, 60, 67, 0.12);
  height: 0.5px;
}

/* ── Buttons — iOS filled style ─────────────────────────────────────────── */
[data-theme="apple-glass"] .btn-neon {
  background: #007aff;
  color: #ffffff;
  border: none;
  border-radius: 980px;
  box-shadow: none;
  font-weight: 600;
  letter-spacing: 0.3px;
  text-shadow: none;
  transition: all 0.2s ease;
}

[data-theme="apple-glass"] .btn-neon:hover {
  background: #0071e3;
  filter: none;
  box-shadow: 0 2px 8px rgba(0, 122, 255, 0.30);
  transform: none;
}

[data-theme="apple-glass"] .btn-neon:active {
  background: #0062cc;
  transform: scale(0.98);
}

[data-theme="apple-glass"] .btn-neon svg {
  stroke: #ffffff;
}

/* Ghost — iOS tinted button */
[data-theme="apple-glass"] .btn-ghost {
  border: none;
  color: #007aff;
  border-radius: 980px;
  font-weight: 500;
  background: rgba(0, 122, 255, 0.08);
  transition: all 0.2s ease;
}

[data-theme="apple-glass"] .btn-ghost:hover {
  background: rgba(0, 122, 255, 0.14);
  box-shadow: none;
}

[data-theme="apple-glass"] .btn-ghost:active {
  background: rgba(0, 122, 255, 0.20);
  transform: scale(0.98);
}

/* ── Inputs — iOS text fields ───────────────────────────────────────────── */
[data-theme="apple-glass"] input[type="text"],
[data-theme="apple-glass"] input[type="number"],
[data-theme="apple-glass"] select {
  border-radius: 10px;
  border: 0.5px solid rgba(60, 60, 67, 0.18);
  background-color: #ffffff;
  color: var(--text);
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

[data-theme="apple-glass"] input:focus,
[data-theme="apple-glass"] select:focus {
  border-color: #007aff;
  box-shadow: 0 0 0 3.5px rgba(0, 122, 255, 0.20);
  outline: none;
}

[data-theme="apple-glass"] select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='M2 4l4 4 4-4' fill='none' stroke='%23007aff' stroke-width='1.5'/%3E%3C/svg%3E");
}

/* ── Column rows — clean white tiles ────────────────────────────────────── */
[data-theme="apple-glass"] .col-row {
  background: #ffffff;
  border: 0.5px solid rgba(60, 60, 67, 0.10);
  border-radius: 12px;
  box-shadow: 0 0.5px 2px rgba(0, 0, 0, 0.04);
}

[data-theme="apple-glass"] .col-row:hover {
  border-color: rgba(0, 122, 255, 0.20);
}

[data-theme="apple-glass"] .col-num {
  background: rgba(0, 122, 255, 0.06);
  border-color: rgba(0, 122, 255, 0.12);
  color: #007aff;
  border-radius: 8px;
  font-weight: 600;
}

[data-theme="apple-glass"] .add-btn {
  border: 1.5px dashed rgba(0, 122, 255, 0.25);
  color: #007aff;
  border-radius: 12px;
}

[data-theme="apple-glass"] .add-btn:hover {
  background: rgba(0, 122, 255, 0.06);
  border-color: #007aff;
  box-shadow: none;
}

/* ── Table — clean iOS list style ───────────────────────────────────────── */
[data-theme="apple-glass"] .table-wrap {
  border: 0.5px solid rgba(60, 60, 67, 0.10);
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 0.5px 2px rgba(0, 0, 0, 0.04);
}

[data-theme="apple-glass"] th {
  font-family: var(--font-body);
  font-weight: 600;
  letter-spacing: 0;
  font-size: 12px;
  text-transform: none;
  color: var(--text3);
  background: #f9f9fb;
  border-bottom-color: rgba(60, 60, 67, 0.12);
}

[data-theme="apple-glass"] td {
  border-bottom-color: rgba(60, 60, 67, 0.08);
}

[data-theme="apple-glass"] td:hover {
  background: rgba(0, 122, 255, 0.06) !important;
  color: #007aff;
}

/* ── Side panel — white sidebar ─────────────────────────────────────────── */
[data-theme="apple-glass"] .type-panel {
  background: #f9f9fb;
  border-right: 0.5px solid rgba(60, 60, 67, 0.12);
  box-shadow: none;
}

[data-theme="apple-glass"] .tp-tab {
  font-weight: 600;
  letter-spacing: 0.5px;
  color: var(--text3);
}

[data-theme="apple-glass"] .tp-tab.active {
  color: #007aff;
  border-bottom-color: #007aff;
}

[data-theme="apple-glass"] .tp-item:hover {
  background: rgba(0, 122, 255, 0.06);
  color: #007aff;
}

[data-theme="apple-glass"] .tp-item:active {
  background: rgba(0, 122, 255, 0.10);
}

[data-theme="apple-glass"] .tp-domain {
  color: var(--text3);
  font-weight: 600;
}

[data-theme="apple-glass"] .tp-cat .cat-icon {
  color: #007aff;
}

[data-theme="apple-glass"] .tp-search {
  background: rgba(118, 118, 128, 0.12);
  border: none;
  border-radius: 10px;
  color: var(--text);
}

[data-theme="apple-glass"] .tp-search:focus {
  background: #ffffff;
  border: none;
  box-shadow: 0 0 0 3.5px rgba(0, 122, 255, 0.20);
}

[data-theme="apple-glass"] .tp-search::placeholder {
  color: #8e8e93;
}

[data-theme="apple-glass"] .tp-tpl-card {
  background: #ffffff;
  border: 0.5px solid rgba(60, 60, 67, 0.10);
  border-radius: 10px;
}

[data-theme="apple-glass"] .tp-tpl-card:hover {
  border-color: rgba(0, 122, 255, 0.25);
  box-shadow: 0 2px 8px rgba(0, 122, 255, 0.08);
}

[data-theme="apple-glass"] .tp-tpl-name {
  color: #007aff;
}

/* ── Field options panel ────────────────────────────────────────────────── */
[data-theme="apple-glass"] .field-options-panel {
  background: #f9f9fb;
  border-left: 0.5px solid rgba(60, 60, 67, 0.12);
}

[data-theme="apple-glass"] .fo-title {
  color: #000000;
}

/* ── Theme picker ───────────────────────────────────────────────────────── */
[data-theme="apple-glass"] .theme-dropdown {
  background: #ffffff;
  border: 0.5px solid rgba(60, 60, 67, 0.10);
  border-radius: 12px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.12), 0 0 0 0.5px rgba(0, 0, 0, 0.04);
  overflow: hidden;
}

[data-theme="apple-glass"] .theme-option:hover {
  background: rgba(0, 122, 255, 0.06);
  color: #007aff;
}

[data-theme="apple-glass"] .theme-option.active {
  color: #007aff;
}

[data-theme="apple-glass"] .theme-toggle {
  background: #ffffff;
  border: 0.5px solid rgba(60, 60, 67, 0.12);
  border-radius: 10px;
  color: #007aff;
  box-shadow: 0 0.5px 2px rgba(0, 0, 0, 0.06);
}

[data-theme="apple-glass"] .theme-toggle:hover {
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.10);
  border-color: rgba(60, 60, 67, 0.20);
}

[data-theme="apple-glass"] .help-btn {
  background: #ffffff;
  border: 0.5px solid rgba(60, 60, 67, 0.12);
  border-radius: 10px;
  color: #007aff;
  box-shadow: 0 0.5px 2px rgba(0, 0, 0, 0.06);
}

[data-theme="apple-glass"] .help-btn:hover {
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.10);
}

/* ── Action buttons — subtle iOS styling ────────────────────────────────── */
[data-theme="apple-glass"] .del-btn:hover {
  border-color: rgba(255, 59, 48, 0.25);
  color: #ff3b30;
  box-shadow: none;
}

[data-theme="apple-glass"] .dup-btn:hover {
  border-color: rgba(0, 122, 255, 0.25);
  color: #007aff;
}

[data-theme="apple-glass"] .opts-btn:hover {
  border-color: rgba(0, 122, 255, 0.25);
  color: #007aff;
}

[data-theme="apple-glass"] .opts-btn-active {
  color: #007aff !important;
  border-color: rgba(0, 122, 255, 0.25) !important;
  box-shadow: none;
  background: rgba(0, 122, 255, 0.06);
}

[data-theme="apple-glass"] .opts-btn-active::after {
  background: #ff3b30;
  box-shadow: none;
}

/* ── Preset dropdown ────────────────────────────────────────────────────── */
[data-theme="apple-glass"] .preset-btn {
  background: #ffffff;
  border: 0.5px solid rgba(60, 60, 67, 0.12);
  border-radius: 8px;
  color: #007aff;
}

[data-theme="apple-glass"] .preset-btn:hover {
  background: rgba(0, 122, 255, 0.06);
  border-color: rgba(0, 122, 255, 0.25);
  color: #007aff;
}

[data-theme="apple-glass"] .preset-dropdown {
  background: #ffffff;
  border: 0.5px solid rgba(60, 60, 67, 0.10);
  border-radius: 12px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.12);
}

[data-theme="apple-glass"] .preset-option:hover {
  background: rgba(0, 122, 255, 0.06);
  color: #007aff;
}

/* ── Loading overlay ────────────────────────────────────────────────────── */
[data-theme="apple-glass"] .overlay-box {
  background: #ffffff;
  border: none;
  border-left: none;
  border-radius: 16px;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.12);
  clip-path: none;
}

[data-theme="apple-glass"] .spinner {
  border-color: rgba(60, 60, 67, 0.12);
  border-top-color: #007aff;
}

[data-theme="apple-glass"] .overlay-box span {
  color: var(--text2);
}

/* ── Modals — iOS sheet style ───────────────────────────────────────────── */
[data-theme="apple-glass"] .tips-panel {
  background: #ffffff;
  border: none;
  border-left: none;
  border-radius: 16px;
  box-shadow: 0 8px 40px rgba(0, 0, 0, 0.15);
}

[data-theme="apple-glass"] .tips-hd-title {
  color: #000000;
  font-weight: 700;
}

[data-theme="apple-glass"] .tips-hd-title::before {
  color: #007aff;
}

[data-theme="apple-glass"] .tip-item {
  background: #f2f2f7;
  border-left: 2px solid #007aff;
  border-radius: 8px;
}

[data-theme="apple-glass"] .tip-d code {
  background: rgba(0, 122, 255, 0.08);
  color: #007aff;
  border: 0.5px solid rgba(0, 122, 255, 0.15);
  border-radius: 4px;
}

[data-theme="apple-glass"] .tips-ft button {
  border-radius: 980px;
}

[data-theme="apple-glass"] .tips-ft .tips-ok {
  color: #ffffff;
  background: #007aff;
  border-color: #007aff;
}

[data-theme="apple-glass"] .tips-ft .tips-ok:hover {
  background: #0071e3;
}

/* ── Toast — iOS style notification ─────────────────────────────────────── */
[data-theme="apple-glass"] .toast {
  background: #ffffff;
  border: none;
  color: #ff3b30;
  border-radius: 14px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
}

/* ── Stats cards ────────────────────────────────────────────────────────── */
[data-theme="apple-glass"] .stat-card {
  background: #ffffff;
  border: 0.5px solid rgba(60, 60, 67, 0.10);
  border-radius: 12px;
  box-shadow: 0 0.5px 2px rgba(0, 0, 0, 0.04);
}

[data-theme="apple-glass"] .stat-card.numeric::before {
  background: #007aff;
  border-radius: 2px;
}

[data-theme="apple-glass"] .stat-card.categorical::before {
  background: #ff9500;
  border-radius: 2px;
}

/* ── Range slider — iOS style ───────────────────────────────────────────── */
[data-theme="apple-glass"] input[type="range"] {
  background: rgba(60, 60, 67, 0.12);
  border-radius: 100px;
  height: 4px;
}

[data-theme="apple-glass"] input[type="range"]::-webkit-slider-thumb {
  background: #ffffff;
  box-shadow: 0 0.5px 4px rgba(0, 0, 0, 0.16), 0 0 0 0.5px rgba(0, 0, 0, 0.04);
  width: 22px;
  height: 22px;
}

[data-theme="apple-glass"] input[type="range"]::-moz-range-thumb {
  background: #ffffff;
  box-shadow: 0 0.5px 4px rgba(0, 0, 0, 0.16), 0 0 0 0.5px rgba(0, 0, 0, 0.04);
  width: 22px;
  height: 22px;
}

/* ── Checkbox — iOS tint ────────────────────────────────────────────────── */
[data-theme="apple-glass"] input[type="checkbox"] {
  accent-color: #007aff;
}

/* ── Scrollbar — macOS overlay style ────────────────────────────────────── */
[data-theme="apple-glass"] ::-webkit-scrollbar {
  width: 7px;
}

[data-theme="apple-glass"] ::-webkit-scrollbar-track {
  background: transparent;
}

[data-theme="apple-glass"] ::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.15);
  border-radius: 100px;
  border: 2px solid transparent;
  background-clip: padding-box;
}

[data-theme="apple-glass"] ::-webkit-scrollbar-thumb:hover {
  background: rgba(0, 0, 0, 0.30);
  background-clip: padding-box;
}

/* ── Selection ──────────────────────────────────────────────────────────── */
[data-theme="apple-glass"] ::selection {
  background: rgba(0, 122, 255, 0.20);
  color: var(--text);
}

/* ── Smooth Apple transitions ───────────────────────────────────────────── */
[data-theme="apple-glass"] a,
[data-theme="apple-glass"] button,
[data-theme="apple-glass"] input,
[data-theme="apple-glass"] select {
  transition: all 0.2s ease;
}

/* ── Max rows button ────────────────────────────────────────────────────── */
[data-theme="apple-glass"] #max-rows-btn {
  background: #ffffff;
  border: 0.5px solid rgba(60, 60, 67, 0.12);
  border-radius: 8px;
  color: #007aff;
}

[data-theme="apple-glass"] #max-rows-btn:hover {
  background: rgba(0, 122, 255, 0.06);
  border-color: rgba(0, 122, 255, 0.25);
  color: #007aff;
}

/* ── Cat control buttons ────────────────────────────────────────────────── */
[data-theme="apple-glass"] .tp-cat-ctrl-btn {
  background: rgba(118, 118, 128, 0.08);
  border: none;
  border-radius: 8px;
  color: var(--text3);
}

[data-theme="apple-glass"] .tp-cat-ctrl-btn:hover {
  background: rgba(0, 122, 255, 0.08);
  color: #007aff;
}

/* ── Footer ─────────────────────────────────────────────────────────────── */
[data-theme="apple-glass"] .footer span {
  color: #007aff;
}