/* ============================================================
   THEMES.CSS — 5 themes via data-theme attribute
   🌸 garden | 📖 storybook | 🌊 ocean | 🌙 midnight | 🌿 meadow
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,600;1,400&family=Nunito:wght@300;400;600;700&family=Lora:ital,wght@0,400;0,600;1,400&family=Quicksand:wght@400;600;700&family=Josefin+Sans:wght@300;400;600&family=DM+Serif+Display:ital@0;1&family=Space+Grotesk:wght@400;600;700&family=Fraunces:ital,wght@0,400;1,600&display=swap');

/* ============================================================
   1. 🌸 GARDEN — soft florals, blush & mint, organic
   ============================================================ */
[data-theme="garden"]{
  --font-display:'Playfair Display',Georgia,serif;
  --font-body:'Nunito',system-ui,sans-serif;
  --clr-bg:#fdf6f0;--clr-bg2:#fff9f5;--clr-sidebar:#fff0f5;
  --clr-sidebar-border:#fcd5e0;
  --clr-primary:#d4738a;--clr-primary-light:#fbdde6;
  --clr-accent:#6aab8e;--clr-text:#3a2f35;--clr-text2:#7a6270;--clr-text3:#b09aa8;
  --clr-border:#f0d9e3;--clr-card:#ffffff;
  --radius-sm:8px;--radius-md:14px;--radius-lg:20px;--radius-xl:28px;--radius-pill:50px;
}
[data-theme="garden"] body{font-family:var(--font-body);background:var(--clr-bg);color:var(--clr-text);}
[data-theme="garden"] body::before{content:'';position:fixed;inset:0;background:radial-gradient(ellipse 300px 200px at 8% 18%,rgba(212,115,138,.06),transparent 70%),radial-gradient(ellipse 200px 300px at 92% 82%,rgba(106,171,142,.06),transparent 70%);pointer-events:none;z-index:0;}
[data-theme="garden"] .cm-layout{position:relative;z-index:1;}
[data-theme="garden"] .cm-sidebar{background:var(--clr-sidebar);border-right:1.5px solid var(--clr-sidebar-border);}
[data-theme="garden"] .cm-sidebar-logo h2{font-family:var(--font-display);color:var(--clr-primary);font-style:italic;font-size:1.3rem;}
[data-theme="garden"] .cm-sidebar-logo p{font-size:.68rem;color:var(--clr-text3);letter-spacing:.08em;text-transform:uppercase;}
[data-theme="garden"] .cm-sidebar-link,.cm-nav-item{color:var(--clr-text2);}
[data-theme="garden"] .cm-sidebar-link:hover,[data-theme="garden"] .cm-nav-item:hover{background:rgba(212,115,138,.1);color:var(--clr-primary);}
[data-theme="garden"] .cm-nav-item.active{background:#fde8f0;color:var(--clr-primary);border-left-color:var(--clr-primary);}
[data-theme="garden"] .cm-topbar{background:rgba(255,240,245,.85);backdrop-filter:blur(8px);border-bottom:1px solid var(--clr-border);}
[data-theme="garden"] .cm-topbar-title{font-family:var(--font-display);font-style:italic;color:var(--clr-primary);font-size:1.05rem;}
[data-theme="garden"] .cm-hero-name{font-family:var(--font-display);font-size:2.3rem;font-weight:600;}
[data-theme="garden"] .cm-hero-birth{color:var(--clr-accent);}
[data-theme="garden"] .cm-hero::after{content:'✿  ❀  ✿';display:block;color:var(--clr-primary-light);font-size:1.1rem;margin-top:10px;letter-spacing:8px;}
[data-theme="garden"] .cm-section-header h2{font-family:var(--font-display);}
[data-theme="garden"] .cm-tree-header h2{font-family:var(--font-display);font-style:italic;}
[data-theme="garden"] .cm-hamburger{color:var(--clr-text2);}

/* ============================================================
   2. 📖 STORYBOOK — parchment, dark wood sidebar, polaroids
   ============================================================ */
[data-theme="storybook"]{
  --font-display:'Lora',Georgia,serif;
  --font-body:'Quicksand',system-ui,sans-serif;
  --clr-bg:#faf5eb;--clr-bg2:#fff8f0;--clr-sidebar:#3d2c1e;
  --clr-sidebar-border:#2a1f15;
  --clr-primary:#c07c3a;--clr-primary-light:#fde8cc;
  --clr-accent:#5b7e57;--clr-text:#2c1f12;--clr-text2:#6b5040;--clr-text3:#a08070;
  --clr-border:#e8d9c5;--clr-card:#fffdf7;
  --radius-sm:6px;--radius-md:12px;--radius-lg:16px;--radius-xl:22px;--radius-pill:8px;
}
[data-theme="storybook"] body{font-family:var(--font-body);background:var(--clr-bg);color:var(--clr-text);}
[data-theme="storybook"] .cm-sidebar{background:var(--clr-sidebar);border-right:3px solid var(--clr-sidebar-border);}
[data-theme="storybook"] .cm-sidebar-logo h2{font-family:var(--font-display);color:#fde8cc;font-style:italic;font-size:1.25rem;}
[data-theme="storybook"] .cm-sidebar-logo p{font-size:.65rem;color:rgba(255,255,255,.35);letter-spacing:.1em;text-transform:uppercase;}
[data-theme="storybook"] .cm-sidebar-section-label{color:rgba(255,255,255,.3);}
[data-theme="storybook"] .cm-sidebar-link,.cm-nav-item{color:rgba(255,255,255,.55);}
[data-theme="storybook"] .cm-sidebar-link:hover,[data-theme="storybook"] .cm-nav-item:hover{background:rgba(192,124,58,.2);color:rgba(255,255,255,.88);}
[data-theme="storybook"] .cm-nav-item.active{background:rgba(192,124,58,.25);color:#fde8cc;border-left-color:var(--clr-primary);}
[data-theme="storybook"] .cm-sidebar-footer{border-top-color:rgba(255,255,255,.1);}
[data-theme="storybook"] .cm-sidebar-footer .cm-btn--ghost{color:rgba(255,255,255,.55);border-color:rgba(255,255,255,.15);}
[data-theme="storybook"] .cm-sidebar-footer .cm-btn--ghost:hover{background:rgba(255,255,255,.1);color:#fff;}
[data-theme="storybook"] .cm-topbar{background:rgba(250,245,235,.92);backdrop-filter:blur(8px);border-bottom:2px solid var(--clr-border);}
[data-theme="storybook"] .cm-topbar-title{font-family:var(--font-display);font-style:italic;color:var(--clr-primary);font-size:1rem;}
[data-theme="storybook"] .cm-hero-name{font-family:var(--font-display);font-size:2.4rem;}
[data-theme="storybook"] .cm-hero-birth{color:var(--clr-accent);}
[data-theme="storybook"] .cm-hero::before{content:'— ◆ —';display:block;color:var(--clr-border);font-size:.9rem;letter-spacing:12px;margin-bottom:24px;}
[data-theme="storybook"] .cm-hero::after{content:'— ◆ —';display:block;color:var(--clr-border);font-size:.9rem;letter-spacing:12px;margin-top:24px;}
[data-theme="storybook"] .cm-hero-tagline{font-family:var(--font-display);}
[data-theme="storybook"] .cm-section-header h2,[data-theme="storybook"] .cm-tree-header h2{font-family:var(--font-display);font-style:italic;}
/* polaroid rotation */
[data-theme="storybook"] .cm-photo-card:nth-child(odd){transform:rotate(.6deg);}
[data-theme="storybook"] .cm-photo-card:nth-child(even){transform:rotate(-.5deg);}
[data-theme="storybook"] .cm-photo-card{border-radius:2px;border-width:1px;}
[data-theme="storybook"] .cm-photo-card:hover{transform:rotate(0) scale(1.02) !important;}
[data-theme="storybook"] .cm-photo-img-wrap{padding:7px 7px 0;}
[data-theme="storybook"] .cm-hamburger{color:rgba(255,255,255,.7);}

/* ============================================================
   3. 🌊 OCEAN — deep teal & coral, bright coastal
   ============================================================ */
[data-theme="ocean"]{
  --font-display:'Josefin Sans',system-ui,sans-serif;
  --font-body:'Space Grotesk',system-ui,sans-serif;
  --clr-bg:#f0f9ff;--clr-bg2:#e8f6ff;--clr-sidebar:#0c4a6e;
  --clr-sidebar-border:#0a3d5c;
  --clr-primary:#0ea5e9;--clr-primary-light:#bae6fd;
  --clr-accent:#f97316;--clr-text:#0c2d48;--clr-text2:#1e5f85;--clr-text3:#7ab8d8;
  --clr-border:#bae6fd;--clr-card:#ffffff;
  --radius-sm:6px;--radius-md:10px;--radius-lg:16px;--radius-xl:20px;--radius-pill:6px;
}
[data-theme="ocean"] body{font-family:var(--font-body);background:var(--clr-bg);color:var(--clr-text);}
[data-theme="ocean"] body::before{content:'';position:fixed;inset:0;background:radial-gradient(ellipse 60% 40% at 50% 100%,rgba(14,165,233,.08),transparent 70%);pointer-events:none;z-index:0;}
[data-theme="ocean"] .cm-layout{position:relative;z-index:1;}
[data-theme="ocean"] .cm-sidebar{background:var(--clr-sidebar);border-right:2px solid var(--clr-sidebar-border);}
[data-theme="ocean"] .cm-sidebar-logo h2{font-family:var(--font-display);color:#bae6fd;letter-spacing:.06em;font-size:1.2rem;text-transform:uppercase;}
[data-theme="ocean"] .cm-sidebar-logo p{color:rgba(255,255,255,.35);font-size:.65rem;letter-spacing:.1em;text-transform:uppercase;}
[data-theme="ocean"] .cm-sidebar-section-label{color:rgba(255,255,255,.3);}
[data-theme="ocean"] .cm-sidebar-link,[data-theme="ocean"] .cm-nav-item{color:rgba(255,255,255,.55);}
[data-theme="ocean"] .cm-sidebar-link:hover,[data-theme="ocean"] .cm-nav-item:hover{background:rgba(14,165,233,.2);color:#bae6fd;}
[data-theme="ocean"] .cm-nav-item.active{background:rgba(14,165,233,.28);color:#bae6fd;border-left-color:#0ea5e9;}
[data-theme="ocean"] .cm-sidebar-footer{border-top-color:rgba(255,255,255,.1);}
[data-theme="ocean"] .cm-sidebar-footer .cm-btn--ghost{color:rgba(255,255,255,.55);border-color:rgba(255,255,255,.15);}
[data-theme="ocean"] .cm-sidebar-footer .cm-btn--ghost:hover{background:rgba(255,255,255,.1);color:#fff;}
[data-theme="ocean"] .cm-topbar{background:rgba(240,249,255,.9);backdrop-filter:blur(8px);border-bottom:2px solid var(--clr-border);}
[data-theme="ocean"] .cm-topbar-title{font-family:var(--font-display);letter-spacing:.08em;text-transform:uppercase;color:var(--clr-primary);font-size:.95rem;}
[data-theme="ocean"] .cm-hero-name{font-family:var(--font-display);font-size:2.4rem;letter-spacing:.04em;text-transform:uppercase;}
[data-theme="ocean"] .cm-hero-birth{color:var(--clr-accent);}
[data-theme="ocean"] .cm-hero::after{content:'~ ~ ~';display:block;color:var(--clr-primary-light);font-size:1.2rem;letter-spacing:10px;margin-top:10px;}
[data-theme="ocean"] .cm-section-card{border-radius:var(--radius-md);}
[data-theme="ocean"] .cm-stat-card{border-top:3px solid var(--clr-primary);}
[data-theme="ocean"] .cm-section-header h2,[data-theme="ocean"] .cm-tree-header h2{font-family:var(--font-display);letter-spacing:.04em;text-transform:uppercase;}
[data-theme="ocean"] .cm-hamburger{color:rgba(255,255,255,.7);}

/* ============================================================
   4. 🌙 MIDNIGHT — dark mode, starry deep blue, moonlit silver
   ============================================================ */
[data-theme="midnight"]{
  --font-display:'DM Serif Display',Georgia,serif;
  --font-body:'Space Grotesk',system-ui,sans-serif;
  --clr-bg:#0f172a;--clr-bg2:#1e293b;--clr-sidebar:#020617;
  --clr-sidebar-border:#1e293b;
  --clr-primary:#818cf8;--clr-primary-light:#1e1b4b;
  --clr-accent:#34d399;--clr-text:#e2e8f0;--clr-text2:#94a3b8;--clr-text3:#475569;
  --clr-border:#1e293b;--clr-card:#1e293b;
  --radius-sm:8px;--radius-md:12px;--radius-lg:18px;--radius-xl:24px;--radius-pill:50px;
}
[data-theme="midnight"] body{font-family:var(--font-body);background:var(--clr-bg);color:var(--clr-text);}
[data-theme="midnight"] body::before{content:'';position:fixed;inset:0;
  background-image:radial-gradient(1px 1px at 10% 20%,rgba(255,255,255,.8),transparent),
  radial-gradient(1px 1px at 30% 50%,rgba(255,255,255,.6),transparent),
  radial-gradient(2px 2px at 50% 10%,rgba(255,255,255,.7),transparent),
  radial-gradient(1px 1px at 70% 70%,rgba(255,255,255,.5),transparent),
  radial-gradient(1px 1px at 90% 30%,rgba(255,255,255,.8),transparent),
  radial-gradient(1px 1px at 15% 80%,rgba(255,255,255,.6),transparent),
  radial-gradient(2px 2px at 80% 90%,rgba(255,255,255,.4),transparent),
  radial-gradient(ellipse 50% 30% at 50% 0%,rgba(99,102,241,.12),transparent 70%);
  pointer-events:none;z-index:0;}
[data-theme="midnight"] .cm-layout{position:relative;z-index:1;}
[data-theme="midnight"] .cm-sidebar{background:var(--clr-sidebar);border-right:1px solid var(--clr-border);}
[data-theme="midnight"] .cm-sidebar-logo h2{font-family:var(--font-display);color:var(--clr-primary);font-size:1.3rem;font-style:italic;}
[data-theme="midnight"] .cm-sidebar-logo p{color:var(--clr-text3);font-size:.65rem;letter-spacing:.1em;text-transform:uppercase;}
[data-theme="midnight"] .cm-sidebar-section-label{color:var(--clr-text3);}
[data-theme="midnight"] .cm-sidebar-link,[data-theme="midnight"] .cm-nav-item{color:var(--clr-text2);}
[data-theme="midnight"] .cm-sidebar-link:hover,[data-theme="midnight"] .cm-nav-item:hover{background:rgba(129,140,248,.12);color:var(--clr-primary);}
[data-theme="midnight"] .cm-nav-item.active{background:rgba(129,140,248,.18);color:var(--clr-primary);border-left-color:var(--clr-primary);}
[data-theme="midnight"] .cm-sidebar-footer{border-top-color:var(--clr-border);}
[data-theme="midnight"] .cm-topbar{background:rgba(15,23,42,.85);backdrop-filter:blur(10px);border-bottom:1px solid var(--clr-border);}
[data-theme="midnight"] .cm-topbar-title{font-family:var(--font-display);font-style:italic;color:var(--clr-primary);font-size:1.05rem;}
[data-theme="midnight"] .cm-hero-name{font-family:var(--font-display);font-size:2.5rem;font-style:italic;}
[data-theme="midnight"] .cm-hero-birth{color:var(--clr-accent);}
[data-theme="midnight"] .cm-hero::after{content:'✦  ·  ✦  ·  ✦';display:block;color:rgba(129,140,248,.4);font-size:1rem;letter-spacing:8px;margin-top:10px;}
[data-theme="midnight"] .cm-photo-card{box-shadow:0 0 0 1px rgba(129,140,248,.15);}
[data-theme="midnight"] .cm-photo-card:hover{box-shadow:0 0 16px rgba(129,140,248,.2),0 0 0 1px rgba(129,140,248,.3);}
[data-theme="midnight"] .cm-section-card-bg{opacity:.55;}
[data-theme="midnight"] .cm-stat-card{background:var(--clr-bg2);}
[data-theme="midnight"] .cm-section-header h2,[data-theme="midnight"] .cm-tree-header h2{font-family:var(--font-display);font-style:italic;}
[data-theme="midnight"] .cm-hero-avatar{box-shadow:0 0 0 3px var(--clr-primary-light),0 0 20px rgba(129,140,248,.3);}
[data-theme="midnight"] .cm-hamburger{color:var(--clr-text2);}
[data-theme="midnight"] .cm-input,[data-theme="midnight"] .cm-textarea{background:var(--clr-bg);border-color:var(--clr-border);color:var(--clr-text);}
[data-theme="midnight"] .cm-modal{background:var(--clr-bg2);}
[data-theme="midnight"] .cm-tree-generation{background:var(--clr-bg2);}
[data-theme="midnight"] .cm-tree-node{background:var(--clr-bg);}
[data-theme="midnight"] .cm-tree-gen-child{background:var(--clr-primary-light);border-color:var(--clr-primary);}

/* ============================================================
   5. 🌿 MEADOW — earthy greens, warm cream, botanical
   ============================================================ */
[data-theme="meadow"]{
  --font-display:'Fraunces',Georgia,serif;
  --font-body:'Nunito',system-ui,sans-serif;
  --clr-bg:#f7f5ef;--clr-bg2:#efeee6;--clr-sidebar:#2d4a22;
  --clr-sidebar-border:#1e3316;
  --clr-primary:#4a7c3f;--clr-primary-light:#d4edcc;
  --clr-accent:#c47c3a;--clr-text:#1e2d1a;--clr-text2:#4a6040;--clr-text3:#8aaa78;
  --clr-border:#d4e8cc;--clr-card:#fdfcf8;
  --radius-sm:8px;--radius-md:12px;--radius-lg:18px;--radius-xl:26px;--radius-pill:50px;
}
[data-theme="meadow"] body{font-family:var(--font-body);background:var(--clr-bg);color:var(--clr-text);}
[data-theme="meadow"] body::before{content:'';position:fixed;inset:0;
  background:radial-gradient(ellipse 40% 60% at 5% 50%,rgba(74,124,63,.06),transparent 70%),
  radial-gradient(ellipse 30% 50% at 95% 20%,rgba(196,124,58,.05),transparent 70%);
  pointer-events:none;z-index:0;}
[data-theme="meadow"] .cm-layout{position:relative;z-index:1;}
[data-theme="meadow"] .cm-sidebar{background:var(--clr-sidebar);border-right:3px solid var(--clr-sidebar-border);}
[data-theme="meadow"] .cm-sidebar-logo h2{font-family:var(--font-display);color:#d4edcc;font-style:italic;font-size:1.3rem;}
[data-theme="meadow"] .cm-sidebar-logo p{color:rgba(255,255,255,.35);font-size:.65rem;letter-spacing:.09em;text-transform:uppercase;}
[data-theme="meadow"] .cm-sidebar-section-label{color:rgba(255,255,255,.3);}
[data-theme="meadow"] .cm-sidebar-link,[data-theme="meadow"] .cm-nav-item{color:rgba(255,255,255,.6);}
[data-theme="meadow"] .cm-sidebar-link:hover,[data-theme="meadow"] .cm-nav-item:hover{background:rgba(74,124,63,.25);color:#d4edcc;}
[data-theme="meadow"] .cm-nav-item.active{background:rgba(74,124,63,.35);color:#d4edcc;border-left-color:#7bc87e;}
[data-theme="meadow"] .cm-sidebar-footer{border-top-color:rgba(255,255,255,.1);}
[data-theme="meadow"] .cm-sidebar-footer .cm-btn--ghost{color:rgba(255,255,255,.55);border-color:rgba(255,255,255,.15);}
[data-theme="meadow"] .cm-sidebar-footer .cm-btn--ghost:hover{background:rgba(255,255,255,.1);color:#fff;}
[data-theme="meadow"] .cm-topbar{background:rgba(247,245,239,.9);backdrop-filter:blur(8px);border-bottom:1.5px solid var(--clr-border);}
[data-theme="meadow"] .cm-topbar-title{font-family:var(--font-display);font-style:italic;color:var(--clr-primary);font-size:1.05rem;}
[data-theme="meadow"] .cm-hero-name{font-family:var(--font-display);font-size:2.4rem;font-style:italic;}
[data-theme="meadow"] .cm-hero-birth{color:var(--clr-accent);}
[data-theme="meadow"] .cm-hero::before{content:'❧';display:block;color:var(--clr-primary-light);font-size:2rem;margin-bottom:12px;}
[data-theme="meadow"] .cm-hero::after{content:'❧';display:block;color:var(--clr-primary-light);font-size:2rem;margin-top:14px;}
[data-theme="meadow"] .cm-hero-tagline{font-family:var(--font-display);}
[data-theme="meadow"] .cm-section-header h2,[data-theme="meadow"] .cm-tree-header h2{font-family:var(--font-display);font-style:italic;}
[data-theme="meadow"] .cm-stat-card{border-top:3px solid var(--clr-primary);}
[data-theme="meadow"] .cm-hamburger{color:rgba(255,255,255,.7);}