/**
 * platform-bem.css — Mega / Platzona design shell (BEM)
 * - Self-hosted only; no CDN or external SaaS.
 * - Uses CSS custom properties for tokens; BEM naming: Block__element--modifier
 * - Loads after theme CSS; focuses on polish, accessibility, and responsive stability.
 */

/* ===== Design tokens (Block: mega-tokens via :root) ===== */
:root {
  --mega-font-sans: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --mega-font-mono: ui-monospace, "Cascadia Code", "Segoe UI Mono", Consolas, monospace;
  --mega-radius-sm: 6px;
  --mega-radius-md: 10px;
  --mega-radius-lg: 16px;
  --mega-space-1: 0.25rem;
  --mega-space-2: 0.5rem;
  --mega-space-3: 0.75rem;
  --mega-space-4: 1rem;
  --mega-space-5: 1.5rem;
  --mega-space-6: 2rem;
  --mega-shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.06);
  --mega-shadow-md: 0 8px 24px rgba(15, 23, 42, 0.08);
  --mega-shadow-lg: 0 20px 48px rgba(15, 23, 42, 0.12);
  --mega-color-text: #0f172a;
  --mega-color-text-muted: #475569;
  --mega-color-border: rgba(15, 23, 42, 0.08);
  --mega-color-surface: #ffffff;
  --mega-color-primary: #1d4ed8;
  --mega-color-primary-hover: #1e40af;
  --mega-color-focus-ring: rgba(29, 78, 216, 0.35);
  --mega-header-bg: rgba(255, 255, 255, 0.92);
  --mega-footer-gap: clamp(2rem, 5vw, 4rem);
  --mega-transition-fast: 160ms ease;
}

/* ===== Block: mega-store (customer / shopfront body) ===== */
.mega-store {
  font-family: var(--mega-font-sans);
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

.mega-store :where(.container, .container-fluid) {
  padding-left: clamp(var(--mega-space-3), 3vw, var(--mega-space-5));
  padding-right: clamp(var(--mega-space-3), 3vw, var(--mega-space-5));
}

/* Focus visibility (keyboard) */
.mega-store :where(a, button, input, select, textarea, summary):focus-visible {
  outline: 3px solid var(--mega-color-focus-ring);
  outline-offset: 2px;
}

/* Header: modern sticky feel without breaking theme colors */
.mega-store .fixed_header {
  backdrop-filter: saturate(140%) blur(10px);
  -webkit-backdrop-filter: saturate(140%) blur(10px);
  box-shadow: var(--mega-shadow-sm);
  transition: box-shadow var(--mega-transition-fast);
}

.mega-store .saf_header_wrapper .saf_header_info_wrapper select.form-control {
  border-radius: var(--mega-radius-sm);
  min-height: 2.25rem;
}

/* Main typography rhythm */
.mega-store .layout-page__main :where(h1, h2, h3, .saf_section_title h2) {
  letter-spacing: -0.02em;
  line-height: 1.2;
}

.mega-store .saf_pagetitle .page_title h2 {
  font-weight: 600;
}

/* Breadcrumb as BEM-style bar */
.mega-store .saf_pagetitle ul.breadcrumb {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--mega-space-2);
  list-style: none;
  padding: 0;
  margin: var(--mega-space-3) 0 0;
}

/* Footer spacing */
.mega-store footer .saf_footer_wrapper {
  padding-top: var(--mega-footer-gap);
  padding-bottom: var(--mega-footer-gap);
}

.mega-store footer .saf_widgets {
  border-radius: var(--mega-radius-md);
}

.mega-store .saf_copyright_wrapper {
  padding-top: var(--mega-space-4);
  padding-bottom: var(--mega-space-4);
}

/* Minicart / buttons: compact modern pills */
.mega-store .btn-minicart-compact,
.mega-store .cart-hover .select-button .btn {
  border-radius: var(--mega-radius-sm);
  font-weight: 600;
  transition: transform var(--mega-transition-fast), box-shadow var(--mega-transition-fast);
}

.mega-store .btn-minicart-compact:hover,
.mega-store .cart-hover .select-button .btn:hover {
  transform: translateY(-1px);
  box-shadow: var(--mega-shadow-sm);
}

/* Search overlay */
.mega-store .searchBox {
  backdrop-filter: blur(6px);
}

/* Scroll to top */
.mega-store .scroll-to-top {
  border-radius: var(--mega-radius-md);
  box-shadow: var(--mega-shadow-md);
}

/* ===== Block: mega-commerce (PLP, PDP shell, cart) ===== */
.mega-store .mega-commerce__shell {
  padding-top: var(--mega-space-5);
  padding-bottom: clamp(2rem, 6vw, 4rem);
}

.mega-store .mega-commerce__breadcrumb.breacrumb-section,
.mega-store .mega-commerce__breadcrumb#innerbanner {
  border-bottom: 1px solid var(--mega-color-border);
}

.mega-store .mega-commerce__breadcrumb .breadcrumb-text {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: var(--mega-space-2);
}

