/* ============================================================
   PADEL BY THE 8 — Admin theme (light, aksen #5A5D42)
   Dimuat hanya di halaman admin / login admin (body.admin-body).
   ============================================================ */

body.admin-body {
  background: #F7F8FA;
  color: #1A1D20;
  font-family: "Plus Jakarta Sans", "Segoe UI", system-ui, -apple-system, sans-serif;
  -webkit-font-smoothing: antialiased;
}
body.admin-body ::selection { background: #D9DABF; color: #3F422F; }

/* Thin scrollbar */
body.admin-body, body.admin-body * { scrollbar-width: thin; scrollbar-color: #E2E8F0 transparent; }
body.admin-body ::-webkit-scrollbar { width: 6px; height: 6px; }
body.admin-body ::-webkit-scrollbar-track { background: transparent; }
body.admin-body ::-webkit-scrollbar-thumb { background: #E2E8F0; border-radius: 10px; }
body.admin-body ::-webkit-scrollbar-thumb:hover { background: #CBD5E1; }

/* ---------- Typography ---------- */
body.admin-body h1, body.admin-body h2, body.admin-body h3, body.admin-body h4 { color: #1A1D20; }
body.admin-body h2 { font-size: 1.05rem; }
body.admin-body h3 { font-size: 1rem; }
body.admin-body h4 { font-size: .95rem; }
body.admin-body strong { font-weight: 700; }
body.admin-body .muted, body.admin-body .empty, body.admin-body .auth-hint { color: #8A94A6; }
body.admin-body a { color: #5A5D42; }
body.admin-body a:hover { color: #3F422F; }
body.admin-body code {
  background: #EEF0E3; color: #3F422F; padding: .1rem .4rem;
  border-radius: 6px; font-size: .85em;
}

/* ---------- Cards ---------- */
body.admin-body .card {
  background: #fff;
  border: 1px solid #F0F1F3;
  border-radius: 14px;
  box-shadow: 0 1px 2px rgba(16,24,40,.04), 0 10px 22px -12px rgba(16,24,40,.07);
  padding: 1.2rem;
}
body.admin-body .table-wrap.card { padding: 0; }

/* ---------- Buttons ---------- */
body.admin-body .btn { border-radius: 9px; font-size: .92rem; padding: .55rem 1rem; }
body.admin-body .btn-sm { font-size: .82rem; padding: .34rem .65rem; }
body.admin-body .btn-lg { font-size: .95rem; padding: .7rem 1.4rem; }
body.admin-body .btn-primary {
  background-image: linear-gradient(135deg, #6B6F50, #5A5D42);
  border: none; color: #fff; text-shadow: none;
  box-shadow: 0 6px 16px -6px rgba(90,93,66,.5);
}
body.admin-body .btn-primary:hover {
  background-image: linear-gradient(135deg, #7A7E5C, #63674A);
  color: #fff; transform: translateY(-1px);
  box-shadow: 0 10px 22px -8px rgba(90,93,66,.55);
}
body.admin-body .btn-outline { border: 1px solid rgba(90,93,66,.55); color: #5A5D42; background: transparent; }
body.admin-body .btn-outline:hover { background: rgba(90,93,66,.07); color: #3F422F; }
body.admin-body .btn-ghost { border: 1px solid #E5E7EB; background: #fff; color: #374151; }
body.admin-body .btn-ghost:hover { background: #F9FAFB; }
body.admin-body .btn-danger { background: #EF4444; color: #fff; }

/* ---------- Forms ---------- */
body.admin-body label { color: #334155; font-size: .92rem; }
body.admin-body label small { color: #8A94A6; }
body.admin-body input, body.admin-body select, body.admin-body textarea {
  background: #fff; color: #1A1D20;
  border: 1px solid #E5E7EB; border-radius: 10px;
  box-shadow: 0 1px 2px rgba(16,24,40,.03);
}
body.admin-body input::placeholder, body.admin-body textarea::placeholder { color: #9CA3AF; }
body.admin-body input:focus, body.admin-body select:focus, body.admin-body textarea:focus {
  outline: none; border-color: #5A5D42;
  box-shadow: 0 0 0 3px rgba(90,93,66,.15);
}
body.admin-body input[type="checkbox"], body.admin-body input[type="radio"] { accent-color: #5A5D42; }
body.admin-body input[type="file"] { padding: .5rem; }
body.admin-body .inline-form label { margin: 0; }
body.admin-body .input-sm { background: #fff; color: #1A1D20; }

/* ---------- Alerts ---------- */
body.admin-body .alert { border-radius: 12px; }
body.admin-body .alert-success { background: #ECFDF5; border-color: #A7F3D0; color: #047857; }
body.admin-body .alert-error, body.admin-body .alert-danger { background: #FFF1F2; border-color: #FECDD3; color: #BE123C; }
body.admin-body .alert-warn { background: #FFFBEB; border-color: #FDE68A; color: #92400E; }
body.admin-body .alert-info { background: #EFF6FF; border-color: #BFDBFE; color: #1D4ED8; }

/* ---------- Tables ---------- */
body.admin-body .table th {
  background: #F9FAFB; color: #64748B;
  text-transform: uppercase; letter-spacing: .05em; font-size: .68rem;
  border-bottom: 1px solid #EEF1F5;
}
body.admin-body .table td { color: #1A1D20; border-bottom: 1px solid #F0F1F3; font-size: .9rem; }
body.admin-body .table tr:last-child td { border-bottom: 0; }
body.admin-body .table tbody tr:hover td { background: #FAFAFB; }
body.admin-body .table tfoot td { background: #EEF0E3; color: #3F422F; }

/* ---------- Badges ---------- */
body.admin-body .badge-success { background: #ECFDF5; color: #059669; }
body.admin-body .badge-danger { background: #FFF1F2; color: #E11D48; }
body.admin-body .badge-warn { background: #FFFBEB; color: #D97706; }
body.admin-body .badge-info { background: #F0F9FF; color: #0284C7; }
body.admin-body .badge-muted { background: #F1F5F9; color: #64748B; }

/* ---------- Stats ---------- */
body.admin-body .stat { padding: 1rem; }
body.admin-body .stat-num { color: #5A5D42; font-size: 1.4rem; }
body.admin-body .stat-label { color: #8A94A6; font-size: .8rem; }

/* ============================================================
   Layout: sidebar + topbar (gaya referensi)
   ============================================================ */
body.admin-body .admin-layout { display: flex; min-height: 100vh; }
body.admin-body .admin-main { flex: 1; min-width: 0; background: #F7F8FA; }

/* --- Halaman publik bergaya admin (foto.php) — body.admin-body.simple-page --- */
/* Background kehijauan senada logo Janji Padel */
body.admin-body.simple-page {
  display: flex; flex-direction: column; min-height: 100vh;
  background: radial-gradient(1200px 620px at 50% -12%, #6f6d52 0%, #626549 46%, #474836 100%) fixed;
}
body.admin-body.simple-page main { flex: 1 0 auto; }
body.admin-body .simple-admin-topbar {
  background: rgba(255,255,255,.9); backdrop-filter: blur(10px);
  border-bottom: 1px solid #F0F1F3;
  padding: 0 1.6rem; z-index: 30;
}
body.admin-body.simple-page .simple-admin-topbar {
  background: rgba(46, 48, 33, .92); backdrop-filter: blur(10px);
  border-bottom: 1px solid #7a785c;
}
body.admin-body .brand-mini {
  display: flex; align-items: center; gap: .65rem;
  text-decoration: none; color: #1A1D20; font-weight: 800; font-size: 1.02rem;
}
body.admin-body .brand-mini:hover { color: #1A1D20; }
body.admin-body .brand-mini .brand-mini-img { height: 48px; width: auto; display: block; }
body.admin-body .simple-foot {
  border-top: 1px solid #F0F1F3; padding: 1.2rem 1.6rem;
  color: #8A94A6; font-size: .85rem; text-align: center;
}
body.admin-body.simple-page .simple-foot { border-top-color: #7a785c; color: #d4d5bb; }
body.admin-body.simple-page .simple-admin-topbar .brand-mini { color: #eaf7ef; }
body.admin-body.simple-page .simple-admin-topbar .brand-mini:hover { color: #c8f04a; }
body.admin-body.simple-page .container.page .card {
  background: #525440; border-color: #7a785c;
  box-shadow: 0 14px 32px rgba(0,0,0,.30);
}

/* Flat: kurangi radius supaya tidak terlalu rounded */
body.admin-body.simple-page .card,
body.admin-body.simple-page .btn,
body.admin-body.simple-page .btn-icon,
body.admin-body.simple-page .booking-chip,
body.admin-body.simple-page .dl-toolbar,
body.admin-body.simple-page .buy-modal-box { border-radius: 4px; }
body.admin-body.simple-page .foto-grid .media-item { border-radius: 4px; }
body.admin-body.simple-page .foto-grid .p8-videobox,
body.admin-body.simple-page .foto-grid .media-item img,
body.admin-body.simple-page .foto-grid .media-item video { border-radius: 0; }
body.admin-body.simple-page .media-check-ic { border-radius: 3px; }

/* Legibilitas teks di atas latar hijau zaitun */
body.admin-body.simple-page .muted { color: #ccd0b9; }
body.admin-body.simple-page .booking-chip { color: #22241a; }
body.admin-body.simple-page .sesi-quota-label { color: #e6e7d6; }
body.admin-body.simple-page .page-head h1 { color: #fff; }
body.admin-body.simple-page .lookup-form label { color: #fff; }
body.admin-body.simple-page .dl-toolbar-select { color: #e6e7d6; }
body.admin-body.simple-page .btn-outline { color: #e6e7d6; border-color: #9a996f; }
body.admin-body.simple-page .simple-admin-topbar { justify-content: space-between; }
body.admin-body.simple-page .brand-studio { display: flex; align-items: center; text-decoration: none; }
body.admin-body.simple-page .brand-studio .brand-studio-img { height: 44px; width: auto; display: block; }
body.admin-body.simple-page .container.page,
body.admin-body.simple-page .page-head { text-align: center; }
body.admin-body.simple-page .card,
body.admin-body.simple-page .media-meta { text-align: center; }
body.admin-body.simple-page .lookup-form { margin: 0 auto; }
body.admin-body.simple-page .lookup-form .form-row { max-width: 420px; margin: 0 auto; flex-direction: column; align-items: stretch; }
body.admin-body.simple-page .lookup-form .form-row > * { width: 100%; flex: 0 0 auto; }
body.admin-body.simple-page .lookup-form label { display: block; margin: 0; }
body.admin-body.simple-page .lookup-form input { width: 100%; text-align: center; }
body.admin-body.simple-page #galeri { scroll-margin-top: 140px; }
body.admin-body.simple-page .lookup-form > .btn { display: block; margin: .9rem auto 0; }
/* Bar sesi: info booking kiri (kecil), kuota gratis kanan (1 baris, tanpa progress) */
body.admin-body.simple-page .sesi-bar {
  display: flex; align-items: center; justify-content: space-between;
  gap: .75rem; flex-wrap: wrap; padding: .7rem 1rem;
}
body.admin-body.simple-page .sesi-bar .booking-chips {
  display: flex; align-items: center; gap: .4rem;
  flex: 1 1 auto; justify-content: center; flex-wrap: nowrap;
  max-width: 100%; overflow-x: auto; scrollbar-width: none;
}
body.admin-body.simple-page .sesi-bar .booking-chips::-webkit-scrollbar { display: none; }
body.admin-body.simple-page .sesi-bar .booking-chip { flex: none; }
body.admin-body.simple-page .booking-chip {
  display: inline-flex; align-items: center;
  padding: .28rem .6rem; border-radius: 3px;
  background: #EEF2F7; border: 1px solid #DCE3EC;
  color: #1E293B; font-weight: 600; font-size: .78rem;
  white-space: nowrap;
}
body.admin-body.simple-page .booking-chip-code {
  background: #1E293B; border-color: #1E293B;
  color: #fff; letter-spacing: .04em;
}
/* Banner Batas Akses (foto.php): renggang dari bar sesi, tanggal dalam kotak putih */
body.admin-body.simple-page #accessBanner { margin: 14px 0; padding: 1rem 1.2rem; text-align: center; }
body.admin-body.simple-page #accessBanner strong { color: #fff; }
body.admin-body.simple-page #accessBanner .access-date {
  display: inline-block; margin-top: .5rem;
  background: #fff; color: #22241a; font-weight: 800; font-size: 1.05rem;
  padding: .45rem 1rem; border-radius: 4px;
}
body.admin-body.simple-page #accessBanner #accessCountdown { color: #c8f04a; }
body.admin-body.simple-page .sesi-quota {
  position: fixed; right: 18px; bottom: 18px; z-index: 90;
  display: inline-flex; align-items: center; gap: .55rem; flex: none;
}
body.admin-body.simple-page .sesi-quota-label { display: none; }
body.admin-body.simple-page .sesi-quota-val {
  display: inline-flex; align-items: center;
  padding: .5rem .95rem; border-radius: 999px;
  background: #c8f04a; color: #20290f;
  font-size: .9rem; font-weight: 800; white-space: nowrap;
  box-shadow: 0 10px 26px rgba(0,0,0,.32);
  border: 2px solid rgba(255,255,255,.28);
}
body.admin-body.simple-page .sesi-quota-val .q-mob { display: none; }

/* --- Halaman "Foto & Video Sesi Anda" (foto.php) --- */

/* Grid foto: 2 kolom & ukuran besar, foto full memenuhi kotak */
body.admin-body.simple-page .foto-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}
body.admin-body.simple-page .foto-grid .media-item {
  padding: 0; overflow: hidden; position: relative;
  background: #fff; border: 1px solid #fff;
  border-radius: 14px; box-shadow: 0 6px 18px rgba(15, 23, 42, .08);
}
body.admin-body.simple-page .foto-grid .media-item .media-foot { border-top: 1px solid #EFF2F6; }
body.admin-body.simple-page .foto-grid .media-item img {
  width: 100%; height: 320px; object-fit: cover;
  display: block; background: transparent;
}
body.admin-body.simple-page .foto-grid .media-item video {
  width: 100%; height: 320px; object-fit: cover;
  display: block; background: #000;
}
body.admin-body.simple-page .foto-grid .media-video-thumb,
body.admin-body.simple-page .foto-grid .p8-videobox video { height: 320px; object-fit: contain; background: #000; }
body.admin-body.simple-page .foto-grid .p8-videobox { border-radius: 0; }
body.admin-body.simple-page .pg-hidden { display: none; }
body.admin-body.simple-page #pgMore { padding: .65rem 1.6rem; }

/* Bandage / ribbon di kiri-atas foto */
body.admin-body.simple-page .media-ribbon {
  position: absolute; top: 10px; left: 10px; z-index: 7;
  padding: .22rem .7rem; border-radius: 7px;
  font-size: .7rem; font-weight: 800; letter-spacing: .05em;
  text-transform: uppercase; color: #fff;
  box-shadow: 0 3px 10px rgba(0,0,0,.28);
}
body.admin-body.simple-page .ribbon-free { background: #16A34A; }
body.admin-body.simple-page .ribbon-sold { background: #1E293B; }
body.admin-body.simple-page .ribbon-price { background: #F59E0B; }
body.admin-body.simple-page .ribbon-expired { background: #64748B; }

/* Bilah "sudah diunduh" / tombol select tidak dipakai lagi — download 1:1 */
body.admin-body.simple-page .is-downloadable { cursor: pointer; }

/* Baris bawah kartu: nama file kiri, tombol icon kanan */
body.admin-body.simple-page .media-foot {
  display: flex; align-items: center; justify-content: space-between;
  gap: .6rem; padding: .55rem .7rem; background: #fff;
}
body.admin-body.simple-page .media-name {
  min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  font-size: .8rem; color: #475569; font-weight: 600;
}
body.admin-body.simple-page .media-actions { display: flex; align-items: center; gap: .35rem; flex: none; }
body.admin-body.simple-page .btn-icon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 32px; height: 32px; border-radius: 9px; padding: 0;
  border: 1px solid #E2E8F0; background: #F8FAFC; color: #334155;
  cursor: pointer; transition: background .15s ease, color .15s ease, border-color .15s ease;
}
body.admin-body.simple-page .btn-icon:hover,
body.admin-body.simple-page .btn-icon:focus {
  background: #16A34A; border-color: #16A34A; color: #fff;
}
body.admin-body.simple-page .icon-form { display: inline-flex; margin: 0; }

/* Overlay loading saat mengunduh foto (tanpa refresh halaman) */
body.admin-body.simple-page .dl-loading {
  position: fixed; inset: 0; z-index: 1000;
  display: flex; align-items: center; justify-content: center;
  background: rgba(15, 23, 42, .55); backdrop-filter: blur(2px);
}
body.admin-body.simple-page .dl-loading-box {
  display: flex; align-items: center; gap: .85rem;
  background: #fff; color: #1E293B;
  padding: 1rem 1.4rem; border-radius: 12px;
  box-shadow: 0 12px 35px rgba(0, 0, 0, .3);
  font-weight: 600;
}
body.admin-body.simple-page .dl-spinner {
  width: 24px; height: 24px; border-radius: 50%;
  border: 3px solid #DDE4EC; border-top-color: #16A34A;
  animation: dlSpin .7s linear infinite;
}
@keyframes dlSpin { to { transform: rotate(360deg); } }

/* Popup "Payment & Download" (tanpa login) — tematik hijau & flat */
body.admin-body.simple-page .buy-modal {
  position: fixed; inset: 0; z-index: 1001;
  display: flex; align-items: center; justify-content: center;
  padding: 16px;
  background: rgba(20, 24, 14, .66); backdrop-filter: blur(2px);
}
body.admin-body.simple-page .buy-modal-box {
  position: relative; width: 100%; max-width: 460px;
  background: #525440; color: #e6e7d6; border: 1px solid #7a785c;
  border-radius: 4px; padding: 1.4rem 1.5rem 1.5rem;
  box-shadow: 0 18px 50px rgba(0, 0, 0, .35);
  max-height: 92vh; overflow-y: auto;
}
body.admin-body.simple-page .buy-modal-box h3 { margin: 0 0 1rem; color: #eaf7ef; }
body.admin-body.simple-page .buy-modal-box label { color: #e6e7d6; }
body.admin-body.simple-page .buy-modal-box input { border-radius: 3px; }
body.admin-body.simple-page .buy-modal-close {
  position: absolute; top: 12px; right: 12px;
  width: 30px; height: 30px; border: none; border-radius: 3px;
  background: #3f4130; color: #e6e7d6; font-size: 1.1rem; line-height: 1;
  cursor: pointer;
}
body.admin-body.simple-page .buy-modal-close:hover { background: #4b4e39; }
body.admin-body.simple-page .buy-summary {
  display: flex; align-items: center; justify-content: space-between; gap: .75rem;
  flex-wrap: wrap; margin-bottom: 1rem;
  padding: .75rem .9rem; border-radius: 3px;
  background: #3f4130; border: 1px solid #68674b; font-size: .9rem;
}
body.admin-body.simple-page .buy-summary-name { color: #d4d5bb; word-break: break-word; }
body.admin-body.simple-page .buy-summary strong { color: #c8f04a; white-space: nowrap; }
body.admin-body.simple-page .buy-modal-actions {
  display: flex; align-items: center; justify-content: space-between;
  gap: .75rem; margin-top: 1.2rem;
}
body.admin-body.simple-page .buy-modal-actions .btn { min-width: 130px; margin: 0; }
body.admin-body.simple-page .buy-modal-box .btn-yellow {
  background: #c8f04a; color: #20290f; border: 1px solid #b5dd3a;
}
body.admin-body.simple-page .buy-modal-box .btn-yellow:hover {
  background: #d5f468; color: #20290f;
}

/* Toast notifikasi (tanpa refresh) — kotak tengah, teks center */
body.admin-body.simple-page .pbt8-toast {
  position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%) scale(.96);
  z-index: 1002; opacity: 0; pointer-events: none;
  background: #16A34A; color: #fff;
  display: flex; align-items: center; justify-content: center; text-align: center;
  max-width: 340px; padding: .9rem 1.6rem; border-radius: 10px;
  font-weight: 600; font-size: .9rem; line-height: 1.45; box-shadow: 0 16px 40px rgba(0,0,0,.3);
  transition: opacity .25s ease, transform .25s ease;
}
body.admin-body.simple-page .pbt8-toast.show { opacity: 1; transform: translate(-50%, -50%) scale(1); }
body.admin-body.simple-page .pbt8-toast.show-error { background: #DC2626; }

/* Bilah multi-select: unduh per foto (tanpa ZIP) & beli sekaligus — jadi sticky navbar */
body.admin-body.simple-page .dl-toolbar {
  position: sticky; top: 64px; z-index: 60;
  display: flex; align-items: center; justify-content: space-between;
  gap: .75rem; flex-wrap: wrap;
  margin: 1.4rem 0 1.1rem;
  padding: .5rem .9rem;
  background: rgba(46,48,33,.96); backdrop-filter: blur(10px);
  border: 1px solid #7a785c; border-radius: 0;
  box-shadow: 0 8px 22px rgba(0,0,0,.25);
}
body.admin-body.simple-page .dl-toolbar .dl-toolbar-select { color: #f5f6e8; }
body.admin-body.simple-page .dl-toolbar-select {
  display: flex; align-items: center; justify-content: center;
  gap: .55rem;
  height: 36px; line-height: 1.15;
  font-weight: 600; font-size: .84rem; white-space: nowrap; cursor: pointer;
  transform: translateY(8px);
}
body.admin-body.simple-page .dl-toolbar-select input {
  width: 16px; height: 16px; margin: 0; flex: none; align-self: center;
  accent-color: #c8f04a; cursor: pointer;
}
body.admin-body.simple-page .dl-toolbar-actions {
  display: flex; align-items: center; justify-content: center; gap: .5rem; flex-wrap: wrap;
}
body.admin-body.simple-page .dl-toolbar .btn-icon {
  width: 36px; height: 36px; border-radius: 3px;
}
body.admin-body.simple-page .dl-toolbar .btn-icon svg { width: 16px; height: 16px; }
body.admin-body.simple-page .dl-toolbar .btn-icon:disabled { opacity: .45; pointer-events: none; }

/* Keranjang beli terpilih — floating kecil di atas badge FREE */
body.admin-body.simple-page .dl-cart-btn {
  position: fixed; right: 20px; bottom: 72px; z-index: 88;
  display: grid; place-items: center;
  width: 50px; height: 50px; padding: 0; border: none; border-radius: 50%;
  background: #c8f04a; color: #20290f; cursor: pointer;
  box-shadow: 0 8px 22px rgba(0,0,0,.32);
  transition: opacity .15s ease, transform .15s ease;
}
body.admin-body.simple-page .dl-cart-btn:hover:not(:disabled) { transform: translateY(-2px); }
body.admin-body.simple-page .dl-cart-btn svg { width: 21px; height: 21px; }
body.admin-body.simple-page .dl-cart-badge {
  position: absolute; top: -4px; right: -4px;
  min-width: 19px; height: 19px; padding: 0 4px; border-radius: 999px;
  display: inline-flex; align-items: center; justify-content: center;
  background: #16A34A; color: #fff; font-size: .7rem; font-weight: 800; line-height: 1;
  border: 2px solid #fff;
}
body.admin-body.simple-page .dl-cart-badge[hidden] { display: none; }
body.admin-body.simple-page .dl-cart-btn:disabled { opacity: .38; cursor: not-allowed; box-shadow: none; transform: none; }
body.admin-body.simple-page .dl-filter-wrap { position: relative; }
body.admin-body.simple-page .dl-filter-menu {
  position: absolute; right: 0; top: calc(100% + 6px); z-index: 50;
  min-width: 168px; background: #fff; border: 1px solid #E2E8F0;
  border-radius: 4px; box-shadow: 0 10px 26px rgba(0,0,0,.18); padding: .4rem;
  display: flex; flex-direction: column; gap: .1rem;
}
body.admin-body.simple-page .dl-filter-menu[hidden] { display: none; }
body.admin-body.simple-page .dl-filter-menu label {
  display: flex; align-items: center; gap: .5rem; padding: .38rem .55rem;
  font-size: .82rem; color: #22241a; font-weight: 600; cursor: pointer; border-radius: 3px;
}
body.admin-body.simple-page .dl-filter-menu label:hover { background: #F1F5F9; }
body.admin-body.simple-page .dl-filter-menu input {
  width: 14px; height: 14px; margin: 0; accent-color: #c8f04a; cursor: pointer;
}
body.admin-body.simple-page .dl-toolbar .btn { margin: 0; padding: .3rem .8rem; font-size: .82rem; }

/* Kotak centang per foto (kanan-atas kartu) */
body.admin-body.simple-page .media-check {
  position: absolute; top: 12px; right: 12px; z-index: 8;
  width: 28px; height: 28px; display: flex; align-items: center; justify-content: center;
  cursor: pointer;
}
body.admin-body.simple-page .media-check input {
  position: absolute; inset: 0; margin: 0; opacity: 0; cursor: pointer;
}
body.admin-body.simple-page .media-check-ic {
  display: flex; align-items: center; justify-content: center;
  width: 24px; height: 24px; border-radius: 7px;
  border: 2px solid rgba(255,255,255,.95);
  background: rgba(15,23,42,.55);
  box-shadow: 0 2px 6px rgba(0,0,0,.3);
  color: #fff; font-size: .85rem; font-weight: 800; line-height: 1;
  transition: background .15s ease, border-color .15s ease;
  pointer-events: none;
}
body.admin-body.simple-page .media-check input:checked + .media-check-ic {
  background: #16A34A; border-color: #16A34A;
}
body.admin-body.simple-page .media-check input:checked + .media-check-ic::after { content: '\2713'; }
body.admin-body.simple-page .media-item.selected { outline: 2px solid #16A34A; outline-offset: 2px; }
body.admin-body.simple-page .media-item:has(.p8-videobox) .media-check { top: 48px; }

/* Pengaturan harga default (admin): di halaman sesi publik & admin detail sesi */
.harga-card { margin-bottom: .75rem; padding: .85rem 1rem; }
.harga-form {
  display: flex; align-items: flex-end; gap: .9rem; flex-wrap: wrap;
  margin-bottom: .25rem;
}
.harga-inputs {
  display: flex; gap: .9rem; flex-wrap: wrap; flex: 1; min-width: 220px;
}
.harga-inputs label { flex: 1; min-width: 150px; margin: 0; }
.harga-form .btn { margin: 0; white-space: nowrap; }

@media (max-width: 600px) {
  body.admin-body.simple-page .foto-grid { gap: .8rem; }
  body.admin-body.simple-page .foto-grid .media-item { border-radius: 2px; }
  body.admin-body.simple-page .foto-grid .media-item img,
  body.admin-body.simple-page .foto-grid .media-item video,
  body.admin-body.simple-page .foto-grid .media-video-thumb,
  body.admin-body.simple-page .foto-grid .p8-videobox video { height: 230px; border-radius: 0; }
  body.admin-body.simple-page .dl-toolbar-actions .btn { font-size: .8rem; }
  body.admin-body.simple-page .sesi-bar { justify-content: center; text-align: center; }
  body.admin-body.simple-page .sesi-bar .booking-chips { display: flex; align-items: center; gap: .35rem; justify-content: center; flex-wrap: nowrap; }
  body.admin-body.simple-page .sesi-bar .booking-chip { font-size: .72rem; padding: .25rem .5rem; }
  body.admin-body.simple-page .sesi-quota { right: 12px; bottom: 12px; }
  body.admin-body.simple-page .dl-cart-btn { right: 12px; bottom: 64px; width: 46px; height: 46px; }
  body.admin-body.simple-page .dl-cart-btn svg { width: 19px; height: 19px; }
  body.admin-body.simple-page .sesi-quota-val .q-dsk { display: none; }
  body.admin-body.simple-page .sesi-quota-val .q-mob { display: inline; }
  body.admin-body.simple-page #accessBanner { margin: 12px 0; padding: .9rem .8rem; }
  body.admin-body.simple-page #accessBanner .access-date { font-size: .95rem; padding: .4rem .8rem; }
}

/* Desktop: foto tampil dengan rasio aslinya (frameless, tanpa bar hitam) */
@media (min-width: 900px) {
  body.admin-body.simple-page .foto-grid .media-item img {
    height: auto; width: 100%; object-fit: contain; background: transparent;
  }
  body.admin-body.simple-page .foto-grid .media-item video,
  body.admin-body.simple-page .foto-grid .media-video-thumb,
  body.admin-body.simple-page .foto-grid .p8-videobox video {
    height: auto; max-height: 76vh; object-fit: contain;
  }
}

/* --- Sidebar --- */
body.admin-body .admin-sidebar {
  width: 252px; flex-shrink: 0; background: #fff;
  border-right: 1px solid #F0F1F3;
  padding: 1.4rem 1rem 1rem;
  display: flex; flex-direction: column; gap: .9rem;
  position: sticky; top: 0; height: 100vh; overflow-y: auto;
  z-index: 20;
}
body.admin-body .admin-brand a {
  color: #1A1D20; display: flex; align-items: center; gap: .6rem;
  font-weight: 800; font-size: 1rem; text-decoration: none;
}
body.admin-body .admin-brand { display: flex; justify-content: center; }
body.admin-body .admin-brand-link {
  display: inline-block; line-height: 0;
}
body.admin-body .admin-brand-logo {
  width: 132px; height: auto; display: block;
  object-fit: contain;
}
body.admin-body .brand-logo {
  background-image: linear-gradient(135deg, #6B6F50, #5A5D42);
  color: #fff; font-weight: 900; letter-spacing: -1px;
  width: 38px; height: 38px; border-radius: 10px;
  box-shadow: 0 8px 18px -6px rgba(90,93,66,.45);
}
body.admin-body .admin-brand-name { display: flex; flex-direction: column; }
body.admin-body .admin-brand-name .admin-sub { font-weight: 500; font-size: .77rem; letter-spacing: .02em; }
body.admin-body .admin-menu { display: flex; flex-direction: column; gap: .15rem; }
body.admin-body .admin-menu-title {
  font-size: .68rem; font-weight: 700; letter-spacing: .09em; text-transform: uppercase;
  color: #8A94A6; padding: .3rem .8rem .15rem; margin-top: .3rem;
}
body.admin-body .admin-link {
  display: flex; align-items: center; gap: .65rem;
  color: #55637A; padding: .5rem .8rem; border-radius: 9px;
  font-size: .9rem; font-weight: 500; transition: background .15s,color .15s;
  position: relative;
}
body.admin-body .admin-link:hover { background: #F7F8FA; color: #1A1D20; }
body.admin-body .admin-link.active { background: #EFF0E6; color: #5A5D42; font-weight: 600; }
body.admin-body .admin-link.active::before {
  content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%);
  width: 4px; height: 22px; background: #5A5D42; border-radius: 999px;
}
body.admin-body .admin-sub-title { margin-top: .8rem; }
body.admin-body .admin-link.sub { padding-left: 1.15rem; font-size: .84rem; }
body.admin-body .admin-link.sub .adm-ico { width: 15px; height: 15px; }
body.admin-body .admin-link.sub .adm-ico svg { width: 15px; height: 15px; }
body.admin-body .admin-link.sub.active::before { height: 16px; }
body.admin-body .adm-ico { display: grid; place-items: center; width: 18px; height: 18px; }
body.admin-body .adm-ico svg { width: 18px; height: 18px; }
body.admin-body .admin-sidebar-foot {
  display: flex; flex-direction: column; gap: .15rem;
  border-top: 1px solid #F0F1F3; padding-top: 1rem;
}
body.admin-body .admin-sidebar-foot .admin-link { font-size: .88rem; }

body.admin-body .admin-bottom { margin-top: auto; display: flex; flex-direction: column; gap: .9rem; }

/* Promo card (bawah sidebar, tepat di atas tombol Keluar) */
body.admin-body .side-promo {
  padding: 1.1rem 1.1rem;
  border-radius: 18px;
  background-image: linear-gradient(135deg, #73785A, #5A5D42 60%, #484A35);
  color: #fff; box-shadow: 0 12px 26px -12px rgba(90,93,66,.5);
}
body.admin-body .side-promo h4 { color: #fff; font-size: .95rem; margin: 0 0 .25rem; line-height: 1.35; }
body.admin-body .side-promo p { color: #E3E6CF; font-size: .78rem; margin-bottom: .9rem; }
body.admin-body .side-promo a {
  display: flex; align-items: center; justify-content: space-between;
  background: #fff; color: #3F422F; font-weight: 600; font-size: .8rem;
  padding: .5rem .8rem; border-radius: 10px; text-decoration: none;
}
body.admin-body .side-promo a:hover { background: #FAFAFA; color: #3F422F; }

/* --- Topbar --- */
body.admin-body .admin-topbar {
  display: flex; align-items: center; gap: 1rem;
  padding: 0 1.6rem; height: 64px;
  background: rgba(247,248,250,.82); backdrop-filter: blur(10px);
  border-bottom: 1px solid #F0F1F3;
  position: sticky; top: 0; z-index: 40;
}
body.admin-body .admin-page-title { font-size: 1.1rem; font-weight: 700; margin: 0; color: #1A1D20; }
body.admin-body .tb-actions { display: flex; align-items: center; gap: .6rem; margin-left: auto; }
body.admin-body .tb-btn {
  display: inline-flex; align-items: center; gap: .45rem;
  padding: .45rem .95rem; border-radius: 999px;
  background: #fff; border: 1px solid #E5E7EB; color: #374151;
  font-weight: 600; font-size: .82rem; text-decoration: none;
  transition: background .15s;
}
body.admin-body .tb-btn:hover { background: #F9FAFB; color: #1A1D20; }
body.admin-body .tb-btn.pink {
  background-image: linear-gradient(135deg, #6B6F50, #5A5D42);
  color: #fff; border: none; box-shadow: 0 6px 16px -6px rgba(90,93,66,.5);
}
body.admin-body .tb-btn.pink:hover { color: #fff; filter: brightness(1.08); }
body.admin-body .tb-btn.danger {
  background: #DC2626; color: #fff; border: none;
  box-shadow: 0 6px 16px -6px rgba(220,38,38,.5);
}
body.admin-body .tb-btn.danger:hover { color: #fff; filter: brightness(1.08); }
body.admin-body .admin-link.danger { color: #DC2626; }
body.admin-body .admin-link.danger:hover { background: #FEF2F2; color: #B91C1C; }
body.admin-body .admin-link.danger svg { color: #DC2626; }
body.admin-body .admin-user { display: flex; align-items: center; gap: .6rem; padding: 0 .4rem; }
body.admin-body .admin-user .uname { color: #334155; font-weight: 600; font-size: .84rem; line-height: 1.2; }
body.admin-body .admin-user .uname small { display: block; color: #8A94A6; font-weight: 500; }
body.admin-body .admin-avatar {
  width: 34px; height: 34px; border-radius: 999px;
  background: #E9EADE; color: #5A5D42; border: 2px solid #D3D5BF;
  display: grid; place-items: center; font-weight: 700; font-size: .78rem;
}
body.admin-body .admin-nav-toggle span { background: #1A1D20; }

/* --- Konten --- */
body.admin-body .admin-content { padding: 1.5rem 1.8rem 2.2rem; max-width: 1440px; margin-inline: auto; }
body.admin-body .admin-flash { margin-bottom: 1rem; }
body.admin-body .grid.admin-stats { grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 1rem; }
body.admin-body .toolbar h2 { margin: 0; }
body.admin-body a.link-card {
  display: flex; flex-direction: column; gap: .4rem; color: inherit; text-decoration: none;
  border: 1px solid #E4E9F0; border-radius: 14px; padding: 1.1rem 1.2rem; background: #fff;
  box-shadow: 0 2px 10px rgba(16,24,40,.04); transition: transform .15s, box-shadow .15s;
}
body.admin-body a.link-card:hover { transform: translateY(-2px); box-shadow: 0 14px 30px -12px rgba(16,24,40,.18); }
body.admin-body .link-card .link-ico {
  display: grid; place-items: center; width: 38px; height: 38px; border-radius: 10px;
  background: #EFF0E6; color: #5A5D42; margin-bottom: .2rem;
}
body.admin-body .link-card .link-ico svg { width: 20px; height: 20px; }
body.admin-body .link-card b { font-size: .98rem; color: #1A1D20; }
body.admin-body .link-card small { color: #8A94A6; line-height: 1.45; }

/* --- Login --- */
body.admin-body.login-page { display: flex; align-items: flex-start; justify-content: center; }
body.admin-body .login-logo {
  width: 48px; height: 48px; margin: 0 auto 1rem;
  border-radius: 12px; background-image: linear-gradient(135deg, #6B6F50, #5A5D42);
  color: #fff; display: grid; place-items: center; font-weight: 800; font-size: 1.1rem;
  box-shadow: 0 12px 24px -10px rgba(90,93,66,.5);
}
body.admin-body .auth-card { box-shadow: 0 20px 50px -20px rgba(16,24,40,.18); }
body.admin-body .auth-title { font-size: 1.35rem; font-weight: 700; }
body.admin-body.login-page .auth-card form { max-width: 300px; margin: 1.4rem auto 0; }
body.admin-body.login-page .auth-card label { text-align: center; }
body.admin-body.login-page .auth-card input { width: 100%; text-align: center; }
body.admin-body.login-page .login-footer {
  text-align: center; margin-top: 1.4rem; padding-top: 1rem; border-top: 1px solid rgba(148,163,184,.25);
  color: #8A94A6; font-size: .85rem; font-weight: 600; letter-spacing: .08em;
}

/* --- Upload XHR progress --- */
body.admin-body .upload-progress { display: flex; align-items: center; gap: 10px; margin-top: 12px; }
body.admin-body .upload-progress-track {
  flex: 1; height: 10px; background: #E9EDF2; border-radius: 999px; overflow: hidden;
}
body.admin-body .upload-progress-fill {
  height: 100%; width: 0%; background: #E15B84;
  transition: width .2s linear; border-radius: 999px;
}
body.admin-body .upload-progress-pct { font-size: 12px; color: #6B7280; font-weight: 600; white-space: nowrap; }

/* --- Modal --- */
body.admin-body .modal-overlay {
  position: fixed; inset: 0; background: rgba(16,24,40,.5);
  display: none; align-items: center; justify-content: center;
  padding: 1rem; z-index: 100; overflow-y: auto;
}
body.admin-body .modal-overlay.open { display: flex; }
body.admin-body .modal-box {
  width: 100%; max-width: 460px; background: #fff; border-radius: 14px;
  border: 1px solid #E4E9F0; box-shadow: 0 24px 60px -20px rgba(16,24,40,.4);
}
body.admin-body .modal-head {
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  padding: 1rem 1.25rem; border-bottom: 1px solid #EEF1F6;
}
body.admin-body .modal-head h3 { margin: 0; font-size: 1.05rem; }
body.admin-body .modal-body { padding: 1.25rem; }
body.admin-body .modal-foot {
  display: flex; justify-content: flex-end; gap: .5rem;
  padding: .9rem 1.25rem; border-top: 1px solid #EEF1F6;
}
body.admin-body .modal-close {
  border: none; background: none; cursor: pointer; font-size: 22px; line-height: 1;
  color: #6B7280; padding: 2px 8px; border-radius: 8px;
}
body.admin-body .modal-close:hover { background: #EEF1F6; }
body.admin-body .table-centered th,
body.admin-body .table-centered td { text-align: center; vertical-align: middle; }
body.admin-body .table-centered .inline-form { justify-content: center; }

/* --- Multi-select media pada detail sesi --- */
body.admin-body .media-item { position: relative; }
body.admin-body .media-select {
  position: absolute; top: 8px; left: 8px; z-index: 6; cursor: pointer;
}
body.admin-body .media-select-mark {
  display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%;
  background: rgba(0,0,0,.45); border: 2px solid #fff; color: #fff;
  font-size: 14px; font-weight: 700; line-height: 1; opacity: .85;
  box-shadow: 0 2px 6px rgba(0,0,0,.3);
}
body.admin-body .media-select input { display: none; }
body.admin-body .media-select input:checked + .media-select-mark {
  background: #16A34A; border-color: #16A34A; opacity: 1;
}
body.admin-body .media-item.selected { outline: 2px solid #16A34A; outline-offset: 2px; }

/* --- Scene progress (tombol Refresh / Re-Scan) --- */
body.admin-body .scene-progress {
  position: fixed; inset: 0; z-index: 2000;
  background: rgba(16,24,40,.45);
  display: none; align-items: center; justify-content: center; padding: 1rem;
}
body.admin-body .scene-progress-box {
  background: #fff; border-radius: 14px; padding: 18px 24px;
  display: flex; gap: 14px; align-items: center;
  border: 1px solid #E4E9F0; box-shadow: 0 24px 60px -20px rgba(16,24,40,.4);
  color: #0F172A; max-width: 420px;
}
body.admin-body .scene-spinner {
  width: 26px; height: 26px; border-radius: 50%; flex: none; position: relative;
}
body.admin-body .scene-spinner::before {
  content: ''; position: absolute; inset: 0; border-radius: 50%;
  border: 3px solid #E4E9F0; border-top-color: var(--primary, #0ea5e9);
  animation: scene-spin .8s linear infinite;
}
body.admin-body .scene-spinner::after {
  content: '✓'; position: absolute; inset: 0; display: grid; place-items: center;
  font-size: 15px; font-weight: 700; line-height: 1; color: #fff; background: #16A34A;
  border-radius: 50%; opacity: 0; transform: scale(.4); transition: .18s;
}
body.admin-body .scene-progress.done .scene-spinner::before,
body.admin-body .scene-progress.fail .scene-spinner::before { opacity: 0; animation: none; }
body.admin-body .scene-progress.done .scene-spinner::after { opacity: 1; transform: none; }
body.admin-body .scene-progress.fail .scene-spinner::after {
  content: '✕'; background: #DC2626; opacity: 1; transform: none; font-size: 14px;
}
body.admin-body .scene-progress.done { background: rgba(16,24,40,.28); }
@keyframes scene-spin { to { transform: rotate(360deg); } }

/* ============================================================
   Responsive
   ============================================================ */
@media (max-width: 900px) {
  body.admin-body .admin-layout { flex-direction: column; }
  body.admin-body .admin-sidebar {
    position: fixed; inset: 0 auto 0 0; width: 262px;
    transform: translateX(-105%); transition: transform .25s;
    z-index: 60; height: 100vh; box-shadow: none;
  }
  body.admin-body .admin-sidebar.open { transform: none; box-shadow: 0 10px 40px rgba(16,24,40,.16); }
  body.admin-body .admin-nav-toggle { display: flex; }
  body.admin-body .admin-topbar { padding: 0 1rem; height: 62px; }
  body.admin-body .admin-content { padding: 1rem; }
  body.admin-body .admin-user .uname { display: none; }
  body.admin-body .hide-mobile { display: none; }
}