/* ==========================================================
   Site Theme: "ProBlog Purple" skin
   Applied only when admin picks this theme (Admin → Theme Settings).
   Overrides ToolsHub's default CSS variables with proBlog's actual
   published palette/typography — works with the existing light/dark
   toggle (data-theme) on top of it, since both are just variables.
   ========================================================== */
[data-site-theme="problog"] {
  --primary: #5b3df0;
  --primary-light: #efeaff;
  --bg: #f6f6fb;
  --surface: #ffffff;
  --surface-alt: #faf9ff;
  --border: #e9e9f3;
  --text: #16161f;
  --text-muted: #6b6b7a;
  --radius: 16px;
  --shadow: 0 8px 24px rgba(20, 20, 40, 0.08);
  --success: #16a34a;
  --font-heading: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}
[data-site-theme="problog"][data-theme="dark"] {
  --bg: #0d0d14;
  --surface: #16161f;
  --surface-alt: #1b1b28;
  --text: #f2f2f7;
  --text-muted: #9d9dae;
  --border: #2a2a3a;
  --primary-light: #241f3d;
  --shadow: 0 10px 30px rgba(0, 0, 0, 0.4);
}
/* proBlog's look leans on slightly rounder cards + a subtle glow on hover
   instead of ToolsHub's flat translateY hover — small, safe additive touch. */
[data-site-theme="problog"] .card:hover {
  box-shadow: 0 8px 30px rgba(91, 61, 240, 0.18);
}
[data-site-theme="problog"] .btn-primary,
[data-site-theme="problog"] .btn.btn-primary {
  background: linear-gradient(135deg, var(--primary), #4626c4);
}