.mega-store .mega-commerce__breadcrumb h3 {
  font-weight: 600;
  letter-spacing: -0.02em;
}

/* PLP product cards */
.mega-store .mega-commerce__card {
  height: 100%;
  border-radius: var(--mega-radius-md);
  border: 1px solid var(--mega-color-border);
  box-shadow: var(--mega-shadow-sm);
  background: var(--mega-color-surface);
  overflow: hidden;
  transition: box-shadow var(--mega-transition-fast), transform var(--mega-transition-fast);
}

.mega-store .mega-commerce__card:hover {
  box-shadow: var(--mega-shadow-md);
  transform: translateY(-2px);
}

.mega-store .mega-commerce__card .pi-pic {
  overflow: hidden;
}

.mega-store .mega-commerce__card .pi-pic img {
  transition: transform 240ms ease;
}

.mega-store .mega-commerce__card:hover .pi-pic img {
  transform: scale(1.03);
}

.mega-store .mega-commerce--listing .filter-widget {
  border-radius: var(--mega-radius-md);
  border: 1px solid var(--mega-color-border);
  padding: var(--mega-space-4);
  margin-bottom: var(--mega-space-4);
  background: var(--mega-color-surface);
  box-shadow: var(--mega-shadow-sm);
}

.mega-store .mega-commerce--listing .product-show-option {
  border-radius: var(--mega-radius-md);
  padding: var(--mega-space-3) var(--mega-space-4);
  margin-bottom: var(--mega-space-4);
  border: 1px solid var(--mega-color-border);
  background: var(--mega-color-surface);
}

.mega-store .mega-commerce--listing .product-list {
  margin-bottom: var(--mega-space-5);
}

.mega-store .mega-commerce--listing .page-set .pagination > li > a,
.mega-store .mega-commerce--listing .page-set .pagination > li > span {
  border-radius: var(--mega-radius-sm);
  margin: 0 2px;
}

/* ===== Block: mega-pdp (product detail) ===== */
.mega-store .mega-pdp {
  align-items: flex-start;
}

.mega-store .mega-pdp__gallery .product-pic-zoom {
  border-radius: var(--mega-radius-md);
  overflow: hidden;
}

.mega-store .mega-pdp__gallery .product-big-img {
  border-radius: var(--mega-radius-md);
}

@media (min-width: 992px) {
  .mega-store .mega-pdp__gallery {
    position: sticky;
    top: clamp(100px, 18vh, 160px);
  }
}

.mega-store .mega-pdp__info .product-details__panel {
  border-radius: var(--mega-radius-md);
  border: 1px solid var(--mega-color-border);
  padding: clamp(var(--mega-space-4), 3vw, var(--mega-space-6));
  box-shadow: var(--mega-shadow-sm);
  background: var(--mega-color-surface);
}

.mega-store .mega-pdp__info .pd-title h3 {
  font-weight: 600;
  letter-spacing: -0.02em;
}

.mega-store .mega-pdp__info .pd-desc h4 {
  font-weight: 700;
  font-size: clamp(1.25rem, 3vw, 1.5rem);
}

.mega-store .mega-pdp__info .layout1-product-color-label {
  border-radius: var(--mega-radius-sm);
}

/* ===== Block: mega-commerce--cart ===== */
.mega-store .mega-commerce--cart #listingmidmain {
  padding-bottom: var(--mega-space-6);
}

.mega-store .mega-commerce__table-wrap table {
  border-collapse: separate;
  border-spacing: 0;
  width: 100%;
}

.mega-store .mega-commerce__table-wrap thead th {
  background: rgba(15, 23, 42, 0.04);
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-weight: 600;
  padding: var(--mega-space-3);
  border-bottom: 1px solid var(--mega-color-border);
}

.mega-store .mega-commerce__table-wrap tbody td {
  padding: var(--mega-space-4) var(--mega-space-3);
  vertical-align: middle;
  border-bottom: 1px solid var(--mega-color-border);
}

.mega-store .mega-commerce--cart .cart__image {
  border-radius: var(--mega-radius-sm);
}

.mega-store .mega-commerce .alert {
  border-radius: var(--mega-radius-md);
  border-width: 1px;
}

/* ===== Block: mega-commerce--checkout (multi-step checkout) ===== */
.mega-store .mega-commerce--checkout .mega-commerce__checkout-shell,
.mega-store .mega-commerce--checkout section.checkout-section,
.mega-store .mega-commerce--checkout section.shopping-cart {
  padding-bottom: clamp(2rem, 6vw, 4rem);
}

.mega-store .mega-commerce--checkout .checkout-section h4,
.mega-store .mega-commerce--checkout .place-order h4 {
  font-weight: 600;
  letter-spacing: -0.02em;
  margin-bottom: var(--mega-space-4);
}

.mega-store .mega-commerce--checkout .checkout-form label {
  font-weight: 500;
  margin-bottom: var(--mega-space-2);
}

