*{margin:0;padding:0;box-sizing:border-box;font-family:'Prompt',sans-serif}
:root{
  --primary:#1e63d7;
  --primary-deep:#0b3d91;
  --gold:#d4af37;
  --gold-light:#f3d36a;
  --dark:#05070b;
  --page-bg:#05070b;
  --text:#f8fafc;
  --text-soft:#cbd5e1;
  --muted:#94a3b8;
  --card-bg:#0a1220;
  --card-soft:#101c31;
  --line:rgba(243,211,106,.18);
  --input-bg:#0f172a;
  --shadow:0 22px 70px rgba(0,0,0,.40);
}
body.light-mode{
  --primary:#0b3d91;
  --primary-deep:#082d6b;
  --gold:#d4af37;
  --gold-light:#f3d36a;
  --dark:#071a33;
  --page-bg:#f4f8ff;
  --text:#071a33;
  --text-soft:#475569;
  --muted:#64748b;
  --card-bg:#ffffff;
  --card-soft:#f8fafc;
  --line:#dbe7f5;
  --input-bg:#ffffff;
  --shadow:0 18px 55px rgba(11,61,145,.10);
}
body{background:var(--page-bg);color:var(--text);min-height:100vh;transition:background .25s,color .25s}
.login-body{display:grid;place-items:center;background:linear-gradient(135deg,#000000,#0b3d91,#d4af37);padding:20px}
.login-card{width:min(440px,100%);background:var(--card-bg);padding:34px;border-radius:34px;box-shadow:var(--shadow);border:1px solid var(--line)}
.login-logo{width:62px;height:62px;border-radius:22px;background:linear-gradient(135deg,#f3d36a,#d4af37);display:grid;place-items:center;font-weight:900;margin-bottom:18px;box-shadow:0 14px 35px rgba(212,175,55,.28);color:#05070b}
.login-card h1{font-size:1.9rem;margin-bottom:8px;color:var(--text)}
.login-card p{color:var(--text-soft);line-height:1.7;margin-bottom:18px}
label{display:block;font-weight:700;margin:13px 0 7px;color:var(--text-soft)}
input,textarea{width:100%;border:1px solid var(--line);background:var(--input-bg);color:var(--text);border-radius:16px;padding:13px 14px;font-size:.95rem;outline:none}
textarea{min-height:104px;resize:vertical}
input:focus,textarea:focus{border-color:var(--gold);box-shadow:0 0 0 4px rgba(212,175,55,.12)}
.login-card button,.save-btn,.new-btn,.cancel-btn,.theme-toggle-admin{border:0;border-radius:16px;padding:13px 18px;font-weight:800;text-decoration:none;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:.22s}
.login-card button,.save-btn,.new-btn{background:linear-gradient(135deg,#f3d36a,#d4af37);color:#05070b;box-shadow:0 14px 35px rgba(212,175,55,.22)}
.cancel-btn,.theme-toggle-admin{background:var(--card-soft);color:var(--text);border:1px solid var(--line)}
.login-card button{width:100%;margin-top:18px}
.back-link{display:inline-block;margin-top:16px;color:var(--gold);text-decoration:none;font-weight:700}
body.light-mode .back-link{color:var(--primary)}
.alert{padding:13px 16px;border-radius:18px;margin-bottom:18px;font-weight:700}
.alert.error{background:#fee2e2;color:#991b1b;border:1px solid #fecaca}
.alert.success{background:#dcfce7;color:#166534;border:1px solid #bbf7d0}
.sidebar{position:fixed;left:0;top:0;bottom:0;width:280px;background:linear-gradient(180deg,#000000,#071a33,#0b3d91);color:#fff;padding:24px;display:flex;flex-direction:column;gap:12px;border-right:1px solid rgba(243,211,106,.24)}
.brand{display:flex;gap:12px;align-items:center;margin-bottom:20px}
.brand span{width:50px;height:50px;border-radius:18px;background:linear-gradient(135deg,#f3d36a,#d4af37);color:#05070b;font-weight:900;display:grid;place-items:center;box-shadow:0 14px 35px rgba(212,175,55,.28)}
.brand strong{display:block}
.brand small{color:#cbd5e1}
.side-link{color:#cbd5e1;text-decoration:none;padding:13px 15px;border-radius:16px;font-weight:700;transition:.2s}
.side-link:hover,.side-link.active{background:rgba(212,175,55,.14);color:#f3d36a}
.side-link.logout{margin-top:auto;color:#fff0bb}
.admin-main{margin-left:280px;padding:30px}
.topbar{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-bottom:22px}
.top-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.topbar h1{font-size:clamp(1.8rem,4vw,3rem);color:var(--text)}
.topbar p{color:var(--text-soft);margin-top:5px}
.dashboard-grid{display:grid;grid-template-columns:minmax(420px,1fr) minmax(380px,.9fr);gap:22px}
.panel{background:var(--card-bg);border:1px solid var(--line);border-radius:30px;padding:24px;box-shadow:var(--shadow)}
.panel h2{margin-bottom:16px;color:var(--text)}
.form-row.two{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.checkbox{display:flex;align-items:center;gap:10px;margin-top:15px}
.checkbox input{width:auto}
.form-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}
.image-preview{margin-top:12px}
.image-preview img{width:180px;height:120px;object-fit:cover;border-radius:18px;border:1px solid var(--line)}
.course-list-admin{display:grid;gap:14px;max-height:78vh;overflow:auto;padding-right:5px}
.admin-course-card{display:grid;grid-template-columns:88px 1fr auto;gap:13px;align-items:center;border:1px solid var(--line);border-radius:22px;padding:12px;background:var(--card-soft);box-shadow:0 12px 30px rgba(0,0,0,.18);transition:.2s}
body.light-mode .admin-course-card{box-shadow:0 12px 30px rgba(11,61,145,.06)}
.admin-course-card:hover{border-color:rgba(212,175,55,.7);box-shadow:0 18px 45px rgba(0,0,0,.20)}
.admin-course-card img{width:88px;height:68px;object-fit:cover;border-radius:16px}
.admin-course-info strong{display:block;color:var(--text)}
.admin-course-info span,.admin-course-info small{display:block;color:var(--text-soft);font-size:.86rem;margin-top:3px}
.admin-course-actions{display:flex;flex-direction:column;gap:8px}
.admin-course-actions a,.admin-course-actions button{border:0;border-radius:12px;padding:9px 12px;text-decoration:none;font-weight:800;cursor:pointer;text-align:center}
.admin-course-actions a{background:rgba(30,99,215,.18);color:#bfdbfe}
body.light-mode .admin-course-actions a{background:#edf4ff;color:#0b3d91}
.admin-course-actions button{background:#fff4cc;color:#7a5200}
.empty{background:var(--card-soft);border:1px dashed var(--line);border-radius:18px;padding:24px;color:var(--text-soft)}
@media(max-width:1100px){.sidebar{position:static;width:auto}.admin-main{margin-left:0}.dashboard-grid{grid-template-columns:1fr}}
@media(max-width:700px){.admin-main{padding:16px}.topbar,.form-row.two{grid-template-columns:1fr;display:grid}.admin-course-card{grid-template-columns:72px 1fr}.admin-course-actions{grid-column:1/-1;flex-direction:row}.panel{padding:16px;border-radius:24px}}


.field-note{
  display:block;
  color:var(--text-soft);
  margin-top:7px;
  font-size:.86rem;
  line-height:1.5;
}

.top-actions{
  display:flex;
  gap:10px;
  align-items:center;
  flex-wrap:wrap;
}


/* Better image preview visibility in admin */
.image-preview img{
  object-fit:contain;
  background:#0f172a;
  padding:6px;
}

body.light-mode .image-preview img{
  background:#f8fafc;
}

.admin-course-card img{
  object-fit:contain;
  background:#0f172a;
  padding:4px;
}

body.light-mode .admin-course-card img{
  background:#f8fafc;
}