/* Minimal “WoW-like” vibe: dark stone bg, gold accents, parchment cards */
:root{
  --bg:#0b0f14;
  --panel:#161c22;
  --card:#1c242c;
  --gold:#c9a227;
  --text:#d7e0ea;
  --muted:#9bb0c3;
  --accent:#2e5266;
}
*{box-sizing:border-box}
body.wow-bg{margin:0;background:linear-gradient(180deg,#0b0f14,#0a0e12);color:var(--text);font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif}
.container{max-width:1100px;margin:0 auto;padding:16px}
.wow-header{background:linear-gradient(180deg,#0c1218,#0a0f14);border-bottom:1px solid #0e151b;position:sticky;top:0;z-index:10}
.wow-header .brand{color:var(--gold);text-decoration:none;font-weight:700;margin-right:16px}
.wow-header nav{gap:12px;align-items:center}
.burger{display:none;background:#0e151b;color:#d7e0ea;border:1px solid #22303b;border-radius:10px;padding:6px 10px;cursor:pointer;margin-right:8px}
.nav-links{display:flex;gap:12px;align-items:center}
.menu-group{position:relative;display:none}
.menu-group .dropdown{display:none;position:absolute;top:calc(100% + 6px);left:0;background:#1c242c;border:1px solid #24323d;border-radius:10px;box-shadow:0 8px 24px rgba(0,0,0,.35);padding:8px;min-width:180px;z-index:20}
.menu-group .dropdown a{display:block;color:#d7e0ea;text-decoration:none;padding:6px 8px;border-radius:8px}
.menu-group .dropdown a:hover{background:#0f151b}
.menu-group .dropdown.open{display:block}
.wow-header nav a{color:var(--muted);text-decoration:none}
.wow-header .btn{background:var(--gold);color:#111;padding:8px 12px;border-radius:10px;text-decoration:none;font-weight:700}
.user{padding-left:8px}
.wow-footer{opacity:.7;border-top:1px solid #0e151b;margin-top:40px}
h1,h2{color:var(--gold);text-shadow:0 0 6px rgba(201,162,39,.25)}
.panel{background:var(--panel);border:1px solid #22303b;border-radius:14px;padding:16px;margin:18px 0;box-shadow:0 8px 24px rgba(0,0,0,.25)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px}
.card{background:var(--card);border:1px solid #24323d;border-radius:14px;padding:12px;box-shadow:inset 0 0 0 1px rgba(201,162,39,.08)}
.card-title{font-weight:800;color:#f0d58a}
.card-desc{color:var(--muted);font-size:.95rem;margin:4px 0 8px}
.card-disabled{opacity:.5;filter:grayscale(1)}
.meter{height:10px;background:#0f151b;border-radius:8px;overflow:hidden;border:1px solid #20303b}
.meter .bar{height:100%;background:linear-gradient(90deg,#715b15,#c9a227);width:40%}
.meter .bar.full{width:100%}
.meter .bar{transition:width .35s ease}
.meta{font-size:.9rem;color:#bcd}
.form .field{margin:10px 0}
.form input, .form select, .form textarea{width:100%;padding:8px;border-radius:10px;border:1px solid #2a3945;background:#0d141a;color:var(--text)}
.form textarea{min-height:110px;resize:vertical}
.form input::placeholder, .form textarea::placeholder{color:#7c93a6}
.form input:focus, .form select:focus, .form textarea:focus{outline:none;border-color:#3a5161;box-shadow:0 0 0 3px rgba(201,162,39,.15)}
.form input[readonly], .form select[disabled], .form textarea[readonly]{opacity:.9;background:#0b1217;color:#9bb0c3}

/* Global fallback: ensure all fields in dark theme are styled, even outside .form */
body.wow-bg textarea,
body.wow-bg select,
body.wow-bg input[type="text"],
body.wow-bg input[type="email"],
body.wow-bg input[type="password"],
body.wow-bg input[type="number"],
body.wow-bg input[type="url"],
body.wow-bg input[type="search"],
body.wow-bg input[type="file"]{
  background:#0d141a;
  color:var(--text);
  border:1px solid #2a3945;
  border-radius:10px;
}
body.wow-bg textarea:focus,
body.wow-bg select:focus,
body.wow-bg input:focus{outline:none;border-color:#3a5161;box-shadow:0 0 0 3px rgba(201,162,39,.15)}
.form .btn{background:var(--gold);color:#111;padding:10px 14px;border-radius:12px;border:none}
.flash{background:#11321a;border:1px solid #1b5a2a;padding:8px;border-radius:10px;margin:12px 0}
.list{display:flex;flex-direction:column;gap:10px}
.list-item{display:flex;gap:12px;align-items:center;background:var(--panel);padding:10px;border-radius:10px;border:1px solid #22303b}
.when{min-width:140px;color:#a6c1d4}
.notes{opacity:.9;color:#cfe6f5}


.icon-circle{width:44px;height:44px;border-radius:50%;background:#0f151b;border:2px solid #c9a227;display:inline-block;background-size:cover;background-position:center;margin-right:8px;vertical-align:middle}
.badges{display:flex;gap:6px;margin-top:6px;flex-wrap:wrap}
.badge{display:inline-flex;align-items:center;gap:6px;padding:4px 8px;border-radius:999px;border:1px solid #24323d;background:#10171d;color:#f4e7b0;font-size:.8rem}
.badge img{width:16px;height:16px;display:block}
.filters{display:flex;gap:10px;align-items:flex-end;margin:8px 0 16px}
.filters .field{margin:0;min-width:180px}
.filters .field select, .filters .field input{padding:8px;border-radius:10px;border:1px solid #2a3945;background:#0d141a;color:var(--text);width:100%}
.filters .btn{height:36px}
.table{width:100%;border-collapse:collapse}
.table th,.table td{border-bottom:1px solid #22303b;padding:8px;text-align:left}
.privacy-note{font-size:.9rem;color:#9bb0c3;margin:4px 0 10px}

/* Small green + button for quick increment */
.btn-green{background:#2ea043;color:#111;padding:6px 10px;border-radius:999px;border:1px solid #2b7a34;cursor:pointer;font-weight:800}
.btn-green:hover{filter:brightness(1.05)}
.btn-green[disabled]{opacity:.6;cursor:not-allowed;filter:none}
.btn-small{font-size:.9rem;line-height:1}
.card-title{display:flex;align-items:center;gap:6px}
.card-title .actions{margin-left:auto;display:flex;align-items:center}
.card-title .actions form{display:inline}
.card-title .actions .btn-green{min-width:26px;min-height:26px;padding:4px 8px}

/* Tiny success animation */
@keyframes bump{0%{transform:scale(1)}30%{transform:scale(1.18)}100%{transform:scale(1)}}
.bump-animate{animation:bump .28s ease}

/* ---------------------- Responsive Tweaks ---------------------- */
@media (max-width: 768px){
  .container{padding:12px}
  .wow-header .brand{display:block;margin:0 0 8px 0;font-size:1rem}
  .burger{display:inline-block}
  .wow-header nav{flex-wrap:wrap;gap:8px}
  .nav-links{display:none;flex-direction:column;align-items:flex-start;background:linear-gradient(180deg,#0c1218,#0a0f14);border:1px solid #0e151b;border-radius:12px;padding:10px;margin-top:8px}
  .nav-links.open{display:flex}
  .wow-header nav a{white-space:nowrap;font-size:.95rem}
  .is-desktop-only{display:none}
  .menu-group{display:block}

  .grid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}
  .icon-circle{width:36px;height:36px}
  .card-title{font-size:1rem}
  .meter{height:8px}

  .filters{flex-direction:column;align-items:stretch}
  .filters .field{min-width:100%}
  .filters .btn{width:100%}

  .badge{font-size:.75rem}
  .list-item{padding:8px}
  .card{padding:10px}

  /* Bigger touch target for + button on mobile */
  .card-title .actions .btn-green{min-width:36px;min-height:36px;padding:6px 10px}
}

@media (max-width: 420px){
  .grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}
  .wow-header nav{gap:6px}
}