.mega-store .mega-commerce--checkout .checkout-form input[type="text"],
.mega-store .mega-commerce--checkout .checkout-form input[type="email"],
.mega-store .mega-commerce--checkout .checkout-form input[type="tel"],
.mega-store .mega-commerce--checkout .checkout-form input[type="number"],
.mega-store .mega-commerce--checkout .checkout-form input[type="password"],
.mega-store .mega-commerce--checkout .checkout-form select,
.mega-store .mega-commerce--checkout .checkout-form textarea {
  border-radius: var(--mega-radius-sm);
  border: 1px solid var(--mega-color-border);
  min-height: 2.75rem;
  padding: var(--mega-space-2) var(--mega-space-3);
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  transition: border-color var(--mega-transition-fast), box-shadow var(--mega-transition-fast);
}

.mega-store .mega-commerce--checkout .checkout-form input:focus,
.mega-store .mega-commerce--checkout .checkout-form select:focus,
.mega-store .mega-commerce--checkout .checkout-form textarea:focus {
  border-color: rgba(29, 78, 216, 0.45);
  box-shadow: 0 0 0 3px var(--mega-color-focus-ring);
  outline: none;
}

.mega-store .mega-commerce--checkout .place-order,
.mega-store .mega-commerce--checkout .checkout-content {
  border-radius: var(--mega-radius-md);
  border: 1px solid var(--mega-color-border);
  box-shadow: var(--mega-shadow-sm);
  background: var(--mega-color-surface);
  padding: var(--mega-space-5);
}

.mega-store .mega-commerce--checkout .site-btn,
.mega-store .mega-commerce--checkout .place-btn,
.mega-store .mega-commerce--checkout .content-btn {
  border-radius: var(--mega-radius-sm);
  font-weight: 600;
  transition: transform var(--mega-transition-fast), box-shadow var(--mega-transition-fast);
}

.mega-store .mega-commerce--checkout .order-btn .site-btn:hover,
.mega-store .mega-commerce--checkout .order-btn .place-btn:hover {
  transform: translateY(-1px);
  box-shadow: var(--mega-shadow-sm);
}

.mega-store .mega-commerce--checkout .payment-method-label {
  border-radius: var(--mega-radius-sm);
  padding: var(--mega-space-3) var(--mega-space-4);
  border: 1px solid var(--mega-color-border);
  display: block;
  margin-bottom: var(--mega-space-3);
  cursor: pointer;
  background: var(--mega-color-surface);
}

.mega-store .mega-commerce--checkout .payment-method-radio:checked + .payment-method-label,
.mega-store .mega-commerce--checkout .payment-method-label:hover {
  border-color: rgba(29, 78, 216, 0.35);
  background: rgba(29, 78, 216, 0.04);
}

.mega-store .mega-commerce--checkout .cart-table {
  border-radius: var(--mega-radius-md);
  overflow: hidden;
  border: 1px solid var(--mega-color-border);
  box-shadow: var(--mega-shadow-sm);
  background: var(--mega-color-surface);
}

.mega-store .mega-commerce--checkout .cart-table table {
  border-collapse: collapse;
  width: 100%;
  margin: 0;
}

.mega-store .mega-commerce--checkout .cart-table thead th {
  background: rgba(15, 23, 42, 0.04);
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-weight: 600;
  padding: var(--mega-space-3);
  border-bottom: 1px solid var(--mega-color-border);
}

.mega-store .mega-commerce--checkout .cart-table tbody td {
  padding: var(--mega-space-4) var(--mega-space-3);
  vertical-align: middle;
  border-bottom: 1px solid var(--mega-color-border);
}

.mega-store .mega-commerce--checkout .cart-thumb-img {
  border-radius: var(--mega-radius-sm);
}

.mega-store .mega-commerce--checkout .checkout-status-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 4rem;
  height: 4rem;
  border-radius: 50%;
  font-size: 1.75rem;
  margin-bottom: var(--mega-space-4);
  text-decoration: none;
  box-sizing: border-box;
}

.mega-store .mega-commerce--checkout .checkout-status-icon--success {
  background: rgba(22, 163, 74, 0.15);
  color: #15803d;
}

.mega-store .mega-commerce--checkout .checkout-status-icon--error {
  background: rgba(220, 38, 38, 0.12);
  color: #b91c1c;
}

.mega-store .mega-commerce--checkout .checkout-status-title {
  font-weight: 600;
  letter-spacing: -0.02em;
}

.mega-store .mega-commerce--checkout .mega-commerce__minicart .order-table {
  border-radius: var(--mega-radius-sm);
}

.mega-store .mega-commerce--checkout .mega-commerce__minicart .order-table li {
  padding: var(--mega-space-2) 0;
}

.mega-store .mega-commerce--checkout .alert {
  border-radius: var(--mega-radius-md);
}

/* ===== Block: mega-commerce--account (auth + customer dashboard) ===== */
.mega-store .mega-commerce--account .user-auth-page__breadcrumb,
.mega-store .mega-commerce--account .breacrumb-section.mega-commerce__breadcrumb,
.mega-store .mega-commerce--account .mega-commerce__breadcrumb,
.mega-store .mega-commerce--account ul.breadcrumb.mega-commerce__breadcrumb {
  border-radius: 0;
}

