:root { --sidebar-width: 280px; }
.admin-body { background:#f8fafc; }
.admin-shell { display:grid; grid-template-columns: var(--sidebar-width) 1fr; min-height:100vh; }
.admin-sidebar { background:#0f172a; color:#fff; padding:24px 18px; position:sticky; top:0; height:100vh; overflow:auto; }
.admin-brand { display:flex; align-items:center; gap:12px; margin-bottom:26px; font-weight:800; }
.admin-brand img { width:52px; height:52px; border-radius:16px; background:#fff; padding:6px; }
.admin-nav { display:grid; gap:10px; }
.admin-nav button { width:100%; text-align:right; padding:14px 16px; border-radius:16px; background:transparent; color:#cbd5e1; border:none; cursor:pointer; font-weight:700; }
.admin-nav button.active, .admin-nav button:hover { background:rgba(255,255,255,.08); color:#fff; }
.admin-main { padding:24px; }
.admin-topbar { display:flex; align-items:center; justify-content:space-between; gap:18px; margin-bottom:24px; }
.admin-title h1 { margin-bottom: 6px; }
.admin-title p { color: var(--medium); }
.admin-grid, .mini-grid { display:grid; gap:18px; }
.admin-grid { grid-template-columns: repeat(4, 1fr); }
.mini-grid { grid-template-columns: repeat(2, 1fr); }
.stat-box { padding:20px; }
.stat-box h3 { font-size:2rem; margin-bottom: 6px; }
.panel { display:none; }
.panel.active { display:block; }
.toolbar { display:flex; justify-content:space-between; gap:12px; align-items:center; margin-bottom:18px; flex-wrap:wrap; }
.table-wrap { overflow:auto; }
.data-table { width:100%; border-collapse:collapse; min-width: 760px; }
.data-table th, .data-table td { padding:12px 14px; text-align:right; border-bottom:1px solid var(--border); vertical-align:top; }
.data-table th { background:#f8fafc; white-space:nowrap; }
.thumb-sm { width:58px; height:58px; border-radius:16px; object-fit:cover; background:#f4f4f5; }
.action-group { display:flex; gap:8px; flex-wrap:wrap; }
.inline-form { display:grid; gap:14px; grid-template-columns: repeat(2, 1fr); }
.inline-form .full { grid-column:1/-1; }
.kbd { padding:4px 8px; background:#eef2ff; border-radius:8px; font-size:.85rem; }
.analytics-grid { display:grid; grid-template-columns: repeat(3, 1fr); gap:18px; }
.order-detail-grid { display:grid; grid-template-columns: 180px 1fr; gap:22px; }
.message-block { white-space:pre-wrap; color: var(--medium); }
.admin-mobile-toggle { display:none; margin-bottom: 14px; }
@media (max-width: 1160px) { .admin-grid { grid-template-columns: repeat(2, 1fr); } .analytics-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 900px) {
  .admin-shell { grid-template-columns: 1fr; }
  .admin-sidebar { position:fixed; inset:0 auto 0 0; width:min(86vw, 320px); transform: translateX(-110%); z-index:1600; transition: var(--transition); }
  html[dir="rtl"] .admin-sidebar { inset:0 0 0 auto; transform: translateX(110%); }
  .admin-sidebar.is-open { transform: translateX(0); }
  .admin-mobile-toggle { display:inline-flex; }
  .admin-main { padding:16px; }
  .inline-form, .mini-grid, .analytics-grid, .admin-grid, .order-detail-grid { grid-template-columns: 1fr; }
}


.form-progress {
  grid-column:1/-1;
  position:relative;
  height:10px;
  border-radius:999px;
  background:linear-gradient(180deg,#eef2f7,#e2e8f0);
  overflow:hidden;
  box-shadow: inset 0 1px 2px rgba(15,23,42,.06);
  opacity:0;
  transform:translateY(-4px);
  transition:opacity .22s ease, transform .22s ease;
}
.form-progress.is-visible { opacity:1; transform:translateY(0); }
.form-progress.is-complete .form-progress-bar { filter:saturate(1.12); }
.form-progress-bar {
  display:block;
  width:0%;
  height:100%;
  border-radius:inherit;
  background:linear-gradient(90deg,#d4af37,#f6d365,#d4af37);
  box-shadow:0 8px 18px rgba(212,175,55,.28);
  transition:width .22s ease;
}
.form-status { min-height: 22px; color:#64748b; font-weight:700; }
.form-status.is-saving { color:#0f766e; }
.form-status.is-done { color:#15803d; }
.admin-sidebar .mobile-overlay { z-index: auto; }

.admin-main .card { border-radius:24px; }
.admin-nav button { transition: var(--transition); }
.admin-nav button:hover { transform: translateX(-2px); }
.admin-topbar { align-items:flex-start; }
.admin-toolbar-actions { display:flex; gap:10px; flex-wrap:wrap; }
.modal-card, .drawer-card { border-radius:26px; }
@media (max-width: 900px) {
  .admin-body { background:#f6f8fb; }
  .admin-title h1 { font-size:2rem; }
  .table-wrap { overflow:visible; }
  .data-table { min-width:100%; display:block; }
  .data-table thead { display:none; }
  .data-table tbody, .data-table tr, .data-table td { display:block; width:100%; }
  .data-table tr { background:#fff; border:1px solid var(--border); border-radius:18px; margin-bottom:14px; padding:10px 12px; box-shadow: var(--shadow); }
  .data-table td { border:none; padding:8px 4px; }
  .data-table td::before { content: attr(data-label); display:block; color:#64748b; font-weight:700; margin-bottom:4px; }
  .action-group { justify-content:flex-start; }
  .drawer-card { width:min(100% - 16px, 100%); margin:8px auto; padding:18px; }
  .modal-card { width:min(100% - 16px, 100%); margin:10px auto; padding:18px; }
}


.admin-body.sidebar-open { overflow:hidden; }
.admin-topbar {
  position: sticky;
  top: 0;
  z-index: 20;
  background: rgba(248,250,252,.92);
  backdrop-filter: blur(10px);
  padding: 10px 0 14px;
}
.admin-mobile-toggle {
  align-items:center;
  gap:10px;
  border-radius: 999px;
  box-shadow: 0 12px 28px rgba(15,23,42,.12);
}
.admin-sidebar-close {
  display:none;
  width:42px;
  height:42px;
  border:none;
  border-radius:14px;
  background:rgba(255,255,255,.08);
  color:#fff;
  font-size:1.1rem;
}
.admin-sidebar-head { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.admin-nav { padding-bottom: 24px; }
.admin-nav button, #logoutBtn { min-height: 50px; }
.admin-nav button i, #logoutBtn i { width: 22px; }
@media (max-width: 900px) {
  .admin-mobile-toggle {
    position: sticky;
    top: 10px;
    z-index: 25;
  }
  .admin-sidebar {
    width:min(88vw, 340px);
    border-inline-start:1px solid rgba(255,255,255,.08);
    box-shadow: -20px 0 60px rgba(15,23,42,.28);
    padding:20px 14px 26px;
  }
  html[dir="rtl"] .admin-sidebar { right:0; left:auto; }
  .admin-sidebar-close { display:inline-flex; align-items:center; justify-content:center; }
  .admin-brand { margin-bottom:18px; }
  .admin-brand img { width:46px; height:46px; border-radius:14px; }
  .admin-nav { gap:8px; }
  .admin-nav button, #logoutBtn {
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:14px 14px;
    border-radius:14px;
    font-size:.98rem;
  }
  .admin-main { padding:14px; }
  .toolbar { align-items:stretch; }
  .toolbar > * { width:100%; }
  .admin-toolbar-actions { width:100%; }
  .admin-toolbar-actions .btn { flex:1 1 0; justify-content:center; }
  .card { border-radius:20px !important; }
  .inline-form { gap:12px; }
  .inline-form .btn { width:100%; justify-content:center; }
  .data-table tr { border-radius:20px; padding:12px 12px; }
  .action-group { width:100%; }
  .action-group .btn { flex:1 1 120px; justify-content:center; }
  .drawer-card {
    width:100%;
    max-width:none;
    min-height:100vh;
    margin:0;
    border-radius:24px 24px 0 0;
    padding:18px 16px 28px;
    position:fixed;
    inset:auto 0 0 0;
    max-height:88vh;
    overflow:auto;
  }
  .modal-card {
    width:calc(100% - 16px);
    max-height:88vh;
    overflow:auto;
    border-radius:22px;
    padding:18px 16px 24px;
  }
  .order-detail-grid {
    grid-template-columns:1fr;
  }
}


/* mobile dashboard sidebar hardening */
.admin-sidebar { z-index:1601; }
#adminOverlay { z-index:1600; }
.admin-main { position:relative; z-index:1; }
.admin-mobile-bar { display:none; }
@media (max-width: 900px) {
  .admin-mobile-bar {
    display:flex;
    position:fixed;
    top:12px;
    right:12px;
    left:auto;
    z-index:1705;
    gap:10px;
    align-items:center;
  }
  .admin-mobile-toggle {
    display:inline-flex;
    position:static !important;
    min-height:48px;
    padding:0 16px;
    border-radius:999px;
    box-shadow:0 12px 30px rgba(15,23,42,.18);
    touch-action:manipulation;
  }
  .admin-body.sidebar-open .admin-mobile-toggle {
    opacity:0;
    pointer-events:none;
  }
  .admin-sidebar {
    pointer-events:none;
    opacity:0;
    transform:translateX(112%);
    transition:transform .28s ease, opacity .28s ease;
  }
  .admin-sidebar.is-open {
    pointer-events:auto;
    opacity:1;
    transform:translateX(0);
  }
  html[dir="rtl"] .admin-sidebar {
    right:0;
    left:auto;
    transform:translateX(112%);
  }
  html[dir="rtl"] .admin-sidebar.is-open {
    transform:translateX(0);
  }
  .admin-sidebar-close {
    cursor:pointer;
    touch-action:manipulation;
  }
  .admin-nav button,
  #logoutBtn {
    touch-action:manipulation;
  }
}


@media (max-width: 900px) {
  .admin-mobile-bar { top: env(safe-area-inset-top, 12px); }
  .admin-mobile-toggle { background:#0f172a; color:#fff; border:1px solid rgba(255,255,255,.08); }
  .admin-sidebar { display:block !important; visibility:visible !important; }
  .admin-sidebar .admin-nav { margin-top: 10px; }
  .admin-main { padding-top: 74px; }
}

.admin-boot-loader{z-index:3005;}
.admin-boot-loader .site-loader-card{width:min(92vw,440px);}
@media (max-width:900px){
  .admin-mobile-bar{display:flex;position:fixed;top:12px;right:12px;z-index:1705;}
  .admin-sidebar{max-width:340px;width:min(88vw,340px);}
}


@media (max-width:900px){.admin-topbar{padding-inline-end:64px}.table-wrap{overflow:auto;-webkit-overflow-scrolling:touch}.data-table{min-width:760px}.admin-main .panel{animation:none}.admin-sidebar{box-shadow:-12px 0 32px rgba(15,23,42,.22)}}

@media (max-width:900px){#adminOverlay.is-visible{display:block;opacity:1;pointer-events:auto}.admin-mobile-toggle,.admin-sidebar-close{cursor:pointer;touch-action:manipulation}.admin-sidebar{will-change:transform,opacity}.admin-main{overflow-x:hidden}}