/* ═══════════════════════════════════════════
   THEME — Light Mode Overrides
   Shared by all feed pages.
   Dark mode is the default (defined in feed-shell.css).
═══════════════════════════════════════════ */

/* ── Smooth transition when toggling ── */
*, *::before, *::after {
  transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
}

/* ═══════════════════════════════════════════
   LIGHT MODE — Feed Shell Token Overrides
═══════════════════════════════════════════ */
[data-theme="light"] {
  --ink: #FAFAF8;
  --surface: #F2F0EC;
  --layer-01: #EDEAE4;
  --layer-02: #E4E0D8;
  --layer-03: #D6D2C8;
  --border: #D0CCC4;
  --border-2: #B8B4AA;
  --border-3: #9A968C;
  --cream: #1A1814;
  --cream-60: rgba(26,24,20,0.7);
  --cream-30: rgba(26,24,20,0.45);
  --cream-12: rgba(26,24,20,0.12);
  --cream-06: rgba(26,24,20,0.06);
  --gold: #9A7B2C;
  --gold-dim: rgba(154,123,44,0.1);
  --gold-glow: rgba(154,123,44,0.2);
  --green-dim: rgba(36,161,72,0.1);
  --red: #DA1E28;
  --blue: #0043CE;
  --teal: #005D5D;
  --green: #24A148;
  --purple: #6929C4;
  --orange: #BA4E00;
}

/* ── Light body ── */
[data-theme="light"] body {
  background: var(--ink);
  color: var(--cream);
}
[data-theme="light"] body::after { opacity: 0.3; }
[data-theme="light"] ::selection { background: var(--gold-dim); color: var(--gold); }
[data-theme="light"] ::-webkit-scrollbar-thumb { background: var(--border-2); }

/* ── Cursor ── */
[data-theme="light"] .c-dot { background: var(--gold); }
[data-theme="light"] .c-ring { border-color: rgba(154,123,44,0.4); }

/* ── Topbar ── */
[data-theme="light"] .topbar {
  background: rgba(250,250,248,0.96);
  border-bottom-color: var(--border);
}

/* ── Feed controls ── */
[data-theme="light"] .feed-controls {
  background: var(--surface);
  border-bottom-color: var(--border);
}
[data-theme="light"] .fc-btn.on {
  color: var(--gold);
  border-color: rgba(154,123,44,0.35);
  background: var(--gold-dim);
}

/* ── Today banner ── */
[data-theme="light"] .today-banner {
  background: var(--layer-01);
  border-bottom-color: var(--border);
}
[data-theme="light"] .today-banner::before {
  background: linear-gradient(90deg, rgba(154,123,44,0.06) 0%, transparent 50%);
}

/* ── Content cards ── */
[data-theme="light"] .content-card {
  background: #ffffff;
  border-color: var(--border);
  box-shadow: 0 1px 3px rgba(0,0,0,0.06);
}
[data-theme="light"] .content-card:hover {
  border-color: var(--border-3);
  box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}
[data-theme="light"] .card-overlay {
  background: rgba(250,250,248,0.92);
}

/* ── Card badges ── */
[data-theme="light"] .card-status-badge,
[data-theme="light"] .review-badge {
  background: rgba(255,255,255,0.85);
  backdrop-filter: blur(8px);
}

/* ── Loop indicator ── */
[data-theme="light"] .loop-indicator {
  background: #ffffff;
  border-color: var(--border);
  box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}

/* ── Load more ── */
[data-theme="light"] .load-more { border-top-color: var(--border); }

/* ── Generate panel ── */
[data-theme="light"] .gen-panel { background: var(--surface); border-left-color: var(--border); }
[data-theme="light"] .gen-textarea { background: #ffffff; border-color: var(--border); color: var(--cream); }
[data-theme="light"] .gen-select { background: #ffffff; border-color: var(--border); color: var(--cream-60); }

/* ── Sidebar: Always dark — no overrides ── */

/* ═══════════════════════════════════════════
   THEME TOGGLE BUTTON
═══════════════════════════════════════════ */
.theme-toggle {
  width: 32px;
  height: 32px;
  background: transparent;
  border: 1px solid var(--border);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all var(--dur, 160ms) var(--ease, ease);
  flex-shrink: 0;
}
.theme-toggle:hover {
  border-color: var(--gold, #C9A84C);
  background: var(--cream-06, rgba(242,237,228,0.06));
}
.theme-toggle svg {
  width: 16px;
  height: 16px;
  fill: var(--cream-60, rgba(242,237,228,0.6));
}
.theme-toggle:hover svg { fill: var(--gold, #C9A84C); }

/* Show moon in dark, sun in light */
.theme-toggle .icon-sun { display: none; }
.theme-toggle .icon-moon { display: block; }
[data-theme="light"] .theme-toggle .icon-sun { display: block; }
[data-theme="light"] .theme-toggle .icon-moon { display: none; }