.mega-store .mega-commerce--account .user-auth__card,
.mega-store .mega-commerce--account .user-auth__inner {
  border-radius: var(--mega-radius-md);
  border: 1px solid var(--mega-color-border);
  background: var(--mega-color-surface);
  box-shadow: var(--mega-shadow-sm);
}

.mega-store .mega-commerce--account .user-auth__label {
  font-weight: 500;
  color: var(--mega-color-text);
}

.mega-store .mega-commerce--account .user-auth__input,
.mega-store .mega-commerce--account .user-auth__form .form-control {
  border-radius: var(--mega-radius-sm);
  border: 1px solid var(--mega-color-border);
}

.mega-store .mega-commerce--account .user-auth__input:focus,
.mega-store .mega-commerce--account .user-auth__form .form-control:focus {
  border-color: var(--mega-color-primary);
  box-shadow: 0 0 0 3px var(--mega-color-focus-ring);
}

.mega-store .mega-commerce--account .user-auth__alert,
.mega-store .mega-commerce--account .user-panel__alert {
  border-radius: var(--mega-radius-md);
}

.mega-store .mega-commerce--account .user-auth__submit,
.mega-store .mega-commerce--account .user-panel__submit,
.mega-store .mega-commerce--account .primary-btn.user-panel__submit {
  border-radius: var(--mega-radius-sm);
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

@media (prefers-reduced-motion: reduce) {
  .mega-store .mega-commerce--account .user-auth__submit,
  .mega-store .mega-commerce--account .user-panel__submit,
  .mega-store .mega-commerce--account .primary-btn.user-panel__submit {
    transition: none;
  }
}

.mega-store .mega-commerce--account.mega-commerce__account-shell .user-panel,
.mega-store .mega-commerce--account .user-panel {
  border-radius: var(--mega-radius-md);
  border: 1px solid var(--mega-color-border);
  background: var(--mega-color-surface);
  box-shadow: var(--mega-shadow-sm);
  padding: var(--mega-space-4) var(--mega-space-5);
}

.mega-store .mega-commerce--account .user-panel__heading {
  font-weight: 600;
  letter-spacing: -0.02em;
}

.mega-store .mega-commerce--account .user-panel__rule {
  border-color: var(--mega-color-border);
}

.mega-store .mega-commerce--account .table-responsive {
  border-radius: var(--mega-radius-md);
  border: 1px solid var(--mega-color-border);
  overflow: hidden;
  background: var(--mega-color-surface);
}

.mega-store .mega-commerce--account .table thead th {
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--mega-color-text-muted);
}

/* ===== Block: mega-commerce--cms (contact, blog, FAQ, static / legal pages) ===== */
.mega-store .mega-commerce--cms .breacrumb-section.mega-commerce__breadcrumb,
.mega-store .mega-commerce--cms .mega-commerce__breadcrumb {
  border-radius: 0;
}

.mega-store .mega-commerce--cms .saf_form_field,
.mega-store .mega-commerce--cms .form-control {
  border-radius: var(--mega-radius-sm);
  border: 1px solid var(--mega-color-border);
}

.mega-store .mega-commerce--cms .saf_form_field:focus,
.mega-store .mega-commerce--cms .form-control:focus {
  border-color: var(--mega-color-primary);
  box-shadow: 0 0 0 3px var(--mega-color-focus-ring);
}

.mega-store .mega-commerce--cms .panel {
  border-radius: var(--mega-radius-md);
  border: 1px solid var(--mega-color-border);
  box-shadow: var(--mega-shadow-sm);
}

.mega-store .mega-commerce--cms .panel-heading .panel-title {
  font-weight: 600;
}

.mega-store .mega-commerce--cms .blog-section .list-group-item,
.mega-store .mega-commerce--cms .blog-details .list-group-item {
  border-radius: var(--mega-radius-sm);
}

.mega-store .mega-commerce--cms #contentpagehere :where(h1, h2, h3, h4) {
  font-weight: 600;
  letter-spacing: -0.02em;
  margin-top: var(--mega-space-5);
}

.mega-store .mega-commerce--cms .rte :where(h1, h2, h3, h4) {
  font-weight: 600;
  letter-spacing: -0.02em;
  margin-top: var(--mega-space-4);
}

.mega-store .mega-commerce--cms .section-header h1 {
  font-weight: 600;
  letter-spacing: -0.02em;
}

.mega-store .mega-commerce--cms .saf_btn.submitForm,
.mega-store .mega-commerce--cms .contact-form__captcha-btn {
  border-radius: var(--mega-radius-sm);
}

/* ===== Block: mega-commerce--home (layout1 home dashboard) ===== */
.mega-store .mega-commerce--home .saf_products_wrapper .section-title h2,
.mega-store .mega-commerce--home .saf_about_title {
  font-weight: 600;
  letter-spacing: -0.02em;
}

/* Block: mega-util (optional helpers for new markup) */
.mega-util__stack {
  display: flex;
  flex-direction: column;
  gap: var(--mega-space-4);
}

