/* =====================================================
   Sauz Tiger - Premium Design System
   Company: Sauz Tiger Technologies
   Palette: Deep navy, Electric blue, White, Soft gray
   ===================================================== */

:root {
  /* Brand */
  --bg-navy-900: #0a1628;
  --bg-navy-800: #0f2240;
  --bg-navy-700: #16315c;
  --bg-navy-600: #1d407a;
  --bg-blue-600: #1f6feb;
  --bg-blue-500: #2f81f7;
  --bg-blue-400: #4c9aff;
  --bg-blue-50:  #eaf2ff;
  --bg-cyan-500: #19b4e6;

  /* Neutrals */
  --bg-white: #ffffff;
  --bg-gray-50:  #f7f9fc;
  --bg-gray-100: #eef2f7;
  --bg-gray-200: #e2e8f0;
  --bg-gray-300: #cbd5e1;
  --bg-gray-400: #94a3b8;
  --bg-gray-500: #64748b;
  --bg-gray-600: #475569;
  --bg-gray-700: #334155;
  --bg-gray-800: #1e293b;
  --bg-gray-900: #0f172a;

  /* Status */
  --bg-success: #16a34a;
  --bg-success-bg: #dcfce7;
  --bg-warning: #f59e0b;
  --bg-warning-bg: #fef3c7;
  --bg-danger:  #dc2626;
  --bg-danger-bg: #fee2e2;
  --bg-info:    #0891b2;
  --bg-info-bg: #cffafe;

  /* Typography */
  --bg-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --bg-radius: 12px;
  --bg-radius-sm: 8px;
  --bg-radius-lg: 18px;
  --bg-shadow-sm: 0 1px 2px rgba(15, 34, 64, .06), 0 1px 3px rgba(15, 34, 64, .04);
  --bg-shadow:    0 4px 12px rgba(15, 34, 64, .08), 0 2px 4px rgba(15, 34, 64, .04);
  --bg-shadow-lg: 0 12px 32px rgba(15, 34, 64, .12), 0 4px 8px rgba(15, 34, 64, .06);
  --bg-transition: all .2s cubic-bezier(.4, 0, .2, 1);

  /* Layout */
  --bg-sidebar-w: 264px;
  --bg-navbar-h: 64px;
}

* { box-sizing: border-box; }

