@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap');

:root {
  --mv-font: "Plus Jakarta Sans", "Segoe UI", sans-serif;
  --mv-bg: #f3efe7;
  --mv-bg-soft: #fbf9f4;
  --mv-surface: rgba(255, 255, 255, 0.88);
  --mv-surface-strong: #ffffff;
  --mv-border: rgba(33, 44, 65, 0.12);
  --mv-text: #1f2937;
  --mv-muted: #667085;
  --mv-brand: #0f4c5c;
  --mv-brand-strong: #0a3742;
  --mv-accent: #c48a3a;
  --mv-shadow: 0 24px 60px rgba(15, 23, 42, 0.10);
  --mv-radius: 24px;
  --mv-primary: #04b84a;
  --mv-primary-dark: #04943d;
  --mv-accent-live: #ff9f2e;
  --mv-page-bg-live: #edf4f7;
  --mv-header-start: #04b84a;
  --mv-header-end: #04943d;
  --mv-header-text: #ffffff;
  --mv-header-gradient: linear-gradient(135deg, #04b84a 0%, #04943d 100%);
}

html, body {
  font-family: var(--mv-font);
  color: var(--mv-text);
}

body {
  background:
    radial-gradient(circle at top left, rgba(196, 138, 58, 0.18), transparent 30%),
    radial-gradient(circle at top right, rgba(15, 76, 92, 0.14), transparent 28%),
    linear-gradient(180deg, #f8f5ee 0%, #f1ece2 100%);
  min-height: 100vh;
}

.mv-shell {
  position: relative;
}

.mv-shell::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(135deg, rgba(255,255,255,0.12), transparent 35%),
    repeating-linear-gradient(
      135deg,
      rgba(255,255,255,0.06) 0,
      rgba(255,255,255,0.06) 1px,
      transparent 1px,
      transparent 18px
    );
  opacity: 0.55;
}

.mv-panel,
.card {
  border: 1px solid var(--mv-border);
  border-radius: var(--mv-radius);
  background: var(--mv-surface);
  box-shadow: var(--mv-shadow);
  backdrop-filter: blur(16px);
}

.mv-hero-card {
  border: 1px solid rgba(255,255,255,0.45);
  border-radius: 28px;
  background:
    linear-gradient(135deg, rgba(15, 76, 92, 0.96), rgba(10, 55, 66, 0.92)),
    linear-gradient(135deg, rgba(196, 138, 58, 0.18), transparent);
  box-shadow: 0 30px 70px rgba(10, 55, 66, 0.24);
  color: #fff;
}

.mv-kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 14px;
  border-radius: 999px;
  background: rgba(255,255,255,0.14);
  border: 1px solid rgba(255,255,255,0.16);
  font-size: 0.82rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.mv-title {
  font-weight: 800;
  letter-spacing: -0.04em;
}

.mv-muted {
  color: var(--mv-muted);
}

.mv-btn-primary,
.btn-primary {
  background: var(--mv-header-gradient);
  border-color: transparent;
  color: #fff;
  box-shadow: 0 16px 30px rgba(15, 23, 42, 0.16);
}

.mv-btn-primary:hover,
.mv-btn-primary:focus,
.btn-primary:hover,
.btn-primary:focus {
  background: linear-gradient(135deg, var(--mv-primary-dark), var(--mv-primary));
  border-color: transparent;
  color: #fff;
}

.mv-btn-accent {
  background: var(--mv-accent-live);
  border-color: transparent;
  color: #fff;
  box-shadow: 0 14px 28px rgba(196, 138, 58, 0.22);
}

.mv-btn-accent:hover,
.mv-btn-accent:focus {
  color: #fff;
  background: var(--mv-accent-live);
}

.btn,
.form-control,
.form-select {
  border-radius: 16px;
}

.form-control,
.form-select {
  border: 1px solid rgba(33, 44, 65, 0.10);
  box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.03);
  padding: 0.82rem 0.95rem;
}

.form-control:focus,
.form-select:focus {
  border-color: rgba(15, 76, 92, 0.46);
  box-shadow: 0 0 0 0.25rem rgba(15, 76, 92, 0.12);
}

.alert {
  border-radius: 18px;
  border: 1px solid rgba(33, 44, 65, 0.08);
}

.mv-grid {
  display: grid;
  gap: 1.25rem;
}

.mv-summary-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  padding: 0.7rem 0;
}

.mv-summary-row + .mv-summary-row {
  border-top: 1px solid rgba(33, 44, 65, 0.08);
}

.mv-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(4, 184, 74, 0.08);
  color: var(--mv-primary-dark);
  font-size: 0.88rem;
  font-weight: 600;
}

.mv-link {
  color: var(--mv-primary-dark);
  text-decoration: none;
}

.mv-link:hover {
  color: var(--mv-primary);
}

.mv-app-bg {
  background: var(--mv-page-bg-live);
  min-height: 100vh;
  position: relative;
}

.mv-app-bg::before {
  content: "";
  position: fixed;
  inset: 0 0 auto 0;
  height: 260px;
  pointer-events: none;
  background: var(--mv-header-gradient);
  opacity: 0.08;
  z-index: 0;
}

.mv-app-bg > * {
  position: relative;
  z-index: 1;
}

.mv-appbar {
  position: sticky;
  top: 0;
  z-index: 1040;
  background: var(--mv-header-gradient);
  color: var(--mv-header-text);
  box-shadow: 0 14px 34px rgba(15, 23, 42, 0.16);
  overflow: hidden;
}

.mv-appbar::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(255,255,255,.20), transparent 38%, rgba(255,255,255,.10)),
    radial-gradient(circle at 18% 0%, rgba(255,255,255,.22), transparent 30%);
  opacity: .85;
}

.mv-appbar::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 1px;
  background: rgba(255,255,255,.24);
}

.mv-appbar-inner {
  width: min(1500px, calc(100% - 24px));
  min-height: 72px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  position: relative;
  z-index: 1;
}

.mv-app-brand {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--mv-header-text);
  text-decoration: none;
  padding: 8px 0;
}

.mv-app-logo {
  width: 46px;
  height: 46px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  background: rgba(255,255,255,0.20);
  border: 1px solid rgba(255,255,255,0.30);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.22), 0 10px 22px rgba(15,23,42,.14);
  font-weight: 900;
  color: var(--mv-header-text);
}

.mv-app-brand-text {
  min-width: 0;
  display: grid;
  line-height: 1.1;
}

.mv-app-brand-text strong {
  font-size: 1.04rem;
  letter-spacing: 0;
}

.mv-app-brand-text strong,
.mv-app-brand-text small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mv-app-brand-text small {
  opacity: 0.86;
  margin-top: 3px;
}

.mv-app-actions {
  flex: 1 1 auto;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  overflow-x: auto;
  scrollbar-width: none;
}

.mv-app-menu {
  width: 42px;
  height: 42px;
  border: 1px solid rgba(255,255,255,.24);
  border-radius: 12px;
  display: none;
  place-items: center;
  background: rgba(255,255,255,.14);
  color: var(--mv-header-text);
  font-size: 1.45rem;
  flex: 0 0 auto;
}

.mv-sidebar-collapse {
  width: 40px;
  height: 40px;
  display: none;
  place-items: center;
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 10px;
  background: rgba(255,255,255,.12);
  color: var(--mv-header-text);
  font-size: 1.1rem;
}

.mv-app-actions::-webkit-scrollbar {
  display: none;
}

.mv-nav-group {
  position: relative;
  display: inline-flex;
}

.mv-nav-submenu {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  min-width: 190px;
  display: none;
  padding: 8px;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 18px 40px rgba(15,23,42,.18);
  z-index: 1090;
}

.mv-nav-group:hover .mv-nav-submenu,
.mv-nav-group:focus-within .mv-nav-submenu {
  display: grid;
  gap: 4px;
}

.mv-nav-submenu a {
  padding: 9px 10px;
  border-radius: 9px;
  color: #111827;
  text-decoration: none;
  font-size: .88rem;
  font-weight: 800;
}

.mv-nav-submenu a:hover {
  background: #eef8f1;
  color: var(--mv-primary-dark);
}

.mv-app-action,
.mv-app-primary {
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  border-radius: 999px;
  padding: 0 14px;
  color: var(--mv-header-text);
  text-decoration: none;
  white-space: nowrap;
  font-weight: 700;
  border: 1px solid rgba(255,255,255,.18);
  transition: transform .16s ease, background .16s ease, box-shadow .16s ease;
}

.mv-app-action {
  background: rgba(255,255,255,0.12);
}

.mv-app-primary {
  background: var(--mv-accent-live);
  border-color: rgba(255,255,255,.12);
  box-shadow: 0 10px 22px rgba(15,23,42,.14);
}

.mv-app-action:hover,
.mv-app-primary:hover {
  color: var(--mv-header-text);
  transform: translateY(-1px);
  background: rgba(255,255,255,.20);
}

.mv-app-primary:hover {
  background: var(--mv-accent-live);
}

.mv-app-action em {
  min-width: 20px;
  height: 20px;
  display: inline-grid;
  place-items: center;
  border-radius: 999px;
  background: #fff;
  color: var(--mv-primary-dark);
  font-style: normal;
  font-size: 0.72rem;
}

.mv-page {
  width: min(1180px, calc(100% - 24px));
  margin: 0 auto;
  padding: 22px 0 34px;
}

.mv-page-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 16px;
}

.mv-page-title {
  margin: 0;
  font-size: clamp(1.45rem, 4vw, 2rem);
  font-weight: 900;
  letter-spacing: 0;
}

.mv-page-subtitle {
  color: var(--mv-muted);
  margin: 6px 0 0;
}

.mv-standard-card {
  background: #fff;
  border: 1px solid rgba(31, 41, 55, 0.09);
  border-radius: 8px;
  box-shadow: 0 10px 26px rgba(15,23,42,.06);
}

.mv-dashboard-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: 10px;
  margin-bottom: 18px;
}

.mv-action-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 10px;
}

.mv-action-card {
  min-height: 80px;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px;
  color: #17212b;
  text-decoration: none;
}

.mv-action-card:hover {
  color: #17212b;
  border-color: rgba(4, 184, 74, .35);
  box-shadow: 0 12px 30px rgba(15,23,42,.09);
}

.mv-action-icon {
  width: 42px;
  height: 42px;
  border-radius: 8px;
  background: var(--mv-header-gradient);
  color: #fff;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  font-size: 1.1rem;
}

.mv-side-appbar {
  overflow: visible;
}

.mv-user-menu {
  position: relative;
  flex: 0 0 auto;
}

.mv-user-button {
  width: 100%;
  min-height: 48px;
  display: flex;
  align-items: center;
  gap: 10px;
  border: 1px solid rgba(255,255,255,.20);
  border-radius: 12px;
  background: rgba(255,255,255,.12);
  color: var(--mv-header-text);
  padding: 7px 10px;
  text-align: left;
}

.mv-user-avatar {
  width: 36px;
  height: 36px;
  flex: 0 0 36px;
  border-radius: 10px;
  display: grid;
  place-items: center;
  overflow: hidden;
  background: rgba(255,255,255,.22);
  border: 1px solid rgba(255,255,255,.28);
  color: #fff;
  font-weight: 900;
}

.mv-user-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.mv-user-copy {
  min-width: 0;
  display: grid;
  line-height: 1.1;
  flex: 1 1 auto;
}

.mv-user-copy strong,
.mv-user-copy small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mv-user-copy small {
  opacity: .82;
  margin-top: 3px;
}

.mv-user-dropdown {
  position: absolute;
  right: 0;
  top: calc(100% + 8px);
  width: min(280px, 90vw);
  display: none;
  padding: 8px;
  background: #fff;
  color: #17212b;
  border: 1px solid rgba(31,41,55,.10);
  border-radius: 8px;
  box-shadow: 0 18px 42px rgba(15,23,42,.18);
  z-index: 1090;
}

.mv-user-menu.is-open .mv-user-dropdown {
  display: grid;
  gap: 4px;
}

.mv-user-dropdown a,
.mv-user-dropdown > span {
  min-height: 40px;
  display: flex;
  align-items: center;
  gap: 9px;
  border-radius: 7px;
  padding: 8px 10px;
  color: #17212b;
  text-decoration: none;
  font-weight: 700;
}

.mv-user-dropdown a:hover {
  background: #f1f5f9;
}

.mv-login-bottom-nav {
  display: none;
}

.mv-floating-actions {
  position: fixed;
  right: 18px;
  bottom: 22px;
  z-index: 1035;
  display: flex;
  flex-direction: column;
  gap: 10px;
  transition: transform .22s ease, opacity .22s ease;
}

.mv-floating-actions.is-hidden {
  transform: translateY(18px);
  opacity: 0;
  pointer-events: none;
}

.mv-floating-actions a {
  width: 46px;
  height: 46px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  background: #fff;
  color: var(--mv-primary-dark);
  border: 1px solid rgba(31,41,55,.10);
  box-shadow: 0 14px 30px rgba(15,23,42,.16);
  text-decoration: none;
  transition: transform .16s ease, box-shadow .16s ease;
}

.mv-floating-actions a:hover {
  transform: translateY(-2px);
  box-shadow: 0 16px 34px rgba(15,23,42,.20);
}

.mv-floating-actions .mv-floating-primary {
  background: var(--mv-accent-live);
  color: #fff;
}

.mv-group-float {
  position: fixed;
  right: 18px;
  top: 92px;
  z-index: 1090;
  width: 52px;
  height: 52px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: #25d366;
  color: #fff;
  border: 1px solid rgba(255,255,255,.32);
  box-shadow: 0 16px 34px rgba(15,23,42,.22);
  text-decoration: none;
  font-size: 1.55rem;
  transition: transform .16s ease, box-shadow .16s ease, opacity .2s ease;
}

.mv-group-float:hover {
  color: #fff;
  transform: translateY(-2px);
  box-shadow: 0 18px 38px rgba(15,23,42,.28);
}

.mv-group-float span {
  position: absolute;
  right: 60px;
  white-space: nowrap;
  background: rgba(15,23,42,.88);
  color: #fff;
  border-radius: 999px;
  padding: 7px 11px;
  font-size: .78rem;
  font-weight: 800;
  opacity: 0;
  transform: translateX(-6px);
  pointer-events: none;
  transition: opacity .16s ease, transform .16s ease;
}

.mv-group-float.is-left {
  left: 18px;
  right: auto;
}

.mv-group-float.is-left span {
  left: 60px;
  right: auto;
}

.mv-group-float:hover span,
.mv-group-float:focus-visible span {
  opacity: 1;
  transform: translateX(0);
}

@media (max-width: 991px) {
  .mv-group-float {
    top: 82px;
  }
}

.mv-feedback-layer {
  position: fixed;
  left: 50%;
  top: 22px;
  z-index: 3000;
  width: min(520px, calc(100% - 24px));
  transform: translateX(-50%);
  display: grid;
  gap: 10px;
  pointer-events: none;
}

.mv-feedback-toast {
  display: grid;
  gap: 2px;
  padding: 12px 14px;
  border-radius: 8px;
  background: #fff;
  color: #17212b;
  border-left: 5px solid var(--mv-primary);
  box-shadow: 0 18px 48px rgba(15,23,42,.22);
  animation: mvToastIn .18s ease both;
  pointer-events: auto;
}

.mv-feedback-toast span {
  color: #64748b;
}