.mega-util__visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* mega-admin-ui--crud: wrapped in superadmin adminlayout; --products: shop + product subviews */
.mega-admin .mega-admin-ui--crud .page-titles,
.mega-admin .mega-admin-ui--products .page-titles {
  margin-bottom: var(--mega-space-4);
}

.mega-admin .mega-admin-ui--crud .page-titles h3,
.mega-admin .mega-admin-ui--products .page-titles h3 {
  font-weight: 600;
  letter-spacing: -0.02em;
}

.mega-admin .mega-admin-ui--crud .table-responsive,
.mega-admin .mega-admin-ui--products .table-responsive {
  border-radius: var(--mega-radius-md);
  border: 1px solid var(--mega-color-border);
  overflow: hidden;
  background: var(--mega-color-surface);
}

.mega-admin .mega-admin-ui--crud .pagination > li > a,
.mega-admin .mega-admin-ui--crud .pagination > li > span,
.mega-admin .mega-admin-ui--products .pagination > li > a,
.mega-admin .mega-admin-ui--products .pagination > li > span {
  border-radius: var(--mega-radius-sm);
  margin: 0 2px;
}

.mega-admin .mega-admin-ui--crud .admin-img-preview,
.mega-admin .mega-admin-ui--products .admin-img-preview {
  border-radius: var(--mega-radius-sm);
}

/* Superadmin platform: cards / tables / forms inside module shell */
.mega-admin.mega-admin--platform .mega-admin-ui--crud .card,
.mega-admin.mega-admin--platform .mega-admin-ui--products .card {
  border-radius: var(--mega-radius-md);
  border: 1px solid var(--mega-color-border);
  box-shadow: var(--mega-shadow-sm);
}

.mega-admin.mega-admin--platform .mega-admin-ui--crud .card-header,
.mega-admin.mega-admin--platform .mega-admin-ui--products .card-header {
  border-bottom: 1px solid var(--mega-color-border);
  font-weight: 600;
}

.mega-admin.mega-admin--platform .mega-admin-ui--crud .table thead th,
.mega-admin.mega-admin--platform .mega-admin-ui--products .table thead th {
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--mega-color-text-muted);
  border-bottom-width: 1px;
}

.mega-admin.mega-admin--platform .mega-admin-ui--crud .table tbody tr:hover,
.mega-admin.mega-admin--platform .mega-admin-ui--products .table tbody tr:hover {
  background-color: rgba(29, 78, 216, 0.04);
}

.mega-admin.mega-admin--platform .mega-admin-ui--crud .form-control,
.mega-admin.mega-admin--platform .mega-admin-ui--products .form-control {
  border-radius: var(--mega-radius-sm);
}

.mega-admin.mega-admin--platform .mega-admin-ui--crud .btn-primary,
.mega-admin.mega-admin--platform .mega-admin-ui--products .btn-primary {
  border-radius: var(--mega-radius-sm);
  font-weight: 600;
}

.mega-admin.mega-admin--platform .mega-admin-ui--crud .box,
.mega-admin.mega-admin--platform .mega-admin-ui--products .box {
  border-radius: var(--mega-radius-md);
  border: 1px solid var(--mega-color-border);
  box-shadow: var(--mega-shadow-sm);
}

.mega-admin.mega-admin--platform .mega-admin-ui--crud .box.box-body,
.mega-admin.mega-admin--platform .mega-admin-ui--products .box.box-body {
  background: var(--mega-color-surface);
}

/* ===== Block: mega-admin (shop admin + superadmin shell) ===== */
.mega-admin {
  font-family: var(--mega-font-sans);
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

.mega-admin :where(a, button, input, select, textarea, summary):focus-visible {
  outline: 3px solid var(--mega-color-focus-ring);
  outline-offset: 2px;
}

/* --- AdminLTE (shop admin layout1) --- */
.mega-admin.mega-admin--shop .wrapper,
.mega-admin.mega-admin--shop .content-wrapper {
  background: linear-gradient(180deg, #f1f5f9 0%, #f8fafc 48%, #f1f5f9 100%);
}

.mega-admin.mega-admin--shop .main-header {
  box-shadow: var(--mega-shadow-sm);
  border-bottom: 1px solid var(--mega-color-border);
}

.mega-admin.mega-admin--shop .main-sidebar {
  box-shadow: 2px 0 16px rgba(15, 23, 42, 0.06);
}

.mega-admin.mega-admin--shop .content-header h1 {
  font-weight: 600;
  letter-spacing: -0.02em;
}

.mega-admin.mega-admin--shop .card {
  border-radius: var(--mega-radius-md);
  border: 1px solid var(--mega-color-border);
  box-shadow: var(--mega-shadow-sm);
}

.mega-admin.mega-admin--shop .card-header {
  border-bottom: 1px solid var(--mega-color-border);
  font-weight: 600;
}

.mega-admin.mega-admin--shop .table thead th {
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--mega-color-text-muted);
  border-bottom-width: 1px;
}

.mega-admin.mega-admin--shop .table tbody tr:hover {
  background-color: rgba(29, 78, 216, 0.04);
}

.mega-admin.mega-admin--shop .btn-primary {
  border-radius: var(--mega-radius-sm);
  font-weight: 600;
}

.mega-admin.mega-admin--shop .form-control {
  border-radius: var(--mega-radius-sm);
}

/* --- Legacy shop admin (Bootstrap 3 style wrapper) --- */
.mega-admin.mega-admin--legacy #page-wrapper {
  padding-bottom: var(--mega-space-6);
}

