:root {
    --ideas-bg-1: #fefeff;
    --ideas-bg-2: #eef5ff;
    --ideas-bg-3: #e2ecfa;
    --ideas-card: #ffffff;
    --ideas-card-alt: #f5f9ff;
    --ideas-ink: #1b2838;
    --ideas-muted: #5b6b7f;
    --ideas-border: #cdd7e3;
    --ideas-border-strong: #9fb1c7;
    --ideas-accent: #b3ccf8;
    --ideas-accent-hover: #91b5f3;
    --ideas-titlebar: linear-gradient(90deg, #d1e2ff, #e7effa);
    --ideas-input-bg: #fdfdff;
}

.theme-dark {
    --ideas-bg-1: #0f0f0f;
    --ideas-bg-2: #1a1a1a;
    --ideas-bg-3: #1f1f1f;
    --ideas-card: #1f1f1f;
    --ideas-card-alt: #262626;
    --ideas-ink: #e8eef5;
    --ideas-muted: #9aa5b5;
    --ideas-border: #3a3a3a;
    --ideas-border-strong: #2a2a2a;
    --ideas-accent: #64b5f6;
    --ideas-accent-hover: #42a5f5;
    --ideas-titlebar: linear-gradient(90deg, #2a3139, #1f262e);
    --ideas-input-bg: #262626;
}

.theme-midnight {
    --ideas-bg-1: #0a1428;
    --ideas-bg-2: #0f1f2f;
    --ideas-bg-3: #112840;
    --ideas-card: #1a2a3a;
    --ideas-card-alt: #1b3a52;
    --ideas-ink: #d4e6f5;
    --ideas-muted: #7a9ab8;
    --ideas-border: #2a4560;
    --ideas-border-strong: #1f3448;
    --ideas-accent: #64b5f6;
    --ideas-accent-hover: #42a5f5;
    --ideas-titlebar: linear-gradient(90deg, #1b3a52, #112840);
    --ideas-input-bg: #1b3a52;
}

.theme-sunset {
    --ideas-bg-1: #ffecd1;
    --ideas-bg-2: #ffd4a3;
    --ideas-bg-3: #ffb86f;
    --ideas-card: #fff7ef;
    --ideas-card-alt: #fff2e6;
    --ideas-ink: #3d2817;
    --ideas-muted: #5a4027;
    --ideas-border: #d4a373;
    --ideas-border-strong: #b8885a;
    --ideas-accent: #ffb86f;
    --ideas-accent-hover: #ff9f5a;
    --ideas-titlebar: linear-gradient(90deg, #ffd4a3, #ffb86f);
    --ideas-input-bg: #fff7ef;
}

.theme-forest {
    --ideas-bg-1: #d4e8d4;
    --ideas-bg-2: #a8c9a7;
    --ideas-bg-3: #8fb58e;
    --ideas-card: #f3fbf3;
    --ideas-card-alt: #eef8ee;
    --ideas-ink: #1f3a1e;
    --ideas-muted: #2d4a2c;
    --ideas-border: #5a7c59;
    --ideas-border-strong: #486246;
    --ideas-accent: #8fb58e;
    --ideas-accent-hover: #6a9a69;
    --ideas-titlebar: linear-gradient(90deg, #a8c9a7, #8fb58e);
    --ideas-input-bg: #f3fbf3;
}

.theme-purple {
    --ideas-bg-1: #f3e5f5;
    --ideas-bg-2: #d1c4e9;
    --ideas-bg-3: #b39ddb;
    --ideas-card: #fbf7fd;
    --ideas-card-alt: #f6eefb;
    --ideas-ink: #311b92;
    --ideas-muted: #6a4c93;
    --ideas-border: #9575cd;
    --ideas-border-strong: #7e57c2;
    --ideas-accent: #b39ddb;
    --ideas-accent-hover: #9575cd;
    --ideas-titlebar: linear-gradient(90deg, #d1c4e9, #b39ddb);
    --ideas-input-bg: #fbf7fd;
}

.ideas-window { position:relative; background:linear-gradient(180deg, var(--ideas-bg-1), var(--ideas-bg-2) 72%, var(--ideas-bg-3)); border:1px solid var(--ideas-border); border-bottom:2px solid var(--ideas-border-strong); border-radius:12px; box-shadow:0 3px 0 var(--ideas-border-strong), 0 0 0 4px rgba(255,255,255,0.05) inset; overflow:hidden; width:calc(100% - 24px); max-width:840px; min-width:280px; margin:0 auto 40px; }
.ideas-window-titlebar { display:flex; align-items:center; justify-content:center; gap:10px; padding:8px 12px 6px; background:var(--ideas-titlebar); border-bottom:1px solid var(--ideas-border); box-shadow:0 1px 0 var(--ideas-border-strong); }
.ideas-window .window-title { font-size:0.85rem; font-weight:600; letter-spacing:0.5px; text-transform:uppercase; color:var(--ideas-ink); font-family:'Comic Sans MS','Patrick Hand',cursive; }
.ideas-window .ideas-wall-head { padding:8px 14px 4px; }
.ideas-window .ideas-scroll { padding:10px 14px 14px; }


.ideas-page header { display:flex; justify-content:center; }
.ideas-page header .button-tray { margin:0 auto; justify-content:center; width:fit-content; max-width:calc(100% - 24px); }
.ideas-page main {
  position: static;
  width: 100%;
  height: auto;
  overflow: visible;
}
.ideas-main {
  width:100%;
  max-width: 980px;
  margin: 0 auto 48px;
  padding: var(--ideas-offset, 76px) 24px 48px; 
  display: flex;
  flex-direction: column;
  align-items: center;
  box-sizing: border-box;
  transition: padding-top 0.25s ease;
}
.ideas-main > section { width:calc(100% - 24px); max-width:840px; min-width:280px; margin-left:auto; margin-right:auto; }
.ideas-page .ideas-header-tray { justify-content: center; margin: 0 auto; }
.ideas-page .ideas-header-tray .button-group.nav { min-width: 260px; justify-content: center; }

/* Idea Wall */
.ideas-wall-head { margin-bottom: 12px; }
.ideas-wall-head { text-align: center; max-width: 840px; margin-left:auto; margin-right:auto; }
.ideas-wall-head h2 { margin: 0 0 6px; font-family: 'Comic Sans MS','Patrick Hand',cursive; letter-spacing:0.5px; font-size:1.6rem; }
.ideas-wall-head .wall-sub { margin:0 0 10px; font-size:0.85rem; opacity:0.85; }
.wall-filters { display:flex; gap:6px; flex-wrap:wrap; justify-content:center; }
.filter-btn { padding:6px 10px; font-size:0.7rem; text-transform:uppercase; letter-spacing:0.6px; background:var(--ideas-card); color:var(--ideas-ink); border:1px solid var(--ideas-border); border-bottom-color: var(--ideas-border-strong); border-radius:6px; cursor:pointer; box-shadow:0 2px 0 var(--ideas-border-strong); }
.filter-btn.active { background:var(--ideas-card-alt); border-color:var(--ideas-accent); }
.filter-btn:hover { background:var(--ideas-card-alt); }
.ideas-scroll { max-height: 460px; width:calc(100% - 12px); max-width:840px; overflow-y:auto; padding:6px 4px 8px 6px; scrollbar-width:thin; box-sizing:border-box; margin-left:auto; margin-right:auto; }
.ideas-scroll::-webkit-scrollbar { width:10px; }
.ideas-scroll::-webkit-scrollbar-track { background: var(--ideas-bg-2); border-radius:8px; }
.ideas-scroll::-webkit-scrollbar-thumb { background:var(--ideas-accent); border-radius:8px; }
.ideas-scroll::-webkit-scrollbar-thumb:hover { background:var(--ideas-accent-hover); }
.ideas-form-section .feedback-form label { display:block; margin-top:12px; font-weight:600; }
.ideas-feed .idea-item { border-bottom: 1px solid rgba(0,0,0,0.06); padding:12px 0; }
.ideas-feed .muted { color:var(--ideas-muted); font-size:12px; }
.idea-status { margin-top:12px; }
.idea-status.success { color: var(--ideas-accent-hover); }
.idea-status.error { color: var(--ideas-muted); }

/* Mild y2k accent for idea items */
.idea-item .idea-header strong { font-family: 'Comic Sans MS', 'Patrick Hand', cursive; }
.idea-item { background: linear-gradient(180deg, var(--ideas-card), var(--ideas-card-alt)); border-radius:6px; padding:10px 14px; box-shadow:0 2px 0 var(--ideas-border-strong); margin-bottom:12px; color:var(--ideas-ink); }
.idea-item .idea-type { font-size:11px; text-transform:uppercase; letter-spacing:0.5px; color:var(--ideas-muted); margin-top:4px; }
.idea-item .idea-body { margin:8px 0 4px; line-height:1.3; font-size:0.9rem; }

/* Voting UI */
.idea-vote { display:flex; align-items:center; gap:6px; margin:8px 0 0; }
.vote-btn { background:transparent; border:none; padding:4px; cursor:pointer; display:inline-flex; align-items:center; justify-content:center; border-radius:6px; }
.vote-btn img { width:26px; height:26px; display:block; }
.vote-count { font-weight:700; min-width:30px; text-align:center; }
.vote-btn.voted-up img { filter: drop-shadow(0 1px 0 rgba(0,0,0,0.08)) saturate(120%); }
.vote-btn.voted-up { color: var(--ideas-accent-hover); }
.vote-btn.voted-down { color: var(--ideas-muted); }
.vote-btn.voted-up img { filter: hue-rotate(80deg) saturate(150%); }
.vote-btn.voted-down img { filter: hue-rotate(-20deg) saturate(150%); }

/* Submission form */
.ideas-submit { margin-top: 46px; width:calc(100% - 24px); max-width:840px; min-width:280px; margin-left:auto; margin-right:auto; }
.idea-form { background:var(--ideas-card); color:var(--ideas-ink); border:1px solid var(--ideas-border); border-bottom-color: var(--ideas-border-strong); border-radius:12px; padding:22px 22px 26px; box-shadow:0 2px 0 var(--ideas-border-strong); }
.ideas-submit-window .idea-form { background:transparent; border:none; box-shadow:none; padding:14px 18px 20px; }
.ideas-submit-window .idea-form .field-row label { font-weight:600; color:var(--ideas-ink); }
.ideas-submit-window .idea-form input,
.ideas-submit-window .idea-form select,
.ideas-submit-window .idea-form textarea { background:var(--ideas-input-bg); color:var(--ideas-ink); }
.idea-form h3 { margin-top:0; font-family:'Comic Sans MS','Patrick Hand',cursive; }
.idea-form .field-row { margin-bottom:12px; display:flex; flex-direction:column; gap:6px; }
.idea-form input,.idea-form select,.idea-form textarea { padding:10px 12px; border:1px solid var(--ideas-border); border-radius:6px; font-family:inherit; font-size:0.9rem; background:var(--ideas-input-bg); color:var(--ideas-ink); transition:all 0.15s; }
.idea-form input:focus,.idea-form select:focus,.idea-form textarea:focus { border-color:var(--ideas-accent); outline:none; box-shadow:0 0 0 2px rgba(179,204,248,0.1); }
.idea-form textarea { min-height:120px; resize:vertical; }
.ideas-actions { display:flex; gap:12px; flex-wrap:wrap; margin-top:6px; justify-content:center; }
.ideas-actions .primary { background:var(--ideas-card); color:var(--ideas-ink); border:1px solid var(--ideas-border); border-bottom-color: var(--ideas-border-strong); border-radius:6px; padding:8px 16px; box-shadow:0 2px 0 var(--ideas-border-strong); cursor:pointer; font-weight:600; transition:all 0.15s; }
.ideas-actions .primary:hover { background:var(--ideas-card-alt); border-color:var(--ideas-border-strong); }
.ideas-actions .secondary { background:var(--ideas-card-alt); color:var(--ideas-ink); border:1px solid var(--ideas-border); border-radius:6px; padding:8px 16px; cursor:pointer; font-weight:600; transition:all 0.15s; }
.ideas-actions .secondary:hover { background:var(--ideas-card); border-color:var(--ideas-border-strong); }