/* v4.8.0 — Mobile Visual System Pro
   Unifies the mobile experience into one premium app-like visual system. */

@media (max-width: 782px) {
  :root {
    --vlg-mob-bg: #f3f6fb;
    --vlg-mob-card: rgba(255,255,255,.96);
    --vlg-mob-line: rgba(15,23,42,.08);
    --vlg-mob-text: #0f172a;
    --vlg-mob-muted: #64748b;
    --vlg-mob-primary: var(--vlg-primary, #f28a00);
    --vlg-mob-radius: 22px;
    --vlg-mob-shadow: 0 14px 38px rgba(15,23,42,.08);
  }

  html { scroll-behavior: smooth; }
  body.vlg-theme {
    background:
      radial-gradient(circle at 100% 0, rgba(242,138,0,.07), transparent 30%),
      linear-gradient(180deg, #f7f9fc 0%, var(--vlg-mob-bg) 100%) !important;
    color: var(--vlg-mob-text) !important;
    -webkit-font-smoothing: antialiased;
  }

  body.vlg-theme .vlg-container,
  body.vlg-theme .site-main,
  body.vlg-theme main {
    padding-left: max(14px, env(safe-area-inset-left)) !important;
    padding-right: max(14px, env(safe-area-inset-right)) !important;
  }

  /* Unified cards across mobile */
  body.vlg-theme .vlg-section,
  body.vlg-theme .vlg-home-product-section,
  body.vlg-theme .vlg-latest-showcase,
  body.vlg-theme .vlg-archive-intro,
  body.vlg-theme .vlg-shop-preloop,
  body.vlg-theme .vlg-product-summary-card,
  body.vlg-theme .vlg-product-gallery-card,
  body.vlg-theme .vlg-product-tabs,
  body.vlg-theme .cart_totals,
  body.vlg-theme .woocommerce-cart-form,
  body.vlg-theme .vlg-checkout-panel,
  body.vlg-theme .fs-checkout-card {
    border-radius: var(--vlg-mob-radius) !important;
  }

  body.vlg-theme .vlg-section-head,
  body.vlg-theme .vlg-section-title-wrap,
  body.vlg-theme .vlg-shop-head {
    gap: 10px !important;
  }

  body.vlg-theme .vlg-section-head h2,
  body.vlg-theme .vlg-home h2,
  body.vlg-theme .vlg-section-title,
  body.vlg-theme .vlg-archive-intro h1 {
    letter-spacing: -.055em !important;
  }

  /* Appbar: calmer, more tactile, premium */
  body.vlg-theme .vlg-mobile-appbar {
    left: max(10px, env(safe-area-inset-left)) !important;
    right: max(10px, env(safe-area-inset-right)) !important;
    bottom: max(10px, env(safe-area-inset-bottom)) !important;
    min-height: 68px !important;
    padding: 8px !important;
    border-radius: 26px !important;
    background: rgba(255,255,255,.90) !important;
    border: 1px solid rgba(255,255,255,.62) !important;
    backdrop-filter: blur(22px) saturate(175%) !important;
    box-shadow: 0 24px 70px rgba(2,8,23,.24), inset 0 1px 0 rgba(255,255,255,.70) !important;
  }

  body.vlg-theme .vlg-mobile-appbar__item {
    border-radius: 18px !important;
    color: #475569 !important;
    transition: transform .16s ease, background .16s ease, color .16s ease !important;
  }

  body.vlg-theme .vlg-mobile-appbar__item:active {
    transform: scale(.96) !important;
  }

  body.vlg-theme .vlg-mobile-appbar__item--primary {
    background:
      radial-gradient(circle at 100% 0, rgba(255,180,80,.35), transparent 34%),
      linear-gradient(135deg, #071224 0%, #152b4e 100%) !important;
    box-shadow: 0 12px 28px rgba(7,18,36,.28) !important;
  }

  body.vlg-theme .vlg-mobile-appbar__item span {
    font-size: 19px !important;
  }

  body.vlg-theme .vlg-mobile-appbar__item b {
    font-size: 10px !important;
    letter-spacing: -.01em !important;
  }

  /* Floating ValgusAbi, positioned above appbar */
  body.vlg-theme .vlg-mobile-valgusabi {
    position: fixed !important;
    right: max(14px, env(safe-area-inset-right)) !important;
    bottom: calc(var(--vlg-mobile-appbar-h, 76px) + 24px + env(safe-area-inset-bottom)) !important;
    z-index: 9180 !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    min-height: 46px !important;
    padding: 0 13px 0 11px !important;
    border-radius: 999px !important;
    background: linear-gradient(135deg, #071224, #152b4e) !important;
    color: #fff !important;
    text-decoration: none !important;
    box-shadow: 0 18px 44px rgba(7,18,36,.28) !important;
    border: 1px solid rgba(255,255,255,.12) !important;
  }

  body.vlg-theme .vlg-mobile-valgusabi span {
    display: grid !important;
    place-items: center !important;
    width: 30px !important;
    height: 30px !important;
    border-radius: 999px !important;
    background: rgba(255,180,60,.18) !important;
  }

  body.vlg-theme .vlg-mobile-valgusabi b {
    font-size: 12px !important;
    font-weight: 950 !important;
    white-space: nowrap !important;
  }

  body.vlg-theme .vlg-back-to-top {
    display: none !important;
  }

  /* Mobile home becomes more app-like */
  body.vlg-theme .vlg-home .vlg-hero,
  body.vlg-theme .site-main.vlg-home .vlg-hero,
  body.vlg-theme .vlg-hero {
    border-radius: 28px !important;
    box-shadow: 0 22px 54px rgba(7,18,36,.18) !important;
  }

  body.vlg-theme .vlg-trust-grid,
  body.vlg-theme .vlg-category-grid,
  body.vlg-theme .vlg-products-grid,
  body.vlg-theme ul.products {
    scroll-padding-left: 14px !important;
  }

  /* Premium mobile product cards */
  body.vlg-theme ul.products,
  body.vlg-theme .vlg-products-grid,
  body.vlg-theme .vlg-shop-products ul.products {
    gap: 14px !important;
  }

  body.vlg-theme ul.products li.product.vlg-product-card,
  body.vlg-theme .vlg-product-card {
    border-radius: 22px !important;
    border: 1px solid rgba(226,232,240,.95) !important;
    background: #fff !important;
    box-shadow: 0 14px 34px rgba(15,23,42,.065) !important;
    overflow: hidden !important;
    transform: translateZ(0) !important;
  }

  body.vlg-theme .vlg-product-card .vlg-card-image-wrap {
    margin: 8px 8px 0 !important;
    border-radius: 18px !important;
    background:
      radial-gradient(circle at 90% 8%, rgba(242,138,0,.08), transparent 32%),
      #f8fafc !important;
    overflow: hidden !important;
  }

  body.vlg-theme .vlg-product-card .wp-post-image,
  body.vlg-theme .vlg-product-card img:first-of-type {
    border-radius: 16px !important;
    background: transparent !important;
  }

  body.vlg-theme .vlg-product-card .vlg-card-content {
    padding: 10px 10px 2px !important;
  }

  body.vlg-theme .vlg-product-card .vlg-card-category {
    display: inline-flex !important;
    width: fit-content !important;
    max-width: 100% !important;
    padding: 4px 8px !important;
    border-radius: 999px !important;
    background: #eef4fb !important;
    color: #40516b !important;
    font-size: 10.5px !important;
    font-weight: 900 !important;
  }

  body.vlg-theme .vlg-product-card .woocommerce-loop-product__title,
  body.vlg-theme .vlg-product-card h2 {
    color: #101827 !important;
    font-size: 14.5px !important;
    line-height: 1.18 !important;
    font-weight: 900 !important;
  }

  body.vlg-theme .vlg-product-card .price,
  body.vlg-theme .vlg-product-card .vlg-card-price {
    color: #071224 !important;
    font-size: 15.5px !important;
    font-weight: 950 !important;
  }

  body.vlg-theme .vlg-product-card .vlg-card-actions {
    padding: 0 10px 10px !important;
  }

  body.vlg-theme .vlg-product-card .vlg-card-actions .button,
  body.vlg-theme .vlg-product-card .vlg-card-actions .vlg-card-cart {
    min-height: 42px !important;
    border-radius: 16px !important;
    background: linear-gradient(135deg, #ff9f1a, #f28a00) !important;
    box-shadow: 0 12px 24px rgba(242,138,0,.22) !important;
    font-size: 12px !important;
    font-weight: 950 !important;
  }

  body.vlg-theme .vlg-product-card .vlg-card-actions .added_to_cart {
    border-radius: 14px !important;
  }

  /* Archive / product list top area */
  body.vlg-theme .vlg-archive-intro {
    padding: 18px !important;
    border-radius: 26px !important;
    box-shadow: 0 16px 42px rgba(15,23,42,.06) !important;
  }

  body.vlg-theme .vlg-shop-preloop {
    border-radius: 22px !important;
  }

  body.vlg-theme .vlg-filter-toggle {
    position: sticky !important;
    top: calc(var(--vlg-mobile-header-height, 92px) + 6px) !important;
    z-index: 4200 !important;
    min-height: 50px !important;
    border-radius: 18px !important;
    box-shadow: 0 14px 34px rgba(15,23,42,.12) !important;
  }

  /* Mobile mini cart / notices feel like app snackbars */
  body.vlg-theme .woocommerce-message,
  body.vlg-theme .woocommerce-info,
  body.vlg-theme .woocommerce-error,
  body.vlg-theme .vlg-free-shipping-progress {
    border-radius: 20px !important;
    box-shadow: 0 14px 36px rgba(15,23,42,.08) !important;
  }

  body.vlg-theme .vlg-mini-cart-drawer,
  body.vlg-theme .widget_shopping_cart,
  body.vlg-theme .woocommerce-mini-cart {
    border-radius: 24px !important;
  }

  /* Mobile footer: slimmer so appbar does not feel crowded */
  body.vlg-theme .vlg-footer.vlg-footer--premium.vlg-footer--refined {
    margin-top: 44px !important;
    padding-bottom: calc(92px + env(safe-area-inset-bottom)) !important;
  }

  body.vlg-theme .vlg-footer-trustbar {
    gap: 8px !important;
  }

  body.vlg-theme .vlg-footer-trustitem {
    min-height: 42px !important;
    border-radius: 16px !important;
    font-size: 12px !important;
  }

  /* Tiny motion: premium but not noisy */
  body.vlg-theme .vlg-mobile-search-panel,
  body.vlg-theme .vlg-nav.is-open,
  body.vlg-theme .vlg-mobile-appbar,
  body.vlg-theme .vlg-mobile-valgusabi {
    animation: vlgMobileSoftIn .22s ease both;
  }

  @keyframes vlgMobileSoftIn {
    from { opacity: .86; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
  }
}

@media (max-width: 420px) {
  body.vlg-theme .vlg-mobile-appbar {
    grid-template-columns: repeat(5, minmax(0,1fr)) !important;
    gap: 4px !important;
    padding: 6px !important;
  }

  body.vlg-theme .vlg-mobile-appbar__item {
    min-height: 50px !important;
  }

  body.vlg-theme .vlg-mobile-appbar__item b {
    font-size: 9.5px !important;
  }

  body.vlg-theme .vlg-mobile-valgusabi b {
    display: none !important;
  }

  body.vlg-theme .vlg-mobile-valgusabi {
    width: 48px !important;
    min-width: 48px !important;
    height: 48px !important;
    padding: 0 !important;
    justify-content: center !important;
  }
}