.mega-admin.mega-admin--legacy .navbar.admin-navbar {
  box-shadow: var(--mega-shadow-sm);
  border: 0;
  background: var(--mega-color-surface);
}

.mega-admin.mega-admin--legacy .sidebar {
  background: #1e293b;
}

.mega-admin.mega-admin--legacy .sidebar .nav > li > a {
  border-radius: var(--mega-radius-sm);
  margin: 2px var(--mega-space-2);
  transition: background var(--mega-transition-fast);
}

.mega-admin.mega-admin--legacy .sidebar .nav > li.active > a,
.mega-admin.mega-admin--legacy .sidebar .nav > li > a:hover {
  background: rgba(255, 255, 255, 0.12);
}

/* --- Superadmin platform (same legacy navbar pattern) --- */
.mega-admin.mega-admin--platform .navbar.admin-navbar,
.mega-admin.mega-admin--platform .mega-admin__navbar {
  box-shadow: var(--mega-shadow-sm);
  border: 0;
  background: var(--mega-color-surface);
}

.mega-admin.mega-admin--platform #page-wrapper,
.mega-admin.mega-admin--platform .mega-admin__page {
  background: linear-gradient(165deg, #f1f5f9 0%, #e8eef5 45%, #f8fafc 100%);
  min-height: 0;
  flex: 1 0 auto;
  padding-bottom: var(--mega-space-6);
}

.mega-admin.mega-admin--platform .mega-admin__wrapper {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

.mega-admin.mega-admin--platform .mega-admin__navbar.navbar {
  min-height: 56px;
  backdrop-filter: saturate(140%) blur(12px);
  -webkit-backdrop-filter: saturate(140%) blur(12px);
  border-bottom: 1px solid var(--mega-color-border) !important;
  z-index: 1030;
}

.mega-admin.mega-admin--platform .mega-admin__navbar .navbar-brand {
  padding: var(--mega-space-2) var(--mega-space-3);
}

.mega-admin.mega-admin--platform .mega-admin__navbar .navbar-top-links .img-circle {
  border: 2px solid var(--mega-color-border);
  width: 36px;
  height: 36px;
  object-fit: cover;
}

.mega-admin.mega-admin--platform .mega-admin__dropdown.dropdown-menu,
.mega-admin.mega-admin--platform .mega-admin__navbar .dropdown-menu.right-swip {
  border-radius: var(--mega-radius-md);
  border: 1px solid var(--mega-color-border);
  box-shadow: var(--mega-shadow-md);
  padding: var(--mega-space-2) 0;
}

.mega-admin.mega-admin--platform .mega-admin__navbar .dropdown-menu > li > a {
  padding: var(--mega-space-2) var(--mega-space-4);
  transition: background var(--mega-transition-fast);
}

.mega-admin.mega-admin--platform .mega-admin__navbar .dropdown-menu > li > a:hover,
.mega-admin.mega-admin--platform .mega-admin__navbar .dropdown-menu > li > a:focus {
  background: rgba(29, 78, 216, 0.08);
}

/* Sidebar (superadmin) */
.mega-admin.mega-admin--platform .mega-admin__sidebar.navbar-default.sidebar {
  background: linear-gradient(180deg, #0f172a 0%, #1e293b 100%);
  border-color: rgba(148, 163, 184, 0.12);
}

.mega-admin.mega-admin--platform .mega-admin__sidebar .sidebar-nav .nav#side-menu > li > a {
  color: #e2e8f0;
  padding: 11px 14px;
  font-weight: 500;
  font-size: 13px;
  border-radius: var(--mega-radius-sm);
  margin: 2px 8px;
}

.mega-admin.mega-admin--platform .mega-admin__sidebar .sidebar-nav .nav#side-menu > li > a i {
  margin-right: 8px;
  color: #94a3b8;
}

.mega-admin.mega-admin--platform .mega-admin__sidebar .sidebar-nav .nav#side-menu > li.active > a,
.mega-admin.mega-admin--platform .mega-admin__sidebar .sidebar-nav .nav#side-menu > li > a:hover,
.mega-admin.mega-admin--platform .mega-admin__sidebar .sidebar-nav .nav#side-menu > li > a:focus {
  background: rgba(59, 130, 246, 0.15);
  color: #fff;
  border-left: 3px solid #3b82f6;
  padding-left: 11px;
}

.mega-admin.mega-admin--platform .mega-admin__sidebar .nav-second-level {
  background: rgba(0, 0, 0, 0.2);
  border-radius: var(--mega-radius-sm);
  margin: 4px 10px 8px;
  padding: 4px 0;
}