html, body {
  font-family: var(--bg-font);
  background: var(--bg-gray-50);
  color: var(--bg-gray-800);
  margin: 0;
  padding: 0;
  font-size: 14px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

a { color: var(--bg-blue-600); text-decoration: none; }
a:hover { color: var(--bg-blue-500); }

h1, h2, h3, h4, h5, h6 { color: var(--bg-navy-800); font-weight: 700; line-height: 1.25; }
h1 { font-size: 1.6rem; } h2 { font-size: 1.3rem; } h3 { font-size: 1.1rem; }

.text-navy { color: var(--bg-navy-800) !important; }
.text-blue { color: var(--bg-blue-600) !important; }
.bg-navy { background: var(--bg-navy-800) !important; }

/* ============ Top Navbar ============ */
.bg-navbar {
  height: var(--bg-navbar-h);
  background: linear-gradient(135deg, var(--bg-navy-900) 0%, var(--bg-navy-800) 100%);
  border-bottom: 1px solid rgba(255,255,255,.06);
  box-shadow: 0 2px 12px rgba(10, 22, 40, .18);
  z-index: 1030;
}
.bg-navbar-inner {
  height: 100%;
  display: flex;
  align-items: center;
  padding: 0 20px;
  gap: 8px;
}
.bg-brand { color: #fff; text-decoration: none; }
.bg-brand:hover { color: #fff; }
.bg-brand-mark {
  width: 38px; height: 38px;
  display: inline-flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg, var(--bg-blue-500), var(--bg-cyan-500));
  border-radius: 10px;
  font-weight: 800; font-size: .85rem; letter-spacing: .5px;
  color: #fff;
  box-shadow: 0 4px 12px rgba(31, 111, 235, .35);
}
.bg-brand-text { line-height: 1.1; }
.bg-brand-name { font-weight: 700; font-size: 1rem; color: #fff; }
.bg-brand-sub { font-size: .68rem; color: rgba(255,255,255,.55); }

.btn-icon {
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.1);
  color: #fff;
  border-radius: 9px;
  padding: 8px 10px;
  display: inline-flex; align-items: center;
  transition: var(--bg-transition);
}
.btn-icon:hover { background: rgba(255,255,255,.16); color: #fff; }

/* Shop switcher */
.bg-shop-btn {
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.08);
  color: #fff;
  border-radius: 10px;
  padding: 6px 10px;
  display: flex; align-items: center; gap: 8px;
  max-width: 220px;
  transition: var(--bg-transition);
}
.bg-shop-btn:hover { background: rgba(255,255,255,.12); color: #fff; }
.bg-shop-ic {
  width: 30px; height: 30px; border-radius: 7px;
  background: rgba(255,255,255,.1);
  display: flex; align-items: center; justify-content: center;
  overflow: hidden; flex-shrink: 0;
  color: var(--bg-blue-400);
}
.bg-shop-ic img { width: 100%; height: 100%; object-fit: cover; }
.bg-shop-label { display: block; font-size: .62rem; color: rgba(255,255,255,.5); text-transform: uppercase; letter-spacing: .5px; }
.bg-shop-name { display: block; font-size: .82rem; font-weight: 600; max-width: 130px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bg-shop-menu { min-width: 240px; border: none; border-radius: 12px; }

/* Search */
.bg-search {
  display: flex; align-items: center; gap: 8px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 10px;
  padding: 0 12px;
  width: 260px;
  color: rgba(255,255,255,.6);
}
.bg-search input {
  background: transparent; border: none; color: #fff;
  box-shadow: none; padding: 8px 0; font-size: .85rem;
}
.bg-search input::placeholder { color: rgba(255,255,255,.45); }
.bg-search input:focus { box-shadow: none; outline: none; }

/* Notifications */
.bg-notif-badge {
  position: absolute; top: 2px; right: 2px;
  font-size: .6rem; min-width: 16px; height: 16px;
  padding: 0 4px; border-radius: 8px;
  display: flex; align-items: center; justify-content: center;
  border: 2px solid var(--bg-navy-900);
}
.bg-notif-menu { width: 340px; max-width: 90vw; padding: 0; border: none; border-radius: 14px; overflow: hidden; }
.bg-notif-head { padding: 14px 16px; font-weight: 700; color: var(--bg-navy-800); border-bottom: 1px solid var(--bg-gray-100); }
.bg-notif-body { max-height: 340px; overflow-y: auto; }
.bg-notif-item { display: flex; flex-direction: column; gap: 2px; padding: 12px 16px; border-bottom: 1px solid var(--bg-gray-100); text-decoration: none; transition: var(--bg-transition); }
.bg-notif-item:hover { background: var(--bg-gray-50); }
.bg-notif-item.unread { background: var(--bg-blue-50); }
.bg-notif-title { font-weight: 600; color: var(--bg-navy-800); font-size: .85rem; }
.bg-notif-desc { color: var(--bg-gray-600); font-size: .8rem; }
.bg-notif-time { color: var(--bg-gray-400); font-size: .72rem; }
.bg-notif-empty { padding: 32px 16px; text-align: center; color: var(--bg-gray-400); font-size: .85rem; }

/* User menu */
.bg-user-btn {
  background: transparent; border: none; color: #fff;
  display: flex; align-items: center; padding: 4px 8px 4px 4px;
  border-radius: 10px; transition: var(--bg-transition);
}
.bg-user-btn:hover { background: rgba(255,255,255,.08); }
.bg-user-btn img, .bg-avatar-text {
  width: 36px; height: 36px; border-radius: 9px;
  object-fit: cover;
  background: linear-gradient(135deg, var(--bg-blue-500), var(--bg-cyan-500));
  color: #fff; font-weight: 700; font-size: .8rem;
  display: flex; align-items: center; justify-content: center;
}
.bg-user-name { font-size: .82rem; font-weight: 600; line-height: 1.2; }
.bg-user-role { font-size: .68rem; color: rgba(255,255,255,.55); text-transform: capitalize; }
.bg-user-menu { min-width: 220px; border: none; border-radius: 12px; padding: 6px; }
.bg-user-menu .dropdown-item { border-radius: 8px; padding: 8px 12px; font-size: .85rem; }

/* ============ Sidebar ============ */
.bg-sidebar {
  position: fixed; top: 0; left: 0; bottom: 0;
  width: var(--bg-sidebar-w);
  background: linear-gradient(180deg, var(--bg-navy-900) 0%, var(--bg-navy-800) 100%);
  z-index: 1040;
  display: flex; flex-direction: column;
  padding: 18px 14px;
  overflow-y: auto;
  transition: transform .28s cubic-bezier(.4,0,.2,1);
}
.bg-sidebar-brand { padding: 6px 8px 18px; }
.bg-sidebar .bg-brand-mark { width: 34px; height: 34px; }
.bg-sidebar .bg-brand-name { font-size: .95rem; }
.bg-sidebar .bg-brand-sub { font-size: .62rem; }

.bg-nav { flex: 1; display: flex; flex-direction: column; gap: 2px; }
.bg-nav-section {
  font-size: .62rem; text-transform: uppercase; letter-spacing: 1px;
  color: rgba(255,255,255,.35); padding: 14px 12px 6px; font-weight: 600;
}
.bg-nav-link {
  display: flex; align-items: center; gap: 12px;
  padding: 10px 12px; border-radius: 10px;
  color: rgba(255,255,255,.7);
  font-size: .85rem; font-weight: 500;
  transition: var(--bg-transition);
  text-decoration: none;
  position: relative;
}
.bg-nav-link:hover { background: rgba(255,255,255,.06); color: #fff; }
.bg-nav-link.active {
  background: linear-gradient(135deg, rgba(31,111,235,.22), rgba(25,180,230,.16));
  color: #fff;
  box-shadow: inset 0 0 0 1px rgba(31,111,235,.25);
}
.bg-nav-link.active::before {
  content: ''; position: absolute; left: -14px; top: 8px; bottom: 8px;
  width: 3px; border-radius: 2px;
  background: linear-gradient(180deg, var(--bg-blue-400), var(--bg-cyan-500));
}
.bg-nav-ic { display: inline-flex; flex-shrink: 0; }
.bg-nav-label { flex: 1; }
.bg-nav-link .badge { font-size: .62rem; }

.bg-sidebar-foot { padding-top: 14px; }
.bg-foot-card {
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 12px; padding: 12px;
}
.bg-foot-title { color: #fff; font-weight: 600; font-size: .8rem; }
.bg-foot-sub { color: rgba(255,255,255,.5); font-size: .68rem; margin: 2px 0 6px; }
.bg-foot-link { color: var(--bg-blue-400); font-size: .72rem; font-weight: 600; }

.bg-sidebar-backdrop {
  display: none; position: fixed; inset: 0;
  background: rgba(10,22,40,.5);
  z-index: 1035; border: none;
}
.bg-sidebar-backdrop.show { display: block; }

/* ============ Main content ============ */
.bg-main {
  margin-left: var(--bg-sidebar-w);
  padding-top: var(--bg-navbar-h);
  min-height: 100vh;
  transition: margin-left .28s cubic-bezier(.4,0,.2,1);
}
.bg-content { padding: 24px 28px 40px; }

/* Page header */
.bg-page-head {
  display: flex; flex-wrap: wrap; gap: 12px;
  align-items: flex-start; justify-content: space-between;
  margin-bottom: 24px;
}
.bg-page-title h1 { margin: 0; font-size: 1.5rem; }
.bg-page-title p { margin: 4px 0 0; color: var(--bg-gray-500); font-size: .85rem; }
.bg-page-actions { display: flex; gap: 8px; flex-wrap: wrap; }

/* ============ Cards ============ */
.bg-card {
  background: var(--bg-white);
  border: 1px solid var(--bg-gray-100);
  border-radius: var(--bg-radius);
  box-shadow: var(--bg-shadow-sm);
  overflow: hidden;
}
.bg-card-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 16px 20px; border-bottom: 1px solid var(--bg-gray-100);
}
.bg-card-title { margin: 0; font-size: 1rem; font-weight: 700; color: var(--bg-navy-800); }
.bg-card-body { padding: 20px; }

/* Stat cards */
.bg-stat {
  background: var(--bg-white);
  border: 1px solid var(--bg-gray-100);
  border-radius: var(--bg-radius);
  padding: 20px;
  box-shadow: var(--bg-shadow-sm);
  transition: var(--bg-transition);
  position: relative;
  overflow: hidden;
}
.bg-stat:hover { box-shadow: var(--bg-shadow); transform: translateY(-2px); }
.bg-stat::after {
  content: ''; position: absolute; right: -20px; top: -20px;
  width: 90px; height: 90px; border-radius: 50%;
  background: var(--stat-color, var(--bg-blue-50));
  opacity: .5; filter: blur(8px);
}
.bg-stat-ic {
  width: 44px; height: 44px; border-radius: 11px;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--stat-color, var(--bg-blue-50));
  color: var(--stat-ic, var(--bg-blue-600));
  margin-bottom: 14px;
  position: relative; z-index: 1;
}
.bg-stat-label { font-size: .78rem; color: var(--bg-gray-500); font-weight: 500; margin: 0; }
.bg-stat-value { font-size: 1.5rem; font-weight: 800; color: var(--bg-navy-800); margin: 4px 0 0; position: relative; z-index: 1; }
.bg-stat-foot { margin-top: 10px; font-size: .72rem; color: var(--bg-gray-400); position: relative; z-index: 1; }
.bg-stat-foot .up { color: var(--bg-success); font-weight: 600; }
.bg-stat-foot .down { color: var(--bg-danger); font-weight: 600; }

/* Status badges */
.bg-badge { padding: 3px 10px; border-radius: 20px; font-size: .72rem; font-weight: 600; display: inline-flex; align-items: center; gap: 5px; }
.bg-badge.success { background: var(--bg-success-bg); color: var(--bg-success); }
.bg-badge.warning { background: var(--bg-warning-bg); color: #b45309; }
.bg-badge.danger  { background: var(--bg-danger-bg); color: var(--bg-danger); }
.bg-badge.info    { background: var(--bg-info-bg); color: var(--bg-info); }
.bg-badge.gray    { background: var(--bg-gray-100); color: var(--bg-gray-600); }
.bg-badge .dot { width: 6px; height: 6px; border-radius: 50%; background: currentColor; }

/* ============ Buttons ============ */
.btn { font-weight: 600; border-radius: 9px; padding: 8px 16px; font-size: .85rem; transition: var(--bg-transition); }
.btn-primary { background: var(--bg-blue-600); border-color: var(--bg-blue-600); }
.btn-primary:hover { background: var(--bg-blue-500); border-color: var(--bg-blue-500); }
.btn-navy { background: var(--bg-navy-800); color: #fff; border-color: var(--bg-navy-800); }
.btn-navy:hover { background: var(--bg-navy-700); color: #fff; }
.btn-outline-secondary { color: var(--bg-gray-600); border-color: var(--bg-gray-200); }
.btn-outline-secondary:hover { background: var(--bg-gray-50); color: var(--bg-gray-800); }
.btn-soft {
  background: var(--bg-blue-50); color: var(--bg-blue-600); border: 1px solid transparent;
}
.btn-soft:hover { background: #d8e8ff; color: var(--bg-blue-600); }
.btn-sm { padding: 5px 10px; font-size: .78rem; border-radius: 7px; }
.btn-icon-sm { padding: 6px; width: 32px; height: 32px; display: inline-flex; align-items: center; justify-content: center; }

/* ============ Tables ============ */
.bg-table { width: 100%; }
.bg-table thead th {
  font-size: .68rem; text-transform: uppercase; letter-spacing: .6px;
  color: var(--bg-gray-500); font-weight: 600;
  padding: 10px 14px; border-bottom: 1px solid var(--bg-gray-100);
  background: var(--bg-gray-50); white-space: nowrap;
}
.bg-table tbody td { padding: 12px 14px; border-bottom: 1px solid var(--bg-gray-100); vertical-align: middle; font-size: .85rem; }
.bg-table tbody tr:last-child td { border-bottom: none; }
.bg-table tbody tr:hover { background: var(--bg-gray-50); }
.bg-table .prod-img { width: 38px; height: 38px; border-radius: 8px; object-fit: cover; background: var(--bg-gray-100); }

/* ============ Forms ============ */
.form-control, .form-select {
  border-radius: 9px; border-color: var(--bg-gray-200);
  padding: 9px 12px; font-size: .85rem;
}
.form-control:focus, .form-select:focus {
  border-color: var(--bg-blue-400);
  box-shadow: 0 0 0 3px rgba(31,111,235,.12);
}
.form-label { font-size: .8rem; font-weight: 600; color: var(--bg-gray-700); margin-bottom: 6px; }
.input-group-text { border-radius: 9px; border-color: var(--bg-gray-200); background: var(--bg-gray-50); }

/* ============ Footer ============ */
.bg-footer {
  padding: 16px 28px;
  border-top: 1px solid var(--bg-gray-100);
  background: var(--bg-white);
}

/* ============ Login & Auth ============ */
.bg-auth {
  min-height: 100vh; display: flex;
  background: linear-gradient(135deg, var(--bg-navy-900) 0%, var(--bg-navy-800) 60%, var(--bg-navy-700) 100%);
  position: relative; overflow: hidden;
}
.bg-auth::before {
  content: ''; position: absolute; top: -30%; right: -10%;
  width: 600px; height: 600px; border-radius: 50%;
  background: radial-gradient(circle, rgba(31,111,235,.25), transparent 70%);
  filter: blur(40px);
}
.bg-auth::after {
  content: ''; position: absolute; bottom: -20%; left: -10%;
  width: 500px; height: 500px; border-radius: 50%;
  background: radial-gradient(circle, rgba(25,180,230,.18), transparent 70%);
  filter: blur(40px);
}
.bg-auth-left {
  flex: 1; padding: 60px; display: flex; flex-direction: column; justify-content: center;
  color: #fff; position: relative; z-index: 1;
  max-width: 620px;
}
.bg-auth-logo { display: flex; align-items: center; gap: 12px; margin-bottom: 48px; }
.bg-auth-logo .bg-brand-mark { width: 48px; height: 48px; font-size: 1rem; }
.bg-auth-logo .bg-brand-name { font-size: 1.4rem; }
.bg-auth-logo .bg-brand-sub { font-size: .75rem; }
.bg-auth-title { font-size: 2.4rem; font-weight: 800; color: #fff; line-height: 1.2; margin-bottom: 16px; }
.bg-auth-tagline { font-size: 1.05rem; color: rgba(255,255,255,.7); margin-bottom: 40px; max-width: 460px; }
.bg-auth-features { display: flex; flex-direction: column; gap: 14px; max-width: 460px; }
.bg-auth-feat { display: flex; align-items: center; gap: 12px; color: rgba(255,255,255,.85); font-size: .9rem; }
.bg-auth-feat .ic {
  width: 36px; height: 36px; border-radius: 9px;
  background: rgba(31,111,235,.18); color: var(--bg-blue-400);
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.bg-auth-right {
  width: 520px; max-width: 92vw; margin: 40px;
  background: #fff; border-radius: 20px;
  padding: 44px; box-shadow: 0 24px 64px rgba(10,22,40,.4);
  display: flex; flex-direction: column; justify-content: center;
  position: relative; z-index: 1;
}
.bg-auth-form h2 { font-size: 1.5rem; margin: 0 0 6px; }
.bg-auth-form .sub { color: var(--bg-gray-500); margin-bottom: 28px; font-size: .88rem; }
.bg-auth-foot { text-align: center; margin-top: 22px; font-size: .82rem; color: var(--bg-gray-500); }
.bg-auth-foot a { font-weight: 600; }

@media (max-width: 991.98px) {
  .bg-auth-left { display: none; }
  .bg-auth-right { margin: auto; }
}

/* ============ POS ============ */
.bg-pos { display: grid; grid-template-columns: 1fr 380px; gap: 20px; }
.bg-pos-search { position: relative; }
.bg-pos-search input { padding-left: 40px; font-size: .95rem; }
.bg-pos-search svg { position: absolute; left: 14px; top: 50%; transform: translateY(-50%); color: var(--bg-gray-400); }
.bg-pos-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 14px; }
.bg-prod-card {
  background: #fff; border: 1px solid var(--bg-gray-100); border-radius: 12px;
  padding: 14px; cursor: pointer; transition: var(--bg-transition);
  display: flex; flex-direction: column; gap: 8px;
}
.bg-prod-card:hover { border-color: var(--bg-blue-400); box-shadow: var(--bg-shadow); transform: translateY(-2px); }
.bg-prod-card .img {
  width: 100%; aspect-ratio: 1; border-radius: 8px;
  background: var(--bg-gray-100); object-fit: cover;
  display: flex; align-items: center; justify-content: center;
  color: var(--bg-gray-400);
}
.bg-prod-card .img img { width: 100%; height: 100%; object-fit: cover; border-radius: 8px; }
.bg-prod-card .name { font-weight: 600; font-size: .82rem; color: var(--bg-navy-800); line-height: 1.3; }
.bg-prod-card .price { font-weight: 700; color: var(--bg-blue-600); font-size: .9rem; }
.bg-prod-card .stock { font-size: .7rem; color: var(--bg-gray-400); }
.bg-prod-card.out { opacity: .55; cursor: not-allowed; }

.bg-cart { position: sticky; top: 80px; }
.bg-cart-body { max-height: calc(100vh - 260px); overflow-y: auto; }
.bg-cart-item { display: flex; gap: 10px; padding: 10px 0; border-bottom: 1px solid var(--bg-gray-100); }
.bg-cart-item .info { flex: 1; }
.bg-cart-item .name { font-size: .82rem; font-weight: 600; }
.bg-cart-item .price { font-size: .75rem; color: var(--bg-gray-500); }
.bg-qty { display: inline-flex; align-items: center; border: 1px solid var(--bg-gray-200); border-radius: 7px; overflow: hidden; }
.bg-qty button { background: var(--bg-gray-50); border: none; width: 26px; height: 26px; font-weight: 700; color: var(--bg-gray-600); }
.bg-qty button:hover { background: var(--bg-gray-100); }
.bg-qty span { padding: 0 8px; font-size: .8rem; font-weight: 600; min-width: 28px; text-align: center; }

/* ============ Misc ============ */
.bg-empty { text-align: center; padding: 48px 20px; color: var(--bg-gray-400); }
.bg-empty svg { margin-bottom: 12px; color: var(--bg-gray-300); }
.bg-empty p { margin: 0; font-size: .9rem; }

.bg-avatar { width: 36px; height: 36px; border-radius: 9px; object-fit: cover; background: var(--bg-gray-100); }
.bg-avatar-sm { width: 28px; height: 28px; border-radius: 7px; }

.bg-progress { height: 6px; background: var(--bg-gray-100); border-radius: 4px; overflow: hidden; }
.bg-progress-bar { height: 100%; border-radius: 4px; background: linear-gradient(90deg, var(--bg-blue-500), var(--bg-cyan-500)); }

/* Toast / flash */
.bg-flash { position: fixed; top: 80px; right: 24px; z-index: 2000; max-width: 360px; }
.bg-flash .alert { border: none; border-radius: 12px; box-shadow: var(--bg-shadow-lg); padding: 14px 18px; font-size: .85rem; }

/* Receipt */
.bg-receipt { max-width: 320px; margin: 0 auto; font-family: 'Courier New', monospace; font-size: .8rem; color: #000; }
.bg-receipt h4 { font-size: 1rem; }
.bg-receipt table { width: 100%; }
.bg-receipt .sep { border-top: 1px dashed #000; margin: 8px 0; }

/* Print */
@media print {
  .bg-navbar, .bg-sidebar, .bg-sidebar-backdrop, .bg-footer, .d-print-none { display: none !important; }
  .bg-main { margin-left: 0 !important; padding-top: 0 !important; }
  body { background: #fff; }
}

/* ============ Responsive ============ */
@media (max-width: 991.98px) {
  .bg-sidebar { transform: translateX(-100%); }
  .bg-sidebar.show { transform: translateX(0); box-shadow: 0 0 40px rgba(0,0,0,.3); }
  .bg-main { margin-left: 0; }
  .bg-pos { grid-template-columns: 1fr; }
  .bg-cart { position: static; }
}
@media (max-width: 575.98px) {
  .bg-content { padding: 16px; }
  .bg-auth-right { padding: 28px; margin: 16px; }
  .bg-search { display: none; }
}