/* ============================================================
   Glance — Catppuccin Mocha · Lofi
   Companion to the HSL theme block in glance.nix.
   Served from the store via server.assets-path.
   ============================================================ */

:root {
  --ctp-base:     #1e1e2e;
  --ctp-mantle:   #181825;
  --ctp-crust:    #11111b;
  --ctp-surface0: #313244;
  --ctp-surface1: #45475a;
  --ctp-surface2: #585b70;
  --ctp-overlay0: #6c7086;
  --ctp-text:     #cdd6f4;
  --ctp-subtext1: #bac2de;
  --ctp-subtext0: #a6adc8;
  --ctp-blue:     #89b4fa;
  --ctp-lavender: #b4befe;
  --ctp-mauve:    #cba6f7;
  --ctp-red:      #f38ba8;
  --ctp-green:    #a6e3a1;
  --ctp-yellow:   #f9e2af;
  --ctp-peach:    #fab387;
  --ctp-teal:     #94e2d5;
}

/* --- lofi type + warm backdrop --- */
body {
  font-family: "Inter", "Hanken Grotesk", ui-sans-serif, system-ui, sans-serif;
  color: var(--ctp-text);
  background:
    radial-gradient(1200px 800px at 15% -10%, rgba(203, 166, 247, 0.07), transparent 60%),
    radial-gradient(1000px 700px at 110% 110%, rgba(249, 226, 175, 0.06), transparent 55%),
    linear-gradient(180deg, var(--ctp-crust) 0%, var(--ctp-base) 40%, var(--ctp-mantle) 100%);
  background-attachment: fixed;
}

/* --- film grain removed (caused scroll jank) --- */

/* --- widget cards: soft glass (no backdrop-filter — causes scroll jank) --- */
.widget {
  border-radius: 16px;
  border: 1px solid rgba(69, 71, 90, 0.35);            /* surface1 @ 35% */
  box-shadow: 0 4px 18px rgba(17, 17, 27, 0.35);
  background: linear-gradient(180deg,
    rgba(49, 50, 68, 0.55),                              /* surface0 */
    rgba(24, 24, 37, 0.65));                             /* mantle */
  /* backdrop-filter: blur(6px); — removed: heavy scroll jank */
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.widget:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 24px rgba(17, 17, 27, 0.5);
}

/* --- headers --- */
.widget-header {
  letter-spacing: 0.03em;
  color: var(--ctp-subtext1);
  font-weight: 500;
}

/* --- links --- */
a {
  color: var(--ctp-lavender);
  transition: color 0.2s ease;
}
a:hover {
  color: var(--ctp-mauve);
}

/* --- clock: hide local time, show only configured timezones --- */
[data-local-time] { display: none; }
[data-local-time] + hr { display: none; }

/* --- clock: big, light --- */
.clock-time {
  font-weight: 300;
  letter-spacing: 0.02em;
  color: var(--ctp-text);
}

/* --- calendar: today pill --- */
.calendar-current-date {
  background: rgba(137, 180, 250, 0.22);               /* blue @ 22% */
  color: var(--ctp-text);
  border-radius: 8px;
}
.calendar-date {
  transition: background 0.15s ease;
}

/* --- rss cards --- */
.widget-type-rss {
  content-visibility: auto;
  contain-intrinsic-size: 600px;
}
.widget-type-rss a {
  font-weight: 450;
}
.rss-card-image,
.rss-detailed-thumbnail {
  border-radius: 8px;
}

/* --- markets up/down already via theme colors; soften flash --- */
.market-change {
  transition: opacity 0.3s ease;
}

/* --- scrollbar --- */
::-webkit-scrollbar {
  width: 10px;
}
::-webkit-scrollbar-thumb {
  background: var(--ctp-surface1);
  border-radius: 8px;
  border: 2px solid var(--ctp-base);
}
::-webkit-scrollbar-track {
  background: transparent;
}