.mega-admin.mega-admin--platform .mega-admin__sidebar .nav-second-level > li > a {
  color: #94a3b8;
  padding: 8px 12px 8px 28px;
  font-size: 12px;
}

.mega-admin.mega-admin--platform .mega-admin__sidebar .nav-second-level > li.active > a,
.mega-admin.mega-admin--platform .mega-admin__sidebar .nav-second-level > li > a:hover {
  color: #fff;
  background: transparent;
}

.mega-admin.mega-admin--platform .mega-admin__sidebar .fa.arrow {
  color: #94a3b8;
}

.mega-admin.mega-admin--platform .mega-admin__page .mega-admin-ui {
  padding: clamp(12px, 2vw, 22px) clamp(12px, 2.5vw, 28px);
  max-width: 1920px;
  margin: 0 auto;
}

.mega-admin.mega-admin--platform .mega-admin__footer.footer {
  flex-shrink: 0;
  text-align: center;
  padding: var(--mega-space-4) var(--mega-space-3);
  font-size: 0.85rem;
  color: var(--mega-color-text-muted);
  background: var(--mega-color-surface);
  border-top: 1px solid var(--mega-color-border);
}

/* Content: page heading, filters, stack (explicit BEM + all mega-admin-ui--crud pages) */
.mega-admin .mega-admin-ui__page-head.page-titles,
.mega-admin.mega-admin--platform .mega-admin-ui--crud .page-titles {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--mega-space-3);
  margin-bottom: var(--mega-space-5);
  padding: var(--mega-space-4) var(--mega-space-5);
  background: var(--mega-color-surface);
  border-radius: var(--mega-radius-md);
  border: 1px solid var(--mega-color-border);
  box-shadow: var(--mega-shadow-sm);
}

.mega-admin .mega-admin-ui__page-head .text-themecolor,
.mega-admin.mega-admin--platform .mega-admin-ui--crud .page-titles .text-themecolor {
  color: var(--mega-color-text) !important;
}

.mega-admin .mega-admin-ui__breadcrumb.breadcrumb,
.mega-admin.mega-admin--platform .mega-admin-ui--crud .page-titles .breadcrumb {
  margin: 0;
  padding: var(--mega-space-2) var(--mega-space-3);
  background: rgba(29, 78, 216, 0.06);
  border-radius: 999px;
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--mega-space-2);
  list-style: none;
  font-size: 0.9rem;
}

.mega-admin .mega-admin-ui__body.container-fluid {
  padding-left: 0;
  padding-right: 0;
}

@media (min-width: 768px) {
  .mega-admin .mega-admin-ui__body.container-fluid {
    padding-left: 12px;
    padding-right: 12px;
  }
}

.mega-admin.mega-admin--platform .mega-admin-ui--crud .page-titles + .container-fluid:not(.mega-admin-ui__body),
.mega-admin.mega-admin--platform .mega-admin-ui--crud > style + .container-fluid:not(.mega-admin-ui__body) {
  padding-left: 0;
  padding-right: 0;
}

@media (min-width: 768px) {
  .mega-admin.mega-admin--platform .mega-admin-ui--crud .page-titles + .container-fluid:not(.mega-admin-ui__body),
  .mega-admin.mega-admin--platform .mega-admin-ui--crud > style + .container-fluid:not(.mega-admin-ui__body) {
    padding-left: 12px;
    padding-right: 12px;
  }
}

.mega-admin .mega-admin-ui__stack {
  display: flex;
  flex-direction: column;
  gap: var(--mega-space-5);
}

.mega-admin .mega-admin-ui__toolbar {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: var(--mega-space-2);
}

.mega-admin .mega-admin-ui__toolbar .btn {
  margin-left: 0 !important;
}

.mega-admin.mega-admin--platform .mega-admin-ui__panel.card {
  overflow: hidden;
}

.mega-admin.mega-admin--platform .mega-admin-ui__panel--search .card-header {
  background: linear-gradient(90deg, rgba(29, 78, 216, 0.06), transparent);
}

@media (max-width: 767px) {
  .mega-admin.mega-admin--platform .mega-admin-ui__panel--search .searchform .row > [class*="col-"] {
    margin-bottom: var(--mega-space-3);
  }
}

.mega-admin.mega-admin--platform .mega-admin-ui__readiness {
  border-radius: var(--mega-radius-md);
  border: none !important;
  box-shadow: var(--mega-shadow-sm);
}

.mega-admin.mega-admin--platform .mega-admin-ui__readiness.alert-success {
  border-left: 4px solid #198754 !important;
}

.mega-admin.mega-admin--platform .mega-admin-ui__readiness.alert-danger {
  border-left: 4px solid #b02a37 !important;
}

.mega-admin.mega-admin--platform .mega-admin-ui--crud .alert:not(.mega-admin-ui__readiness):not(.ssl-platform__banner) {
  border-radius: var(--mega-radius-md);
  border: none;
  box-shadow: var(--mega-shadow-sm);
}