.mv-feedback-success { border-left-color: #16a34a; }
.mv-feedback-danger,
.mv-feedback-error { border-left-color: #dc2626; }
.mv-feedback-warning { border-left-color: #d97706; }

.mv-feedback-toast.is-leaving {
  animation: mvToastOut .24s ease both;
}

.mv-button-spinner {
  width: 1em;
  height: 1em;
  display: inline-block;
  border-radius: 999px;
  border: 2px solid currentColor;
  border-right-color: transparent;
  animation: mvSpin .72s linear infinite;
}

button.is-loading,
input.is-loading {
  cursor: wait;
}

.mv-click-card {
  cursor: pointer;
  transition: transform .16s ease, box-shadow .16s ease;
}

.mv-click-card:hover {
  transform: translateY(-1px);
  box-shadow: 0 14px 34px rgba(15,23,42,.10);
}

.mv-card-details {
  display: none;
  margin-top: 10px;
  color: #64748b;
  font-size: .9rem;
}

.analytics-mini {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  flex-wrap: wrap;
  min-width: 156px;
}

.analytics-mini span {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  border-radius: 999px;
  background: #f1f5f9;
  color: #334155;
  padding: 3px 7px;
  font-size: .76rem;
  font-weight: 800;
}

.mv-click-card.is-expanded .mv-card-details {
  display: block;
}

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

@keyframes mvToastIn {
  from { opacity: 0; transform: translateY(-8px) scale(.98); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes mvToastOut {
  to { opacity: 0; transform: translateY(-8px) scale(.98); }
}

@media (min-width: 921px) {
  .mv-side-appbar {
    position: fixed;
    inset: 0 auto 0 0;
    width: 270px;
    overflow: visible;
    box-shadow: 14px 0 34px rgba(15,23,42,.16);
  }

  .mv-side-appbar::after {
    top: 0;
    right: 0;
    bottom: 0;
    left: auto;
    width: 1px;
    height: auto;
  }

  .mv-side-appbar .mv-appbar-inner {
    width: 100%;
    min-height: 100%;
    padding: 18px 14px;
    margin: 0;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 14px;
  }

  .mv-side-appbar .mv-app-brand {
    padding: 4px 0 8px;
  }

  .mv-side-appbar .mv-app-menu {
    display: none;
  }

  .mv-side-appbar .mv-sidebar-collapse {
    display: grid;
    position: absolute;
    right: -20px;
    top: 88px;
    background: var(--mv-primary-dark);
    box-shadow: 0 12px 24px rgba(15,23,42,.20);
    z-index: 2;
  }

  .mv-side-appbar .mv-app-actions {
    width: 100%;
    flex: 1 1 auto;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 8px;
    overflow: visible;
  }

  .mv-side-appbar .mv-nav-group {
    width: 100%;
    display: grid;
    gap: 5px;
  }

  .mv-side-appbar .mv-nav-submenu {
    position: static;
    display: grid;
    gap: 4px;
    min-width: 0;
    padding: 2px 0 2px 32px;
    background: transparent;
    box-shadow: none;
  }

  .mv-side-appbar .mv-nav-submenu a {
    color: rgba(255,255,255,.88);
    background: rgba(255,255,255,.08);
  }

  .mv-side-appbar .mv-app-action,
  .mv-side-appbar .mv-app-primary {
    width: 100%;
    min-height: 44px;
    justify-content: flex-start;
    border-radius: 10px;
  }

  .mv-side-appbar .mv-user-menu {
    margin-top: auto;
  }

  .mv-side-appbar .mv-user-dropdown {
    left: calc(100% + 10px);
    right: auto;
    bottom: 0;
    top: auto;
  }

  .mv-side-appbar ~ .mv-page,
  .mv-side-appbar ~ .container,
  .mv-side-appbar ~ main.auth-wrap {
    width: calc(100% - 306px) !important;
    max-width: none !important;
    margin-left: 288px !important;
    margin-right: 18px !important;
  }

  body.mv-sidebar-collapsed .mv-side-appbar {
    width: 74px;
  }

  body.mv-sidebar-collapsed .mv-side-appbar .mv-appbar-inner {
    padding-left: 10px;
    padding-right: 10px;
    align-items: center;
  }

  body.mv-sidebar-collapsed .mv-side-appbar .mv-app-brand-text,
  body.mv-sidebar-collapsed .mv-side-appbar .mv-app-action span,
  body.mv-sidebar-collapsed .mv-side-appbar .mv-app-primary span,
  body.mv-sidebar-collapsed .mv-side-appbar .mv-nav-submenu,
  body.mv-sidebar-collapsed .mv-side-appbar .mv-user-copy {
    display: none;
  }

  body.mv-sidebar-collapsed .mv-side-appbar .mv-app-action,
  body.mv-sidebar-collapsed .mv-side-appbar .mv-app-primary {
    width: 48px;
    justify-content: center;
    padding: 0;
  }

  body.mv-sidebar-collapsed .mv-side-appbar .mv-user-button {
    width: 48px;
    padding: 0;
    justify-content: center;
  }

  body.mv-sidebar-collapsed .mv-side-appbar ~ .mv-page,
  body.mv-sidebar-collapsed .mv-side-appbar ~ .container,
  body.mv-sidebar-collapsed .mv-side-appbar ~ main.auth-wrap {
    width: calc(100% - 112px) !important;
    margin-left: 94px !important;
    margin-right: 18px !important;
  }
}

@media (max-width: 920px) {
  .mv-appbar-inner {
    flex-wrap: wrap;
  }

  .mv-app-menu {
    display: grid;
    margin-left: auto;
  }

  .mv-app-actions {
    flex: 1 1 100%;
    width: 100%;
    display: none;
    grid-template-columns: repeat(auto-fit, minmax(132px, 1fr));
    gap: 8px;
    max-width: none;
    padding: 0 0 8px;
    overflow: visible;
  }

  .mv-app-actions.is-open {
    display: grid;
  }

  .mv-app-action,
  .mv-app-primary {
    justify-content: center;
  }
}

@media (max-width: 760px) {
  .mv-appbar-inner {
    width: min(100% - 18px, 760px);
    min-height: 64px;
    gap: 8px;
    flex-wrap: wrap;
  }

  .mv-app-logo {
    width: 38px;
    height: 38px;
    border-radius: 12px;
  }

  .mv-app-brand-text strong {
    max-width: 42vw;
  }

  .mv-app-brand-text small {
    display: none;
  }

  .mv-app-menu {
    display: grid;
    margin-left: auto;
  }

  .mv-app-actions {
    flex: 1 1 100%;
    width: 100%;
    display: none;
    grid-template-columns: repeat(auto-fit, minmax(132px, 1fr));
    gap: 8px;
    max-width: none;
    padding: 0 0 8px;
    overflow: visible;
  }

  .mv-app-actions.is-open {
    display: grid;
  }

  .mv-app-action,
  .mv-app-primary {
    min-height: 38px;
    min-width: 38px;
    padding: 0 10px;
    justify-content: center;
  }

  .mv-app-action span,
  .mv-app-primary span {
    display: inline;
  }

  .mv-page {
    width: min(100% - 18px, 760px);
    padding-top: 16px;
  }

  .mv-page-head {
    display: block;
  }
}

@media (max-width: 920px) {
  .mv-side-appbar {
    position: sticky;
    top: 0;
    overflow: visible;
  }

  .mv-side-appbar .mv-appbar-inner {
    width: min(100% - 18px, 920px);
    min-height: 66px;
    flex-wrap: nowrap;
  }

  .mv-side-appbar .mv-app-brand {
    flex: 1 1 auto;
  }

  .mv-side-appbar .mv-user-menu {
    width: auto;
    order: 3;
  }

  .mv-side-appbar .mv-user-button {
    width: 42px;
    height: 42px;
    min-height: 42px;
    padding: 0;
    justify-content: center;
    border-radius: 12px;
  }

  .mv-side-appbar .mv-user-copy,
  .mv-side-appbar .mv-user-button > .bi {
    display: none;
  }

  .mv-side-appbar .mv-user-dropdown {
    right: 0;
    left: auto;
    top: calc(100% + 8px);
    bottom: auto;
  }

  .mv-side-appbar .mv-app-menu {
    order: 2;
    display: grid;
    margin-left: auto;
  }

  .mv-side-appbar .mv-sidebar-collapse {
    display: none;
  }

  .mv-side-appbar .mv-app-actions {
    position: fixed;
    left: 0;
    top: 0;
    bottom: 0;
    width: min(82vw, 310px);
    max-width: none;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 8px;
    padding: 84px 14px 18px;
    background: var(--mv-header-gradient);
    box-shadow: 18px 0 42px rgba(15,23,42,.24);
    transform: translateX(-105%);
    transition: transform .22s ease;
    z-index: 1080;
  }

  .mv-side-appbar .mv-nav-group {
    width: 100%;
    display: grid;
    gap: 5px;
  }

  .mv-side-appbar .mv-nav-submenu {
    position: static;
    display: grid;
    gap: 4px;
    min-width: 0;
    padding: 2px 0 2px 32px;
    background: transparent;
    box-shadow: none;
  }

  .mv-side-appbar .mv-nav-submenu a {
    color: rgba(255,255,255,.88);
    background: rgba(255,255,255,.08);
  }

  .mv-side-appbar .mv-app-actions.is-open {
    display: flex;
    transform: translateX(0);
  }

  .mv-drawer-open::after {
    content: "";
    position: fixed;
    inset: 0;
    background: rgba(15,23,42,.42);
    z-index: 1070;
  }

  .mv-side-appbar .mv-app-action,
  .mv-side-appbar .mv-app-primary {
    width: 100%;
    min-height: 44px;
    justify-content: flex-start;
    border-radius: 10px;
  }

  .mv-side-appbar ~ .mv-page,
  .mv-side-appbar ~ .container {
    padding-bottom: 102px;
  }

  .mv-login-bottom-nav {
    position: fixed;
    left: 10px;
    right: 10px;
    bottom: 10px;
    z-index: 1050;
    min-height: 64px;
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 4px;
    padding: 7px;
    background: rgba(255,255,255,.95);
    border: 1px solid rgba(31,41,55,.10);
    border-radius: 18px;
    box-shadow: 0 18px 44px rgba(15,23,42,.18);
    backdrop-filter: blur(14px);
  }

  .mv-login-bottom-nav a {
    min-width: 0;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 2px;
    border-radius: 13px;
    color: #334155;
    text-decoration: none;
    font-weight: 800;
    font-size: .68rem;
  }

  .mv-login-bottom-nav a:hover {
    background: #f1f5f9;
    color: var(--mv-primary-dark);
  }

  .mv-login-bottom-nav i {
    font-size: 1.05rem;
  }

  .mv-floating-actions {
    right: 16px;
    bottom: 88px;
  }
}

.mv-storefront {
  background: #f7f6f1;
}

.mv-storefront .mv-topbar {
  position: sticky;
  top: 0;
  z-index: 1030;
  background: rgba(247, 246, 241, 0.94);
  border-bottom: 1px solid rgba(31, 41, 55, 0.08);
  backdrop-filter: blur(14px);
}

.mv-container {
  width: min(1180px, calc(100% - 24px));
  margin: 0 auto;
}

.mv-brand-mark {
  width: 42px;
  height: 42px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  background: var(--mv-header-gradient);
  color: #fff;
  font-weight: 800;
}

.mv-search {
  display: flex;
  align-items: center;
  gap: 10px;
  background: #fff;
  border: 1px solid rgba(31, 41, 55, 0.12);
  border-radius: 18px;
  padding: 9px 12px;
  box-shadow: 0 10px 28px rgba(31, 41, 55, 0.06);
}

.mv-search input {
  width: 100%;
  min-width: 0;
  border: 0;
  outline: 0;
  background: transparent;
}

.mv-hero-market {
  background: var(--mv-header-gradient);
  color: #fff;
  border-radius: 0 0 28px 28px;
}

.mv-hero-grid {
  display: grid;
  gap: 24px;
  align-items: center;
  padding: 28px 0;
}

.mv-hero-title {
  max-width: 760px;
  font-size: clamp(2rem, 5vw, 4.4rem);
  line-height: 0.98;
  font-weight: 800;
}

.mv-hero-copy {
  max-width: 620px;
  color: rgba(255, 255, 255, 0.82);
  font-size: 1rem;
}

.mv-trust-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.mv-trust {
  padding: 12px;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.12);
  border: 1px solid rgba(255, 255, 255, 0.14);
}

.mv-section-title {
  font-weight: 800;
  letter-spacing: 0;
}

.mv-product-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.mv-product-card {
  height: 100%;
  background: #fff;
  border: 1px solid rgba(31, 41, 55, 0.09);
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 10px 28px rgba(31, 41, 55, 0.07);
}

.mv-product-media {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  aspect-ratio: 1 / 1;
  background: #fff;
  overflow: hidden;
}

.mv-product-media img,
.mv-gallery-main img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  display: block;
  background: #fff;
}

.mv-gallery-main video {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  display: block;
  background: #000;
}

.mv-product-actions {
  position: absolute;
  left: 10px;
  right: 10px;
  bottom: 10px;
  display: flex;
  gap: 8px;
}

.mv-icon-btn {
  width: 42px;
  height: 42px;
  border-radius: 14px;
  display: inline-grid;
  place-items: center;
  border: 0;
  background: var(--mv-header-gradient);
  color: #fff;
  text-decoration: none;
  box-shadow: 0 12px 22px rgba(15, 23, 42, 0.18);
}

.mv-icon-btn.secondary {
  background: rgba(17, 24, 39, 0.9);
}

.mv-icon-btn:disabled {
  opacity: 0.55;
}

.mv-card-body {
  padding: 12px;
}

.mv-card-title {
  display: -webkit-box;
  -webkit-line-clamp: var(--mv-card-title-lines, 2);
  -webkit-box-orient: vertical;
  overflow: hidden;
  min-height: calc(1.25em * var(--mv-card-title-lines, 2));
  color: var(--mv-card-title-color, #111111);
  font-weight: var(--mv-card-title-weight, 800);
  font-size: var(--mv-card-title-size, 1rem);
  line-height: 1.25;
  text-decoration: none;
}

.mv-price {
  color: var(--mv-primary-dark);
  font-size: 1.05rem;
  font-weight: 800;
}

.mv-meta {
  color: #667085;
  font-size: 0.9rem;
}

.mv-chip-row {
  display: flex;
  gap: 8px;
  overflow: auto;
  padding-bottom: 4px;
}

.mv-chip {
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
  border: 1px solid rgba(31, 41, 55, 0.12);
  border-radius: 999px;
  padding: 8px 12px;
  color: #1f2937;
  background: #fff;
  text-decoration: none;
  font-weight: 600;
}

.mv-chip.active {
  background: var(--mv-header-gradient);
  color: #fff;
}

.mv-panel-flat {
  background: #fff;
  border: 1px solid rgba(31, 41, 55, 0.09);
  border-radius: 8px;
  box-shadow: 0 12px 28px rgba(31, 41, 55, 0.07);
}

.mv-gallery {
  display: grid;
  gap: 12px;
}

.mv-gallery-main {
  aspect-ratio: 1 / 1;
  overflow: hidden;
  border-radius: 8px;
  background: #eef2f1;
}

.mv-gallery-thumbs {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
}

.mv-gallery-thumb {
  aspect-ratio: 1 / 1;
  border: 2px solid transparent;
  border-radius: 8px;
  overflow: hidden;
  background: #eef2f1;
  padding: 0;
}

.mv-gallery-thumb.active {
  border-color: var(--mv-primary);
}

.mv-checkout-grid {
  display: grid;
  gap: 16px;
}

.mv-share-row {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.mv-share-btn {
  width: 42px;
  height: 42px;
  display: inline-grid;
  place-items: center;
  border-radius: 14px;
  color: #fff;
  text-decoration: none;
  border: 0;
  box-shadow: 0 10px 18px rgba(15, 23, 42, 0.14);
}

.mv-share-btn:hover {
  color: #fff;
  transform: translateY(-1px);
}

.mv-share-whatsapp { background: #25d366; }
.mv-share-facebook { background: #1877f2; }
.mv-share-x { background: #111827; }
.mv-share-telegram { background: #229ed9; }
.mv-share-linkedin { background: #0a66c2; }
.mv-share-email { background: #6b7280; }
.mv-share-copy { background: var(--mv-header-gradient); }

.mv-blog-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
}

.mv-blog-card {
  display: grid;
  grid-template-columns: 112px minmax(0, 1fr);
  gap: 14px;
  background: #fff;
  border: 1px solid rgba(31, 41, 55, 0.09);
  border-radius: 8px;
  box-shadow: 0 10px 28px rgba(31, 41, 55, 0.07);
  overflow: hidden;
  padding: 10px;
}

.mv-blog-card img {
  width: 112px;
  height: 112px;
  object-fit: cover;
  border-radius: 8px;
  background: #eef2f1;
}

.mv-blog-title {
  color: #111827;
  font-weight: 800;
  text-decoration: none;
  line-height: 1.2;
}

.mv-blog-excerpt {
  color: #667085;
  font-size: 0.94rem;
}

@media (min-width: 768px) {
  .mv-product-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
  }

  .mv-trust-row {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (min-width: 992px) {
  .mv-hero-grid {
    grid-template-columns: minmax(0, 1fr) 360px;
    padding: 46px 0;
  }

  .mv-product-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .mv-checkout-grid {
    grid-template-columns: minmax(0, 1fr) 380px;
    align-items: start;
  }

  .mv-blog-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .mv-blog-card {
    display: block;
    padding: 0;
  }

  .mv-blog-card img {
    width: 100%;
    height: 190px;
    border-radius: 0;
  }

  .mv-blog-card .mv-blog-body {
    padding: 14px;
  }
}

@media (min-width: 1200px) {
  .mv-product-grid {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
}

/* ========== CONSISTENT TABLE STYLES ========== */
.mv-table {
  background: #fff;
  border: 1px solid rgba(31, 41, 55, 0.09);
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 10px 26px rgba(15,23,42,.06);
}

.mv-table thead {
  background: #f8fafc;
  border-bottom: 1px solid rgba(31, 41, 55, 0.09);
}

.mv-table th {
  padding: 14px 16px;
  font-size: 0.85rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #475569;
}

.mv-table td {
  padding: 14px 16px;
  border-bottom: 1px solid rgba(31, 41, 55, 0.06);
}

.mv-table tbody tr:last-child td {
  border-bottom: 0;
}

.mv-table tbody tr:hover {
  background: #f8fafc;
}

/* ========== FORM STYLES ========== */
.mv-form-group {
  margin-bottom: 18px;
}

.mv-form-group label {
  display: block;
  font-weight: 700;
  color: #1f2937;
  margin-bottom: 8px;
}

.mv-form-group .form-control,
.mv-form-group .form-select {
  width: 100%;
}

/* ========== MODAL & CARD STYLES ========== */
.mv-card {
  background: #fff;
  border: 1px solid rgba(31, 41, 55, 0.09);
  border-radius: 8px;
  box-shadow: 0 10px 26px rgba(15,23,42,.06);
}

.mv-card-header {
  padding: 16px;
  border-bottom: 1px solid rgba(31, 41, 55, 0.09);
  background: rgba(4,184,74,.04);
}

.mv-card-body {
  padding: 16px;
}

.mv-card-footer {
  padding: 16px;
  border-top: 1px solid rgba(31, 41, 55, 0.09);
  background: rgba(4,184,74,.04);
}

/* ========== STATUS BADGE STYLES ========== */
.mv-badge-success {
  background: rgba(34, 197, 94, 0.1);
  color: #16a34a;
}

.mv-badge-warning {
  background: rgba(251, 146, 60, 0.1);
  color: #ea580c;
}

.mv-badge-danger {
  background: rgba(239, 68, 68, 0.1);
  color: #dc2626;
}

.mv-badge-info {
  background: rgba(59, 130, 246, 0.1);
  color: #2563eb;
}

.mv-badge-secondary {
  background: rgba(107, 114, 128, 0.1);
  color: #4b5563;
}

/* ========== ALERT CONSISTENT STYLES ========== */
.alert {
  border-radius: 12px;
  border: 1px solid;
  padding: 14px 16px;
  margin-bottom: 16px;
}

.alert-success {
  background: rgba(34, 197, 94, 0.08);
  border-color: rgba(34, 197, 94, 0.3);
  color: #16a34a;
}

.alert-warning {
  background: rgba(251, 146, 60, 0.08);
  border-color: rgba(251, 146, 60, 0.3);
  color: #ea580c;
}

.alert-danger {
  background: rgba(239, 68, 68, 0.08);
  border-color: rgba(239, 68, 68, 0.3);
  color: #dc2626;
}

.alert-info {
  background: rgba(59, 130, 246, 0.08);
  border-color: rgba(59, 130, 246, 0.3);
  color: #2563eb;
}

/* ========== BUTTON GROUP STYLES ========== */
.btn-group-vertical .btn,
.btn-group .btn {
  border-radius: 8px;
}

.btn-sm {
  border-radius: 8px;
  padding: 6px 12px;
  font-size: 0.875rem;
}

.btn-lg {
  border-radius: 12px;
  padding: 12px 24px;
  font-size: 1rem;
}

/* ========== FILTER BAR STYLES ========== */
.mv-filterbar {
  position: sticky;
  top: 64px;
  z-index: 999;
  background: color-mix(in srgb, var(--mv-page-bg-live), #fff 72%);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(31, 41, 55, 0.09);
  padding: 12px 0;
  margin-bottom: 16px;
}

/* ========== EMPTY STATE STYLES ========== */
.mv-empty-state {
  text-align: center;
  padding: 40px 24px;
}

.mv-empty-state i {
  font-size: 3rem;
  color: #cbd5e1;
  display: block;
  margin-bottom: 16px;
}

.mv-empty-state h3 {
  font-weight: 700;
  color: #1f2937;
  margin-bottom: 8px;
}

.mv-empty-state p {
  color: #667085;
  margin-bottom: 20px;
}

/* ========== STAT CARD STYLES ========== */
.mv-stat-card {
  background: #fff;
  border: 1px solid rgba(31, 41, 55, 0.09);
  border-radius: 8px;
  padding: 12px;
  box-shadow: 0 10px 26px rgba(15,23,42,.06);
  min-height: 82px;
  display: flex;
  gap: 10px;
  align-items: center;
}

.mv-stat-label {
  font-size: 0.85rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #667085;
  margin-bottom: 0;
  min-width: 0;
  flex: 1 1 auto;
  overflow-wrap: anywhere;
}

.mv-stat-value {
  font-size: 2rem;
  font-weight: 900;
  color: var(--mv-primary-dark);
  line-height: 1;
  margin-left: auto;
  text-align: right;
  white-space: nowrap;
}

.mv-stat-icon {
  width: 46px;
  height: 46px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.35rem;
  margin-bottom: 0;
  background: rgba(4,184,74,.1);
  color: var(--mv-primary-dark);
}

.mv-stat-icon-blue{background:#eaf2ff;color:#1d4ed8}
.mv-stat-icon-green{background:#e9fbf0;color:#07853a}
.mv-stat-icon-amber{background:#fff7e6;color:#b45309}
.mv-stat-icon-purple{background:#f3e8ff;color:#7e22ce}
.mv-stat-icon-rose{background:#ffe8ed;color:#be123c}
.mv-stat-icon-cyan{background:#e6faff;color:#0e7490}
.mv-stat-icon-slate{background:#eef2f7;color:#334155}

/* ========== PILL/TAG STYLES ========== */
.mv-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 14px;
  border-radius: 999px;
  background: #f3efe7;
  color: #1f2937;
  font-size: 0.9rem;
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
  user-select: none;
  border: 1px solid rgba(31, 41, 55, 0.1);
}

.mv-pill:hover {
  background: #e8ddd2;
}

.mv-pill.active {
  background: var(--mv-header-gradient);
  color: #fff;
}

/* ========== KICKER/LABEL STYLES ========== */
.mv-kicker {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  border-radius: 999px;
  background: rgba(4,184,74,.08);
  color: var(--mv-primary-dark);
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  border: 1px solid rgba(31, 41, 55, 0.1);
}

.mv-kicker.dark {
  background: var(--mv-header-gradient);
  color: #fff;
}

/* ========== MARKET FOOTER ========== */
.market-footer {
  margin-top: auto;
  background: var(--mv-primary);
  color: #fff;
  padding: 34px 0 18px;
}

.market-footer-inner {
  width: min(1180px, calc(100% - 24px));
  margin: auto;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 28px;
}

.market-footer h2 {
  font-size: 1rem;
  font-weight: 900;
  margin: 0 0 14px;
}

.market-footer a {
  display: block;
  color: #fff;
  text-decoration: none;
  margin: 0 0 11px;
  font-size: 0.92rem;
}

.store-badge {
  background: #050505;
  border-radius: 8px;
  padding: 8px 12px !important;
  width: max-content;
  display: flex !important;
  gap: 10px;
  align-items: center;
}

.store-badge i {
  font-size: 1.5rem;
}

.store-badge small {
  display: block;
  font-size: 0.65rem;
  line-height: 1;
}

.market-flags {
  display: flex;
  gap: 10px;
  justify-content: center;
  flex-wrap: wrap;
  margin: 26px 12px 16px;
}

.market-flags span {
  width: 32px;
  height: 32px;
  border-radius: 999px;
  border: 2px solid rgba(255,255,255,.75);
  display: grid;
  place-items: center;
  font-size: 0.65rem;
  font-weight: 900;
}

.market-copy {
  text-align: center;
  margin: 0;
  color: rgba(255,255,255,.88);
}

/* ========== RESPONSIVE FIXES ========== */
@media (max-width: 800px) {
  .market-footer-inner {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 560px) {
  .mv-table {
    overflow-x: auto;
  }

  .mv-page-head {
    flex-direction: column;
    align-items: flex-start;
  }

  .mv-page-head .btn {
    width: 100%;
  }

  .mv-dashboard-grid {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .mv-action-grid {
    grid-template-columns: 1fr;
  }

  .mv-action-card {
    min-height: 70px;
  }

  .mv-card-body {
    padding: 12px;
  }

  .mv-stat-card {
    padding: 12px;
  }
}

@media (max-width: 380px) {
  .market-footer-inner {
    grid-template-columns: 1fr;
  }
}



/* Fresh login/account/sidebar fix */
.mv-user-menu { z-index: 1200; }
.mv-user-button { cursor: pointer; }
.mv-user-dropdown { pointer-events: auto; }
.mv-user-menu.is-open .mv-user-dropdown {
  display: grid !important;
  gap: 4px;
  animation: mvDropdownIn .16s ease both;
}
@keyframes mvDropdownIn {
  from { opacity: 0; transform: translateY(-6px); }
  to { opacity: 1; transform: translateY(0); }
}

@media (min-width: 921px) {
  .mv-side-appbar {
    position: fixed !important;
    left: 0;
    top: 0;
    bottom: 0;
    width: 288px;
    height: 100vh;
    overflow: visible !important;
    border-radius: 0 !important;
  }

  .mv-side-appbar .mv-appbar-inner {
    width: 100% !important;
    height: 100%;
    min-height: 100vh;
    padding: 18px 14px;
    margin: 0;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    overflow: visible;
  }

  .mv-side-appbar .mv-app-menu {
    display: none !important;
  }

  .mv-side-appbar .mv-sidebar-collapse {
    display: grid !important;
    position: absolute;
    right: -21px;
    top: 92px;
    z-index: 1250;
    background: #0518b9;
    box-shadow: 0 10px 26px rgba(0,0,0,.22);
  }

  .mv-side-appbar .mv-app-actions {
    display: grid !important;
    width: 100%;
    flex: 0 0 auto;
    overflow: visible;
    gap: 8px;
    margin-top: 18px;
    justify-content: stretch;
  }

  .mv-side-appbar .mv-app-action,
  .mv-side-appbar .mv-app-primary {
    width: 100%;
    justify-content: flex-start;
    border-radius: 10px;
  }

  .mv-side-appbar .mv-user-menu {
    margin-top: auto;
    width: 100%;
  }

  .mv-side-appbar .mv-user-dropdown {
    left: calc(100% + 12px);
    right: auto;
    bottom: 0;
    top: auto;
    border-radius: 14px;
  }

  .mv-side-appbar ~ .mv-page,
  .mv-side-appbar ~ .container,
  .mv-side-appbar ~ main,
  .mv-side-appbar ~ .content,
  .mv-side-appbar ~ .auth-wrap {
    width: calc(100% - 324px) !important;
    max-width: none !important;
    margin-left: 306px !important;
    margin-right: 18px !important;
  }

  body.mv-sidebar-collapsed .mv-side-appbar {
    width: 78px;
  }

  body.mv-sidebar-collapsed .mv-side-appbar .mv-appbar-inner {
    padding-left: 10px;
    padding-right: 10px;
    align-items: center;
  }

  body.mv-sidebar-collapsed .mv-side-appbar .mv-app-brand-text,
  body.mv-sidebar-collapsed .mv-side-appbar .mv-app-action span,
  body.mv-sidebar-collapsed .mv-side-appbar .mv-app-primary span,
  body.mv-sidebar-collapsed .mv-side-appbar .mv-nav-submenu,
  body.mv-sidebar-collapsed .mv-side-appbar .mv-user-copy {
    display: none !important;
  }

  body.mv-sidebar-collapsed .mv-side-appbar .mv-app-action,
  body.mv-sidebar-collapsed .mv-side-appbar .mv-app-primary,
  body.mv-sidebar-collapsed .mv-side-appbar .mv-user-button {
    width: 50px;
    justify-content: center;
    padding-left: 0;
    padding-right: 0;
  }

  body.mv-sidebar-collapsed .mv-side-appbar ~ .mv-page,
  body.mv-sidebar-collapsed .mv-side-appbar ~ .container,
  body.mv-sidebar-collapsed .mv-side-appbar ~ main,
  body.mv-sidebar-collapsed .mv-side-appbar ~ .content,
  body.mv-sidebar-collapsed .mv-side-appbar ~ .auth-wrap {
    width: calc(100% - 116px) !important;
    margin-left: 96px !important;
    margin-right: 18px !important;
  }
}

@media (max-width: 920px) {
  .mv-user-dropdown {
    position: fixed !important;
    left: 12px !important;
    right: 12px !important;
    top: 76px !important;
    width: auto !important;
    z-index: 1300 !important;
  }
}

/* =========================================================
   Global Loading/Feedback Overlay Fix
   Keeps processing text hidden until a real submit/API request.
   ========================================================= */
.mv-global-overlay{
  position:fixed !important;
  inset:0 !important;
  display:none !important;
  align-items:center !important;
  justify-content:center !important;
  padding:20px !important;
  background:rgba(15,23,42,.38) !important;
  backdrop-filter:blur(5px) !important;
  z-index:2147483646 !important;
  opacity:0 !important;
  pointer-events:none !important;
  transition:opacity .22s ease !important;
}
.mv-global-overlay.is-visible{
  display:flex !important;
  opacity:1 !important;
  pointer-events:auto !important;
}
.mv-global-loader{
  width:min(420px,92vw) !important;
  border-radius:22px !important;
  background:#fff !important;
  box-shadow:0 24px 70px rgba(15,23,42,.25) !important;
  padding:28px 24px !important;
  text-align:center !important;
  color:#0f172a !important;
  transform:translateY(8px) scale(.98) !important;
  transition:transform .22s ease !important;
}
.mv-global-overlay.is-visible .mv-global-loader{
  transform:translateY(0) scale(1) !important;
}
.mv-spinner-ring{
  width:56px !important;
  height:56px !important;
  margin:0 auto 14px !important;
  border:5px solid rgba(225,29,72,.16) !important;
  border-top-color:#e11d48 !important;
  border-radius:50% !important;
  animation:mvSpin .75s linear infinite !important;
}
.mv-spinner-ring span{display:none !important;}
.mv-global-loader h4{
  margin:0 0 6px !important;
  font-size:18px !important;
  font-weight:800 !important;
  color:#0f172a !important;
}
.mv-global-loader p{
  margin:0 !important;
  font-size:14px !important;
  color:#64748b !important;
}
body.mv-processing form.mv-form-processing{
  pointer-events:none !important;
  opacity:.78 !important;
}
.mv-toast-center{
  position:fixed !important;
  top:22px !important;
  left:50% !important;
  transform:translateX(-50%) !important;
  z-index:2147483647 !important;
  display:flex !important;
  flex-direction:column !important;
  gap:10px !important;
  width:min(430px,92vw) !important;
  pointer-events:none !important;
}
.mv-toast{
  display:flex !important;
  align-items:flex-start !important;
  gap:12px !important;
  padding:14px 16px !important;
  border-radius:16px !important;
  background:#fff !important;
  box-shadow:0 18px 50px rgba(15,23,42,.18) !important;
  border:1px solid rgba(148,163,184,.22) !important;
  opacity:0 !important;
  transform:translateY(-10px) scale(.98) !important;
  transition:all .22s ease !important;
  pointer-events:auto !important;
}
.mv-toast.is-visible{opacity:1 !important; transform:translateY(0) scale(1) !important;}
.mv-toast-copy{display:flex !important; flex-direction:column !important; gap:2px !important; flex:1 !important;}
.mv-toast-copy strong{font-size:14px !important; color:#0f172a !important;}
.mv-toast-copy span{font-size:13px !important; color:#64748b !important;}
.mv-toast-icon{font-size:20px !important; color:#0ea5e9 !important; line-height:1 !important;}
.mv-toast-success .mv-toast-icon{color:#16a34a !important;}
.mv-toast-error .mv-toast-icon{color:#dc2626 !important;}
.mv-toast-close{border:0 !important; background:transparent !important; color:#64748b !important; cursor:pointer !important; padding:2px !important;}
@keyframes mvSpin{to{transform:rotate(360deg)}}


/* === FIX: Side account dropdown + homepage video preview === */
.catalog-main-frame{position:relative;}
.catalog-main-video{width:100%;height:100%;object-fit:cover;display:block;background:#0f172a;}
.catalog-video-main-badge{position:absolute;right:10px;bottom:10px;width:34px;height:34px;border-radius:999px;background:rgba(15,23,42,.82);color:#fff;display:grid;place-items:center;font-size:1rem;box-shadow:0 12px 26px rgba(15,23,42,.28);z-index:4;}

.mv-user-menu{position:relative;z-index:3000;}
.mv-user-button{cursor:pointer;}
.mv-user-dropdown{z-index:2147483000 !important;}
.mv-user-menu.is-open .mv-user-dropdown{display:grid !important;opacity:1 !important;visibility:visible !important;pointer-events:auto !important;}

@media (min-width: 992px){
  .mv-side-appbar .mv-user-menu{position:sticky;bottom:10px;z-index:3100;}
  .mv-side-appbar .mv-user-dropdown{
    position:fixed !important;
    left:var(--mv-user-dd-left, 260px) !important;
    top:var(--mv-user-dd-top, auto) !important;
    bottom:auto !important;
    right:auto !important;
    width:min(290px, calc(100vw - 24px)) !important;
    max-height:min(360px, calc(100vh - 24px)) !important;
    overflow:auto !important;
    border-radius:14px !important;
  }
  body.mv-sidebar-collapsed .mv-side-appbar .mv-user-dropdown{
    left:86px !important;
  }
}

@media (max-width: 991px){
  .mv-user-dropdown{
    position:fixed !important;
    left:12px !important;
    right:12px !important;
    top:auto !important;
    bottom:74px !important;
    width:auto !important;
    max-height:55vh !important;
    overflow:auto !important;
    border-radius:16px !important;
  }
}

/* === FINAL FIX: Professional folded side submenus + scroll/sidebar account spacing === */
@media (min-width: 992px){
  .mv-side-appbar{
    height:100vh !important;
    max-height:100vh !important;
    overflow:visible !important;
  }
  .mv-side-appbar .mv-appbar-inner{
    height:100vh !important;
    min-height:0 !important;
    max-height:100vh !important;
    display:flex !important;
    flex-direction:column !important;
    overflow:hidden !important;
    padding-bottom:12px !important;
  }
  .mv-side-appbar .mv-app-brand{
    flex:0 0 auto !important;
  }
  .mv-side-appbar .mv-app-actions{
    flex:1 1 auto !important;
    min-height:0 !important;
    overflow-y:auto !important;
    overflow-x:hidden !important;
    padding-right:5px !important;
    padding-bottom:16px !important;
    margin-bottom:10px !important;
    scrollbar-width:thin !important;
  }
  .mv-side-appbar .mv-app-actions::-webkit-scrollbar{display:block !important;width:6px !important;}
  .mv-side-appbar .mv-app-actions::-webkit-scrollbar-thumb{background:rgba(255,255,255,.28) !important;border-radius:999px !important;}
  .mv-side-appbar .mv-user-menu{
    flex:0 0 auto !important;
    margin-top:0 !important;
    position:relative !important;
    z-index:3200 !important;
    background:transparent !important;
  }
  .mv-side-appbar .mv-user-button{
    min-height:54px !important;
    max-width:100% !important;
  }

  /* Fold all side submenus by default. Only JS .is-open may show them. */
  .mv-side-appbar .mv-nav-group{
    display:grid !important;
    width:100% !important;
    gap:0 !important;
    position:relative !important;
  }
  .mv-side-appbar .mv-nav-group:hover .mv-nav-submenu,
  .mv-side-appbar .mv-nav-group:focus-within .mv-nav-submenu{
    display:none !important;
  }
  .mv-side-appbar .mv-nav-group.is-open .mv-nav-submenu{
    display:grid !important;
  }
  .mv-side-appbar .mv-nav-submenu{
    position:static !important;
    min-width:0 !important;
    width:calc(100% - 24px) !important;
    margin:6px 0 4px 24px !important;
    padding:0 !important;
    gap:6px !important;
    background:transparent !important;
    box-shadow:none !important;
    border-radius:0 !important;
    z-index:auto !important;
  }
  .mv-side-appbar .mv-nav-submenu a{
    display:flex !important;
    align-items:center !important;
    min-height:38px !important;
    padding:8px 12px !important;
    border-radius:10px !important;
    color:#fff !important;
    background:rgba(0,0,0,.12) !important;
    border:1px solid rgba(255,255,255,.06) !important;
    line-height:1.2 !important;
    white-space:nowrap !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
  }
  .mv-side-appbar .mv-nav-submenu a:hover,
  .mv-side-appbar .mv-nav-submenu a.active{
    background:rgba(255,255,255,.18) !important;
    color:#fff !important;
  }
  .mv-side-appbar .mv-nav-group > .mv-app-action,
  .mv-side-appbar .mv-nav-group > .mv-app-primary{
    position:relative !important;
    padding-right:34px !important;
  }
  .mv-side-appbar .mv-nav-group:has(.mv-nav-submenu) > .mv-app-action::after,
  .mv-side-appbar .mv-nav-group:has(.mv-nav-submenu) > .mv-app-primary::after{
    content:'▾' !important;
    position:absolute !important;
    right:12px !important;
    top:50% !important;
    transform:translateY(-50%) rotate(-90deg) !important;
    font-size:12px !important;
    opacity:.92 !important;
    transition:transform .18s ease !important;
  }
  .mv-side-appbar .mv-nav-group.is-open > .mv-app-action::after,
  .mv-side-appbar .mv-nav-group.is-open > .mv-app-primary::after{
    transform:translateY(-50%) rotate(0deg) !important;
  }
  .mv-side-appbar .mv-sidebar-collapse{
    z-index:5000 !important;
    pointer-events:auto !important;
  }
  body.mv-sidebar-collapsed .mv-side-appbar .mv-app-actions{
    overflow-y:auto !important;
    padding-right:0 !important;
  }
  body.mv-sidebar-collapsed .mv-side-appbar .mv-nav-group.is-open .mv-nav-submenu,
  body.mv-sidebar-collapsed .mv-side-appbar .mv-nav-submenu{
    display:none !important;
  }
}

@media (max-width: 991px){
  .mv-side-appbar .mv-appbar-inner{
    max-height:100dvh !important;
    overflow:hidden !important;
  }
  .mv-side-appbar .mv-app-actions{
    max-height:calc(100dvh - 180px) !important;
    overflow-y:auto !important;
    overflow-x:hidden !important;
    padding-bottom:18px !important;
  }
  .mv-side-appbar .mv-user-menu{
    margin-top:8px !important;
    flex:0 0 auto !important;
  }
  .mv-side-appbar .mv-nav-group:hover .mv-nav-submenu,
  .mv-side-appbar .mv-nav-group:focus-within .mv-nav-submenu{
    display:none !important;
  }
  .mv-side-appbar .mv-nav-group.is-open .mv-nav-submenu{display:grid !important;}
  .mv-side-appbar .mv-nav-submenu{
    position:static !important;
    width:calc(100% - 22px) !important;
    margin:6px 0 4px 22px !important;
    padding:0 !important;
    gap:6px !important;
    background:transparent !important;
    box-shadow:none !important;
  }
  .mv-side-appbar .mv-nav-submenu a{
    background:rgba(0,0,0,.13) !important;
    color:#fff !important;
    min-height:38px !important;
    border-radius:10px !important;
    padding:8px 12px !important;
  }
}

/* === HARD FIX: ALL SIDEBAR SUBMENUS FOLDED BY DEFAULT === */
.mv-side-appbar .mv-nav-group .mv-nav-submenu,
.mv-side-appbar .mv-nav-group:hover .mv-nav-submenu,
.mv-side-appbar .mv-nav-group:focus-within .mv-nav-submenu,
.mv-appbar.mv-side-appbar .mv-nav-group .mv-nav-submenu,
.mv-appbar.mv-side-appbar .mv-nav-group:hover .mv-nav-submenu,
.mv-appbar.mv-side-appbar .mv-nav-group:focus-within .mv-nav-submenu{
    display:none !important;
    visibility:hidden !important;
    opacity:0 !important;
    height:0 !important;
    max-height:0 !important;
    overflow:hidden !important;
    pointer-events:none !important;
    margin-top:0 !important;
    margin-bottom:0 !important;
}

.mv-side-appbar .mv-nav-group.is-open > .mv-nav-submenu,
.mv-appbar.mv-side-appbar .mv-nav-group.is-open > .mv-nav-submenu{
    display:grid !important;
    visibility:visible !important;
    opacity:1 !important;
    height:auto !important;
    max-height:500px !important;
    overflow:visible !important;
    pointer-events:auto !important;
    margin-top:6px !important;
    margin-bottom:6px !important;
}

.mv-side-appbar .mv-nav-group:not(.is-open) > .mv-nav-submenu *{
    pointer-events:none !important;
}

.mv-side-appbar .mv-app-actions{
    overflow-y:auto !important;
    overflow-x:hidden !important;
}

/* === FINAL STABLE SIDEBAR DROPDOWN + RESPONSIVE FIX === */
.mv-side-appbar{z-index:1040 !important;}
.mv-side-appbar .mv-appbar-inner{min-height:0 !important;}
.mv-side-appbar .mv-app-actions{overscroll-behavior:contain !important;-webkit-overflow-scrolling:touch !important;}
.mv-side-appbar .mv-nav-group{display:block !important;width:100% !important;position:relative !important;}
.mv-side-appbar .mv-nav-group > .mv-app-action,
.mv-side-appbar .mv-nav-group > .mv-app-primary{width:100% !important;cursor:pointer !important;user-select:none !important;}
.mv-side-appbar .mv-nav-group > .mv-app-action::after,
.mv-side-appbar .mv-nav-group > .mv-app-primary::after{content:'\f282' !important;font-family:'bootstrap-icons' !important;position:absolute !important;right:12px !important;top:50% !important;transform:translateY(-50%) rotate(-90deg) !important;font-size:12px !important;transition:transform .18s ease !important;opacity:.9 !important;}
.mv-side-appbar .mv-nav-group.is-open > .mv-app-action::after,
.mv-side-appbar .mv-nav-group.is-open > .mv-app-primary::after{transform:translateY(-50%) rotate(0deg) !important;}
.mv-side-appbar .mv-nav-group > .mv-nav-submenu,
.mv-side-appbar .mv-nav-group:hover > .mv-nav-submenu,
.mv-side-appbar .mv-nav-group:focus-within > .mv-nav-submenu{display:none !important;visibility:hidden !important;opacity:0 !important;max-height:0 !important;overflow:hidden !important;pointer-events:none !important;margin:0 !important;padding:0 !important;}
.mv-side-appbar .mv-nav-group.is-open > .mv-nav-submenu{display:grid !important;visibility:visible !important;opacity:1 !important;max-height:480px !important;overflow:visible !important;pointer-events:auto !important;margin:6px 0 6px 24px !important;padding:0 !important;gap:6px !important;position:static !important;width:calc(100% - 24px) !important;background:transparent !important;box-shadow:none !important;border:0 !important;}
.mv-side-appbar .mv-nav-submenu a{display:flex !important;align-items:center !important;width:100% !important;min-height:38px !important;padding:8px 12px !important;border-radius:10px !important;background:rgba(0,0,0,.14) !important;color:#fff !important;text-decoration:none !important;white-space:nowrap !important;overflow:hidden !important;text-overflow:ellipsis !important;}
.mv-side-appbar .mv-nav-submenu a:hover{background:rgba(255,255,255,.18) !important;color:#fff !important;}
@media (min-width:992px){
  .mv-side-appbar{position:fixed !important;left:0 !important;top:0 !important;bottom:0 !important;height:100dvh !important;overflow:visible !important;}
  .mv-side-appbar .mv-appbar-inner{height:100dvh !important;display:flex !important;flex-direction:column !important;overflow:hidden !important;}
  .mv-side-appbar .mv-app-brand{flex:0 0 auto !important;}
  .mv-side-appbar .mv-app-actions{flex:1 1 auto !important;min-height:0 !important;max-height:none !important;overflow-y:auto !important;overflow-x:hidden !important;padding-bottom:18px !important;margin-bottom:8px !important;}
  .mv-side-appbar .mv-user-menu{flex:0 0 auto !important;position:relative !important;margin-top:auto !important;z-index:3200 !important;}
  .mv-side-appbar .mv-sidebar-collapse{z-index:6000 !important;pointer-events:auto !important;}
  body.mv-sidebar-collapsed .mv-side-appbar .mv-nav-group > .mv-nav-submenu{display:none !important;}
}
@media (max-width:991px){
  .mv-side-appbar{height:auto !important;min-height:0 !important;overflow:visible !important;}
  .mv-side-appbar .mv-appbar-inner{height:auto !important;max-height:100dvh !important;overflow:hidden !important;}
  .mv-side-appbar .mv-app-actions{display:none !important;max-height:calc(100dvh - 150px) !important;overflow-y:auto !important;overflow-x:hidden !important;padding:10px 12px 18px !important;}
  .mv-side-appbar .mv-app-actions.is-open{display:grid !important;}
  .mv-side-appbar .mv-nav-group.is-open > .mv-nav-submenu{margin-left:20px !important;width:calc(100% - 20px) !important;}
  .mv-side-appbar .mv-user-menu{position:relative !important;margin-top:8px !important;z-index:3300 !important;}
}

/* === ADMIN ORDERS STYLE MIRROR - SYSTEMWIDE ADMIN TABLE/PAGE CONSISTENCY === */
body.mv-app-bg.admin-orders-mirror-page,
body.mv-app-bg{background:linear-gradient(180deg,rgba(244,232,236,.9) 0,rgba(238,248,251,.92) 210px,#eef7fb 100%) !important;}
.mv-page.mv-pro-page,
.admin-products-wrap,
.admin-vendors-wrap{max-width:min(1280px,calc(100vw - 32px)) !important;margin:0 auto !important;padding:24px 14px 90px !important;}
@media (min-width:992px){.mv-side-appbar + .mv-page,.mv-page{margin-left:var(--mv-sidebar-offset,220px) !important;max-width:calc(100vw - var(--mv-sidebar-offset,220px) - 34px) !important;}.admin-products-wrap,.admin-vendors-wrap{margin-left:calc(var(--mv-sidebar-offset,220px) + 14px) !important;max-width:calc(100vw - var(--mv-sidebar-offset,220px) - 34px) !important;}}
.mv-page-head,.admin-products-wrap>div.d-flex:first-of-type,.admin-vendors-wrap>div.d-flex:first-of-type,.mv-pro-hero{background:var(--mv-header-gradient,linear-gradient(135deg,var(--mv-primary,#b40016),var(--mv-primary-dark,#7f0010))) !important;color:#fff !important;border:0 !important;border-radius:24px !important;padding:24px !important;box-shadow:0 22px 60px rgba(15,23,42,.12) !important;display:flex !important;align-items:center !important;justify-content:space-between !important;gap:14px !important;margin-bottom:16px !important;position:relative !important;overflow:hidden !important;}
.mv-page-head:after,.admin-products-wrap>div.d-flex:first-of-type:after,.admin-vendors-wrap>div.d-flex:first-of-type:after,.mv-pro-hero:after{content:'';position:absolute;right:-40px;top:-60px;width:220px;height:220px;border-radius:50%;background:rgba(255,255,255,.12);pointer-events:none;}
.mv-page-title,.mv-pro-hero h1,.admin-products-wrap h4,.admin-vendors-wrap h4{font-size:clamp(1.45rem,2.4vw,2rem) !important;font-weight:950 !important;letter-spacing:-.04em !important;margin:0 !important;color:#fff !important;}
.mv-page-subtitle,.mv-pro-hero p,.admin-products-wrap .small-muted,.admin-vendors-wrap .small-muted{color:rgba(255,255,255,.9) !important;margin:4px 0 0 !important;font-weight:600 !important;}
.mv-card,.mv-standard-card,.card,.cardx,.products-card,.vendors-card{border:1px solid rgba(15,23,42,.06) !important;border-radius:20px !important;box-shadow:0 18px 50px rgba(15,23,42,.08) !important;background:#fff !important;overflow:hidden !important;}
.mv-card-body,.card-body{padding:16px !important;}
.mv-dashboard-grid,.mv-pro-stats{display:grid !important;grid-template-columns:repeat(auto-fit,minmax(185px,1fr)) !important;gap:12px !important;margin:14px 0 16px !important;}
.mv-stat-card{border:1px solid rgba(15,23,42,.06) !important;border-radius:18px !important;background:rgba(255,255,255,.95) !important;box-shadow:0 12px 34px rgba(15,23,42,.06) !important;padding:16px !important;}
.mv-stat-label{text-transform:uppercase !important;color:#64748b !important;font-weight:900 !important;font-size:.72rem !important;letter-spacing:.035em !important;}
.mv-stat-value{font-size:1.45rem !important;font-weight:950 !important;color:#0f172a !important;}
.mv-stat-icon{width:40px;height:40px;border-radius:13px;display:grid;place-items:center;background:rgba(220,38,38,.10);color:var(--mv-primary,#b40016);margin-bottom:8px;}
.mv-toolbar,.mv-pro-toolbar,.admin-table-tools .card-body{display:flex !important;align-items:center !important;gap:10px !important;flex-wrap:wrap !important;}
.mv-toolbar .form-control,.mv-toolbar .form-select,.mv-pro-toolbar .form-control,.mv-pro-toolbar .form-select,.admin-table-tools .form-control,.admin-table-tools .form-select{border-radius:14px !important;min-height:46px !important;border-color:#e2e8f0 !important;box-shadow:none !important;}
.mv-pro-table,.table{--bs-table-bg:transparent !important;margin-bottom:0 !important;}
.mv-pro-table thead th,.table thead th{font-size:.76rem !important;text-transform:uppercase !important;letter-spacing:.035em !important;color:#64748b !important;border-bottom:1px solid #e5e7eb !important;white-space:nowrap !important;font-weight:950 !important;background:#fff !important;}
.mv-pro-table tbody td,.table tbody td{vertical-align:middle !important;border-color:#edf2f7 !important;}
.mv-pro-table tbody tr:hover,.table-hover tbody tr:hover{background:#f8fafc !important;}
.mv-btn,.btn-round,.btn{border-radius:12px !important;font-weight:850 !important;}
.mv-badge,.badge-soft,.badge{border-radius:999px !important;font-weight:850 !important;}
.mv-user-cell{display:flex !important;align-items:center !important;gap:10px !important;min-width:210px !important;}
.mv-avatar{width:44px;height:44px;border-radius:14px;background:#ecfdf3;color:#08753a;display:grid;place-items:center;overflow:hidden;flex:0 0 auto;font-weight:950;border:2px solid rgba(8,117,58,.12)}
.mv-avatar img{width:100%;height:100%;object-fit:cover;display:block}.mv-muted{display:block;color:#64748b;font-size:.84rem}.mv-chip{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;background:#f8fafc;border:1px solid #e2e8f0;font-weight:850;font-size:.82rem;color:#334155}.mv-action-stack{display:grid;gap:6px;min-width:150px}.mv-info-row{display:flex;justify-content:space-between;gap:12px;border-top:1px solid #eef2f7;padding-top:9px;margin-top:9px}.mv-info-row span:first-child{color:#64748b;font-weight:850}.mv-mobile-cards{display:none}.mv-modal-card,.modal-content{border-radius:22px !important;border:0 !important;box-shadow:0 24px 70px rgba(15,23,42,.22) !important;}
.admin-products-wrap .card.p-3,.admin-vendors-wrap .card.p-3{padding:0 !important}.admin-products-wrap table,.admin-vendors-wrap table{margin-bottom:0 !important}.toolbar-actions .btn{position:relative;z-index:2}.photo-preview{box-shadow:0 18px 50px rgba(15,23,42,.12)}
@media(max-width:800px){.mv-page.mv-pro-page,.admin-products-wrap,.admin-vendors-wrap{max-width:100% !important;padding:14px 10px 76px !important;margin-left:0 !important}.mv-page-head,.admin-products-wrap>div.d-flex:first-of-type,.admin-vendors-wrap>div.d-flex:first-of-type,.mv-pro-hero{border-radius:20px !important;padding:20px !important;display:block !important}.mv-toolbar,.mv-pro-toolbar,.admin-table-tools .card-body{display:grid !important;grid-template-columns:1fr !important}.mv-toolbar .form-control,.mv-toolbar .form-select,.mv-pro-toolbar .form-control,.mv-pro-toolbar .form-select,.admin-table-tools .form-control,.admin-table-tools .form-select{max-width:none !important;width:100% !important}.mv-desktop-table{display:none !important}.mv-mobile-cards{display:grid !important;gap:12px}.mv-mobile-card{background:#fff;border:1px solid rgba(15,23,42,.06);border-radius:18px;padding:14px;box-shadow:0 12px 34px rgba(15,23,42,.06)}.table-responsive{border-radius:18px !important}.table{font-size:.88rem !important}}

/* =====================================================
   LOCATION STANDARD MODAL - TRUE CENTERED OVERLAY FIX
   Keeps location form out of normal page flow.
===================================================== */
.mv-location-modal{
  position:fixed !important;
  inset:0 !important;
  width:100vw !important;
  height:100vh !important;
  min-height:100vh !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  padding:18px !important;
  background:rgba(15,23,42,.62) !important;
  backdrop-filter:blur(8px) !important;
  -webkit-backdrop-filter:blur(8px) !important;
  z-index:2147483647 !important;
  opacity:0 !important;
  visibility:hidden !important;
  pointer-events:none !important;
  transform:none !important;
  overflow:auto !important;
  transition:opacity .22s ease, visibility .22s ease !important;
}
.mv-location-modal.is-open,
.mv-location-modal[data-force="1"]{
  opacity:1 !important;
  visibility:visible !important;
  pointer-events:auto !important;
}
.mv-location-modal[aria-hidden="true"]:not(.is-open):not([data-force="1"]){
  display:none !important;
  opacity:0 !important;
  visibility:hidden !important;
  pointer-events:none !important;
}
.mv-location-card{
  width:min(640px, calc(100vw - 28px)) !important;
  max-height:calc(100vh - 36px) !important;
  overflow:auto !important;
  background:#fff !important;
  color:#0f172a !important;
  border-radius:24px !important;
  border:1px solid rgba(255,255,255,.35) !important;
  box-shadow:0 30px 90px rgba(0,0,0,.35) !important;
  padding:0 !important;
  transform:translateY(12px) scale(.98) !important;
  transition:transform .22s ease !important;
}
.mv-location-modal.is-open .mv-location-card,
.mv-location-modal[data-force="1"] .mv-location-card{
  transform:translateY(0) scale(1) !important;
}
.mv-location-head{
  display:flex !important;
  align-items:flex-start !important;
  justify-content:space-between !important;
  gap:14px !important;
  padding:22px 24px !important;
  color:#fff !important;
  background:linear-gradient(135deg,var(--mv-theme-primary,#b00020),var(--mv-theme-secondary,#e11d48)) !important;
  border-radius:24px 24px 0 0 !important;
}
.mv-location-head strong{display:block !important;font-size:1.15rem !important;font-weight:950 !important;line-height:1.2 !important;}
.mv-location-head small{display:block !important;margin-top:4px !important;opacity:.88 !important;font-weight:700 !important;}
.mv-location-close{
  width:38px !important;height:38px !important;border-radius:12px !important;
  border:1px solid rgba(255,255,255,.28) !important;background:rgba(255,255,255,.16) !important;
  color:#fff !important;display:grid !important;place-items:center !important;cursor:pointer !important;
}
.mv-location-close:disabled{opacity:.45 !important;cursor:not-allowed !important;}
.mv-location-form{padding:22px 24px 24px !important;display:grid !important;gap:10px !important;}
.mv-location-form label{font-weight:900 !important;color:#334155 !important;margin:3px 0 0 !important;}
.mv-location-form .form-select,.mv-location-form .form-control{
  width:100% !important;border:1px solid #dbe3ef !important;border-radius:14px !important;
  min-height:46px !important;padding:10px 12px !important;background:#fff !important;color:#0f172a !important;
  box-shadow:none !important;
}
.mv-location-alert{
  display:flex !important;gap:10px !important;align-items:flex-start !important;
  padding:12px 14px !important;border-radius:16px !important;
  background:#eff6ff !important;color:#1e3a8a !important;border:1px solid #bfdbfe !important;
  font-weight:750 !important;line-height:1.4 !important;
}
.mv-location-save{
  margin-top:8px !important;border:0 !important;border-radius:16px !important;
  padding:13px 16px !important;font-weight:950 !important;color:#fff !important;
  background:linear-gradient(135deg,var(--mv-theme-primary,#b00020),var(--mv-theme-secondary,#e11d48)) !important;
  box-shadow:0 16px 40px rgba(190,18,60,.25) !important;cursor:pointer !important;
}
.mv-location-badge{
  display:inline-flex !important;align-items:center !important;gap:6px !important;
  border:1px solid rgba(255,255,255,.24) !important;border-radius:999px !important;
  padding:9px 12px !important;background:rgba(255,255,255,.12) !important;color:#fff !important;
  font-weight:900 !important;max-width:220px !important;white-space:nowrap !important;cursor:pointer !important;
}
.mv-location-badge span{overflow:hidden !important;text-overflow:ellipsis !important;}
.mv-location-badge.is-valid{background:rgba(255,255,255,.16) !important;}
.mv-location-badge.is-missing{background:#fff7ed !important;color:#9a3412 !important;border-color:#fed7aa !important;}
body.mv-location-locked{overflow:hidden !important;}
body.mv-location-locked .mv-location-modal{display:flex !important;}
@media(max-width:640px){
  .mv-location-modal{align-items:flex-end !important;padding:10px !important;}
  .mv-location-card{width:100% !important;max-height:92vh !important;border-radius:24px 24px 18px 18px !important;}
  .mv-location-head{border-radius:24px 24px 0 0 !important;padding:18px !important;}
  .mv-location-form{padding:18px !important;}
  .mv-location-badge{max-width:150px !important;padding:8px 10px !important;}
}

/* Final modal/filters/rider UX hardening */
#mv-location-overlay{position:fixed!important;inset:0!important;width:100vw!important;height:100vh!important;background:rgba(10,10,20,.55)!important;backdrop-filter:blur(4px);z-index:2147483646!important;display:flex!important;align-items:center!important;justify-content:center!important;padding:20px;animation:mvFadeIn .25s ease}
#mv-location-modal{width:100%;max-width:680px;background:#fff;border-radius:24px;overflow:hidden;box-shadow:0 30px 80px rgba(0,0,0,.25);position:relative;z-index:2147483647!important;animation:mvModalUp .25s ease}
body.mv-modal-open{overflow:hidden!important}
@keyframes mvFadeIn{from{opacity:0}to{opacity:1}}
@keyframes mvModalUp{from{opacity:0;transform:translateY(20px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}
.filter-link.active{background:color-mix(in srgb,var(--mv-primary,#04b84a),#fff 88%);color:var(--mv-primary-dark,#04943d);font-weight:900;border-radius:10px;padding-left:10px;padding-right:10px}
.catalog-rating small{font-size:.72em;color:#64748b}

/* =========================================================
   GLOBAL MODAL / BACKDROP HARD FIX
   Ensures every Bootstrap/custom modal overlay covers the full viewport
   and never starts inside the page content or appears above the modal box.
   ========================================================= */
html.modal-open,
body.modal-open,
body.mv-modal-open{
  overflow:hidden !important;
  padding-right:0 !important;
}
body.modal-open .mv-global-overlay:not(.is-visible),
body.mv-modal-open .mv-global-overlay:not(.is-visible){
  display:none !important;
  opacity:0 !important;
  pointer-events:none !important;
}
.modal-backdrop,
.modal-backdrop.fade,
.modal-backdrop.show{
  position:fixed !important;
  top:0 !important;
  left:0 !important;
  right:0 !important;
  bottom:0 !important;
  width:100vw !important;
  height:100vh !important;
  min-width:100vw !important;
  min-height:100vh !important;
  margin:0 !important;
  transform:none !important;
  background:#020617 !important;
  opacity:.62 !important;
  z-index:2147483000 !important;
}
.modal,
.modal.fade,
.modal.show{
  position:fixed !important;
  top:0 !important;
  left:0 !important;
  right:0 !important;
  bottom:0 !important;
  width:100vw !important;
  height:100vh !important;
  max-width:none !important;
  max-height:none !important;
  margin:0 !important;
  padding:0 !important;
  overflow-x:hidden !important;
  overflow-y:auto !important;
  transform:none !important;
  z-index:2147483010 !important;
}
.modal.show{display:block !important;}
.modal-dialog{
  position:relative !important;
  z-index:2147483020 !important;
  pointer-events:auto !important;
  margin:1.75rem auto !important;
}
.modal-dialog-centered{
  min-height:calc(100vh - 3.5rem) !important;
  display:flex !important;
  align-items:center !important;
}
.modal-content{
  position:relative !important;
  z-index:2147483030 !important;
}
body.modal-open .mv-side-appbar,
body.modal-open .mv-floating-actions,
body.modal-open .mv-login-bottom-nav,
body.modal-open .mv-group-float,
body.modal-open .whatsapp-float,
body.modal-open .mv-user-dropdown,
body.mv-modal-open .mv-side-appbar,
body.mv-modal-open .mv-floating-actions,
body.mv-modal-open .mv-login-bottom-nav,
body.mv-modal-open .mv-group-float,
body.mv-modal-open .whatsapp-float,
body.mv-modal-open .mv-user-dropdown{
  z-index:1000 !important;
}
@media(max-width:576px){
  .modal-dialog{width:calc(100vw - 20px) !important;max-width:calc(100vw - 20px) !important;margin:10px auto !important;}
  .modal-dialog-centered{min-height:calc(100vh - 20px) !important;}
}

/* FINAL GLOBAL MODAL SAFETY PATCH: overlay below, form above, never hidden */
.modal-backdrop.mv-fixed-backdrop,
.modal-backdrop.show{position:fixed!important;inset:0!important;width:100vw!important;height:100vh!important;background:#020617!important;opacity:.62!important;z-index:2147483000!important;}
.modal.show,
.modal[data-mv-modal-opened="1"]{display:block!important;position:fixed!important;inset:0!important;width:100vw!important;height:100vh!important;overflow:auto!important;visibility:visible!important;opacity:1!important;z-index:2147483010!important;pointer-events:auto!important;}
.modal.show .modal-dialog,
.modal[data-mv-modal-opened="1"] .modal-dialog{position:relative!important;z-index:2147483020!important;pointer-events:auto!important;}
.modal.show .modal-content,
.modal[data-mv-modal-opened="1"] .modal-content{position:relative!important;z-index:2147483030!important;visibility:visible!important;opacity:1!important;background:#fff!important;pointer-events:auto!important;}

/* FINAL FIX: keep sidebar minimize button clickable above page overlays */
.mv-side-appbar .mv-sidebar-collapse,
button.mv-sidebar-collapse {
  pointer-events: auto !important;
  z-index: 2147482500 !important;
}
.mv-side-appbar {
  pointer-events: auto !important;
}
body.mv-sidebar-collapsed .mv-side-appbar .mv-sidebar-collapse {
  right: -21px !important;
}
body:not(.modal-open) .modal-backdrop,
body:not(.modal-open) .mv-fixed-backdrop {
  display: none !important;
  pointer-events: none !important;
}

/* =====================================================
   ADMIN UNIFIED DESIGN SYSTEM - match admin/orders style globally
   Applies to all admin pages that use partials/admin_nav.
   ===================================================== */
body.mv-admin-unified,
body.mv-app-bg{
  background:
    radial-gradient(circle at 15% 0%, rgba(176,0,24,.10), transparent 30%),
    linear-gradient(180deg,#f2e4e9 0%, #eaf6f9 44%, #edf8fb 100%) !important;
  font-family: var(--mv-font) !important;
  color:#111827 !important;
}
body.mv-admin-unified::before,
body.mv-app-bg::before{height:265px !important;background:linear-gradient(180deg,rgba(176,0,24,.08),rgba(176,0,24,0)) !important;}
body.mv-admin-unified .mv-page,
body.mv-admin-unified main.mv-page,
body.mv-app-bg .mv-page{
  width:min(1280px, calc(100% - 34px)) !important;
  max-width:1280px !important;
  padding:28px 0 40px !important;
}
body.mv-admin-unified .mv-page-head,
body.mv-app-bg .mv-page-head{
  position:relative !important;
  align-items:center !important;
  min-height:88px !important;
  padding:22px 28px !important;
  margin-bottom:18px !important;
  border:0 !important;
  border-radius:22px !important;
  background:linear-gradient(135deg,#a30016 0%,#b20b18 58%,#b5302f 100%) !important;
  color:#fff !important;
  box-shadow:0 20px 44px rgba(105,0,14,.18) !important;
  overflow:hidden !important;
}
body.mv-admin-unified .mv-page-head::after,
body.mv-app-bg .mv-page-head::after{
  content:"";position:absolute;right:-42px;top:-54px;width:230px;height:230px;border-radius:999px;background:rgba(255,255,255,.10);pointer-events:none;
}
body.mv-admin-unified .mv-page-title,
body.mv-app-bg .mv-page-title{color:#fff !important;font-size:clamp(1.55rem,3vw,2.05rem) !important;font-weight:950 !important;letter-spacing:-.035em !important;}
body.mv-admin-unified .mv-page-subtitle,
body.mv-app-bg .mv-page-subtitle{color:rgba(255,255,255,.92) !important;font-weight:700 !important;}
body.mv-admin-unified .mv-page-head .btn,
body.mv-app-bg .mv-page-head .btn{position:relative;z-index:1;border-radius:13px !important;font-weight:900 !important;box-shadow:none !important;}
body.mv-admin-unified .mv-dashboard-grid,
body.mv-app-bg .mv-dashboard-grid{grid-template-columns:repeat(auto-fit,minmax(210px,1fr)) !important;gap:12px !important;margin-bottom:18px !important;}
body.mv-admin-unified .mv-stat-card,
body.mv-app-bg .mv-stat-card{
  min-height:72px !important;padding:16px 18px !important;border:1px solid rgba(15,23,42,.06) !important;border-radius:14px !important;background:#fff !important;box-shadow:0 16px 38px rgba(15,23,42,.07) !important;display:grid !important;grid-template-columns:44px 1fr auto !important;align-items:center !important;gap:12px !important;
}
body.mv-admin-unified .mv-stat-icon,
body.mv-app-bg .mv-stat-icon{width:42px !important;height:42px !important;border-radius:13px !important;background:#fee2e2 !important;color:#b00018 !important;display:grid !important;place-items:center !important;}
body.mv-admin-unified .mv-stat-label,
body.mv-app-bg .mv-stat-label{font-size:.76rem !important;text-transform:uppercase !important;color:#64748b !important;font-weight:900 !important;letter-spacing:.04em !important;}
body.mv-admin-unified .mv-stat-value,
body.mv-app-bg .mv-stat-value{font-size:1.45rem !important;font-weight:950 !important;color:#0f172a !important;}
body.mv-admin-unified .mv-card,
body.mv-admin-unified .mv-standard-card,
body.mv-admin-unified .card,
body.mv-admin-unified .panel,
body.mv-admin-unified .well,
body.mv-app-bg .mv-card,
body.mv-app-bg .mv-standard-card,
body.mv-app-bg .card{
  border:1px solid rgba(15,23,42,.06) !important;border-radius:18px !important;background:#fff !important;box-shadow:0 18px 44px rgba(15,23,42,.07) !important;overflow:hidden !important;
}
body.mv-admin-unified .mv-card-body,
body.mv-admin-unified .card-body,
body.mv-app-bg .mv-card-body,
body.mv-app-bg .card-body{padding:18px !important;}
body.mv-admin-unified .table-responsive,
body.mv-app-bg .table-responsive{border-radius:16px !important;overflow:auto !important;background:#fff !important;}
body.mv-admin-unified table.table,
body.mv-app-bg table.table{width:100% !important;margin:0 !important;border-collapse:separate !important;border-spacing:0 !important;}
body.mv-admin-unified table.table thead th,
body.mv-app-bg table.table thead th{
  background:#fff !important;color:#64748b !important;font-size:.74rem !important;text-transform:uppercase !important;letter-spacing:.04em !important;font-weight:950 !important;border-bottom:1px solid #e5e7eb !important;padding:14px 12px !important;white-space:nowrap !important;
}
body.mv-admin-unified table.table tbody td,
body.mv-app-bg table.table tbody td{padding:14px 12px !important;vertical-align:middle !important;border-color:#edf2f7 !important;}
body.mv-admin-unified table.table tbody tr:hover,
body.mv-app-bg table.table tbody tr:hover{background:#f8fafc !important;}
body.mv-admin-unified .form-control,
body.mv-admin-unified .form-select,
body.mv-app-bg .form-control,
body.mv-app-bg .form-select{min-height:44px !important;border-radius:14px !important;border:1px solid #e2e8f0 !important;background:#fff !important;}
body.mv-admin-unified .btn,
body.mv-app-bg .btn{border-radius:12px !important;font-weight:850 !important;}
body.mv-admin-unified .badge,
body.mv-app-bg .badge{border-radius:999px !important;font-weight:900 !important;}
body.mv-admin-unified .modal-content,
body.mv-app-bg .modal-content{border:0 !important;border-radius:18px !important;box-shadow:0 24px 70px rgba(15,23,42,.24) !important;overflow:hidden !important;}
body.mv-admin-unified .modal-header,
body.mv-app-bg .modal-header{background:#fff !important;border-bottom:1px solid #e5e7eb !important;}
body.mv-admin-unified .modal-footer,
body.mv-app-bg .modal-footer{background:#f8fafc !important;border-top:1px solid #e5e7eb !important;}
body.mv-admin-unified .modal-backdrop.show,
body.mv-app-bg .modal-backdrop.show{opacity:.58 !important;}
/* keep fixed left sidebar but let page use remaining space evenly */
@media (min-width: 992px){
  body.mv-admin-unified:has(.mv-side-appbar) .mv-page,
  body.mv-app-bg:has(.mv-side-appbar) .mv-page{margin-left:calc(250px + max(16px, (100vw - 1530px)/2)) !important;margin-right:max(16px, (100vw - 1530px)/2) !important;width:auto !important;max-width:none !important;}
  body.mv-admin-unified.mv-sidebar-collapsed:has(.mv-side-appbar) .mv-page,
  body.mv-app-bg.mv-sidebar-collapsed:has(.mv-side-appbar) .mv-page{margin-left:calc(78px + max(16px, (100vw - 1360px)/2)) !important;}
}
@media (max-width: 991px){
  body.mv-admin-unified .mv-page,
  body.mv-app-bg .mv-page{width:calc(100% - 20px) !important;padding:14px 0 92px !important;}
  body.mv-admin-unified .mv-page-head,
  body.mv-app-bg .mv-page-head{display:block !important;padding:20px !important;border-radius:18px !important;}
  body.mv-admin-unified .mv-page-head .btn,
  body.mv-app-bg .mv-page-head .btn{margin-top:10px !important;}
  body.mv-admin-unified .mv-dashboard-grid,
  body.mv-app-bg .mv-dashboard-grid{grid-template-columns:1fr 1fr !important;}
  body.mv-admin-unified .mv-stat-card,
  body.mv-app-bg .mv-stat-card{grid-template-columns:38px 1fr !important;}
  body.mv-admin-unified .mv-stat-value,
  body.mv-app-bg .mv-stat-value{grid-column:2 !important;font-size:1.2rem !important;}
}
@media (max-width: 560px){
  body.mv-admin-unified .mv-dashboard-grid,
  body.mv-app-bg .mv-dashboard-grid{grid-template-columns:1fr !important;}
  body.mv-admin-unified table.table,
  body.mv-app-bg table.table{font-size:.86rem !important;}
}

/* =========================================================
   GLOBAL FULL-SCREEN RESPONSIVE WIDTH FIX
   Admin / Vendor / Rider pages use all available viewport width.
   Keeps the left sidebar visible and removes old max-width caps.
   ========================================================= */
:root{
  --mv-sidebar-full: 236px;
  --mv-sidebar-mini: 72px;
  --mv-page-gap: 16px;
}

html,body{width:100% !important;max-width:100% !important;overflow-x:hidden !important;}
body.mv-app-bg,
body.mv-admin-unified{
  min-width:0 !important;
}

/* any common page shell should not stay centered/narrow */
.mv-page,
.mv-pro-page,
.mv-shell,
.admin-products-wrap,
.admin-vendors-wrap,
.vendor-page,
.vendor-shell,
.rider-page,
.rider-shell,
.content,
.content-wrapper,
.content-body,
.app-content,
.main-content,
.page-content,
.container-fluid{
  max-width:none !important;
  min-width:0 !important;
  box-sizing:border-box !important;
}

/* desktop: use the remaining width beside the left sidebar */
@media (min-width: 992px){
  body:has(.mv-side-appbar) .mv-page,
  body:has(.mv-side-appbar) .mv-pro-page,
  body:has(.mv-side-appbar) .admin-products-wrap,
  body:has(.mv-side-appbar) .admin-vendors-wrap,
  body:has(.mv-side-appbar) .vendor-page,
  body:has(.mv-side-appbar) .vendor-shell,
  body:has(.mv-side-appbar) .rider-page,
  body:has(.mv-side-appbar) .rider-shell,
  body:has(.mv-side-appbar) .content,
  body:has(.mv-side-appbar) .content-wrapper,
  body:has(.mv-side-appbar) .content-body,
  body:has(.mv-side-appbar) .app-content,
  body:has(.mv-side-appbar) .main-content,
  body:has(.mv-side-appbar) .page-content{
    width:calc(100vw - var(--mv-sidebar-full) - (var(--mv-page-gap) * 2)) !important;
    max-width:calc(100vw - var(--mv-sidebar-full) - (var(--mv-page-gap) * 2)) !important;
    margin-left:calc(var(--mv-sidebar-full) + var(--mv-page-gap)) !important;
    margin-right:var(--mv-page-gap) !important;
    padding-left:0 !important;
    padding-right:0 !important;
  }

  body.mv-sidebar-collapsed:has(.mv-side-appbar) .mv-page,
  body.mv-sidebar-collapsed:has(.mv-side-appbar) .mv-pro-page,
  body.mv-sidebar-collapsed:has(.mv-side-appbar) .admin-products-wrap,
  body.mv-sidebar-collapsed:has(.mv-side-appbar) .admin-vendors-wrap,
  body.mv-sidebar-collapsed:has(.mv-side-appbar) .vendor-page,
  body.mv-sidebar-collapsed:has(.mv-side-appbar) .vendor-shell,
  body.mv-sidebar-collapsed:has(.mv-side-appbar) .rider-page,
  body.mv-sidebar-collapsed:has(.mv-side-appbar) .rider-shell,
  body.mv-sidebar-collapsed:has(.mv-side-appbar) .content,
  body.mv-sidebar-collapsed:has(.mv-side-appbar) .content-wrapper,
  body.mv-sidebar-collapsed:has(.mv-side-appbar) .content-body,
  body.mv-sidebar-collapsed:has(.mv-side-appbar) .app-content,
  body.mv-sidebar-collapsed:has(.mv-side-appbar) .main-content,
  body.mv-sidebar-collapsed:has(.mv-side-appbar) .page-content{
    width:calc(100vw - var(--mv-sidebar-mini) - (var(--mv-page-gap) * 2)) !important;
    max-width:calc(100vw - var(--mv-sidebar-mini) - (var(--mv-page-gap) * 2)) !important;
    margin-left:calc(var(--mv-sidebar-mini) + var(--mv-page-gap)) !important;
    margin-right:var(--mv-page-gap) !important;
  }

  /* legacy pages that used Bootstrap .container */
  body.mv-app-bg > .container,
  body.mv-admin-unified > .container,
  body:has(.mv-side-appbar) > .container{
    width:calc(100vw - var(--mv-sidebar-full) - (var(--mv-page-gap) * 2)) !important;
    max-width:calc(100vw - var(--mv-sidebar-full) - (var(--mv-page-gap) * 2)) !important;
    margin-left:calc(var(--mv-sidebar-full) + var(--mv-page-gap)) !important;
    margin-right:var(--mv-page-gap) !important;
  }
  body.mv-sidebar-collapsed:has(.mv-side-appbar) > .container{
    width:calc(100vw - var(--mv-sidebar-mini) - (var(--mv-page-gap) * 2)) !important;
    max-width:calc(100vw - var(--mv-sidebar-mini) - (var(--mv-page-gap) * 2)) !important;
    margin-left:calc(var(--mv-sidebar-mini) + var(--mv-page-gap)) !important;
  }
}

/* mobile/tablet: no side gap, full width with safe padding */
@media (max-width: 991px){
  .mv-page,
  .mv-pro-page,
  .admin-products-wrap,
  .admin-vendors-wrap,
  .vendor-page,
  .vendor-shell,
  .rider-page,
  .rider-shell,
  .content,
  .content-wrapper,
  .content-body,
  .app-content,
  .main-content,
  .page-content,
  body.mv-app-bg > .container,
  body.mv-admin-unified > .container{
    width:calc(100vw - 20px) !important;
    max-width:calc(100vw - 20px) !important;
    margin-left:auto !important;
    margin-right:auto !important;
    padding-left:0 !important;
    padding-right:0 !important;
  }
}

/* make panels/tables stretch evenly inside the page */
.mv-page > *,
.mv-pro-page > *,
.vendor-page > *,
.vendor-shell > *,
.rider-page > *,
.rider-shell > *,
.admin-products-wrap > *,
.admin-vendors-wrap > *,
.content-wrapper > *,
.content-body > *,
.app-content > *,
.main-content > *,
.page-content > *{
  max-width:100% !important;
}

.mv-page-head,
.mv-pro-hero,
.mv-hero-card,
.mv-toolbar,
.mv-card,
.card,
.panel,
.well,
.table-responsive,
.orders-table-wrap,
.admin-table-tools{
  width:100% !important;
  max-width:100% !important;
  box-sizing:border-box !important;
}

/* tables fill the card but scroll on small screens instead of breaking layout */
.table-responsive,
.orders-table-wrap{
  overflow-x:auto !important;
  -webkit-overflow-scrolling:touch !important;
}
.table-responsive > table,
.orders-table-wrap > table,
table.table{
  width:100% !important;
}
@media (max-width: 760px){
  .table-responsive > table,
  .orders-table-wrap > table,
  table.table{min-width:720px !important;}
}

/* grids use available width */
.mv-dashboard-grid,
.mv-stats-grid,
.mv-grid,
.row{
  max-width:100% !important;
}

/* =========================================================
   GLOBAL UNIFORM FULL-WIDTH ADMIN / VENDOR / RIDER LAYOUT
   Keeps every back-office page aligned exactly after the left
   menu and stretched to the available screen edge.
   ========================================================= */
*{box-sizing:border-box}
html,body{width:100%;max-width:100%;overflow-x:hidden}
.mv-app-bg{width:100%;max-width:100%;}
.mv-page,
.mv-container,
.container.admin-vendors-wrap,
.admin-vendors-wrap,
.container.admin-page,
.admin-page,
main.mv-page,
main.container,
.mv-main,
.mv-content,
.auth-wrap{
  max-width:none!important;
}
.mv-page > .mv-page-head,
.mv-page > .mv-card,
.mv-page > .mv-standard-card,
.mv-page > .card,
.mv-page > form,
.mv-page > section,
.container > .mv-page-head,
.container > .mv-card,
.container > .mv-standard-card,
.container > .card,
.container > form,
.container > section{
  width:100%;
  max-width:none!important;
}
.mv-dashboard-grid,
.admin-kpi-grid,
.mv-action-grid,
.mv-stats-grid{
  width:100%;
}
.table-responsive{
  width:100%;
  max-width:100%;
  overflow-x:auto!important;
}
.table-responsive table,
table.mv-full-table{
  width:100%!important;
}
@media (min-width:921px){
  :root{--mv-sidebar-width-open:270px;--mv-sidebar-gap:18px;--mv-sidebar-width-closed:74px;}
  .mv-side-appbar ~ .mv-page,
  .mv-side-appbar ~ .container,
  .mv-side-appbar ~ .container-fluid,
  .mv-side-appbar ~ main,
  .mv-side-appbar ~ .admin-vendors-wrap,
  .mv-side-appbar ~ .admin-page,
  .mv-side-appbar ~ .mv-main,
  .mv-side-appbar ~ .mv-content,
  .mv-side-appbar ~ main.auth-wrap{
    width:calc(100vw - var(--mv-sidebar-width-open) - (var(--mv-sidebar-gap) * 2))!important;
    max-width:none!important;
    margin-left:calc(var(--mv-sidebar-width-open) + var(--mv-sidebar-gap))!important;
    margin-right:var(--mv-sidebar-gap)!important;
    padding-left:0!important;
    padding-right:0!important;
  }
  body.mv-sidebar-collapsed .mv-side-appbar ~ .mv-page,
  body.mv-sidebar-collapsed .mv-side-appbar ~ .container,
  body.mv-sidebar-collapsed .mv-side-appbar ~ .container-fluid,
  body.mv-sidebar-collapsed .mv-side-appbar ~ main,
  body.mv-sidebar-collapsed .mv-side-appbar ~ .admin-vendors-wrap,
  body.mv-sidebar-collapsed .mv-side-appbar ~ .admin-page,
  body.mv-sidebar-collapsed .mv-side-appbar ~ .mv-main,
  body.mv-sidebar-collapsed .mv-side-appbar ~ .mv-content,
  body.mv-sidebar-collapsed .mv-side-appbar ~ main.auth-wrap{
    width:calc(100vw - var(--mv-sidebar-width-closed) - (var(--mv-sidebar-gap) * 2))!important;
    max-width:none!important;
    margin-left:calc(var(--mv-sidebar-width-closed) + var(--mv-sidebar-gap))!important;
    margin-right:var(--mv-sidebar-gap)!important;
    padding-left:0!important;
    padding-right:0!important;
  }
  .mv-side-appbar ~ .mv-page .mv-page-head,
  .mv-side-appbar ~ .container .mv-page-head,
  .mv-side-appbar ~ main .mv-page-head{
    width:100%;
  }
}
@media (max-width:920px){
  .mv-page,
  .container,
  .container-fluid,
  main,
  .admin-vendors-wrap,
  .admin-page,
  .mv-main,
  .mv-content{
    width:calc(100% - 18px)!important;
    max-width:none!important;
    margin-left:9px!important;
    margin-right:9px!important;
    padding-left:0!important;
    padding-right:0!important;
  }
}

/* =====================================================
   FINAL FULL-WIDTH CONTENT ALIGNMENT FIX
   Prevents admin/vendor/rider page content and tables from sliding under
   the fixed left sidebar. Content starts AFTER the sidebar and ends at
   the right browser edge with a small safe gutter.
===================================================== */
:root{
  --mv-sidebar-full-width:270px;
  --mv-sidebar-mini-width:78px;
  --mv-page-gap:24px;
  --mv-page-right-gap:14px;
}
@media (min-width:992px){
  body:has(.mv-side-appbar){
    overflow-x:hidden !important;
  }
  .mv-side-appbar{
    width:var(--mv-sidebar-full-width) !important;
    min-width:var(--mv-sidebar-full-width) !important;
    max-width:var(--mv-sidebar-full-width) !important;
  }
  body.mv-sidebar-collapsed .mv-side-appbar{
    width:var(--mv-sidebar-mini-width) !important;
    min-width:var(--mv-sidebar-mini-width) !important;
    max-width:var(--mv-sidebar-mini-width) !important;
  }

  /* Any normal page container loaded after the sidebar */
  .mv-side-appbar ~ .mv-page,
  .mv-side-appbar ~ .container,
  .mv-side-appbar ~ .container-fluid,
  .mv-side-appbar ~ main,
  .mv-side-appbar ~ .content,
  .mv-side-appbar ~ .content-wrapper,
  .mv-side-appbar ~ .app-content,
  .mv-side-appbar ~ .auth-wrap,
  .mv-side-appbar ~ .admin-products-wrap,
  .mv-side-appbar ~ .admin-vendors-wrap,
  .mv-side-appbar ~ .admin-riders-wrap,
  .mv-side-appbar ~ .admin-orders-wrap{
    box-sizing:border-box !important;
    display:block !important;
    float:none !important;
    position:relative !important;
    left:auto !important;
    right:auto !important;
    transform:none !important;
    margin-left:calc(var(--mv-sidebar-full-width) + var(--mv-page-gap)) !important;
    margin-right:var(--mv-page-right-gap) !important;
    width:calc(100vw - var(--mv-sidebar-full-width) - var(--mv-page-gap) - var(--mv-page-right-gap)) !important;
    max-width:calc(100vw - var(--mv-sidebar-full-width) - var(--mv-page-gap) - var(--mv-page-right-gap)) !important;
    min-width:0 !important;
    padding-left:0 !important;
    padding-right:0 !important;
  }

  body.mv-sidebar-collapsed .mv-side-appbar ~ .mv-page,
  body.mv-sidebar-collapsed .mv-side-appbar ~ .container,
  body.mv-sidebar-collapsed .mv-side-appbar ~ .container-fluid,
  body.mv-sidebar-collapsed .mv-side-appbar ~ main,
  body.mv-sidebar-collapsed .mv-side-appbar ~ .content,
  body.mv-sidebar-collapsed .mv-side-appbar ~ .content-wrapper,
  body.mv-sidebar-collapsed .mv-side-appbar ~ .app-content,
  body.mv-sidebar-collapsed .mv-side-appbar ~ .auth-wrap,
  body.mv-sidebar-collapsed .mv-side-appbar ~ .admin-products-wrap,
  body.mv-sidebar-collapsed .mv-side-appbar ~ .admin-vendors-wrap,
  body.mv-sidebar-collapsed .mv-side-appbar ~ .admin-riders-wrap,
  body.mv-sidebar-collapsed .mv-side-appbar ~ .admin-orders-wrap{
    margin-left:calc(var(--mv-sidebar-mini-width) + var(--mv-page-gap)) !important;
    width:calc(100vw - var(--mv-sidebar-mini-width) - var(--mv-page-gap) - var(--mv-page-right-gap)) !important;
    max-width:calc(100vw - var(--mv-sidebar-mini-width) - var(--mv-page-gap) - var(--mv-page-right-gap)) !important;
  }

  /* Some pages use inner Bootstrap containers/cards; keep them from recentering or hiding first columns. */
  .admin-vendors-wrap > *,
  .admin-products-wrap > *,
  .admin-riders-wrap > *,
  .admin-orders-wrap > *,
  .mv-page > *{
    max-width:100% !important;
  }
  .table-responsive{
    width:100% !important;
    max-width:100% !important;
    overflow-x:auto !important;
  }
  .card,
  .mv-card,
  .vendors-card,
  .products-card{
    max-width:100% !important;
  }
}
@media (max-width:991px){
  .mv-side-appbar ~ .mv-page,
  .mv-side-appbar ~ .container,
  .mv-side-appbar ~ .container-fluid,
  .mv-side-appbar ~ main,
  .mv-side-appbar ~ .content,
  .mv-side-appbar ~ .content-wrapper,
  .mv-side-appbar ~ .app-content,
  .mv-side-appbar ~ .auth-wrap,
  .mv-side-appbar ~ .admin-products-wrap,
  .mv-side-appbar ~ .admin-vendors-wrap,
  .mv-side-appbar ~ .admin-riders-wrap,
  .mv-side-appbar ~ .admin-orders-wrap{
    margin-left:auto !important;
    margin-right:auto !important;
    width:min(100% - 16px, 100%) !important;
    max-width:100% !important;
    padding-left:0 !important;
    padding-right:0 !important;
  }
}

/* =====================================================
   GLOBAL ALL-PAGES WIDTH FIX AFTER SIDEBAR
   Applies to admin/orders, admin/delivery, vendors, riders and
   every admin/vendor/rider page that uses the side menu.
===================================================== */
:root{
  --mv-live-sidebar-width:220px;
  --mv-live-content-gap:24px;
  --mv-live-right-gap:18px;
}
@media (min-width:992px){
  body.mv-has-sidebar{overflow-x:hidden!important;}
  body.mv-has-sidebar > :not(.mv-side-appbar):not(.mv-login-bottom-nav):not(.mv-floating-actions):not(.mv-group-float):not(.mv-feedback-layer):not(.mv-location-modal):not(#mvLocationModal):not(.modal):not(.modal-backdrop):not(#mvGlobalOverlay):not(#mvToastCenter):not(script):not(style),
  body.mv-has-sidebar .mv-page,
  body.mv-has-sidebar main.mv-page,
  body.mv-has-sidebar .admin-vendors-wrap,
  body.mv-has-sidebar .admin-products-wrap,
  body.mv-has-sidebar .admin-riders-wrap,
  body.mv-has-sidebar .admin-orders-wrap,
  body.mv-has-sidebar .vendor-page,
  body.mv-has-sidebar .vendor-shell,
  body.mv-has-sidebar .rider-page,
  body.mv-has-sidebar .rider-shell,
  body.mv-has-sidebar .content,
  body.mv-has-sidebar .content-wrapper,
  body.mv-has-sidebar .content-body,
  body.mv-has-sidebar .app-content,
  body.mv-has-sidebar .main-content,
  body.mv-has-sidebar .page-content{
    box-sizing:border-box!important;
    position:relative!important;
    float:none!important;
    left:auto!important;
    right:auto!important;
    transform:none!important;
    margin-left:calc(var(--mv-live-sidebar-width) + var(--mv-live-content-gap))!important;
    margin-right:var(--mv-live-right-gap)!important;
    width:calc(100vw - var(--mv-live-sidebar-width) - var(--mv-live-content-gap) - var(--mv-live-right-gap))!important;
    max-width:calc(100vw - var(--mv-live-sidebar-width) - var(--mv-live-content-gap) - var(--mv-live-right-gap))!important;
    min-width:0!important;
    padding-left:0!important;
    padding-right:0!important;
  }
  body.mv-has-sidebar .container,
  body.mv-has-sidebar .container-sm,
  body.mv-has-sidebar .container-md,
  body.mv-has-sidebar .container-lg,
  body.mv-has-sidebar .container-xl,
  body.mv-has-sidebar .container-xxl,
  body.mv-has-sidebar .container-fluid{
    max-width:calc(100vw - var(--mv-live-sidebar-width) - var(--mv-live-content-gap) - var(--mv-live-right-gap))!important;
  }
  body.mv-has-sidebar .mv-page > *,
  body.mv-has-sidebar .admin-vendors-wrap > *,
  body.mv-has-sidebar .admin-products-wrap > *,
  body.mv-has-sidebar .admin-riders-wrap > *,
  body.mv-has-sidebar .admin-orders-wrap > *,
  body.mv-has-sidebar .vendor-page > *,
  body.mv-has-sidebar .rider-page > *{
    max-width:100%!important;
  }
  body.mv-has-sidebar .table-responsive,
  body.mv-has-sidebar table,
  body.mv-has-sidebar .card,
  body.mv-has-sidebar .mv-card,
  body.mv-has-sidebar .mv-standard-card{
    max-width:100%!important;
  }
  body.mv-has-sidebar .table-responsive{overflow-x:auto!important;}
}
@media (max-width:991px){
  body.mv-has-sidebar > :not(.mv-side-appbar):not(.mv-login-bottom-nav):not(.mv-floating-actions):not(.mv-group-float):not(.mv-feedback-layer):not(.mv-location-modal):not(#mvLocationModal):not(.modal):not(.modal-backdrop):not(#mvGlobalOverlay):not(#mvToastCenter):not(script):not(style),
  body.mv-has-sidebar .mv-page,
  body.mv-has-sidebar main.mv-page,
  body.mv-has-sidebar .container,
  body.mv-has-sidebar .container-fluid,
  body.mv-has-sidebar .admin-vendors-wrap,
  body.mv-has-sidebar .admin-products-wrap,
  body.mv-has-sidebar .admin-riders-wrap,
  body.mv-has-sidebar .admin-orders-wrap,
  body.mv-has-sidebar .vendor-page,
  body.mv-has-sidebar .rider-page{
    margin-left:10px!important;
    margin-right:10px!important;
    width:calc(100vw - 20px)!important;
    max-width:calc(100vw - 20px)!important;
    padding-left:0!important;
    padding-right:0!important;
  }
}

/* =====================================================
   FINAL GLOBAL FULL-SCREEN WIDTH FIX - ADMIN / VENDOR / RIDER
   Keeps every page after the fixed left menu, then stretches to
   the right edge of the browser. Prevents headers/tables entering
   behind the side menu on admin/orders, admin/delivery, vendors, etc.
===================================================== */
:root{
  --mv-sidebar-open-w: 220px;
  --mv-sidebar-collapsed-w: 70px;
  --mv-page-edge-gap: 16px;
}
@media (min-width: 992px){
  body.mv-has-sidebar,
  body:has(.mv-side-appbar){
    overflow-x:hidden !important;
  }

  body.mv-has-sidebar .mv-side-appbar,
  body:has(.mv-side-appbar) .mv-side-appbar{
    position:fixed !important;
    left:0 !important;
    top:0 !important;
    bottom:0 !important;
    width:var(--mv-sidebar-open-w) !important;
    z-index:3000 !important;
  }

  /* Main page wrappers used across admin, vendor and rider pages */
  body.mv-has-sidebar .mv-page,
  body.mv-has-sidebar main.mv-page,
  body.mv-has-sidebar .admin-page,
  body.mv-has-sidebar .admin-orders-wrap,
  body.mv-has-sidebar .admin-vendors-wrap,
  body.mv-has-sidebar .admin-products-wrap,
  body.mv-has-sidebar .admin-riders-wrap,
  body.mv-has-sidebar .vendor-page,
  body.mv-has-sidebar .vendor-shell,
  body.mv-has-sidebar .vendor-orders-page,
  body.mv-has-sidebar .rider-page,
  body.mv-has-sidebar .rider-shell,
  body.mv-has-sidebar .content-wrapper,
  body.mv-has-sidebar .content-body,
  body.mv-has-sidebar .app-content,
  body.mv-has-sidebar .main-content,
  body.mv-has-sidebar .page-content,
  body:has(.mv-side-appbar) .mv-page,
  body:has(.mv-side-appbar) main.mv-page,
  body:has(.mv-side-appbar) .admin-page,
  body:has(.mv-side-appbar) .admin-orders-wrap,
  body:has(.mv-side-appbar) .admin-vendors-wrap,
  body:has(.mv-side-appbar) .admin-products-wrap,
  body:has(.mv-side-appbar) .admin-riders-wrap,
  body:has(.mv-side-appbar) .vendor-page,
  body:has(.mv-side-appbar) .vendor-shell,
  body:has(.mv-side-appbar) .vendor-orders-page,
  body:has(.mv-side-appbar) .rider-page,
  body:has(.mv-side-appbar) .rider-shell,
  body:has(.mv-side-appbar) .content-wrapper,
  body:has(.mv-side-appbar) .content-body,
  body:has(.mv-side-appbar) .app-content,
  body:has(.mv-side-appbar) .main-content,
  body:has(.mv-side-appbar) .page-content{
    box-sizing:border-box !important;
    position:relative !important;
    left:auto !important;
    right:auto !important;
    transform:none !important;
    float:none !important;
    margin-left:calc(var(--mv-sidebar-open-w) + var(--mv-page-edge-gap)) !important;
    margin-right:var(--mv-page-edge-gap) !important;
    width:calc(100vw - var(--mv-sidebar-open-w) - (var(--mv-page-edge-gap) * 2)) !important;
    max-width:calc(100vw - var(--mv-sidebar-open-w) - (var(--mv-page-edge-gap) * 2)) !important;
    min-width:0 !important;
    padding-left:0 !important;
    padding-right:0 !important;
  }

  body.mv-sidebar-collapsed.mv-has-sidebar .mv-page,
  body.mv-sidebar-collapsed.mv-has-sidebar main.mv-page,
  body.mv-sidebar-collapsed.mv-has-sidebar .admin-page,
  body.mv-sidebar-collapsed.mv-has-sidebar .admin-orders-wrap,
  body.mv-sidebar-collapsed.mv-has-sidebar .admin-vendors-wrap,
  body.mv-sidebar-collapsed.mv-has-sidebar .admin-products-wrap,
  body.mv-sidebar-collapsed.mv-has-sidebar .admin-riders-wrap,
  body.mv-sidebar-collapsed.mv-has-sidebar .vendor-page,
  body.mv-sidebar-collapsed.mv-has-sidebar .vendor-shell,
  body.mv-sidebar-collapsed.mv-has-sidebar .vendor-orders-page,
  body.mv-sidebar-collapsed.mv-has-sidebar .rider-page,
  body.mv-sidebar-collapsed.mv-has-sidebar .rider-shell,
  body.mv-sidebar-collapsed.mv-has-sidebar .content-wrapper,
  body.mv-sidebar-collapsed.mv-has-sidebar .content-body,
  body.mv-sidebar-collapsed.mv-has-sidebar .app-content,
  body.mv-sidebar-collapsed.mv-has-sidebar .main-content,
  body.mv-sidebar-collapsed.mv-has-sidebar .page-content,
  body.mv-sidebar-collapsed:has(.mv-side-appbar) .mv-page,
  body.mv-sidebar-collapsed:has(.mv-side-appbar) main.mv-page,
  body.mv-sidebar-collapsed:has(.mv-side-appbar) .admin-page,
  body.mv-sidebar-collapsed:has(.mv-side-appbar) .admin-orders-wrap,
  body.mv-sidebar-collapsed:has(.mv-side-appbar) .admin-vendors-wrap,
  body.mv-sidebar-collapsed:has(.mv-side-appbar) .admin-products-wrap,
  body.mv-sidebar-collapsed:has(.mv-side-appbar) .admin-riders-wrap,
  body.mv-sidebar-collapsed:has(.mv-side-appbar) .vendor-page,
  body.mv-sidebar-collapsed:has(.mv-side-appbar) .vendor-shell,
  body.mv-sidebar-collapsed:has(.mv-side-appbar) .vendor-orders-page,
  body.mv-sidebar-collapsed:has(.mv-side-appbar) .rider-page,
  body.mv-sidebar-collapsed:has(.mv-side-appbar) .rider-shell,
  body.mv-sidebar-collapsed:has(.mv-side-appbar) .content-wrapper,
  body.mv-sidebar-collapsed:has(.mv-side-appbar) .content-body,
  body.mv-sidebar-collapsed:has(.mv-side-appbar) .app-content,
  body.mv-sidebar-collapsed:has(.mv-side-appbar) .main-content,
  body.mv-sidebar-collapsed:has(.mv-side-appbar) .page-content{
    margin-left:calc(var(--mv-sidebar-collapsed-w) + var(--mv-page-edge-gap)) !important;
    width:calc(100vw - var(--mv-sidebar-collapsed-w) - (var(--mv-page-edge-gap) * 2)) !important;
    max-width:calc(100vw - var(--mv-sidebar-collapsed-w) - (var(--mv-page-edge-gap) * 2)) !important;
  }

  /* Inner Bootstrap containers must fill the page wrapper, not center with a small max-width. */
  body.mv-has-sidebar .mv-page .container,
  body.mv-has-sidebar .mv-page .container-fluid,
  body.mv-has-sidebar .admin-page .container,
  body.mv-has-sidebar .admin-page .container-fluid,
  body.mv-has-sidebar .content-wrapper .container,
  body.mv-has-sidebar .content-wrapper .container-fluid,
  body:has(.mv-side-appbar) .mv-page .container,
  body:has(.mv-side-appbar) .mv-page .container-fluid,
  body:has(.mv-side-appbar) .admin-page .container,
  body:has(.mv-side-appbar) .admin-page .container-fluid,
  body:has(.mv-side-appbar) .content-wrapper .container,
  body:has(.mv-side-appbar) .content-wrapper .container-fluid{
    width:100% !important;
    max-width:100% !important;
    margin-left:0 !important;
    margin-right:0 !important;
    padding-left:0 !important;
    padding-right:0 !important;
  }

  body.mv-has-sidebar .table-responsive,
  body:has(.mv-side-appbar) .table-responsive{
    width:100% !important;
    max-width:100% !important;
    overflow-x:auto !important;
  }
}
@media (max-width: 991px){
  body.mv-has-sidebar .mv-page,
  body.mv-has-sidebar main.mv-page,
  body.mv-has-sidebar .admin-page,
  body.mv-has-sidebar .admin-orders-wrap,
  body.mv-has-sidebar .admin-vendors-wrap,
  body.mv-has-sidebar .admin-products-wrap,
  body.mv-has-sidebar .admin-riders-wrap,
  body.mv-has-sidebar .vendor-page,
  body.mv-has-sidebar .vendor-shell,
  body.mv-has-sidebar .rider-page,
  body.mv-has-sidebar .rider-shell,
  body:has(.mv-side-appbar) .mv-page,
  body:has(.mv-side-appbar) main.mv-page,
  body:has(.mv-side-appbar) .admin-page,
  body:has(.mv-side-appbar) .admin-orders-wrap,
  body:has(.mv-side-appbar) .admin-vendors-wrap,
  body:has(.mv-side-appbar) .admin-products-wrap,
  body:has(.mv-side-appbar) .admin-riders-wrap,
  body:has(.mv-side-appbar) .vendor-page,
  body:has(.mv-side-appbar) .vendor-shell,
  body:has(.mv-side-appbar) .rider-page,
  body:has(.mv-side-appbar) .rider-shell{
    margin-left:10px !important;
    margin-right:10px !important;
    width:calc(100vw - 20px) !important;
    max-width:calc(100vw - 20px) !important;
    padding-left:0 !important;
    padding-right:0 !important;
  }
}

/* === Stable sidebar active/open state fix === */
.mv-side-appbar .mv-app-action.is-active,
.mv-side-appbar .mv-app-action.active,
.mv-side-appbar .mv-app-primary.is-active,
.mv-side-appbar .mv-app-primary.active,
.mv-login-bottom-nav a.is-active,
.mv-login-bottom-nav a.active{
  background:var(--mv-accent-live,#ff9f2e)!important;
  color:#fff!important;
  border-color:rgba(255,255,255,.35)!important;
  box-shadow:0 10px 26px rgba(0,0,0,.12)!important;
}
.mv-side-appbar .mv-nav-submenu a.is-active,
.mv-side-appbar .mv-nav-submenu a.active{
  background:rgba(255,255,255,.24)!important;
  color:#fff!important;
  font-weight:900!important;
}
.mv-side-appbar .mv-nav-group.is-open > .mv-app-action,
.mv-side-appbar .mv-nav-group.is-open > .mv-app-primary{
  background:rgba(255,255,255,.16)!important;
}

/* =========================================================
   FINAL MODAL LAYER FIX - modal forms must stay above overlays
   - Bootstrap backdrop stays behind the modal panel.
   - Global processing overlay is pushed behind modals so it cannot dim/cover forms.
   ========================================================= */
body.modal-open .mv-global-overlay,
html.modal-open .mv-global-overlay,
body.mv-modal-open .mv-global-overlay{
  z-index:2147482500 !important;
  pointer-events:none !important;
}
body.modal-open .mv-global-overlay.is-visible,
html.modal-open .mv-global-overlay.is-visible,
body.mv-modal-open .mv-global-overlay.is-visible{
  z-index:2147482500 !important;
  pointer-events:none !important;
}
.modal-backdrop,
.modal-backdrop.fade,
.modal-backdrop.show{
  z-index:2147483000 !important;
}
.modal,
.modal.fade,
.modal.show,
.modal[style*="display: block"]{
  z-index:2147483500 !important;
  pointer-events:auto !important;
}
.modal-dialog,
.modal.show .modal-dialog{
  z-index:2147483510 !important;
  pointer-events:auto !important;
}
.modal-content,
.modal.show .modal-content{
  position:relative !important;
  z-index:2147483520 !important;
  opacity:1 !important;
  visibility:visible !important;
  pointer-events:auto !important;
  filter:none !important;
}
body.modal-open .mv-side-appbar,
body.modal-open .mv-floating-actions,
body.modal-open .whatsapp-float{
  z-index:1000 !important;
}

/* =========================================================
   FINAL SAFE MODAL STACK FIX (NO LOOPS)
   Problem fixed: dark/light overlay was sitting on top of modal forms.
   Rule: any visible modal must be the highest layer; loading overlay is hidden behind modals.
   ========================================================= */
body:has(.modal.show) #mvGlobalOverlay,
body:has(.modal[style*="display: block"]) #mvGlobalOverlay,
html:has(.modal.show) #mvGlobalOverlay,
html:has(.modal[style*="display: block"]) #mvGlobalOverlay,
body:has(.modal.show) .mv-global-overlay,
body:has(.modal[style*="display: block"]) .mv-global-overlay{
  display:none !important;
  opacity:0 !important;
  visibility:hidden !important;
  pointer-events:none !important;
  z-index:1 !important;
}
.modal-backdrop,
.modal-backdrop.fade,
.modal-backdrop.show{
  position:fixed !important;
  inset:0 !important;
  width:100vw !important;
  height:100vh !important;
  background:#020617 !important;
  opacity:.58 !important;
  z-index:2147483000 !important;
  pointer-events:auto !important;
}
.modal,
.modal.fade,
.modal.show,
.modal[style*="display: block"],
.admin-products-modal.modal,
.admin-users-modal.modal,
.admin-vendors-modal.modal{
  position:fixed !important;
  inset:0 !important;
  width:100vw !important;
  height:100vh !important;
  max-width:none !important;
  max-height:none !important;
  margin:0 !important;
  padding:0 !important;
  overflow-x:hidden !important;
  overflow-y:auto !important;
  z-index:2147483600 !important;
  opacity:1 !important;
  visibility:visible !important;
  pointer-events:auto !important;
  filter:none !important;
}
.modal.show,
.modal[style*="display: block"]{display:block !important;}
.modal .modal-dialog,
.modal.show .modal-dialog,
.modal[style*="display: block"] .modal-dialog{
  position:relative !important;
  z-index:2147483610 !important;
  pointer-events:auto !important;
  margin:1.75rem auto !important;
  opacity:1 !important;
  visibility:visible !important;
  filter:none !important;
}
.modal .modal-content,
.modal.show .modal-content,
.modal[style*="display: block"] .modal-content{
  position:relative !important;
  z-index:2147483620 !important;
  background:#fff !important;
  opacity:1 !important;
  visibility:visible !important;
  pointer-events:auto !important;
  filter:none !important;
  transform:none !important;
}
body.modal-open .mv-side-appbar,
body.modal-open .mv-floating-actions,
body.modal-open .whatsapp-float,
body.modal-open .mv-user-dropdown,
body:has(.modal.show) .mv-side-appbar,
body:has(.modal[style*="display: block"]) .mv-side-appbar{
  z-index:1000 !important;
}
@media(max-width:576px){
  .modal .modal-dialog,
  .modal.show .modal-dialog,
  .modal[style*="display: block"] .modal-dialog{
    width:calc(100vw - 20px) !important;
    max-width:calc(100vw - 20px) !important;
    margin:10px auto !important;
  }
}


/* =====================================================
   VENDOR PAGES TOP GAP + WHATSAPP FLOAT POSITION FIX
   Scoped to vendor shell only; keeps vendor pages starting at
   the top of the available space and prevents the WhatsApp/group
   button from being stretched by global full-width layout rules.
===================================================== */
body.mv-vendor-shell-page{
  overflow-x:hidden !important;
}
body.mv-vendor-shell-page .mv-side-appbar ~ main.mv-page,
body.mv-vendor-shell-page .mv-side-appbar ~ .mv-page{
  margin-top:0 !important;
  padding-top:22px !important;
  align-self:flex-start !important;
}
body.mv-vendor-shell-page .mv-page-head{
  margin-top:0 !important;
}
body.mv-vendor-shell-page .mv-group-float,
body.mv-vendor-shell-page.mv-has-sidebar .mv-group-float,
body.mv-vendor-shell-page:has(.mv-side-appbar) .mv-group-float{
  position:fixed !important;
  right:18px !important;
  left:auto !important;
  top:92px !important;
  width:52px !important;
  min-width:52px !important;
  max-width:52px !important;
  height:52px !important;
  margin:0 !important;
  padding:0 !important;
  display:grid !important;
  place-items:center !important;
  border-radius:999px !important;
  background:#25d366 !important;
  color:#fff !important;
  z-index:1090 !important;
  text-decoration:none !important;
  box-shadow:0 16px 34px rgba(15,23,42,.22) !important;
  transform:none !important;
}
body.mv-vendor-shell-page .mv-group-float i{font-size:1.55rem !important;line-height:1 !important;}
body.mv-vendor-shell-page .mv-group-float span{
  position:absolute !important;
  right:60px !important;
  left:auto !important;
  top:50% !important;
  width:auto !important;
  min-width:0 !important;
  max-width:none !important;
  height:auto !important;
  white-space:nowrap !important;
  opacity:0 !important;
  pointer-events:none !important;
  transform:translateY(-50%) translateX(-6px) !important;
  background:rgba(15,23,42,.88) !important;
  color:#fff !important;
  border-radius:999px !important;
  padding:7px 11px !important;
  font-size:.78rem !important;
  font-weight:800 !important;
}
body.mv-vendor-shell-page .mv-group-float:hover span,
body.mv-vendor-shell-page .mv-group-float:focus-visible span{
  opacity:1 !important;
  transform:translateY(-50%) translateX(0) !important;
}
@media(max-width:991px){
  body.mv-vendor-shell-page .mv-side-appbar ~ main.mv-page,
  body.mv-vendor-shell-page .mv-side-appbar ~ .mv-page{
    padding-top:14px !important;
  }
  body.mv-vendor-shell-page .mv-group-float{
    top:82px !important;
    right:14px !important;
  }
}


/* =====================================================
   FINAL VENDOR PAGES HEADER START + WHATSAPP POSITION FIX
   Scoped only to vendor pages. It makes every vendor page start
   immediately beside the side menu (no large empty top gap) and
   keeps the WhatsApp group icon floating independently.
===================================================== */
html.mv-vendor-at-top,
body.mv-vendor-shell-page{
  scroll-behavior:auto !important;
  overflow-x:hidden !important;
}
body.mv-vendor-shell-page .mv-side-appbar ~ main.mv-page,
body.mv-vendor-shell-page .mv-side-appbar ~ .mv-page{
  margin-top:0 !important;
  padding-top:18px !important;
  top:0 !important;
  transform:none !important;
  align-self:flex-start !important;
  min-height:auto !important;
}
body.mv-vendor-shell-page .mv-page > .mv-page-head:first-child,
body.mv-vendor-shell-page main.mv-page > .mv-page-head:first-child{
  margin-top:0 !important;
}
@media (min-width:992px){
  body.mv-vendor-shell-page .mv-side-appbar ~ main.mv-page,
  body.mv-vendor-shell-page .mv-side-appbar ~ .mv-page{
    margin-left:calc(var(--mv-live-sidebar-width,220px) + 24px) !important;
    margin-right:18px !important;
    width:calc(100vw - var(--mv-live-sidebar-width,220px) - 42px) !important;
    max-width:calc(100vw - var(--mv-live-sidebar-width,220px) - 42px) !important;
  }
}
body.mv-vendor-shell-page .mv-group-float,
body.mv-vendor-shell-page.mv-has-sidebar .mv-group-float,
body.mv-vendor-shell-page:has(.mv-side-appbar) .mv-group-float{
  position:fixed !important;
  top:86px !important;
  right:18px !important;
  left:auto !important;
  width:52px !important;
  min-width:52px !important;
  max-width:52px !important;
  height:52px !important;
  margin:0 !important;
  padding:0 !important;
  display:grid !important;
  place-items:center !important;
  border-radius:999px !important;
  z-index:1090 !important;
  transform:none !important;
}
body.mv-vendor-shell-page .mv-group-float span{
  display:none !important;
}
body.mv-vendor-shell-page .mv-page-head{
  position:relative !important;
  z-index:1 !important;
}


/* =====================================================
   CLEAN VENDOR PAGE START + RESPONSIVE LAYOUT FIX
   Fixes blank space above /vendor pages without hiding content.
===================================================== */
html,body{scroll-behavior:auto!important;}
body.mv-vendor-shell-page,
body.mv-vendor-dashboard-page{
  overflow-x:hidden!important;
  overflow-y:auto!important;
  min-height:100vh!important;
}
body.mv-vendor-shell-page .mv-side-appbar,
body.mv-vendor-dashboard-page .mv-side-appbar{
  position:fixed!important;
  left:0!important;
  top:0!important;
  bottom:0!important;
  z-index:3000!important;
}
@media (min-width:992px){
  body.mv-vendor-shell-page .mv-side-appbar ~ main.mv-page,
  body.mv-vendor-shell-page .mv-side-appbar ~ .mv-page,
  body.mv-vendor-dashboard-page .mv-side-appbar ~ main.mv-page,
  body.mv-vendor-dashboard-page .mv-side-appbar ~ .mv-page,
  body.mv-vendor-dashboard-page main.mv-page.mv-vendor-dashboard-home{
    position:relative!important;
    display:block!important;
    visibility:visible!important;
    opacity:1!important;
    top:auto!important;
    bottom:auto!important;
    left:auto!important;
    right:auto!important;
    transform:none!important;
    float:none!important;
    clear:none!important;
    width:calc(100vw - var(--mv-live-sidebar-width,220px) - 36px)!important;
    max-width:none!important;
    min-width:0!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    margin-top:0!important;
    margin-left:calc(var(--mv-live-sidebar-width,220px) + 18px)!important;
    margin-right:18px!important;
    margin-bottom:0!important;
    padding-top:18px!important;
    padding-bottom:96px!important;
    overflow:visible!important;
    box-sizing:border-box!important;
  }
  body.mv-sidebar-collapsed.mv-vendor-shell-page .mv-side-appbar ~ main.mv-page,
  body.mv-sidebar-collapsed.mv-vendor-shell-page .mv-side-appbar ~ .mv-page,
  body.mv-sidebar-collapsed.mv-vendor-dashboard-page .mv-side-appbar ~ main.mv-page,
  body.mv-sidebar-collapsed.mv-vendor-dashboard-page .mv-side-appbar ~ .mv-page,
  body.mv-sidebar-collapsed.mv-vendor-dashboard-page main.mv-page.mv-vendor-dashboard-home{
    width:calc(100vw - 78px - 36px)!important;
    margin-left:96px!important;
  }
  body.mv-vendor-shell-page .mv-page > .mv-page-head:first-child,
  body.mv-vendor-dashboard-page .mv-page > .mv-page-head:first-child{
    margin-top:0!important;
  }
}
@media (max-width:991px){
  body.mv-vendor-shell-page .mv-side-appbar,
  body.mv-vendor-dashboard-page .mv-side-appbar{position:sticky!important;top:0!important;}
  body.mv-vendor-shell-page .mv-side-appbar ~ main.mv-page,
  body.mv-vendor-shell-page .mv-side-appbar ~ .mv-page,
  body.mv-vendor-dashboard-page .mv-side-appbar ~ main.mv-page,
  body.mv-vendor-dashboard-page .mv-side-appbar ~ .mv-page,
  body.mv-vendor-dashboard-page main.mv-page.mv-vendor-dashboard-home{
    position:relative!important;
    top:auto!important;left:auto!important;right:auto!important;bottom:auto!important;
    width:calc(100vw - 20px)!important;
    max-width:calc(100vw - 20px)!important;
    margin:12px 10px 0 10px!important;
    padding:0 0 96px 0!important;
    overflow:visible!important;
    transform:none!important;
    display:block!important;
    visibility:visible!important;
    opacity:1!important;
  }
}
.mv-group-float{
  position:fixed!important;right:18px!important;top:86px!important;left:auto!important;bottom:auto!important;
  width:52px!important;height:52px!important;min-width:52px!important;max-width:52px!important;
  display:grid!important;place-items:center!important;border-radius:999px!important;padding:0!important;
  background:#25d366!important;color:#fff!important;z-index:1200!important;box-shadow:0 16px 34px rgba(15,23,42,.20)!important;
}
.mv-group-float span{display:none!important;}
@media (max-width:991px){.mv-group-float{top:auto!important;bottom:86px!important;right:16px!important;width:48px!important;height:48px!important;min-width:48px!important;max-width:48px!important;}}


/* =====================================================
   HARD FIX: Vendor pages must open at the content start
   The issue was browser/restored scroll placing the first card at
   the bottom of the viewport, making pages look empty.
===================================================== */
html.mv-vendor-at-top,
html.mv-vendor-at-top body{
  scroll-behavior:auto!important;
  overflow-anchor:none!important;
}
body.mv-vendor-shell-page main.mv-page,
body.mv-vendor-dashboard-page main.mv-page,
body.mv-vendor-shell-page .mv-side-appbar ~ .mv-page,
body.mv-vendor-dashboard-page .mv-side-appbar ~ .mv-page{
  top:0!important;
  margin-top:0!important;
  transform:none!important;
  translate:none!important;
  align-self:flex-start!important;
  opacity:1!important;
  visibility:visible!important;
}
body.mv-vendor-shell-page main.mv-page > .mv-page-head:first-child,
body.mv-vendor-dashboard-page main.mv-page > .mv-page-head:first-child{
  margin-top:0!important;
}
@media (min-width:992px){
  body.mv-vendor-shell-page main.mv-page,
  body.mv-vendor-dashboard-page main.mv-page{
    padding-top:18px!important;
    margin-left:calc(var(--mv-live-sidebar-width,220px) + 18px)!important;
    width:calc(100vw - var(--mv-live-sidebar-width,220px) - 36px)!important;
  }
}


/* =====================================================
   FINAL FIX: Vendor content must never be pushed below viewport
   Cause: browser scroll restoration/page scripts were moving the document
   after load. Vendor pages now use a fixed internal scroll container on
   desktop, so content always starts visible at the top.
===================================================== */
@media (min-width: 992px){
  html.mv-vendor-at-top,
  html.mv-vendor-at-top body,
  body.mv-vendor-shell-page{
    height:100% !important;
    min-height:100% !important;
    overflow:hidden !important;
    scroll-behavior:auto !important;
    overflow-anchor:none !important;
  }
  body.mv-vendor-shell-page .mv-side-appbar{
    position:fixed !important;
    left:0 !important;
    top:0 !important;
    bottom:0 !important;
    height:100vh !important;
    z-index:3000 !important;
  }
  body.mv-vendor-shell-page main.mv-page,
  body.mv-vendor-shell-page .mv-side-appbar ~ main.mv-page,
  body.mv-vendor-shell-page .mv-side-appbar ~ .mv-page,
  body.mv-vendor-dashboard-page main.mv-page,
  body.mv-vendor-dashboard-page .mv-side-appbar ~ main.mv-page,
  body.mv-vendor-dashboard-page .mv-side-appbar ~ .mv-page{
    position:fixed !important;
    top:0 !important;
    left:calc(var(--mv-live-sidebar-width,220px) + 18px) !important;
    right:18px !important;
    bottom:0 !important;
    width:auto !important;
    max-width:none !important;
    min-width:0 !important;
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;
    margin:0 !important;
    padding:18px 0 96px 0 !important;
    overflow-y:auto !important;
    overflow-x:hidden !important;
    transform:none !important;
    translate:none !important;
    display:block !important;
    visibility:visible !important;
    opacity:1 !important;
    box-sizing:border-box !important;
    scroll-behavior:auto !important;
    overscroll-behavior:contain !important;
    -webkit-overflow-scrolling:touch !important;
  }
  body.mv-sidebar-collapsed.mv-vendor-shell-page main.mv-page,
  body.mv-sidebar-collapsed.mv-vendor-shell-page .mv-side-appbar ~ main.mv-page,
  body.mv-sidebar-collapsed.mv-vendor-shell-page .mv-side-appbar ~ .mv-page,
  body.mv-sidebar-collapsed.mv-vendor-dashboard-page main.mv-page,
  body.mv-sidebar-collapsed.mv-vendor-dashboard-page .mv-side-appbar ~ main.mv-page,
  body.mv-sidebar-collapsed.mv-vendor-dashboard-page .mv-side-appbar ~ .mv-page{
    left:96px !important;
  }
  body.mv-vendor-shell-page main.mv-page > .mv-page-head:first-child,
  body.mv-vendor-shell-page .mv-page > .mv-page-head:first-child,
  body.mv-vendor-dashboard-page main.mv-page > .mv-page-head:first-child,
  body.mv-vendor-dashboard-page .mv-page > .mv-page-head:first-child{
    margin-top:0 !important;
  }
}
@media (max-width: 991px){
  html.mv-vendor-at-top,
  html.mv-vendor-at-top body{
    scroll-behavior:auto !important;
    overflow-anchor:none !important;
  }
  body.mv-vendor-shell-page main.mv-page,
  body.mv-vendor-shell-page .mv-side-appbar ~ main.mv-page,
  body.mv-vendor-shell-page .mv-side-appbar ~ .mv-page{
    margin-top:0 !important;
    padding-top:12px !important;
  }
}

/* =====================================================
   VENDOR RECOVERY FIX - CONTENT MUST BE VISIBLE AT TOP
   Removes the previous fixed/internal-scroll experiment that made pages
   appear blank. Vendor pages now use normal document flow again.
===================================================== */
html.mv-vendor-at-top,
html.mv-vendor-at-top body{
  height:auto !important;
  min-height:100% !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  scroll-behavior:auto !important;
  overflow-anchor:none !important;
}
body.mv-vendor-shell-page,
body.mv-vendor-dashboard-page{
  height:auto !important;
  min-height:100vh !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
}
body.mv-vendor-shell-page .mv-side-appbar,
body.mv-vendor-dashboard-page .mv-side-appbar{
  position:fixed !important;
  left:0 !important;
  top:0 !important;
  bottom:0 !important;
  height:100vh !important;
  z-index:3000 !important;
}
@media (min-width:992px){
  body.mv-vendor-shell-page main.mv-page,
  body.mv-vendor-shell-page .mv-side-appbar ~ main.mv-page,
  body.mv-vendor-shell-page .mv-side-appbar ~ .mv-page,
  body.mv-vendor-dashboard-page main.mv-page,
  body.mv-vendor-dashboard-page .mv-side-appbar ~ main.mv-page,
  body.mv-vendor-dashboard-page .mv-side-appbar ~ .mv-page,
  body.mv-vendor-dashboard-page main.mv-page.mv-vendor-dashboard-home{
    position:relative !important;
    display:block !important;
    visibility:visible !important;
    opacity:1 !important;
    top:auto !important;
    left:auto !important;
    right:auto !important;
    bottom:auto !important;
    transform:none !important;
    translate:none !important;
    float:none !important;
    clear:none !important;
    width:calc(100vw - var(--mv-live-sidebar-width,220px) - 36px) !important;
    max-width:calc(100vw - var(--mv-live-sidebar-width,220px) - 36px) !important;
    min-width:0 !important;
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;
    margin-top:0 !important;
    margin-left:calc(var(--mv-live-sidebar-width,220px) + 18px) !important;
    margin-right:18px !important;
    margin-bottom:0 !important;
    padding:18px 0 96px 0 !important;
    overflow:visible !important;
    box-sizing:border-box !important;
  }
  body.mv-sidebar-collapsed.mv-vendor-shell-page main.mv-page,
  body.mv-sidebar-collapsed.mv-vendor-shell-page .mv-side-appbar ~ main.mv-page,
  body.mv-sidebar-collapsed.mv-vendor-shell-page .mv-side-appbar ~ .mv-page,
  body.mv-sidebar-collapsed.mv-vendor-dashboard-page main.mv-page,
  body.mv-sidebar-collapsed.mv-vendor-dashboard-page .mv-side-appbar ~ main.mv-page,
  body.mv-sidebar-collapsed.mv-vendor-dashboard-page .mv-side-appbar ~ .mv-page{
    width:calc(100vw - 78px - 36px) !important;
    max-width:calc(100vw - 78px - 36px) !important;
    margin-left:96px !important;
  }
}
@media (max-width:991px){
  body.mv-vendor-shell-page .mv-side-appbar,
  body.mv-vendor-dashboard-page .mv-side-appbar{
    position:sticky !important;
    height:auto !important;
  }
  body.mv-vendor-shell-page main.mv-page,
  body.mv-vendor-shell-page .mv-side-appbar ~ main.mv-page,
  body.mv-vendor-shell-page .mv-side-appbar ~ .mv-page,
  body.mv-vendor-dashboard-page main.mv-page,
  body.mv-vendor-dashboard-page .mv-side-appbar ~ main.mv-page,
  body.mv-vendor-dashboard-page .mv-side-appbar ~ .mv-page{
    position:relative !important;
    display:block !important;
    visibility:visible !important;
    opacity:1 !important;
    top:auto !important;
    left:auto !important;
    right:auto !important;
    bottom:auto !important;
    transform:none !important;
    translate:none !important;
    width:calc(100vw - 20px) !important;
    max-width:calc(100vw - 20px) !important;
    margin:10px 10px 0 10px !important;
    padding:0 0 96px 0 !important;
    overflow:visible !important;
  }
}
body.mv-vendor-shell-page main.mv-page > .mv-page-head:first-child,
body.mv-vendor-dashboard-page main.mv-page > .mv-page-head:first-child{
  margin-top:0 !important;
}
.mv-vendor-debug-panel{
  position:fixed !important;
  left:240px !important;
  top:90px !important;
  right:24px !important;
  z-index:99999 !important;
  background:#fff3cd !important;
  color:#664d03 !important;
  border:2px solid #ffca2c !important;
  border-radius:14px !important;
  padding:14px 16px !important;
  box-shadow:0 18px 45px rgba(0,0,0,.18) !important;
  font-weight:800 !important;
}
.mv-vendor-debug-panel small{display:block;margin-top:5px;font-weight:600;color:#7a5b00;}
@media(max-width:991px){.mv-vendor-debug-panel{left:12px!important;right:12px!important;top:80px!important;}}


/* =====================================================
   FINAL FIX: HIDDEN LOCATION MODAL MUST NOT PUSH VENDOR CONTENT
   The hidden .mv-location-modal is a body child, so it must be excluded
   from sidebar page-width rules and kept out of normal document flow.
===================================================== */
body.mv-has-sidebar > .mv-location-modal,
body.mv-has-sidebar > #mvLocationModal{
  margin:0 !important;
  float:none !important;
  clear:none !important;
  transform:none !important;
  translate:none !important;
  box-sizing:border-box !important;
}

.mv-location-modal:not(.is-open):not([data-force="1"]),
#mvLocationModal:not(.is-open):not([data-force="1"]),
.mv-location-modal[aria-hidden="true"]:not(.is-open):not([data-force="1"]),
#mvLocationModal[aria-hidden="true"]:not(.is-open):not([data-force="1"]){
  display:none !important;
  position:fixed !important;
  inset:0 !important;
  width:100vw !important;
  height:100vh !important;
  min-height:0 !important;
  max-height:none !important;
  margin:0 !important;
  padding:0 !important;
  opacity:0 !important;
  visibility:hidden !important;
  pointer-events:none !important;
  overflow:hidden !important;
}

.mv-location-modal.is-open,
.mv-location-modal[data-force="1"],
#mvLocationModal.is-open,
#mvLocationModal[data-force="1"],
body.mv-location-locked .mv-location-modal,
body.mv-location-locked #mvLocationModal{
  display:flex !important;
  position:fixed !important;
  inset:0 !important;
  width:100vw !important;
  height:100vh !important;
  min-height:100vh !important;
  max-height:none !important;
  margin:0 !important;
  padding:18px !important;
  align-items:center !important;
  justify-content:center !important;
  opacity:1 !important;
  visibility:visible !important;
  pointer-events:auto !important;
  overflow:auto !important;
  z-index:2147483647 !important;
}

.mv-location-modal.is-open .mv-location-card,
.mv-location-modal[data-force="1"] .mv-location-card,
#mvLocationModal.is-open .mv-location-card,
#mvLocationModal[data-force="1"] .mv-location-card{
  position:relative !important;
  width:min(640px, calc(100vw - 28px)) !important;
  max-width:min(640px, calc(100vw - 28px)) !important;
  max-height:calc(100vh - 36px) !important;
  margin:0 !important;
  overflow:auto !important;
}


/* Vendor premium/subscription indicators */
.mv-premium-mini-badge{display:inline-flex;align-items:center;gap:5px;margin-top:3px;padding:3px 8px;border-radius:999px;font-size:10px;font-weight:900;font-style:normal;line-height:1;border:1px solid rgba(255,255,255,.24);max-width:max-content;white-space:nowrap}
.mv-premium-mini-badge.is-active{background:rgba(16,185,129,.20);color:#dcfce7;border-color:rgba(187,247,208,.45)}
.mv-premium-mini-badge.is-basic{background:rgba(255,255,255,.14);color:#fff7ed;border-color:rgba(255,255,255,.20)}
.mv-premium-nav-action{position:relative;gap:8px!important}
.mv-premium-nav-action b{margin-left:auto;padding:3px 7px;border-radius:999px;background:rgba(255,255,255,.16);font-size:10px;line-height:1;color:#fff;font-weight:900;text-transform:uppercase;letter-spacing:.02em}
.mv-premium-nav-action.is-premium-active b{background:#dcfce7;color:#047857}
.mv-subscription-status-card{border:1px solid rgba(16,185,129,.25);background:linear-gradient(135deg,#ecfdf5,#ffffff);border-radius:18px;padding:16px;box-shadow:0 16px 40px rgba(2,6,23,.07)}
.mv-subscription-status-card.is-basic{border-color:rgba(245,158,11,.28);background:linear-gradient(135deg,#fffbeb,#ffffff)}
.mv-subscription-badge{display:inline-flex;align-items:center;gap:6px;padding:6px 11px;border-radius:999px;font-weight:900;font-size:12px;text-transform:uppercase;letter-spacing:.02em}
.mv-subscription-badge.is-active{background:#dcfce7;color:#047857}.mv-subscription-badge.is-basic{background:#fef3c7;color:#92400e}.mv-subscription-badge.is-expired{background:#fee2e2;color:#991b1b}
.mv-plan-meta{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}.mv-plan-meta span{display:inline-flex;align-items:center;gap:5px;border:1px solid rgba(15,23,42,.08);background:#fff;border-radius:999px;padding:5px 10px;font-size:12px;font-weight:800;color:#475569}
.mv-plan-card-current{outline:2px solid rgba(16,185,129,.35);box-shadow:0 18px 50px rgba(16,185,129,.13)!important}
@media(max-width:760px){.mv-premium-mini-badge{font-size:9px;padding:3px 6px}.mv-app-brand-text small{max-width:150px}.mv-plan-meta span{font-size:11px}}


/* FULL PRODUCT IMAGE FIT PATCH */
.mv-product-media,
.catalog-media,
.hero-img,
.mv-gallery-main{
  background:#fff !important;
}
.mv-product-media img,
.catalog-main-frame img,
.hero-img img,
.mv-gallery-main img,
.pimg,
.vendor-product-img{
  object-fit:contain !important;
  object-position:center !important;
  background:#fff !important;
}
.catalog-main-frame video,
.mv-gallery-main video,
.hero-img video{
  object-fit:contain !important;
  object-position:center !important;
  background:#000 !important;
}

/* Button/link loading and safer action feedback */
a.mv-btn-loading-disabled, .mv-btn-loading-disabled{pointer-events:none!important;opacity:.72!important;cursor:wait!important;}
.mv-btn-loading-disabled .spinner-border{vertical-align:-.125em;}

/* =========================================================
   FAST LOADING EFFECT OVERRIDE
   Keeps the site fast between pages: no heavy blur, no blocking taps.
   ========================================================= */
.mv-fast-overlay,
.mv-global-overlay{
  background:rgba(15,23,42,.16) !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
  transition:opacity .08s linear !important;
  pointer-events:none !important;
}
.mv-global-loader{
  width:min(280px,86vw) !important;
  padding:16px 18px !important;
  border-radius:16px !important;
  box-shadow:0 10px 34px rgba(15,23,42,.18) !important;
  transform:none !important;
  transition:none !important;
}
.mv-spinner-ring{
  width:32px !important;
  height:32px !important;
  border-width:3px !important;
  margin-bottom:8px !important;
  animation:mvSpin .55s linear infinite !important;
}
.mv-global-loader h4{font-size:15px!important;margin-bottom:2px!important;}
.mv-global-loader p{font-size:12px!important;}
a.mv-btn-loading-disabled.mv-no-freeze{pointer-events:auto!important;opacity:1!important;}
.mv-btn-loading-disabled{transition:none!important;}


/* =====================================================
   SHOP/HOME FIXED SEARCH + CHANGE LOCATION VISIBILITY
===================================================== */
body.market-page .mv-floating-search{
  top:var(--mv-floating-search-top,0px) !important;
  z-index:2147482400 !important;
}
body.market-page.mv-header-visible .mv-floating-search{
  top:var(--mv-header-height,72px) !important;
}
body.market-page .mv-selected-location [data-mv-open-location],
body.market-page button[data-mv-open-location]{
  cursor:pointer !important;
}
body.market-page .mv-location-modal.is-open,
body.market-page #mvLocationModal.is-open{
  position:fixed !important;
  inset:0 !important;
  z-index:2147483647 !important;
}
@media(max-width:767px){
  body.market-page{padding-top:var(--mv-floating-search-space,82px) !important;}
  body.market-page .mv-floating-search{top:var(--mv-floating-search-top,0px) !important;}
  body.market-page.mv-header-visible .mv-floating-search{top:var(--mv-header-height,64px) !important;}
}

/* =====================================================
   PROFESSIONAL LOCATION PICKER FLOW
   - Region first / saved region / device location / Other option
===================================================== */
.mv-location-quick-actions{
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:10px !important;
  margin:2px 0 4px !important;
}
.mv-location-chip{
  border:1px solid #dbeafe !important;
  background:linear-gradient(135deg,#eff6ff,#fff) !important;
  color:#1e40af !important;
  border-radius:14px !important;
  padding:11px 12px !important;
  font-weight:900 !important;
  cursor:pointer !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:8px !important;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease !important;
}
.mv-location-chip:hover{transform:translateY(-1px) !important;box-shadow:0 12px 28px rgba(37,99,235,.12) !important;border-color:#93c5fd !important;}
.mv-location-status{
  display:none !important;
  padding:11px 13px !important;
  border-radius:14px !important;
  font-weight:800 !important;
  line-height:1.35 !important;
  animation:mvLocationNotice .22s ease both !important;
}
.mv-location-status:not(:empty){display:block !important;}
.mv-location-status.is-ok{background:#ecfdf5 !important;color:#065f46 !important;border:1px solid #a7f3d0 !important;}
.mv-location-status.is-warn{background:#fff7ed !important;color:#9a3412 !important;border:1px solid #fed7aa !important;}
.mv-location-status.is-info{background:#eff6ff !important;color:#1e3a8a !important;border:1px solid #bfdbfe !important;}
.mv-location-form select option[value="Other"]{font-weight:900 !important;color:#b45309 !important;}
@keyframes mvLocationNotice{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:640px){
  .mv-location-quick-actions{grid-template-columns:1fr !important;}
  .mv-location-card{border-radius:22px !important;}
}

/* =====================================================
   TWO-STEP LOCATION MODAL: REGION FIRST, AREA LIST NEXT
===================================================== */
.mv-location-step{display:none !important;animation:mvLocationStepIn .22s ease both !important;}
.mv-location-step.is-active{display:block !important;}
.mv-location-step-card .mv-location-form{gap:14px !important;}
.mv-location-progress{display:grid !important;grid-template-columns:1fr 1fr !important;gap:8px !important;margin-bottom:2px !important;}
.mv-location-progress span{padding:10px 12px !important;border-radius:999px !important;background:#f1f5f9 !important;color:#64748b !important;font-weight:950 !important;text-align:center !important;font-size:.88rem !important;}
.mv-location-progress span.is-active{background:linear-gradient(135deg,#b00020,#e91e63) !important;color:#fff !important;box-shadow:0 10px 25px rgba(176,0,32,.2) !important;}
.mv-region-grid,.mv-area-grid{display:grid !important;grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:10px !important;max-height:310px !important;overflow:auto !important;padding:2px 3px 8px !important;}
.mv-location-card-choice{border:1px solid #e2e8f0 !important;background:#fff !important;border-radius:16px !important;padding:13px 12px !important;text-align:left !important;font-weight:950 !important;color:#0f172a !important;display:flex !important;align-items:center !important;justify-content:space-between !important;gap:8px !important;cursor:pointer !important;box-shadow:0 8px 18px rgba(15,23,42,.05) !important;transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease,background .16s ease !important;}
.mv-location-card-choice:hover{transform:translateY(-1px) !important;border-color:#f43f5e !important;box-shadow:0 12px 30px rgba(244,63,94,.12) !important;}
.mv-location-card-choice.is-selected{background:linear-gradient(135deg,#fff1f2,#fff) !important;border-color:#be123c !important;color:#9f1239 !important;box-shadow:0 12px 30px rgba(190,18,60,.15) !important;}
.mv-location-card-choice.is-other{background:#fff7ed !important;border-color:#fed7aa !important;color:#9a3412 !important;}
.mv-empty-area{grid-column:1/-1 !important;background:#f8fafc !important;border:1px dashed #cbd5e1 !important;border-radius:16px !important;padding:18px !important;text-align:center !important;font-weight:900 !important;color:#64748b !important;}
.mv-location-next,.mv-location-back{width:100% !important;border:0 !important;border-radius:16px !important;padding:13px 15px !important;font-weight:950 !important;cursor:pointer !important;margin-top:12px !important;display:flex !important;align-items:center !important;justify-content:center !important;gap:8px !important;}
.mv-location-next{background:linear-gradient(135deg,#b00020,#e91e63) !important;color:#fff !important;box-shadow:0 14px 30px rgba(176,0,32,.22) !important;}
.mv-location-back{background:#eef2ff !important;color:#3730a3 !important;margin-bottom:10px !important;}
@keyframes mvLocationStepIn{from{opacity:0;transform:translateX(12px)}to{opacity:1;transform:translateX(0)}}
@media(max-width:640px){.mv-region-grid,.mv-area-grid{grid-template-columns:1fr !important;max-height:48vh !important;}.mv-location-progress span{font-size:.8rem !important;padding:9px 8px !important;}}

/* Auto-first location modal simplification */
.mv-location-primary-actions{display:grid;gap:12px;margin:10px 0 14px}
.mv-location-auto-btn{width:100%;border:0;border-radius:20px;padding:18px 16px;background:linear-gradient(135deg,#16a34a,#22c55e);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;box-shadow:0 14px 35px rgba(22,163,74,.28);font-weight:900}
.mv-location-auto-btn i{font-size:30px}
.mv-location-auto-btn span{font-size:18px}
.mv-location-auto-btn small{font-weight:600;opacity:.92}
.mv-location-manual-fold{border:1px solid #e5e7eb;border-radius:16px;background:#fff;overflow:hidden;margin-top:10px}
.mv-location-manual-fold summary{cursor:pointer;list-style:none;padding:13px 15px;font-weight:800;color:#334155;background:#f8fafc;display:flex;gap:8px;align-items:center}
.mv-location-manual-fold summary::-webkit-details-marker{display:none}
.mv-location-manual-fold[open] summary{border-bottom:1px solid #e5e7eb}
.mv-location-manual-fold .mv-location-quick-actions,.mv-location-manual-fold label,.mv-location-manual-fold .mv-region-grid{margin-left:12px;margin-right:12px}
.mv-location-close[data-mv-default-location]{opacity:1!important;cursor:pointer!important}

/* PWA install and push UI */
.mv-pwa-install,.mv-pwa-push-btn{position:fixed;right:18px;bottom:92px;z-index:2147483200;border:0;border-radius:999px;padding:10px 14px;display:inline-flex;align-items:center;gap:8px;background:#0ea5e9;color:#fff;font-weight:900;box-shadow:0 16px 38px rgba(14,165,233,.34);cursor:pointer}.mv-pwa-install b{background:rgba(255,255,255,.22);border-radius:50%;width:24px;height:24px;display:grid;place-items:center}.mv-pwa-push-btn{bottom:145px;background:#111827}.mv-pwa-toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%) translateY(20px);background:#111827;color:#fff;padding:12px 16px;border-radius:14px;box-shadow:0 18px 45px rgba(0,0,0,.2);z-index:2147483600;opacity:0;pointer-events:none;transition:.22s ease;font-weight:800;max-width:92vw;text-align:center}.mv-pwa-toast.show{opacity:1;transform:translateX(-50%) translateY(0)}.mv-pwa-toast.success{background:#15803d}.mv-pwa-toast.error{background:#b91c1c}.mv-pwa-toast.info{background:#0369a1}@media(max-width:640px){.mv-pwa-install,.mv-pwa-push-btn{right:12px;padding:9px 12px;font-size:.88rem}.mv-pwa-install{bottom:86px}.mv-pwa-push-btn{bottom:138px}}

/* Fast location UX update: GPS loading freeze + permission fallback clarity */
.mv-location-auto-btn.is-loading{position:relative!important;pointer-events:none!important;opacity:.92!important;filter:saturate(1.05)!important;}
.mv-location-auto-btn.is-loading:after{content:"";width:34px;height:34px;border-radius:999px;border:4px solid rgba(255,255,255,.45);border-top-color:#fff;animation:mvLocationSpin .75s linear infinite;margin-top:8px;}
.mv-location-auto-btn.is-loading i{animation:mvLocationPulse .9s ease-in-out infinite;}
@keyframes mvLocationSpin{to{transform:rotate(360deg)}}
@keyframes mvLocationPulse{50%{transform:scale(1.12);opacity:.75}}

/* =====================================================
   OB UPDATE: Keep floating quick buttons above mobile nav
   - Prevents lower yellow quick-action button from being covered
   - Applies to vendor/admin floating actions on small screens
===================================================== */
@media (max-width: 760px){
  .mv-floating-actions{
    right: 14px !important;
    bottom: calc(155px + env(safe-area-inset-bottom, 0px)) !important;
    z-index: 2147481200 !important;
  }
  .mv-floating-actions a{
    width: 48px !important;
    height: 48px !important;
    border-radius: 16px !important;
  }
  .mv-login-bottom-nav{
    z-index: 2147481000 !important;
  }
}
@media (max-width: 420px){
  .mv-floating-actions{
    bottom: calc(168px + env(safe-area-inset-bottom, 0px)) !important;
  }
}

/* Global submit loading feedback */
button.is-mv-submitting,
.btn.is-mv-submitting,
input[type="submit"].is-mv-submitting{
  pointer-events:none !important;
  opacity:.82 !important;
  position:relative;
}
button.is-mv-submitting::after,
.btn.is-mv-submitting::after,
input[type="submit"].is-mv-submitting::after{
  content:"";
  display:inline-block;
  width:1em;
  height:1em;
  margin-left:.55rem;
  vertical-align:-.16em;
  border:.16em solid currentColor;
  border-right-color:transparent;
  border-radius:999px;
  animation:mvSubmitSpin .65s linear infinite;
}
@keyframes mvSubmitSpin{to{transform:rotate(360deg)}}


/* OB: Product card text appearance defaults controlled by Admin > Settings > Homepage Display */
.catalog-title, .seller-card-title, .mv-card-title, .product-card-title, .product-title {
  color: var(--mv-card-title-color, #111111) !important;
  font-weight: var(--mv-card-title-weight, 800) !important;
  font-size: var(--mv-card-title-size, 1rem);
  line-height: 1.25;
  display: -webkit-box;
  -webkit-line-clamp: var(--mv-card-title-lines, 2);
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  text-decoration: none;
}
.catalog-desc, .seller-card-desc, .mv-card-desc, .product-card-desc, .product-description {
  color: var(--mv-card-desc-color, #557083) !important;
  font-size: var(--mv-card-desc-size, .88rem);
  line-height: 1.25;
  display: -webkit-box;
  -webkit-line-clamp: var(--mv-card-desc-lines, 2);
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}
