:root {
  --admin-sidebar-width: 276px;
  --admin-sidebar-collapsed: 82px;
  --admin-topbar-height: 68px;
  --admin-radius: 14px;
  --admin-radius-sm: 10px;
  --admin-bg: #f5f7fb;
  --admin-surface: #ffffff;
  --admin-surface-2: #f8fafc;
  --admin-text: #172033;
  --admin-muted: #718096;
  --admin-border: #e7ebf1;
  --admin-primary: #335cff;
  --admin-primary-rgb: 51, 92, 255;
  --admin-primary-soft: rgba(51,92,255,.10);
  --admin-success: #16a36a;
  --admin-warning: #d98b16;
  --admin-danger: #d84452;
  --admin-info: #1687d9;
  --admin-sidebar-bg: #101828;
  --admin-sidebar-text: #98a2b3;
  --admin-sidebar-active: #ffffff;
  --admin-shadow: 0 10px 30px rgba(16,24,40,.06);
  --admin-shadow-lg: 0 18px 48px rgba(16,24,40,.10);
}

html[data-accent="violet"] { --admin-primary:#7c3aed; --admin-primary-rgb:124,58,237; --admin-primary-soft:rgba(124,58,237,.11); }
html[data-accent="emerald"] { --admin-primary:#059669; --admin-primary-rgb:5,150,105; --admin-primary-soft:rgba(5,150,105,.11); }
html[data-accent="orange"] { --admin-primary:#ea580c; --admin-primary-rgb:234,88,12; --admin-primary-soft:rgba(234,88,12,.11); }
html[data-accent="rose"] { --admin-primary:#e11d48; --admin-primary-rgb:225,29,72; --admin-primary-soft:rgba(225,29,72,.11); }

[data-bs-theme="dark"] {
  --admin-bg: #0c111d;
  --admin-surface: #111827;
  --admin-surface-2: #182132;
  --admin-text: #f5f7fa;
  --admin-muted: #98a2b3;
  --admin-border: #273244;
  --admin-sidebar-bg: #080d17;
  --admin-shadow: 0 10px 30px rgba(0,0,0,.22);
  --admin-shadow-lg: 0 18px 48px rgba(0,0,0,.32);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background: var(--admin-bg);
  color: var(--admin-text);
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
}
a { text-decoration: none; }
button, input, select, textarea { font: inherit; }
.text-secondary { color: var(--admin-muted)!important; }
.bg-body-tertiary { background: var(--admin-surface-2)!important; }
.border { border-color: var(--admin-border)!important; }

.admin-shell { min-height: 100vh; }
.admin-sidebar {
  position: fixed;
  inset: 0 auto 0 0;
  z-index: 1045;
  width: var(--admin-sidebar-width);
  background: var(--admin-sidebar-bg);
  color: var(--admin-sidebar-text);
  transition: width .22s ease, transform .22s ease;
  display: flex;
  flex-direction: column;
}
.admin-brand {
  min-height: var(--admin-topbar-height);
  padding: 0 18px;
  display: flex;
  align-items: center;
  gap: 12px;
  color: #fff;
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.admin-brand:hover { color:#fff; }
.admin-brand-mark {
  width: 38px;
  height: 38px;
  border-radius: 11px;
  background: linear-gradient(135deg, color-mix(in srgb, var(--admin-primary) 70%, white), var(--admin-primary));
  display: grid;
  place-items: center;
  font-weight: 800;
  flex: 0 0 auto;
  box-shadow: 0 8px 20px rgba(var(--admin-primary-rgb),.28);
}
.admin-brand-copy { min-width: 0; }
.admin-brand-title { font-weight: 800; line-height: 1.05; letter-spacing: -.02em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:176px; }
.admin-brand-subtitle { font-size: 11px; color: #98a2b3; margin-top: 2px; }
.admin-sidebar-scroll { overflow-y: auto; padding: 12px 12px 20px; flex: 1; scrollbar-width:thin; scrollbar-color:#344054 transparent; }
.admin-sidebar-footer { padding:12px; border-top:1px solid rgba(255,255,255,.08); }
.admin-nav-section {
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .12em;
  color: #667085;
  padding: 15px 12px 7px;
}
.admin-nav-link,
.admin-nav-button {
  width: 100%;
  border: 0;
  background: transparent;
  color: var(--admin-sidebar-text);
  min-height: 44px;
  padding: 10px 12px;
  display: flex;
  align-items: center;
  gap: 12px;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 650;
  text-align: start;
  transition: .18s ease;
}
.admin-nav-link:hover,
.admin-nav-button:hover { color: #fff; background: rgba(255,255,255,.07); }
.admin-nav-link.active { color: var(--admin-sidebar-active); background: rgba(var(--admin-primary-rgb),.20); box-shadow: inset 3px 0 var(--admin-primary); }
.admin-nav-link i,
.admin-nav-button i:first-child { font-size: 18px; width: 20px; text-align: center; flex:0 0 20px; }
.admin-nav-button .chevron { margin-inline-start: auto; font-size: 13px; transition: transform .18s ease; }
.admin-nav-button[aria-expanded="true"] .chevron { transform: rotate(180deg); }
.admin-subnav { padding: 4px 0 7px 32px; }
.admin-subnav .admin-nav-link { min-height: 37px; font-size: 13px; padding-block:8px; }
.admin-subnav .admin-nav-link i { font-size:7px; width:12px; }
.admin-version { padding:10px 12px; color:#667085; font-size:11px; display:flex; justify-content:space-between; gap:8px; }

.admin-main {
  margin-left: var(--admin-sidebar-width);
  min-width: 0;
  padding-top: var(--admin-topbar-height);
  transition: margin-left .22s ease, margin-right .22s ease;
}
.admin-topbar {
  height: var(--admin-topbar-height);
  position: fixed;
  top: 0;
  left: var(--admin-sidebar-width);
  right: 0;
  z-index: 1040;
  transition: left .22s ease, right .22s ease, background-color .18s ease;
  background: var(--admin-surface);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  border-bottom: 1px solid var(--admin-border);
  display: flex;
  align-items: center;
  padding: 0 24px;
  gap: 12px;
}
.admin-page { padding: 24px; max-width: 1800px; width:100%; margin-inline:auto; }
.admin-search { width: min(430px, 42vw); position: relative; }
.admin-search > i { position: absolute; left: 14px; top: 50%; transform: translateY(-50%); color: var(--admin-muted); z-index:2; }
.admin-search input { padding-left: 40px; background: var(--admin-surface-2); border-color: transparent; }
.admin-search input:focus { background: var(--admin-surface); border-color: rgba(var(--admin-primary-rgb),.28); box-shadow: 0 0 0 .2rem rgba(var(--admin-primary-rgb),.08); }
.admin-search-kbd { position:absolute; right:10px; top:50%; transform:translateY(-50%); color:var(--admin-muted); font-size:10px; border:1px solid var(--admin-border); border-radius:5px; padding:2px 5px; background:var(--admin-surface); }
.icon-btn {
  width: 40px;
  height: 40px;
  display: inline-grid;
  place-items: center;
  border: 1px solid var(--admin-border);
  border-radius: 11px;
  background: var(--admin-surface);
  color: var(--admin-text);
  position: relative;
  flex:0 0 auto;
}
.icon-btn:hover { background: var(--admin-surface-2); color:var(--admin-primary); }
.notification-dot { position:absolute; top:7px; right:7px; width:7px; height:7px; border-radius:50%; background:#f04438; border:2px solid var(--admin-surface); }
.avatar { width: 36px; height: 36px; border-radius: 50%; object-fit: cover; background: var(--admin-primary-soft); color: var(--admin-primary); display:grid; place-items:center; font-weight:800; flex:0 0 auto; }
.avatar.avatar-lg { width:68px; height:68px; font-size:1.25rem; }
.avatar.avatar-xl { width:96px; height:96px; font-size:1.75rem; }

.page-heading h1 { margin: 0; font-size: clamp(1.35rem, 2vw, 1.75rem); font-weight: 800; letter-spacing: -.025em; }
.page-heading p { color: var(--admin-muted); margin: 5px 0 0; font-size: .92rem; }
.breadcrumb { --bs-breadcrumb-divider: '›'; margin-bottom: 0; font-size: .82rem; }
.breadcrumb a { color:var(--admin-muted); }

.admin-card {
  background: var(--admin-surface);
  border: 1px solid var(--admin-border);
  border-radius: var(--admin-radius);
  box-shadow: var(--admin-shadow);
}
.admin-card-header { padding: 17px 20px; border-bottom: 1px solid var(--admin-border); display:flex; align-items:center; justify-content:space-between; gap:12px; }
.admin-card-body { padding: 20px; }
.admin-card-footer { padding:14px 20px; border-top:1px solid var(--admin-border); }
.admin-card-title { font-weight:800; font-size:.95rem; margin:0; }
.admin-card-subtitle { color:var(--admin-muted); font-size:.78rem; margin-top:2px; }
.stat-card { padding: 18px; height:100%; overflow:hidden; position:relative; }
.stat-card::after { content:""; position:absolute; width:85px; height:85px; border-radius:50%; background:var(--admin-primary-soft); right:-35px; top:-35px; opacity:.65; }
.stat-icon { width: 46px; height: 46px; display:grid; place-items:center; border-radius: 12px; font-size:21px; background: var(--admin-primary-soft); color: var(--admin-primary); position:relative; z-index:1; }
.stat-label { color: var(--admin-muted); font-weight:650; font-size:.82rem; }
.stat-value { font-size: 1.65rem; font-weight: 800; letter-spacing: -.03em; margin-top: 4px; }
.stat-change { font-size: .78rem; font-weight: 700; }
.mini-chart { height:54px; margin-top:8px; }

.badge-soft-success { background: rgba(22,163,106,.11); color: #14835a; }
.badge-soft-warning { background: rgba(217,139,22,.12); color: #a8680c; }
.badge-soft-danger { background: rgba(216,68,82,.11); color: #b63240; }
.badge-soft-info { background: rgba(22,135,217,.11); color: #126cac; }
.badge-soft-primary { background: var(--admin-primary-soft); color: var(--admin-primary); }
.badge-soft-secondary { background:color-mix(in srgb, var(--admin-muted) 12%, transparent); color:var(--admin-muted); }
.status-badge { display:inline-flex; align-items:center; gap:6px; border-radius:999px; padding:5px 9px; font-size:.72rem; font-weight:750; white-space:nowrap; }
.status-badge::before { content:""; width:6px; height:6px; border-radius:50%; background:currentColor; }

.table { --bs-table-bg:transparent; --bs-table-color:var(--admin-text); margin-bottom:0; }
.table > :not(caption) > * > * { padding: .9rem .85rem; border-color: var(--admin-border); vertical-align: middle; }
.table thead th { color: var(--admin-muted); font-size:.71rem; text-transform:uppercase; letter-spacing:.045em; font-weight:800; white-space:nowrap; background:color-mix(in srgb, var(--admin-surface-2) 72%, transparent); }
.table tbody td { font-size:.86rem; }
.table-hover > tbody > tr:hover > * { --bs-table-bg-state:var(--admin-surface-2); color:var(--admin-text); }
.table-actions { display:flex; justify-content:flex-end; gap:6px; }
.table-user { display:flex; align-items:center; gap:10px; min-width:180px; }
.table-user .avatar { width:34px; height:34px; font-size:.72rem; }
.dt-container { padding:0; }
.dt-container .dt-layout-row { margin:0!important; padding:14px 18px; gap:10px; }
.dt-container .dt-layout-row:first-child { border-bottom:1px solid var(--admin-border); }
.dt-container .dt-layout-row:last-child { border-top:1px solid var(--admin-border); }
.dt-container .dt-search input,
.dt-container .dt-length select { border:1px solid var(--admin-border)!important; border-radius:9px!important; background:var(--admin-surface)!important; color:var(--admin-text)!important; min-height:38px; }
.dt-container .dt-paging .dt-paging-button { border-radius:8px!important; color:var(--admin-text)!important; }
.dt-container .dt-paging .dt-paging-button.current { background:var(--admin-primary)!important; color:#fff!important; border-color:var(--admin-primary)!important; }

.form-control, .form-select { border-color: var(--admin-border); background-color: var(--admin-surface); color: var(--admin-text); border-radius: 10px; min-height: 42px; }
.form-control::placeholder { color:color-mix(in srgb, var(--admin-muted) 78%, transparent); }
.form-control:focus, .form-select:focus { border-color: rgba(var(--admin-primary-rgb),.45); box-shadow: 0 0 0 .2rem rgba(var(--admin-primary-rgb),.09); background-color:var(--admin-surface); color:var(--admin-text); }
.form-label { font-size:.82rem; font-weight:700; }
.form-text { color:var(--admin-muted); }
.input-group-text { background:var(--admin-surface-2); border-color:var(--admin-border); color:var(--admin-muted); }
.form-check-input:checked { background-color:var(--admin-primary); border-color:var(--admin-primary); }
.btn-primary { --bs-btn-bg:var(--admin-primary); --bs-btn-border-color:var(--admin-primary); --bs-btn-hover-bg:color-mix(in srgb,var(--admin-primary) 88%,black); --bs-btn-hover-border-color:color-mix(in srgb,var(--admin-primary) 88%,black); }
.btn-outline-primary { --bs-btn-color:var(--admin-primary); --bs-btn-border-color:var(--admin-primary); --bs-btn-hover-bg:var(--admin-primary); --bs-btn-hover-border-color:var(--admin-primary); }
.modal-content { border: 0; border-radius: 16px; background: var(--admin-surface); color:var(--admin-text); box-shadow:var(--admin-shadow-lg); }
.modal-header, .modal-footer { border-color:var(--admin-border); }
.dropdown-menu { border-color: var(--admin-border); border-radius: 12px; box-shadow: var(--admin-shadow-lg); background: var(--admin-surface); color:var(--admin-text); }
.dropdown-item { color:var(--admin-text); border-radius:8px; }
.dropdown-item:hover, .dropdown-item:focus { background:var(--admin-surface-2); color:var(--admin-text); }
.nav-pills .nav-link { color:var(--admin-text); border-radius:9px; }
.nav-pills .nav-link.active { background:var(--admin-primary); }
.accordion { --bs-accordion-bg:var(--admin-surface); --bs-accordion-color:var(--admin-text); --bs-accordion-border-color:var(--admin-border); --bs-accordion-btn-bg:var(--admin-surface); --bs-accordion-btn-color:var(--admin-text); --bs-accordion-active-bg:var(--admin-primary-soft); --bs-accordion-active-color:var(--admin-primary); }

.quick-action { border:1px solid var(--admin-border); border-radius:12px; padding:14px; display:flex; align-items:center; gap:12px; color:var(--admin-text); background:var(--admin-surface); transition:.18s; height:100%; }
.quick-action:hover { transform:translateY(-2px); border-color:rgba(var(--admin-primary-rgb),.3); box-shadow:var(--admin-shadow); color:var(--admin-text); }
.quick-action i { width:38px; height:38px; display:grid; place-items:center; border-radius:10px; background:var(--admin-primary-soft); color:var(--admin-primary); flex:0 0 auto; }

.activity-item { display:flex; gap:12px; padding:12px 0; border-bottom:1px solid var(--admin-border); }
.activity-item:last-child { border-bottom:0; }
.activity-icon { width:34px; height:34px; border-radius:50%; display:grid; place-items:center; flex:0 0 auto; background:var(--admin-primary-soft); color:var(--admin-primary); }
.activity-title { font-size:.86rem; font-weight:700; }
.activity-time { font-size:.76rem; color:var(--admin-muted); }

.notification-item { display:flex; gap:12px; padding:14px 16px; border-bottom:1px solid var(--admin-border); color:var(--admin-text); position:relative; }
.notification-item:last-child { border-bottom:0; }
.notification-item:hover { background:var(--admin-surface-2); color:var(--admin-text); }
.notification-item.unread { background:color-mix(in srgb, var(--admin-primary-soft) 45%, var(--admin-surface)); }
.notification-item.unread::after { content:""; position:absolute; right:14px; top:20px; width:7px; height:7px; border-radius:50%; background:var(--admin-primary); }
.notification-icon { width:38px; height:38px; border-radius:11px; display:grid; place-items:center; flex:0 0 auto; background:var(--admin-primary-soft); color:var(--admin-primary); }

.profile-cover { height:150px; border-radius:var(--admin-radius) var(--admin-radius) 0 0; background:linear-gradient(120deg,var(--admin-primary),#7a8dff); position:relative; overflow:hidden; }
.profile-cover::before,.profile-cover::after { content:""; position:absolute; border-radius:50%; background:rgba(255,255,255,.10); }
.profile-cover::before { width:230px;height:230px;right:-80px;top:-90px; }
.profile-cover::after { width:130px;height:130px;left:12%;bottom:-70px; }
.profile-avatar-wrap { margin-top:-48px; position:relative; z-index:2; }
.profile-avatar { width:96px; height:96px; border-radius:50%; border:4px solid var(--admin-surface); background:var(--admin-primary-soft); color:var(--admin-primary); display:grid; place-items:center; font-size:1.8rem; font-weight:800; }

.permission-table th:first-child,.permission-table td:first-child { position:sticky; left:0; background:var(--admin-surface); z-index:2; }
.permission-module { font-weight:800; }
.permission-count { font-size:.72rem; color:var(--admin-muted); }
.role-card { padding:18px; height:100%; }
.role-icon { width:46px; height:46px; border-radius:12px; display:grid; place-items:center; background:var(--admin-primary-soft); color:var(--admin-primary); font-size:20px; }

.report-filter { display:flex; flex-wrap:wrap; gap:10px; align-items:end; }
.chart-wrap { position:relative; min-height:320px; }
.chart-wrap-sm { position:relative; min-height:250px; }

.empty-state { text-align:center; padding:48px 20px; }
.empty-state i { font-size:2.2rem; color:var(--admin-muted); }
.skeleton { border-radius:8px; background: linear-gradient(90deg, var(--admin-surface-2) 25%, color-mix(in srgb, var(--admin-surface-2) 75%, #fff) 37%, var(--admin-surface-2) 63%); background-size:400% 100%; animation:skeleton 1.4s ease infinite; }
@keyframes skeleton { 0%{background-position:100% 50%} 100%{background-position:0 50%} }

.ui-swatch { width:34px; height:34px; border-radius:10px; border:2px solid transparent; cursor:pointer; display:grid; place-items:center; color:#fff; }
.ui-swatch.active { outline:3px solid var(--admin-primary-soft); border-color:var(--admin-surface); }
.ui-swatch[data-accent="blue"]{background:#335cff}.ui-swatch[data-accent="violet"]{background:#7c3aed}.ui-swatch[data-accent="emerald"]{background:#059669}.ui-swatch[data-accent="orange"]{background:#ea580c}.ui-swatch[data-accent="rose"]{background:#e11d48}

.sortable-list { display:grid; gap:9px; }
.sortable-item { border:1px solid var(--admin-border); border-radius:10px; padding:11px 12px; display:flex; align-items:center; gap:10px; background:var(--admin-surface); }
.sortable-handle { cursor:grab; color:var(--admin-muted); }
.sortable-ghost { opacity:.45; }

.stepper { display:flex; align-items:center; gap:0; overflow:auto; padding-bottom:2px; }
.stepper-step { display:flex; align-items:center; flex:1; min-width:150px; color:var(--admin-muted); }
.stepper-step:not(:last-child)::after { content:""; height:2px; background:var(--admin-border); flex:1; margin:0 12px; }
.stepper-number { width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--admin-surface-2);border:1px solid var(--admin-border);font-weight:800;font-size:.78rem;flex:0 0 auto; }
.stepper-step.active { color:var(--admin-primary); }
.stepper-step.active .stepper-number,.stepper-step.complete .stepper-number { background:var(--admin-primary);border-color:var(--admin-primary);color:#fff; }
.stepper-step.complete:not(:last-child)::after { background:var(--admin-primary); }

.auth-page { min-height:100vh; display:grid; grid-template-columns:minmax(0,1.05fr) minmax(420px,.95fr); background:var(--admin-bg); }
.auth-visual { position:relative; overflow:hidden; background:linear-gradient(145deg,#0f172a,#172554 55%,var(--admin-primary)); color:#fff; padding:clamp(32px,5vw,72px); display:flex; flex-direction:column; justify-content:space-between; }
.auth-visual::before,.auth-visual::after { content:"";position:absolute;border-radius:50%;background:rgba(255,255,255,.08); }
.auth-visual::before { width:420px;height:420px;right:-170px;top:-120px; }
.auth-visual::after { width:300px;height:300px;left:-130px;bottom:-120px; }
.auth-form-wrap { display:flex; align-items:center; justify-content:center; padding:32px; background:var(--admin-surface); }
.auth-card { width:min(430px,100%); }
.auth-logo { display:flex; align-items:center; gap:10px; color:var(--admin-text); font-weight:800; font-size:1.1rem; margin-bottom:28px; }
.auth-logo .admin-brand-mark { width:36px;height:36px;color:#fff; }
.error-page { min-height:100vh; display:grid; place-items:center; background:var(--admin-bg); padding:24px; }
.error-code { font-size:clamp(5rem,16vw,10rem); font-weight:900; letter-spacing:-.08em; line-height:.8; color:var(--admin-primary); opacity:.14; }

.admin-footer { color:var(--admin-muted); font-size:.8rem; padding:6px 24px 24px; }

/* Compact sidebar */
body.sidebar-collapsed .admin-sidebar { width: var(--admin-sidebar-collapsed); }
body.sidebar-collapsed .admin-main { margin-left: var(--admin-sidebar-collapsed); }
body.sidebar-collapsed .admin-topbar { left: var(--admin-sidebar-collapsed); }
body.sidebar-collapsed .admin-brand-copy,
body.sidebar-collapsed .nav-copy,
body.sidebar-collapsed .admin-nav-section,
body.sidebar-collapsed .admin-nav-button .chevron,
body.sidebar-collapsed .admin-version { display:none; }
body.sidebar-collapsed .admin-nav-link,
body.sidebar-collapsed .admin-nav-button { justify-content:center; padding-inline:10px; }
body.sidebar-collapsed .admin-subnav { padding-left:0; padding-right:0; }
body.sidebar-collapsed .admin-nav-link.active { box-shadow:none; }
body.sidebar-collapsed .admin-subnav.collapse:not(.show) { display:none; }

/* RTL */
html[dir="rtl"] .admin-sidebar { inset:0 0 0 auto; }
html[dir="rtl"] .admin-main { margin-left:0; margin-right:var(--admin-sidebar-width); }
html[dir="rtl"] .admin-topbar { left:0; right:var(--admin-sidebar-width); }
html[dir="rtl"] .admin-nav-link.active { box-shadow:inset -3px 0 var(--admin-primary); }
html[dir="rtl"] .admin-search > i { left:auto; right:14px; }
html[dir="rtl"] .admin-search input { padding-left:12px; padding-right:40px; }
html[dir="rtl"] .admin-search-kbd { right:auto; left:10px; }
html[dir="rtl"] .permission-table th:first-child,html[dir="rtl"] .permission-table td:first-child { left:auto; right:0; }
html[dir="rtl"] body.sidebar-collapsed .admin-main { margin-right:var(--admin-sidebar-collapsed); }
html[dir="rtl"] body.sidebar-collapsed .admin-topbar { left:0; right:var(--admin-sidebar-collapsed); }

@media (max-width: 1199.98px) {
  .admin-search { width:min(330px,34vw); }
}
@media (max-width: 991.98px) {
  .admin-sidebar { transform: translateX(-100%); width: var(--admin-sidebar-width)!important; box-shadow: 20px 0 50px rgba(0,0,0,.25); }
  html[dir="rtl"] .admin-sidebar { transform:translateX(100%); box-shadow:-20px 0 50px rgba(0,0,0,.25); }
  body.sidebar-open .admin-sidebar { transform: translateX(0); }
  .admin-main, body.sidebar-collapsed .admin-main, html[dir="rtl"] .admin-main, html[dir="rtl"] body.sidebar-collapsed .admin-main { margin-left:0; margin-right:0; }
  .admin-topbar,
  body.sidebar-collapsed .admin-topbar,
  html[dir="rtl"] .admin-topbar,
  html[dir="rtl"] body.sidebar-collapsed .admin-topbar { left:0; right:0; }
  body.sidebar-collapsed .admin-brand-copy,
  body.sidebar-collapsed .nav-copy,
  body.sidebar-collapsed .admin-nav-section,
  body.sidebar-collapsed .admin-nav-button .chevron,
  body.sidebar-collapsed .admin-version { display:initial; }
  body.sidebar-collapsed .admin-nav-link,
  body.sidebar-collapsed .admin-nav-button { justify-content:flex-start; }
  .admin-search { width:100%; max-width:360px; }
  .admin-sidebar-backdrop { display:none; position:fixed; inset:0; z-index:1040; background:rgba(0,0,0,.45); }
  body.sidebar-open .admin-sidebar-backdrop { display:block; }
  .auth-page { grid-template-columns:1fr; }
  .auth-visual { display:none; }
}
@media (max-width: 767.98px) {
  .admin-page { padding:18px; }
  .admin-search { display:none; }
  .admin-topbar { padding-inline:16px; }
  .report-filter > * { flex:1 1 180px; }
  .stepper-step { min-width:120px; }
}
@media (max-width: 575.98px) {
  .admin-topbar { padding:0 12px; gap:7px; }
  .admin-page { padding:14px; }
  .user-copy { display:none; }
  .admin-card-header, .admin-card-body { padding:15px; }
  .stat-value { font-size:1.45rem; }
  .page-actions .btn { flex:1; }
  .auth-form-wrap { padding:22px; }
}

@media print {
  .admin-sidebar, .admin-topbar, .admin-footer, .no-print { display:none!important; }
  .admin-main, html[dir="rtl"] .admin-main { margin:0!important; padding-top:0!important; }
  .admin-page { padding:0!important; max-width:none; }
  .admin-card { box-shadow:none; border-color:#ddd; break-inside:avoid; }
  body { background:#fff; color:#000; }
}

/* =========================================================
   v1.2.2 — Reference-style sidebar + topbar alignment
   ========================================================= */
:root {
  --admin-sidebar-width: 270px;
  --admin-sidebar-collapsed: 78px;
  --admin-sidebar-bg: #5a2f4e;
  --admin-sidebar-head: #4b4945;
  --admin-sidebar-footer-bg: #66485d;
  --admin-sidebar-text: #ead9e4;
  --admin-sidebar-muted: #b895ad;
  --admin-sidebar-active: #ffffff;
  --admin-sidebar-accent: #e94c91;
}

.admin-sidebar {
  background: var(--admin-sidebar-bg);
  color: var(--admin-sidebar-text);
  overflow: hidden;
  border-right: 1px solid rgba(255,255,255,.08);
}

.admin-sidebar-brand-wrap {
  background: var(--admin-sidebar-head);
  border-bottom: 1px solid var(--admin-sidebar-accent);
  flex: 0 0 auto;
}

.admin-brand {
  min-height: 98px;
  padding: 16px 22px;
  gap: 13px;
  border-bottom: 0;
}

.admin-brand-mark {
  width: 52px;
  height: 52px;
  border-radius: 12px;
  background: #ffffff;
  color: #f0b400;
  font-size: 1.15rem;
  font-weight: 900;
  box-shadow: none;
  border: 1px solid rgba(255,255,255,.72);
}

.admin-brand-title {
  color: #fff;
  font-size: 17px;
  line-height: 1.1;
  letter-spacing: -.02em;
}

.admin-brand-subtitle {
  color: #d6c0cc;
  font-size: 12px;
  margin-top: 4px;
}

.admin-sidebar-scroll {
  padding: 13px 10px 18px;
  scrollbar-width: thin;
  scrollbar-color: rgba(255,255,255,.62) rgba(255,255,255,.08);
}
.admin-sidebar-scroll::-webkit-scrollbar { width: 8px; }
.admin-sidebar-scroll::-webkit-scrollbar-track { background: rgba(255,255,255,.08); }
.admin-sidebar-scroll::-webkit-scrollbar-thumb {
  background: rgba(255,255,255,.58);
  border-radius: 999px;
  border: 2px solid transparent;
  background-clip: padding-box;
}
.admin-sidebar-scroll::-webkit-scrollbar-thumb:hover { background: rgba(255,255,255,.76); background-clip: padding-box; }

.admin-nav-section {
  color: var(--admin-sidebar-muted);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .16em;
  padding: 12px 14px 7px;
}
.admin-nav-section:not(:first-child) { margin-top: 2px; }

.admin-nav-link,
.admin-nav-button {
  color: var(--admin-sidebar-text);
  min-height: 45px;
  padding: 9px 14px;
  gap: 13px;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 650;
  line-height: 1.35;
}

.admin-nav-link i,
.admin-nav-button i:first-child {
  color: var(--admin-sidebar-muted);
  font-size: 19px;
  width: 22px;
  flex-basis: 22px;
}

.admin-nav-link:hover,
.admin-nav-button:hover,
.admin-nav-button.active-parent {
  color: #fff;
  background: rgba(255,255,255,.07);
}
.admin-nav-link:hover i,
.admin-nav-button:hover i:first-child,
.admin-nav-button.active-parent i:first-child { color: #fff; }

.admin-nav-link.active {
  color: #fff;
  background: rgba(255,255,255,.105);
  box-shadow: inset 3px 0 var(--admin-sidebar-accent);
}
.admin-nav-link.active i { color:#fff; }

.admin-nav-button .chevron {
  color: var(--admin-sidebar-muted);
  font-size: 13px;
  margin-inline-start: auto;
  transform: none;
}
.admin-nav-button[aria-expanded="true"] .chevron { transform: rotate(90deg); }
html[dir="rtl"] .admin-nav-button[aria-expanded="true"] .chevron { transform: rotate(-90deg); }

.admin-subnav {
  padding: 3px 4px 7px 35px;
}
.admin-subnav .admin-nav-link {
  min-height: 36px;
  font-size: 13px;
  padding: 7px 10px;
  gap: 10px;
}
.admin-subnav-link .subnav-dot {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--admin-sidebar-muted);
  flex: 0 0 auto;
}
.admin-subnav-link.active .subnav-dot,
.admin-subnav-link:hover .subnav-dot { background:#fff; }

.admin-sidebar-footer {
  padding: 0;
  background: var(--admin-sidebar-footer-bg);
  border-top: 1px solid var(--admin-sidebar-accent);
  flex: 0 0 auto;
}

.admin-account-card {
  min-height: 77px;
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 12px 18px;
  color: #fff;
}
.admin-account-card:hover { color:#fff; background:rgba(255,255,255,.055); }
.admin-account-avatar {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  background: #f0b400;
  color: #4b263f;
  border: 2px solid rgba(255,255,255,.8);
  font-size: .8rem;
  font-weight: 900;
  box-shadow: 0 0 0 2px rgba(0,0,0,.18);
}
.admin-account-copy { min-width: 0; flex: 1; line-height:1.15; }
.admin-account-copy strong {
  display:block;
  font-size: 13px;
  font-weight: 800;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.admin-account-copy small {
  display:block;
  color:#d6c0cc;
  font-size: 9.5px;
  margin-top: 4px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.admin-account-role {
  display:block;
  color:#c7a8ba;
  font-size: 9px;
  font-weight: 800;
  letter-spacing:.03em;
  margin-top: 3px;
}
.admin-account-arrow { color:#c7a8ba; font-size:12px; }

/* Topbar: controls stay at far right. */
.admin-topbar {
  justify-content: space-between;
}
.admin-topbar-start {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 12px;
  flex: 1 1 auto;
}
.admin-topbar-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  margin-inline-start: auto;
  flex: 0 0 auto;
}
.admin-topbar-start .admin-search { flex:0 1 430px; }
.topbar-profile { white-space:nowrap; }

/* Collapsed reference sidebar */
body.sidebar-collapsed .admin-sidebar-brand-wrap { min-height: var(--admin-topbar-height); }
body.sidebar-collapsed .admin-brand {
  min-height: var(--admin-topbar-height);
  justify-content: center;
  padding: 8px;
}
body.sidebar-collapsed .admin-brand-mark { width:42px; height:42px; }
body.sidebar-collapsed .admin-sidebar-scroll { padding-inline: 8px; }
body.sidebar-collapsed .admin-sidebar-footer { padding:8px 0; }
body.sidebar-collapsed .admin-account-card { justify-content:center; min-height:58px; padding:8px; }
body.sidebar-collapsed .admin-account-copy,
body.sidebar-collapsed .admin-account-arrow { display:none; }
body.sidebar-collapsed .admin-account-avatar { width:40px; height:40px; }
body.sidebar-collapsed .admin-nav-link.active { box-shadow: inset 3px 0 var(--admin-sidebar-accent); }

/* RTL alignment for the new subnav/account layout */
html[dir="rtl"] .admin-subnav { padding-left:4px; padding-right:35px; }
html[dir="rtl"] .admin-nav-link.active { box-shadow: inset -3px 0 var(--admin-sidebar-accent); }
html[dir="rtl"] .admin-account-arrow { transform:rotate(180deg); }

@media (max-width: 991.98px) {
  .admin-brand { min-height: 88px; }
  body.sidebar-collapsed .admin-brand { min-height:88px; justify-content:flex-start; padding:16px 22px; }
  body.sidebar-collapsed .admin-brand-mark { width:52px; height:52px; }
  body.sidebar-collapsed .admin-account-card { justify-content:flex-start; min-height:77px; padding:12px 18px; }
  body.sidebar-collapsed .admin-account-copy { display:block; }
  body.sidebar-collapsed .admin-account-arrow { display:inline-block; margin-inline-start:auto; }
  .admin-topbar-start { gap:8px; }
  .admin-topbar-actions { gap:8px; }
}

@media (max-width: 767.98px) {
  .admin-topbar-start { flex: 0 1 auto; }
  .admin-topbar-actions { gap:7px; }
}

@media (max-width: 575.98px) {
  .admin-topbar-actions .dropdown:has(#themeIcon) { display:none; }
  .topbar-profile { gap:4px!important; }
  .topbar-profile > .fa-chevron-down { display:none; }
}

/* =========================================================
   v1.2.3 — Topbar matches the plum sidebar
   ========================================================= */
:root {
  --admin-topbar-bg: var(--admin-sidebar-bg);
  --admin-topbar-text: #ffffff;
  --admin-topbar-muted: #d6c0cc;
  --admin-topbar-control-bg: rgba(255,255,255,.075);
  --admin-topbar-control-border: rgba(255,255,255,.20);
  --admin-topbar-control-hover: rgba(255,255,255,.14);
  --admin-topbar-search-bg: rgba(255,255,255,.10);
}

.admin-topbar {
  background: var(--admin-topbar-bg);
  color: var(--admin-topbar-text);
  border-bottom-color: var(--admin-sidebar-accent);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  box-shadow: 0 1px 0 rgba(0,0,0,.08);
}

.admin-topbar .icon-btn {
  background: var(--admin-topbar-control-bg);
  border-color: var(--admin-topbar-control-border);
  color: var(--admin-topbar-text);
}
.admin-topbar .icon-btn:hover,
.admin-topbar .icon-btn:focus-visible {
  background: var(--admin-topbar-control-hover);
  border-color: rgba(255,255,255,.34);
  color: #fff;
}

.admin-topbar .notification-dot {
  border-color: var(--admin-topbar-bg);
}

.admin-topbar .admin-search > i {
  color: var(--admin-topbar-muted);
}
.admin-topbar .admin-search input {
  color: #fff;
  background: var(--admin-topbar-search-bg);
  border-color: rgba(255,255,255,.12);
}
.admin-topbar .admin-search input::placeholder {
  color: var(--admin-topbar-muted);
  opacity: 1;
}
.admin-topbar .admin-search input:focus {
  color: #fff;
  background: rgba(255,255,255,.135);
  border-color: rgba(255,255,255,.34);
  box-shadow: 0 0 0 .2rem rgba(255,255,255,.08);
}
.admin-topbar .admin-search-kbd {
  color: var(--admin-topbar-muted);
  background: rgba(255,255,255,.08);
  border-color: rgba(255,255,255,.18);
}

.admin-topbar .topbar-profile,
.admin-topbar .topbar-profile.text-body {
  color: #fff !important;
}
.admin-topbar .topbar-profile:hover,
.admin-topbar .topbar-profile:focus-visible {
  background: rgba(255,255,255,.07);
}
.admin-topbar .topbar-profile .text-secondary {
  color: var(--admin-topbar-muted) !important;
}
.admin-topbar .topbar-profile .avatar {
  background: rgba(255,255,255,.14);
  color: #fff;
  border: 1px solid rgba(255,255,255,.16);
}
.admin-topbar .topbar-profile > .fa-chevron-down {
  color: var(--admin-topbar-muted);
}

/* Keep Bootstrap dropdowns readable: only the fixed bar itself is plum. */
.admin-topbar .dropdown-menu {
  color: var(--admin-text);
}

/* =========================================================
   v1.2.5 — Collapsed sidebar hover flyouts
   ========================================================= */
@media (min-width: 992px) {
  /* A compact group is represented by its parent icon only. Child dots/links
     live in the temporary flyout and must not occupy the rail. */
  body.sidebar-collapsed .admin-subnav,
  body.sidebar-collapsed .admin-subnav.show,
  body.sidebar-collapsed .admin-subnav.collapsing {
    display: none !important;
    height: 0 !important;
    overflow: hidden !important;
  }

  body.sidebar-collapsed .admin-nav-link,
  body.sidebar-collapsed .admin-nav-button,
  body.sidebar-collapsed .admin-account-card {
    cursor: pointer;
  }

  body.sidebar-collapsed .admin-nav-link.flyout-open,
  body.sidebar-collapsed .admin-nav-button.flyout-open,
  body.sidebar-collapsed .admin-account-card.flyout-open {
    color: #fff;
    background: rgba(255,255,255,.12);
  }
  body.sidebar-collapsed .admin-nav-link.flyout-open i,
  body.sidebar-collapsed .admin-nav-button.flyout-open i:first-child {
    color: #fff;
  }
}

.admin-sidebar-flyout {
  position: fixed;
  z-index: 1095;
  width: 238px;
  max-width: calc(100vw - 24px);
  padding: 7px;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 10px;
  background: var(--admin-sidebar-bg);
  color: var(--admin-sidebar-text);
  box-shadow: 0 16px 38px rgba(25,10,22,.28);
  animation: adminFlyoutIn .12s ease-out;
}

@keyframes adminFlyoutIn {
  from { opacity: 0; transform: translateX(-4px) scale(.985); }
  to { opacity: 1; transform: translateX(0) scale(1); }
}
html[dir="rtl"] .admin-sidebar-flyout {
  animation-name: adminFlyoutInRtl;
}
@keyframes adminFlyoutInRtl {
  from { opacity: 0; transform: translateX(4px) scale(.985); }
  to { opacity: 1; transform: translateX(0) scale(1); }
}

.admin-sidebar-flyout-title {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 42px;
  padding: 8px 10px;
  color: #fff;
  font-size: 13px;
  font-weight: 800;
  border-bottom: 1px solid rgba(255,255,255,.10);
}
.admin-sidebar-flyout-title i {
  width: 20px;
  text-align: center;
  color: var(--admin-sidebar-muted);
  font-size: 17px;
}
.admin-sidebar-flyout-menu { padding-top: 5px; }

.admin-sidebar-flyout-link,
.admin-sidebar-flyout-single {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-height: 39px;
  padding: 8px 10px;
  border-radius: 7px;
  color: var(--admin-sidebar-text);
  text-decoration: none;
  font-size: 13px;
  font-weight: 650;
}
.admin-sidebar-flyout-link > span,
.admin-sidebar-flyout-single > span { flex: 1; min-width: 0; }
.admin-sidebar-flyout-link > i:last-child,
.admin-sidebar-flyout-single > i:last-child {
  color: var(--admin-sidebar-muted);
  font-size: 11px;
}
.admin-sidebar-flyout-single > i:first-child {
  width: 20px;
  text-align: center;
  color: var(--admin-sidebar-muted);
  font-size: 17px;
}
.admin-sidebar-flyout-link:hover,
.admin-sidebar-flyout-single:hover,
.admin-sidebar-flyout-link:focus-visible,
.admin-sidebar-flyout-single:focus-visible,
.admin-sidebar-flyout-link.active,
.admin-sidebar-flyout-single.active {
  color: #fff;
  background: rgba(255,255,255,.105);
  outline: none;
}
.admin-sidebar-flyout-link:hover > i,
.admin-sidebar-flyout-single:hover > i,
.admin-sidebar-flyout-link.active > i,
.admin-sidebar-flyout-single.active > i { color:#fff; }
.admin-sidebar-flyout-link.active,
.admin-sidebar-flyout-single.active {
  box-shadow: inset 3px 0 var(--admin-sidebar-accent);
}
html[dir="rtl"] .admin-sidebar-flyout-link.active,
html[dir="rtl"] .admin-sidebar-flyout-single.active {
  box-shadow: inset -3px 0 var(--admin-sidebar-accent);
}
html[dir="rtl"] .admin-sidebar-flyout-link > i:last-child,
html[dir="rtl"] .admin-sidebar-flyout-single > i:last-child { transform: rotate(180deg); }

.admin-sidebar-flyout-account {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 9px;
  border-radius: 8px;
  color:#fff;
  text-decoration:none;
}
.admin-sidebar-flyout-account:hover { color:#fff; background:rgba(255,255,255,.08); }
.admin-sidebar-flyout-account > span:last-child { min-width:0; }
.admin-sidebar-flyout-account strong,
.admin-sidebar-flyout-account small,
.admin-sidebar-flyout-account em { display:block; }
.admin-sidebar-flyout-account strong { font-size:13px; }
.admin-sidebar-flyout-account small {
  margin-top:3px;
  color:#d6c0cc;
  font-size:10px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.admin-sidebar-flyout-account em {
  margin-top:4px;
  color:#c7a8ba;
  font-size:9px;
  font-style:normal;
  font-weight:800;
}

@media (max-width: 991.98px) {
  .admin-sidebar-flyout { display:none !important; }
}

/* =========================================================
   v1.2.6 — Animated sidebar close + active parent groups
   ========================================================= */
.admin-sidebar-brand-wrap {
  position: relative;
}

/* Leave room for the in-sidebar close control while expanded. */
.admin-sidebar-brand-wrap .admin-brand {
  padding-inline-end: 70px;
}

.admin-sidebar-collapse-btn {
  position: absolute;
  inset-inline-end: 17px;
  top: 50%;
  width: 32px;
  height: 32px;
  transform: translateY(-50%);
  border: 0;
  border-radius: 9px;
  display: inline-grid;
  place-items: center;
  background: #f45b69;
  color: #fff;
  box-shadow: 0 7px 18px rgba(244,91,105,.24);
  cursor: pointer;
  z-index: 2;
  opacity: 1;
  visibility: visible;
  transition:
    opacity .16s ease,
    visibility .16s ease,
    transform .22s cubic-bezier(.2,.8,.2,1),
    background-color .16s ease,
    box-shadow .16s ease;
}

.admin-sidebar-collapse-btn i {
  font-size: 15px;
  line-height: 1;
  transition: transform .22s cubic-bezier(.2,.8,.2,1);
}

.admin-sidebar-collapse-btn:hover,
.admin-sidebar-collapse-btn:focus-visible {
  background: #ff6b78;
  color: #fff;
  box-shadow: 0 9px 22px rgba(244,91,105,.34);
  outline: none;
}

.admin-sidebar-collapse-btn:hover i,
.admin-sidebar-collapse-btn:focus-visible i {
  transform: rotate(90deg) scale(1.06);
}

.admin-sidebar-collapse-btn.is-animating i {
  animation: adminSidebarCloseSpin .34s cubic-bezier(.2,.8,.2,1);
}

@keyframes adminSidebarCloseSpin {
  0%   { transform: rotate(0deg) scale(1); }
  45%  { transform: rotate(110deg) scale(.72); }
  100% { transform: rotate(180deg) scale(1); }
}

/* Fade the X away as the desktop sidebar becomes the compact rail. */
@media (min-width: 992px) {
  body.sidebar-collapsed .admin-sidebar-collapse-btn {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(-50%) rotate(90deg) scale(.62);
  }

  body.sidebar-collapsed .admin-sidebar-brand-wrap .admin-brand {
    padding-inline-end: 8px;
  }
}

/* On the mobile drawer the X is always available to close the sidebar. */
@media (max-width: 991.98px) {
  .admin-sidebar-brand-wrap .admin-brand,
  body.sidebar-collapsed .admin-sidebar-brand-wrap .admin-brand {
    padding-inline-end: 70px;
  }

  .admin-sidebar-collapse-btn,
  body.sidebar-collapsed .admin-sidebar-collapse-btn {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(-50%);
  }
}

/* A child page keeps its parent group visibly active too. */
.admin-nav-button.active-parent {
  color: #fff;
  background: rgba(255,255,255,.105);
  box-shadow: inset 3px 0 var(--admin-sidebar-accent);
}

.admin-nav-button.active-parent i:first-child {
  color: #fff;
}

html[dir="rtl"] .admin-nav-button.active-parent {
  box-shadow: inset -3px 0 var(--admin-sidebar-accent);
}

/* Keep the active-parent marker visible on the collapsed icon rail. */
@media (min-width: 992px) {
  body.sidebar-collapsed .admin-nav-button.active-parent {
    box-shadow: inset 3px 0 var(--admin-sidebar-accent);
  }
  html[dir="rtl"] body.sidebar-collapsed .admin-nav-button.active-parent {
    box-shadow: inset -3px 0 var(--admin-sidebar-accent);
  }
}

/* The flyout also identifies the currently active parent section. */
.admin-sidebar-flyout-title.active-parent {
  box-shadow: inset 3px 0 var(--admin-sidebar-accent);
  background: rgba(255,255,255,.055);
}
html[dir="rtl"] .admin-sidebar-flyout-title.active-parent {
  box-shadow: inset -3px 0 var(--admin-sidebar-accent);
}

/* =========================================================
   v1.2.7 — One topbar control for sidebar open / close
   ========================================================= */
/* The old in-sidebar close control is removed. Restore normal brand spacing. */
.admin-sidebar-brand-wrap .admin-brand {
  padding-inline-end: 22px;
}
body.sidebar-collapsed .admin-sidebar-brand-wrap .admin-brand {
  padding-inline-end: 8px;
}

/* One persistent topbar toggle: hamburger = closed, X = open. */
.admin-sidebar-toggle {
  position: relative;
  overflow: hidden;
}
.sidebar-toggle-icon-stack {
  position: relative;
  display: inline-block;
  width: 19px;
  height: 19px;
}
.sidebar-toggle-icon {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  font-size: 19px;
  line-height: 1;
  transition:
    opacity .18s ease,
    transform .26s cubic-bezier(.2,.8,.2,1);
}
.sidebar-toggle-open {
  opacity: 1;
  transform: rotate(0deg) scale(1);
}
.sidebar-toggle-close {
  opacity: 0;
  transform: rotate(90deg) scale(.65);
}
.admin-sidebar-toggle[aria-expanded="true"] .sidebar-toggle-open {
  opacity: 0;
  transform: rotate(-90deg) scale(.65);
}
.admin-sidebar-toggle[aria-expanded="true"] .sidebar-toggle-close {
  opacity: 1;
  transform: rotate(0deg) scale(1);
}
.admin-sidebar-toggle:hover .sidebar-toggle-icon-stack,
.admin-sidebar-toggle:focus-visible .sidebar-toggle-icon-stack {
  transform: scale(1.04);
}

@media (max-width: 991.98px) {
  .admin-sidebar-brand-wrap .admin-brand,
  body.sidebar-collapsed .admin-sidebar-brand-wrap .admin-brand {
    padding-inline-end: 22px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .sidebar-toggle-icon { transition: none; }
}


/* =========================================================
   v1.2.8 — Real submenu icons
   ========================================================= */
.admin-subnav .admin-nav-link > .subnav-icon {
  width: 18px;
  flex: 0 0 18px;
  text-align: center;
  font-size: 15px;
  color: var(--admin-sidebar-muted);
}
.admin-subnav .admin-nav-link:hover > .subnav-icon,
.admin-subnav .admin-nav-link.active > .subnav-icon {
  color: #fff;
}
.admin-sidebar-flyout-link > .admin-sidebar-flyout-child-icon {
  width: 18px;
  flex: 0 0 18px;
  text-align: center;
  color: var(--admin-sidebar-muted);
  font-size: 15px;
}
.admin-sidebar-flyout-link:hover > .admin-sidebar-flyout-child-icon,
.admin-sidebar-flyout-link:focus-visible > .admin-sidebar-flyout-child-icon,
.admin-sidebar-flyout-link.active > .admin-sidebar-flyout-child-icon {
  color: #fff;
}


/* v1.2.9 — keep the admin shell alive during native fullscreen navigation. */
body.fullscreen-route-mode .admin-page {
  padding: 0 !important;
  max-width: none !important;
  height: calc(100vh - var(--admin-topbar-height));
  overflow: hidden;
}
body.fullscreen-route-mode .admin-footer { display:none !important; }
.admin-fullscreen-route-host {
  position: relative;
  width: 100%;
  height: 100%;
  min-height: calc(100vh - var(--admin-topbar-height));
  background: var(--admin-bg);
  overflow: hidden;
}
.admin-fullscreen-route-frame {
  width: 100%;
  height: 100%;
  min-height: calc(100vh - var(--admin-topbar-height));
  display: block;
  border: 0;
  background: var(--admin-bg);
  opacity: 0;
  transition: opacity .18s ease;
}
.admin-fullscreen-route-frame.is-ready { opacity: 1; }
@media (max-width: 991.98px) {
  body.fullscreen-route-mode .admin-page,
  .admin-fullscreen-route-host,
  .admin-fullscreen-route-frame { min-height: calc(100vh - var(--admin-topbar-height)); }
}

/* =========================================================
   v1.2.10 — Fixed bottom footer
   ========================================================= */
:root {
  --admin-footer-height: 52px;
}

/* Reserve space for the fixed footer so long tables/forms are never covered. */
.admin-main {
  min-height: 100vh;
  padding-bottom: var(--admin-footer-height);
}

.admin-footer {
  position: fixed;
  left: var(--admin-sidebar-width);
  right: 0;
  bottom: 0;
  z-index: 1035;
  height: var(--admin-footer-height);
  min-height: var(--admin-footer-height);
  display: flex;
  align-items: center;
  padding: 0 24px;
  margin: 0;
  background: var(--admin-surface);
  color: var(--admin-muted);
  border-top: 1px solid var(--admin-border);
  box-shadow: 0 -1px 0 rgba(16,24,40,.02);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  transition: left .22s ease, right .22s ease, background-color .18s ease;
}

body.sidebar-collapsed .admin-footer {
  left: var(--admin-sidebar-collapsed);
}

html[dir="rtl"] .admin-footer {
  left: 0;
  right: var(--admin-sidebar-width);
}
html[dir="rtl"] body.sidebar-collapsed .admin-footer {
  left: 0;
  right: var(--admin-sidebar-collapsed);
}

@media (max-width: 991.98px) {
  .admin-footer,
  body.sidebar-collapsed .admin-footer,
  html[dir="rtl"] .admin-footer,
  html[dir="rtl"] body.sidebar-collapsed .admin-footer {
    left: 0;
    right: 0;
  }
}

@media (max-width: 575.98px) {
  :root { --admin-footer-height: 48px; }
  .admin-footer { padding-inline: 14px; font-size: .75rem; }
}

/* Fullscreen route mode keeps the shell footer visible and gives the page frame
   only the space between the fixed topbar and fixed footer. */
body.fullscreen-route-mode .admin-page {
  height: calc(100vh - var(--admin-topbar-height) - var(--admin-footer-height));
}
body.fullscreen-route-mode .admin-footer {
  display: flex !important;
}
body.fullscreen-route-mode .admin-fullscreen-route-host,
body.fullscreen-route-mode .admin-fullscreen-route-frame {
  height: 100%;
  min-height: calc(100vh - var(--admin-topbar-height));
}

@media print {
  .admin-footer { display: none !important; }
  .admin-main, html[dir="rtl"] .admin-main { padding-bottom: 0 !important; }
}

/* =========================================================
   v1.3.0 — Unified shell footer, splash loader, back-to-top
   ========================================================= */
:root {
  --admin-footer-bg: var(--admin-sidebar-bg);
  --admin-footer-text: #ead9e4;
  --admin-footer-muted: #d6c0cc;
}

.admin-footer {
  background: var(--admin-footer-bg);
  color: var(--admin-footer-text);
  border-top: 1px solid var(--admin-sidebar-accent);
  box-shadow: 0 -1px 0 rgba(0,0,0,.08);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
.admin-footer a { color:#fff; }
.admin-footer .text-secondary { color:var(--admin-footer-muted)!important; }

.app-splash {
  position: fixed;
  inset: 0;
  z-index: 3000;
  display: grid;
  place-items: center;
  background:
    radial-gradient(circle at 75% 18%, rgba(233,76,145,.18), transparent 30%),
    radial-gradient(circle at 20% 80%, rgba(240,180,0,.10), transparent 28%),
    var(--admin-sidebar-bg);
  color: #fff;
  opacity: 1;
  visibility: visible;
  transition: opacity .28s ease, visibility .28s ease;
}
.app-splash.is-hidden {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
.app-splash-inner {
  width: min(360px, calc(100vw - 48px));
  text-align: center;
  padding: 30px;
}
.app-splash-logo {
  width: 76px;
  height: 76px;
  margin: 0 auto 16px;
  display: grid;
  place-items: center;
  border-radius: 20px;
  background: #fff;
  color: #f0b400;
  font-size: 2rem;
  font-weight: 900;
  box-shadow: 0 18px 48px rgba(0,0,0,.22);
  animation: splashLogo 1.25s ease-in-out infinite alternate;
}
.app-splash-brand { font-size:1.35rem; font-weight:900; letter-spacing:-.02em; }
.app-splash-copy { margin-top:5px; color:#d6c0cc; font-size:.83rem; }
.app-splash-loader {
  width: 148px;
  height: 3px;
  margin: 22px auto 0;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(255,255,255,.14);
}
.app-splash-loader::after {
  content:"";
  display:block;
  width: 46%;
  height:100%;
  border-radius:inherit;
  background: var(--admin-sidebar-accent);
  animation: splashProgress 1s ease-in-out infinite;
}
@keyframes splashLogo {
  from { transform: translateY(0) scale(1); }
  to { transform: translateY(-5px) scale(1.025); }
}
@keyframes splashProgress {
  0% { transform:translateX(-115%); }
  50% { transform:translateX(115%); }
  100% { transform:translateX(250%); }
}

.back-to-top {
  position: fixed;
  right: 22px;
  bottom: calc(var(--admin-footer-height) + 18px);
  z-index: 1038;
  width: 44px;
  height: 44px;
  border-radius: 13px;
  border: 1px solid rgba(255,255,255,.22);
  display: grid;
  place-items: center;
  background: var(--admin-sidebar-bg);
  color: #fff;
  box-shadow: 0 12px 30px rgba(49,23,42,.26);
  opacity: 0;
  visibility: hidden;
  transform: translateY(12px) scale(.92);
  transition: opacity .18s ease, visibility .18s ease, transform .18s ease, background-color .18s ease;
}
.back-to-top:hover,
.back-to-top:focus-visible {
  color:#fff;
  background: color-mix(in srgb, var(--admin-sidebar-bg) 80%, var(--admin-sidebar-accent));
  border-color: var(--admin-sidebar-accent);
}
.back-to-top.is-visible {
  opacity: 1;
  visibility: visible;
  transform: translateY(0) scale(1);
}
html[dir="rtl"] .back-to-top { right:auto; left:22px; }

@media (max-width:575.98px) {
  .back-to-top {
    right: 14px;
    bottom: calc(var(--admin-footer-height) + 12px);
    width:40px;
    height:40px;
    border-radius:11px;
  }
  html[dir="rtl"] .back-to-top { right:auto; left:14px; }
}

@media (prefers-reduced-motion: reduce) {
  .app-splash,
  .back-to-top { transition:none; }
  .app-splash-logo,
  .app-splash-loader::after { animation:none; }
}

@media print {
  .app-splash, .back-to-top { display:none!important; }
}

/* =========================================================
   v1.3.1 — Compact loader card (page remains visible)
   ========================================================= */
.app-splash {
  padding: 24px;
  background: rgba(67, 39, 62, .16);
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

.app-splash-inner {
  position: relative;
  width: min(360px, calc(100vw - 40px));
  min-height: 292px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 28px 30px 24px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 28px;
  background: linear-gradient(180deg, rgba(79,42,73,.56), rgba(38,27,40,.72));
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  box-shadow:
    0 28px 80px rgba(18, 10, 17, .34),
    inset 0 1px 0 rgba(255,255,255,.05);
  text-align: center;
  isolation: isolate;
}

.app-splash-inner::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    linear-gradient(110deg, transparent 0 38%, rgba(255,255,255,.028) 48%, transparent 58%),
    radial-gradient(circle at 18% 82%, rgba(240,180,0,.08), transparent 32%),
    radial-gradient(circle at 84% 16%, rgba(233,76,145,.12), transparent 24%);
}

.app-splash-inner::after {
  content: "FREE • OPEN SOURCE • ADMIN UI";
  order: 5;
  width: 100%;
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid rgba(255,255,255,.07);
  color: rgba(239,225,233,.38);
  font-size: .58rem;
  font-weight: 700;
  letter-spacing: .16em;
}

.app-splash-brand {
  order: 1;
  margin-bottom: 25px;
  color: #fff;
  font-size: 1.55rem;
  font-weight: 900;
  line-height: 1;
  letter-spacing: -.025em;
}

.app-splash-brand::after {
  content: "ADMINISTRATION";
  display: block;
  margin-top: 7px;
  color: #f0b400;
  font-size: .62rem;
  font-weight: 800;
  letter-spacing: .22em;
}

.app-splash-logo {
  order: 2;
  position: relative;
  width: 70px;
  height: 70px;
  margin: 0;
  border: 1px solid rgba(240,180,0,.8);
  border-radius: 50%;
  background: rgba(20,15,21,.18);
  color: #f0b400;
  font-size: 1.8rem;
  font-weight: 900;
  box-shadow:
    0 0 0 8px rgba(240,180,0,.035),
    inset 0 0 24px rgba(240,180,0,.05);
  animation: none;
}

.app-splash-logo::before,
.app-splash-logo::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
}

.app-splash-logo::before {
  inset: -11px;
  border: 1px solid rgba(240,180,0,.18);
  border-top-color: #f0b400;
  border-right-color: rgba(240,180,0,.65);
  animation: splashRing 1.25s linear infinite;
}

.app-splash-logo::after {
  inset: -18px;
  border: 1px solid transparent;
  border-right-color: rgba(233,76,145,.52);
  border-bottom-color: rgba(240,180,0,.16);
  animation: splashRingReverse 1.9s linear infinite;
}

.app-splash-loader {
  order: 3;
  width: 100%;
  height: 4px;
  margin: 30px auto 0;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(255,255,255,.08);
  box-shadow: inset 0 1px 2px rgba(0,0,0,.18);
}

.app-splash-loader::after {
  width: 42%;
  background: linear-gradient(90deg, #f0b400, #ffd75a);
  box-shadow: 0 0 12px rgba(240,180,0,.4);
  animation: splashProgressCard 1.15s ease-in-out infinite;
}

.app-splash-copy {
  order: 4;
  margin-top: 14px;
  color: #d9c8d2;
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
}

@keyframes splashRing {
  to { transform: rotate(360deg); }
}

@keyframes splashRingReverse {
  to { transform: rotate(-360deg); }
}

@keyframes splashProgressCard {
  0% { transform: translateX(-125%); }
  50% { transform: translateX(85%); }
  100% { transform: translateX(250%); }
}

@media (max-width: 575.98px) {
  .app-splash { padding: 18px; }
  .app-splash-inner {
    width: min(330px, calc(100vw - 28px));
    min-height: 268px;
    padding: 24px 22px 20px;
    border-radius: 24px;
  }
  .app-splash-brand { margin-bottom: 22px; font-size: 1.4rem; }
  .app-splash-logo { width: 64px; height: 64px; font-size: 1.6rem; }
  .app-splash-loader { margin-top: 27px; }
}

@media (prefers-reduced-motion: reduce) {
  .app-splash-logo::before,
  .app-splash-logo::after,
  .app-splash-loader::after { animation: none !important; }
}


/* =========================================================
   v1.3.6 — Shell border alignment fix
   Keep all header/footer accent lines aligned across
   sidebar, topbar and footer in collapsed/expanded states.
   ========================================================= */
:root {
  --admin-shell-border-width: 1px;
}

.admin-sidebar,
.admin-sidebar-brand-wrap,
.admin-brand,
.admin-topbar,
.admin-footer,
.admin-sidebar-footer {
  box-sizing: border-box;
}

.admin-sidebar-brand-wrap {
  display: flex;
  align-items: stretch;
  border-bottom-width: var(--admin-shell-border-width);
}

.admin-sidebar-brand-wrap .admin-brand {
  width: 100%;
  align-items: center;
}

.admin-topbar {
  height: var(--admin-topbar-height);
  min-height: var(--admin-topbar-height);
  border-bottom-width: var(--admin-shell-border-width);
}

.admin-footer,
.admin-sidebar-footer {
  border-top-width: var(--admin-shell-border-width);
}

body.sidebar-collapsed .admin-sidebar-brand-wrap,
body.sidebar-collapsed .admin-brand {
  height: var(--admin-topbar-height);
  min-height: var(--admin-topbar-height);
}

body.sidebar-collapsed .admin-sidebar-brand-wrap .admin-brand {
  padding-top: 0;
  padding-bottom: 0;
}

.admin-topbar,
.admin-sidebar-brand-wrap,
.admin-footer,
.admin-sidebar-footer {
  position: relative;
}

/* Ensure the accent divider renders on the exact same pixel row */
.admin-sidebar-brand-wrap::after,
.admin-topbar::after,
.admin-footer::before,
.admin-sidebar-footer::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  pointer-events: none;
}

.admin-sidebar-brand-wrap::after,
.admin-topbar::after {
  bottom: calc(-1 * var(--admin-shell-border-width));
  border-bottom: var(--admin-shell-border-width) solid var(--admin-sidebar-accent);
}

.admin-footer::before,
.admin-sidebar-footer::before {
  top: calc(-1 * var(--admin-shell-border-width));
  border-top: var(--admin-shell-border-width) solid var(--admin-sidebar-accent);
}

/* Avoid double-thick borders under the pseudo lines */
.admin-sidebar-brand-wrap,
.admin-topbar,
.admin-footer,
.admin-sidebar-footer {
  border-color: transparent;
}

@media (max-width: 991.98px) {
  body.sidebar-collapsed .admin-sidebar-brand-wrap,
  body.sidebar-collapsed .admin-brand {
    height: auto;
    min-height: var(--admin-topbar-height);
  }
}

/* =========================================================
   v1.3.8 — Fixed shell positioning repair
   v1.3.6 alignment rules accidentally changed the fixed
   topbar/footer into relative-positioned elements, causing
   the sidebar offset to be applied twice.
   ========================================================= */
.admin-topbar {
  position: fixed !important;
  top: 0;
  left: var(--admin-sidebar-width);
  right: 0;
  width: auto;
  margin: 0;
}

.admin-footer {
  position: fixed !important;
  left: var(--admin-sidebar-width);
  right: 0;
  bottom: 0;
  width: auto;
  margin: 0;
}

body.sidebar-collapsed .admin-topbar,
body.sidebar-collapsed .admin-footer {
  left: var(--admin-sidebar-collapsed);
}

html[dir="rtl"] .admin-topbar,
html[dir="rtl"] .admin-footer {
  left: 0;
  right: var(--admin-sidebar-width);
}

html[dir="rtl"] body.sidebar-collapsed .admin-topbar,
html[dir="rtl"] body.sidebar-collapsed .admin-footer {
  left: 0;
  right: var(--admin-sidebar-collapsed);
}

/* These elements need a positioning context for their
   decorative divider pseudo-elements. Fixed already gives
   topbar/footer that context, so only sidebar pieces remain. */
.admin-sidebar-brand-wrap,
.admin-sidebar-footer {
  position: relative;
}

@media (max-width: 991.98px) {
  .admin-topbar,
  .admin-footer,
  body.sidebar-collapsed .admin-topbar,
  body.sidebar-collapsed .admin-footer,
  html[dir="rtl"] .admin-topbar,
  html[dir="rtl"] .admin-footer,
  html[dir="rtl"] body.sidebar-collapsed .admin-topbar,
  html[dir="rtl"] body.sidebar-collapsed .admin-footer {
    left: 0;
    right: 0;
  }
}


/* v1.3.11 — no embedded/inner loader flash during fullscreen routing */
html.admin-embed-boot .app-splash { display:none !important; }
.admin-fullscreen-route-frame:not(.is-ready) { visibility:hidden !important; opacity:0 !important; }

/* =========================================================
   v1.5.0 — Splash removed; non-blocking top progress only
   ========================================================= */
.app-splash { display:none !important; }
html.admin-embed-boot #pageProgress { display:none !important; }

/* =========================================================
   v1.5.2 — Fast sidebar interaction
   Desktop content offsets update instantly so responsive charts/tables
   resize only once. Only the fixed sidebar itself gets a short animation.
   ========================================================= */
@media (min-width: 992px) {
  .admin-sidebar {
    transition: width .12s cubic-bezier(.2,.8,.2,1) !important;
    will-change: width;
  }

  /* Avoid animating layout-affecting properties across the whole page.
     Continuous margin/left/right animation forces Chart.js/DataTables and
     the browser layout engine to recalculate on every animation frame. */
  .admin-main {
    transition: none !important;
  }

  .admin-topbar {
    transition: background-color .12s ease !important;
  }

  .admin-footer {
    transition: background-color .12s ease !important;
  }
}

@media (max-width: 991.98px) {
  .admin-sidebar {
    transition: transform .16s cubic-bezier(.2,.8,.2,1) !important;
  }
}


/* =========================================================
   v1.6.1 — Online fullscreen route loading + externalized embed CSS
   ========================================================= */
.admin-fullscreen-route-host {
  position: relative;
  width: 100%;
  min-height: calc(100vh - var(--admin-topbar-height));
  background: var(--admin-bg);
  overflow: hidden;
}
.admin-fullscreen-route-frame {
  position: relative;
  z-index: 1;
  display: block;
  width: 100%;
  min-height: calc(100vh - var(--admin-topbar-height));
  border: 0;
  background: var(--admin-bg);
  opacity: 0;
  visibility: hidden;
  transition: opacity .14s ease;
}
.admin-fullscreen-route-frame.is-ready {
  opacity: 1;
  visibility: visible;
}
.admin-fullscreen-route-loading {
  position: absolute;
  inset: 0;
  z-index: 30;
  display: grid;
  place-items: center;
  min-height: 320px;
  padding: 32px;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .18s ease, visibility .18s ease;
}
.admin-fullscreen-route-loading.is-visible {
  opacity: 1;
  visibility: visible;
  pointer-events: all;
}

html.admin-fullscreen-embedded,
html.admin-fullscreen-embedded body {
  min-height: 100% !important;
  height: auto !important;
  overflow: auto !important;
}
html.admin-fullscreen-embedded body {
  visibility: visible !important;
  background: var(--admin-bg) !important;
}
html.admin-fullscreen-embedded #sidebarMount,
html.admin-fullscreen-embedded #topbarMount,
html.admin-fullscreen-embedded .admin-sidebar,
html.admin-fullscreen-embedded .admin-sidebar-backdrop,
html.admin-fullscreen-embedded .admin-topbar,
html.admin-fullscreen-embedded .admin-footer,
html.admin-fullscreen-embedded #pageProgress {
  display: none !important;
}
html.admin-fullscreen-embedded .admin-shell {
  display: block !important;
  min-height: 100% !important;
}
html.admin-fullscreen-embedded .admin-main,
html.admin-fullscreen-embedded body.sidebar-collapsed .admin-main,
html[dir="rtl"].admin-fullscreen-embedded .admin-main,
html[dir="rtl"].admin-fullscreen-embedded body.sidebar-collapsed .admin-main {
  margin: 0 !important;
  padding-top: 0 !important;
  min-height: 100% !important;
  width: 100% !important;
}
html.admin-fullscreen-embedded .admin-page {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
}

/* v1.6.3 — static topbar/dropdown sizing moved out of layout.js */
.admin-theme-menu { min-width: 170px; }
.admin-notification-menu { width: min(370px, calc(100vw - 24px)); }
.admin-user-role-caption { font-size: 11px; }
.admin-profile-menu { min-width: 210px; }

/* =========================================================
   v1.6.4 — Bootstrap 5 print utility support
   ========================================================= */
@media print {
  #pageProgress,
  .admin-page-loader,
  .admin-fullscreen-route-loading,
  .admin-sidebar-flyout,
  .back-to-top { display: none !important; }
}

/* =========================================================
   v1.7.0 — Splash screen retired
   The page loader in admin-boot.css remains the only navigation loader.
   ========================================================= */
.app-splash, .app-splash-inner, .app-splash-logo, .app-splash-brand, .app-splash-copy, .app-splash-loader { display:none !important; }