/* All Bootstrap modals under superadmin (incl. ssl-platform-modal, list deletes, etc.) */
.mega-admin.mega-admin--platform .modal-content {
  border: none;
  border-radius: var(--mega-radius-lg);
  box-shadow: var(--mega-shadow-lg);
  overflow: hidden;
}

.mega-admin.mega-admin--platform .modal-content .modal-header {
  background: linear-gradient(90deg, #f8fafc, #fff);
  border-bottom: 1px solid var(--mega-color-border);
  padding: var(--mega-space-4) var(--mega-space-5);
}

.mega-admin.mega-admin--platform .modal-content .modal-title,
.mega-admin.mega-admin--platform .modal-content .superadmin-modal__title {
  font-weight: 600;
  letter-spacing: -0.02em;
  font-size: 1.1rem;
}

.mega-admin.mega-admin--platform .modal-content .modal-body {
  padding: var(--mega-space-5);
}

.mega-admin.mega-admin--platform .modal-content .modal-footer {
  background: #f8fafc;
  border-top: 1px solid var(--mega-color-border);
  padding: var(--mega-space-3) var(--mega-space-5);
  display: flex;
  flex-wrap: wrap;
  gap: var(--mega-space-2);
  justify-content: flex-end;
}

.mega-admin.mega-admin--platform .modal-content .close {
  opacity: 0.55;
  text-shadow: none;
}

.mega-admin .mega-admin-ui--crud .dataTables_info {
  font-size: 0.875rem;
  color: var(--mega-color-text-muted);
  padding-top: var(--mega-space-3);
}

.mega-admin.mega-admin--platform .dashboard-stats {
  margin-bottom: var(--mega-space-5);
}

.mega-admin.mega-admin--platform .dashboard-quicklinks__card {
  border-radius: var(--mega-radius-md);
  border: 1px solid var(--mega-color-border);
  box-shadow: var(--mega-shadow-sm);
  overflow: hidden;
}

@media (max-width: 767px) {
  .mega-admin .mega-admin-ui__page-head.page-titles,
  .mega-admin.mega-admin--platform .mega-admin-ui--crud .page-titles {
    flex-direction: column;
    align-items: flex-start;
  }
  .mega-admin .mega-admin-ui__toolbar {
    justify-content: flex-start;
  }
  .mega-admin.mega-admin--platform .mega-admin__page .mega-admin-ui {
    padding: 10px;
  }
}

.mega-admin.mega-admin--platform .panel,
.mega-admin.mega-admin--platform .well {
  border-radius: var(--mega-radius-md);
  border: 1px solid var(--mega-color-border);
  box-shadow: var(--mega-shadow-sm);
}

/* ===== Block: mega-admin-login ===== */
.mega-admin.mega-admin--login {
  min-height: 100vh;
  margin: 0;
  background: radial-gradient(1200px 600px at 20% -10%, #bfdbfe 0%, transparent 55%),
    radial-gradient(900px 500px at 100% 0%, #e9d5ff 0%, transparent 50%),
    linear-gradient(180deg, #f8fafc 0%, #e2e8f0 100%);
}

.mega-admin.mega-admin--login .admin-login__wrap {
  max-width: 28rem;
  margin: clamp(2rem, 8vh, 4rem) auto;
  padding: 0 var(--mega-space-4);
}

.mega-admin.mega-admin--login .login-html {
  border-radius: var(--mega-radius-lg);
  box-shadow: var(--mega-shadow-lg);
  overflow: hidden;
  border: 1px solid var(--mega-color-border);
  background: var(--mega-color-surface);
}

.mega-admin.mega-admin--login .login-form .input,
.mega-admin.mega-admin--login .login-form .button {
  border-radius: var(--mega-radius-sm);
}

.mega-admin.mega-admin--login .login-form .button {
  font-weight: 600;
  width: 100%;
  padding: var(--mega-space-3) var(--mega-space-4);
  border: 0;
  background: var(--mega-color-primary);
  color: #fff;
  cursor: pointer;
  transition: background var(--mega-transition-fast), transform var(--mega-transition-fast);
}

.mega-admin.mega-admin--login .login-form .button:hover {
  background: var(--mega-color-primary-hover);
}

.mega-admin.mega-admin--login .login-form .button:active {
  transform: translateY(1px);
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce) {
  .mega-store .fixed_header,
  .mega-store .btn-minicart-compact,
  .mega-store .cart-hover .select-button .btn,
  .mega-store .mega-commerce__card,
  .mega-store .mega-commerce__card .pi-pic img,
  .mega-store .mega-commerce--checkout .site-btn,
  .mega-store .mega-commerce--checkout .place-btn,
  .mega-admin.mega-admin--login .login-form .button {
    transition: none;
  }
  .mega-store .btn-minicart-compact:hover,
  .mega-store .cart-hover .select-button .btn:hover,
  .mega-store .mega-commerce__card:hover {
    transform: none;
  }
  .mega-store .mega-commerce__card:hover .pi-pic img,
  .mega-store .mega-commerce--checkout .order-btn .site-btn:hover,
  .mega-store .mega-commerce--checkout .order-btn .place-btn:hover {
    transform: none;
  }
}