/**
 * Pure Herbs – Mobile App UI
 * Mobile elements hidden by default; shown only inside the media query.
 */

/* ── ALWAYS hide mobile-only elements on desktop ── */
.ph-mobile-header,
.ph-mobile-search-overlay,
.ph-bottom-nav {
	display: none !important;
}

@media (max-width: 1024px) {

  /* =========================================================
     GLOBAL RESET / BASE
     ========================================================= */

  * {
    -webkit-tap-highlight-color: transparent;
  }

  body {
    background: #f4f6f8;
    padding-top: 56px;
    padding-bottom: 80px;
    overflow-x: hidden;
  }

  /* Extra bottom padding on cart page for fixed totals panel */
  body.woocommerce-cart {
    padding-bottom: 260px;
  }

  /* Extra bottom padding on single product:
     bottom-nav (68) + cart bar 2 rows (≈ 46+48+8+10+10 = 122) + gap (10) = ~200px */
  body.single-product {
    padding-bottom: 200px;
  }

  /* Remove page-level box shadows / padding */
  .ph-page {
    box-shadow: none !important;
    padding: 0 !important;
  }

  /* =========================================================
     HIDE DESKTOP CHROME
     ========================================================= */

  .ph-site-header,
  .ph-site-footer,
  .ph-scroll-bottle,
  .ph-loader {
    display: none !important;
  }

  /* =========================================================
     MOBILE APP HEADER
     ========================================================= */

  .ph-mobile-header {
    display: flex !important;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 56px;
    background: #fff;
    z-index: 200;
    box-shadow: 0 1px 6px rgba(0, 0, 0, .08);
    border-bottom: 1px solid #f0f0f0;
  }

  .ph-mobile-header__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 12px;
    width: 100%;
    height: 100%;
  }

  .ph-mobile-brand {
    display: flex;
    align-items: center;
    text-decoration: none;
    flex-shrink: 0;
    height: 100%;
  }

  .ph-mobile-brand .ph-brand-logo {
    max-width: 90px;
    max-height: 40px;
    width: auto;
    height: auto;
    display: block;
    object-fit: contain;
  }

  .ph-mobile-brand .ph-brand__leaf {
    display: inline-block;
    width: 28px;
    height: 28px;
    background-color: #3e6f5b;
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M17 8C8 10 5.9 16.17 3.82 19.37L5.71 21l1-1C8 18.5 10.47 17 12 17c4 0 8-3 8-9-4 0-6 1-8 3-2-2-1-5 1-7 0 0-2 0-3 1z'/%3E%3C/svg%3E");
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M17 8C8 10 5.9 16.17 3.82 19.37L5.71 21l1-1C8 18.5 10.47 17 12 17c4 0 8-3 8-9-4 0-6 1-8 3-2-2-1-5 1-7 0 0-2 0-3 1z'/%3E%3C/svg%3E");
    mask-size: contain;
    -webkit-mask-size: contain;
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    mask-position: center;
    -webkit-mask-position: center;
  }

  .ph-mobile-header__actions {
    display: flex;
    align-items: center;
    gap: 2px;
  }

  .ph-mobile-action-btn,
  .ph-mobile-search-toggle,
  .ph-mobile-cart-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    background: none;
    border: none;
    cursor: pointer;
    color: #444;
    border-radius: 50%;
    position: relative;
    padding: 0;
    text-decoration: none;
    flex-shrink: 0;
  }

  .ph-mobile-action-btn:hover,
  .ph-mobile-search-toggle:hover,
  .ph-mobile-cart-btn:hover {
    background: #f5f5f5;
    color: #3a7c52;
  }

  .ph-mobile-search-toggle:active,
  .ph-mobile-cart-btn:active {
    background: #f4f6f8;
  }

  .ph-mobile-cart-count {
    position: absolute;
    top: 4px;
    right: 4px;
    background: #e74c3c;
    color: #fff;
    border-radius: 50%;
    min-width: 16px;
    height: 16px;
    font-size: .6rem;
    font-weight: 800;
    display: grid;
    place-items: center;
    padding: 0 3px;
    line-height: 1;
    border: 1.5px solid #fff;
  }

  /* =========================================================
     MOBILE SEARCH OVERLAY
     ========================================================= */

  .ph-mobile-search-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: #fff;
    z-index: 300;
    padding: 16px;
    flex-direction: column;
    gap: 12px;
  }

  .ph-mobile-search-overlay.is-open {
    display: flex !important;  /* must beat the global display:none !important */
  }

  .ph-mobile-search-header {
    display: flex;
    align-items: center;
    gap: 12px;
    padding-bottom: 8px;
    border-bottom: 1px solid #eee;
  }

  .ph-mobile-search-close {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: #f4f6f8;
    border: none;
    border-radius: 50%;
    cursor: pointer;
    color: #444;
    padding: 0;
    flex-shrink: 0;
  }

  .ph-mobile-search-input-wrap {
    display: flex;
    align-items: center;
    gap: 10px;
    background: #f4f6f8;
    border-radius: 12px;
    padding: 10px 14px;
    border: 1.5px solid transparent;
    transition: border-color .2s;
  }

  .ph-mobile-search-input-wrap:focus-within {
    border-color: #3e6f5b;
    background: #fff;
  }

  .ph-mobile-search-input-wrap svg {
    color: #999;
    flex-shrink: 0;
  }

  #ph-mobile-search-input {
    border: none;
    background: none;
    outline: none;
    font-size: .9rem;
    color: #222;
    width: 100%;
  }

  .ph-mobile-search-submit {
    height: 46px;
    background: linear-gradient(135deg, #3e6f5b, #4fa77e);
    color: #fff;
    border: none;
    border-radius: 12px;
    font-size: .88rem;
    font-weight: 700;
    cursor: pointer;
    width: 100%;
  }

  /* =========================================================
     BOTTOM NAVIGATION
     ========================================================= */

  .ph-bottom-nav {
    display: flex !important;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 68px;
    background: #fff;
    z-index: 200;
    box-shadow: 0 -2px 16px rgba(0, 0, 0, .08);
    align-items: center;
    justify-content: space-around;
    padding: 0 4px;
  }

  .ph-bottom-nav__item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px;
    padding: 10px 0;
    flex: 1;
    border: none;
    background: transparent;
    text-decoration: none;
    color: #aaa;
    font-size: .6rem;
    font-weight: 600;
    cursor: pointer;
    transition: color .15s;
    position: relative;
  }

  .ph-bottom-nav__item span {
    font-size: .6rem;
    font-weight: 600;
    line-height: 1;
  }

  .ph-bottom-nav__item svg {
    width: 22px;
    height: 22px;
    flex-shrink: 0;
  }

  .ph-bottom-nav__item.is-active {
    color: #3e6f5b;
  }

  /* Floating cart button */
  .ph-bottom-nav__item--cart {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    border-radius: 50%;
    background: linear-gradient(135deg, #3e6f5b, #4fa77e);
    color: #fff;
    flex: none;
    margin-top: -20px;
    box-shadow: 0 4px 16px rgba(62, 111, 91, .45);
    padding: 0;
  }

  .ph-bottom-nav__item--cart span {
    display: none; /* hide "Cart" text for floating button */
  }

  .ph-bottom-nav__item--cart svg {
    width: 22px;
    height: 22px;
  }

  .ph-bottom-nav__item--cart.is-active {
    color: #fff;
  }

  /* Cart count badge on bottom nav cart */
  #ph-bottom-cart-count {
    position: absolute;
    top: -4px;
    right: -4px;
    background: #e74c3c;
    color: #fff;
    border-radius: 50%;
    width: 16px;
    height: 16px;
    font-size: .55rem;
    font-weight: 800;
    display: grid;
    place-items: center;
    border: 1.5px solid #fff;
  }

  /* =========================================================
     HOME PAGE
     ========================================================= */

  /* Hero section */
  .ph-hero {
    min-height: auto;
    border-radius: 0;
    margin: 0;
    overflow: visible;
  }

  .ph-hero__inner {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 20px 16px 0;
  }

  .ph-hero__visual {
    width: 100%;
    max-width: 100%;
    padding: 6px 0 2px;
    order: -1;
    overflow: visible;
  }

  .ph-hero-frame {
    transform: none !important;
    animation: none !important;
    width: min(100%, 390px);
    max-width: 100%;
    margin: 0 auto;
    filter: drop-shadow(0 16px 26px rgba(10, 40, 20, .22));
  }

  .ph-hero-frame::before {
    inset: 11% 8% -2%;
    filter: blur(12px);
  }

  .ph-hero-product-img {
    width: 100%;
    max-width: 100%;
    height: auto;
    border-radius: 0;
    object-fit: contain;
    object-position: center;
    filter: drop-shadow(0 10px 14px rgba(0, 0, 0, .16));
    animation: ph-product-float 5s ease-in-out infinite;
  }

  .ph-hero-badge {
    z-index: 4;
    font-size: .62rem;
    padding: 5px 10px 5px 7px;
    gap: 5px;
    animation: none;
    max-width: calc(100% - 18px);
  }

  .ph-hero-badge svg { width: 12px; height: 12px; }

  .ph-hero-badge--top {
    top: 6%;
    left: 3%;
  }

  .ph-hero-badge--bottom {
    bottom: 8px;
    right: 8px;
    left: auto;
  }

  .ph-hero-glow--1,
  .ph-hero-glow--2,
  .ph-hero-orbit {
    display: none;
  }

  /* Service strip horizontal scroll */
  .ph-service-strip,
  .ph-services {
    display: flex;
    flex-direction: row;
    overflow-x: auto;
    overflow-y: visible;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x mandatory;
    gap: 16px;
    flex-wrap: nowrap;
    padding: 12px 16px;
    margin: 0;
  }

  .ph-service-strip::-webkit-scrollbar,
  .ph-services::-webkit-scrollbar {
    display: none;
  }

  .ph-service-strip {
    scrollbar-width: none;
  }

  .ph-service-item {
    flex-shrink: 0;
    min-width: 130px;
    display: flex;
    flex-direction: column;
    gap: 4px;
    background: #fff;
    border-radius: 12px;
    padding: 12px;
    font-size: .7rem;
    scroll-snap-align: start;
    box-shadow: 0 1px 6px rgba(0,0,0,.06);
  }

  /* Trust band */
  .ph-trust-band {
    flex-direction: column;
  }

  .ph-trust-stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
    padding: 12px 16px;
  }

  /* Section headings */
  .ph-section-title,
  .ph-home-section h2,
  h2.ph-heading {
    font-size: 1rem;
    margin-bottom: 12px;
  }

  /* Product grid – 2 columns (home + general pages) */
  .ph-product-grid,
  .woocommerce ul.products {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 10px !important;
    width: 100% !important;
    padding: 0 !important;
    list-style: none !important;
    margin: 0 !important;
    box-sizing: border-box !important;
  }

  /* Product cards */
  .ph-product-card,
  .woocommerce ul.products li.product {
    border-radius: 14px;
    overflow: hidden;
    min-width: 0;
  }

  /* =========================================================
     PRODUCT CARDS
     ========================================================= */

  .ph-product-card {
    border-radius: 14px;
  }

  .ph-product-card__img-wrap,
  .ph-product-card__image {
    display: block;
    aspect-ratio: 1;
    height: 132px;
    overflow: hidden;
  }

  .ph-product-card__img-wrap a {
    display: grid;
    place-items: center;
    width: 100%;
    height: 100%;
    background: linear-gradient(180deg, #f7fff9, #fff);
  }

  .ph-product-card__img-wrap img,
  .ph-product-card__image img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
    padding: 12px;
    box-sizing: border-box;
  }

  .ph-product-card__body {
    padding: 8px 10px 10px;
  }

  .ph-product-card__body h3,
  .ph-product-card__body h3 a {
    font-size: .75rem;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    line-height: 1.35;
    margin: 0 0 4px;
  }

  .ph-product-card__cats {
    display: none;
  }

  .ph-product-card__promo {
    font-size: .64rem;
    line-height: 1.2;
    margin: 0 0 4px;
  }

  .ph-price,
  .ph-product-card .price {
    font-size: .78rem;
    margin-bottom: 6px;
  }

  .ph-product-card__sku {
    display: none;
  }

  .ph-card-add,
  .ph-product-card .button {
    height: 34px;
    font-size: .66rem;
    border-radius: 8px;
    width: 100%;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .ph-product-card__badge {
    font-size: .62rem;
    padding: 2px 7px;
  }

  /* =========================================================
     SHOP PAGE
     ========================================================= */

  /* Full reset — sidebar is off-canvas, main fills the screen */
  .ph-shop-layout {
    display: block !important;
    padding: 0 !important;
    gap: 0 !important;
    width: 100% !important;
    margin: 0 !important;
  }

  /* Remove any hero/intro section gap on shop */
  .ph-shop-hero,
  .ph-shop-layout > .ph-shop-hero {
    display: none !important;
  }

  /* Make sure site-main has no top padding on shop */
  .woocommerce-shop .site-main,
  .tax-product_cat .site-main,
  body.post-type-archive-product .site-main {
    padding-top: 0 !important;
    margin-top: 0 !important;
  }

  /* Off-canvas sidebar Bottom Sheet */
  .ph-shop-sidebar {
    display: block !important;
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;
    bottom: -100% !important;
    top: auto !important;
    height: auto !important;
    max-height: 85vh !important;
    width: 100% !important;
    max-width: none !important;
    background: #fff !important;
    z-index: 1100 !important;
    transition: bottom .4s cubic-bezier(0.4, 0, 0.2, 1) !important;
    overflow-y: auto !important;
    box-shadow: 0 -10px 40px rgba(0,0,0,0.12) !important;
    flex: none !important;
    border-radius: 32px 32px 0 0 !important;
    padding: 30px 20px 40px !important;
    border: none !important;
  }

  .ph-shop-sidebar::before {
    content: "";
    position: absolute;
    top: 12px;
    left: 50%;
    transform: translateX(-50%);
    width: 40px;
    height: 4px;
    background: #e0e0e0;
    border-radius: 2px;
  }

  .ph-shop-sidebar.is-open {
    bottom: 0 !important;
  }

  /* Main area = full width */
  .ph-shop-main {
    width: 100% !important;
    flex: none !important;
    padding: 0 12px !important;
  }

  /* Toolbar sticky below mobile header */
  .ph-shop-toolbar {
    position: sticky !important;
    top: 56px !important;
    background: #f4f6f8 !important;
    z-index: 10 !important;
    padding: 10px 0 !important;
    margin-bottom: 20px !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
  }

  /* Mobile shop search bar — visible only on mobile */
  .ph-shop-search-bar {
    flex: 1;
    min-width: 0;
  }

  .ph-shop-search-bar__inner {
    display: flex;
    align-items: center;
    gap: 8px;
    background: #fff;
    border: 1.5px solid #e0e0e0;
    border-radius: 10px;
    padding: 0 12px;
    height: 40px;
    transition: border-color .2s;
  }

  .ph-shop-search-bar__inner:focus-within {
    border-color: #3a7c52;
  }

  .ph-shop-search-bar__inner svg {
    flex-shrink: 0;
    color: #aaa;
  }

  .ph-shop-search-input {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: .84rem;
    color: #1a1a1a;
    min-width: 0;
  }

  .ph-shop-search-input::placeholder { color: #bbb; }

  /* Always show filter toggle on mobile */
  .ph-filter-toggle {
    display: inline-flex !important;
    flex-shrink: 0;
    height: 40px;
    padding: 0 14px;
    border-radius: 8px;
    font-size: .78rem;
    font-weight: 700;
    border: 1.5px solid var(--ph-line);
    background: #fff;
    gap: 6px;
    align-items: center;
  }

  /* Toolbar right: wrap WC ordering */
  .ph-toolbar-right {
    flex: 1;
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
  }

  .ph-toolbar-right .woocommerce-result-count {
    display: none !important;
  }

  .ph-toolbar-right .woocommerce-ordering {
    margin: 0 !important;
  }

  .ph-toolbar-right .woocommerce-ordering select {
    width: auto !important;
    max-width: 160px !important;
    font-size: .72rem !important;
    height: 36px !important;
    border-radius: 8px !important;
  }

  /* Hide the WC-rendered result count + ordering that appear INSIDE
     #ph-shop-products (before the ul.products) — they duplicate our toolbar */
  #ph-shop-products .woocommerce-result-count,
  #ph-shop-products .woocommerce-ordering,
  .ph-shop-products .woocommerce-result-count,
  .ph-shop-products .woocommerce-ordering {
    display: none !important;
  }

  .ph-shop-products,
  #ph-shop-products {
    padding-top: 30px !important;
    overflow: visible !important;
  }

  /* 2-column grid — ID selector for max specificity */
  #ph-shop-products ul.products,
  #ph-shop-products ul.ph-product-grid,
  #ph-shop-products .ph-product-grid,
  .ph-shop-products .ph-product-grid,
  .ph-shop-products ul.products,
  .ph-shop-main .ph-product-grid,
  .ph-shop-main ul.products {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 10px !important;
    width: 100% !important;
    padding: 2px 0 0 !important;
    margin: 0 0 16px 0 !important;
    box-sizing: border-box !important;
    overflow: visible !important;
  }

  /* Also force every product li to not override column width */
  #ph-shop-products li.product,
  #ph-shop-products .ph-product-card {
    width: auto !important;
    max-width: 100% !important;
    float: none !important;
  }

  .ph-shop-skeleton {
    grid-template-columns: repeat(2, 1fr) !important;
  }

  /* Sidebar overlay backdrop */
  .ph-sidebar-overlay {
    position: fixed;
    inset: 0;
    background: rgba(23, 35, 29, .45);
    backdrop-filter: blur(4px);
    z-index: 1050 !important;
    opacity: 0;
    visibility: hidden;
    transition: opacity .4s ease, visibility .4s ease;
    border: none;
  }

  .ph-sidebar-overlay.is-open,
  .ph-sidebar-overlay.is-visible {
    opacity: 1;
    visibility: visible;
    display: block !important;
  }

  /* Sidebar internals on mobile */
  .ph-shop-sidebar .ph-sidebar-section {
    margin-bottom: 30px !important;
  }

  .ph-shop-sidebar .ph-sidebar-section h3 {
    font-size: .85rem !important;
    font-weight: 900 !important;
    text-transform: uppercase;
    letter-spacing: .05em;
    margin-bottom: 18px !important;
    border: none !important;
    padding: 0 !important;
  }

  .ph-sidebar-price {
    background: #f1f7f4 !important;
    padding: 20px !important;
    border-radius: 20px !important;
    border: none !important;
  }

  .ph-sidebar-list {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 10px !important;
  }

  .ph-shop-sidebar .ph-sidebar-link {
    font-size: .76rem !important;
    padding: 12px 10px !important;
    background: #f8fbf9 !important;
    border: 1.5px solid #eef3ef !important;
    border-radius: 12px !important;
    flex-direction: column !important;
    text-align: center !important;
    gap: 4px !important;
    justify-content: center !important;
  }

  .ph-shop-sidebar .ph-sidebar-link.is-active {
    background: var(--ph-sage) !important;
    border-color: var(--ph-sage) !important;
    color: #fff !important;
  }

  .ph-sidebar-count {
    font-size: .68rem !important;
    background: rgba(0,0,0,0.05);
    padding: 2px 6px;
    border-radius: 6px;
    margin: 0 !important;
  }

  .ph-shop-sidebar .ph-sidebar-link.is-active .ph-sidebar-count {
    background: rgba(255,255,255,0.2);
  }

  .ph-shop-sidebar__head {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    margin-bottom: 24px !important;
    padding-bottom: 15px !important;
    border-bottom: 1px solid #f0f0f0 !important;
  }

  .ph-shop-sidebar__title {
    font-size: 1.1rem !important;
    font-weight: 900 !important;
    text-transform: uppercase;
    letter-spacing: .02em;
  }

  .ph-sidebar-close {
    display: grid !important;
    background: #f4f6f8 !important;
    border: none !important;
    width: 36px !important;
    height: 36px !important;
    border-radius: 50% !important;
    place-items: center !important;
    color: #444 !important;
  }

  .ph-range-input::-webkit-slider-thumb {
    width: 26px !important;
    height: 26px !important;
    border-width: 3px !important;
  }

  .ph-range-apply {
    height: 52px !important;
    border-radius: 14px !important;
    font-size: .88rem !important;
    font-weight: 800 !important;
    background: linear-gradient(135deg, #3e6f5b, #4fa77e) !important;
    box-shadow: 0 6px 20px rgba(62, 111, 91, .3) !important;
    margin-top: 20px !important;
    text-transform: uppercase;
    letter-spacing: .05em;
  }

  .ph-range-labels {
    margin-top: 20px !important;
    font-size: .85rem !important;
  }

  .ph-range-labels strong {
    font-size: .95rem !important;
  }

  /* =========================================================
     SINGLE PRODUCT PAGE
     ========================================================= */

  .woocommerce div.product {
    display: block !important;
    margin-top: 0;
  }

  /* Product image full-bleed with rounded bottom */
  .woocommerce div.product div.images {
    margin: -64px -16px 0;
    border-radius: 0 0 24px 24px;
    overflow: hidden;
    background: #fff;
  }

  .woocommerce div.product div.images img {
    border-radius: 0 0 24px 24px;
    border: none !important;
    max-height: 280px;
    object-fit: contain;
    width: 100%;
    padding: 20px;
  }

  /* Summary card slides up over the image.
     padding-bottom must be large enough for ALL content to scroll
     above the fixed cart bar (cart bar ≈130px + bottom nav 68px = ~200px) */
  .woocommerce div.product div.summary {
    padding: 16px 16px 220px;
    background: #fff;
    border-radius: 20px 20px 0 0;
    margin-top: -16px;
    position: relative;
    z-index: 2;
    box-shadow: 0 -4px 16px rgba(0, 0, 0, .06);
  }

  .woocommerce div.product .product_title {
    font-size: 1rem;
    margin-bottom: 6px;
    line-height: 1.3;
  }

  .woocommerce div.product p.price,
  .woocommerce div.product span.price {
    font-size: 1.1rem;
  }

  /* ── Fixed add-to-cart bar ──
     Layout: Row 1 = qty control (full width)
             Row 2 = Add to Cart + Buy Now (50/50 split)
     Sits above bottom nav (68px high) */
  .woocommerce div.product form.cart {
    position: fixed !important;
    bottom: 68px !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    padding: 10px 14px 12px !important;
    background: #fff !important;
    box-shadow: 0 -3px 16px rgba(0, 0, 0, .1) !important;
    border-top: 1px solid #eee !important;
    border-radius: 18px 18px 0 0 !important;
    z-index: 150 !important;
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    grid-template-rows: auto auto !important;
    gap: 8px !important;
    margin: 0 !important;
    box-sizing: border-box !important;
  }

  /* Qty row spans both columns */
  .woocommerce div.product form.cart .quantity {
    grid-column: 1 / -1 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    border: 1.5px solid #e0e0e0 !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    height: 46px !important;
    background: #f8fbf9 !important;
    width: 100% !important;
  }

  /* Qty input (center) */
  .woocommerce div.product form.cart .qty {
    flex: 1 !important;
    height: 44px !important;
    text-align: center !important;
    border: none !important;
    border-left: 1px solid #e0e0e0 !important;
    border-right: 1px solid #e0e0e0 !important;
    font-size: 1rem !important;
    font-weight: 700 !important;
    padding: 0 !important;
    background: transparent !important;
    min-width: 0 !important;
  }

  /* Qty +/- buttons */
  .woocommerce div.product form.cart .quantity .qty-btn,
  .woocommerce div.product form.cart .quantity button {
    width: 46px !important;
    height: 44px !important;
    border: none !important;
    background: transparent !important;
    font-size: 1.2rem !important;
    font-weight: 700 !important;
    cursor: pointer !important;
    flex-shrink: 0 !important;
    color: #3a7c52 !important;
  }

  /* Add to cart — column 1 of row 2 */
  .woocommerce div.product form.cart .single_add_to_cart_button {
    grid-column: 1 !important;
    height: 48px !important;
    font-size: .84rem !important;
    font-weight: 800 !important;
    border-radius: 12px !important;
    padding: 0 !important;
    min-width: 0 !important;
    width: 100% !important;
  }

  /* Buy Now — column 2 of row 2 */
  .woocommerce div.product form.cart .ph-buy-now-btn {
    grid-column: 2 !important;
    height: 48px !important;
    font-size: .84rem !important;
    font-weight: 800 !important;
    border-radius: 12px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 0 !important;
    width: 100% !important;
    padding: 0 !important;
    background: #1a1a1a !important;
    color: #fff !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    box-sizing: border-box !important;
  }

  /* Trust badges on single product */
  .ph-trust-badges {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
    margin-top: 16px;
  }

  .ph-trust-badge {
    padding: 10px 6px;
    font-size: .6rem;
    text-align: center;
    background: #f4f6f8;
    border-radius: 10px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
  }

  .ph-trust-badge svg {
    width: 16px;
    height: 16px;
  }

  /* Wishlist sits at bottom of product summary as a compact pill.
     align-self: flex-start prevents it stretching full-width in flex/grid parents */
  .ph-single-wishlist-btn {
    display: inline-flex !important;
    width: auto !important;
    max-width: 200px !important;
    height: 40px !important;
    padding: 0 18px !important;
    border-radius: 20px !important;
    margin: 10px 0 16px !important;
    font-size: .82rem !important;
    align-self: flex-start !important;
    flex-shrink: 0 !important;
  }

  /* Product tabs – extra bottom spacing for fixed cart */
  .woocommerce-tabs,
  .woocommerce div.product .woocommerce-tabs {
    margin-top: 0;
    padding: 0 0 80px;
  }

  /* Related products – 2-column grid */
  .woocommerce .related.products {
    padding: 16px;
    margin-top: 12px;
  }

  .woocommerce .related.products ul.products {
    grid-template-columns: repeat(2, 1fr) !important;
  }

  /* Force related product cards visible — GSAP ScrollTrigger often
     can't fire for items below the fixed bottom cart bar on mobile */
  .woocommerce .related.products [data-ph-reveal],
  .woocommerce .related.products .ph-product-card,
  .woocommerce .upsells.products [data-ph-reveal],
  .woocommerce .upsells.products .ph-product-card {
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
  }

  /* =========================================================
     CART PAGE
     ========================================================= */

  .woocommerce-cart .ph-page {
    padding: 0 !important;
  }

  /* ── CART TABLE ── */
  .woocommerce-cart .ph-page {
    padding: 0 !important;
  }

  .woocommerce-cart table.cart {
    margin: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    border-left: none !important;
    border-right: none !important;
    font-size: .75rem;
  }

  /* ── CART TABLE MOBILE: Clean card layout ── */
  .woocommerce-cart table.cart thead,
  .woocommerce-cart table.cart td.product-price { display: none !important; }

  /* Kill WC responsive ::before labels (float-based, crash layout) */
  .woocommerce-cart table.cart td::before,
  .woocommerce-cart table.cart td::after { display: none !important; float: none !important; content: none !important; }

  /* Make table behave as block */
  .woocommerce-cart table.cart,
  .woocommerce-cart table.cart tbody { display: block !important; width: 100% !important; }

  /* Each cart row = card */
  .woocommerce-cart table.cart tr.cart_item {
    display: grid !important;
    grid-template-columns: 22px 60px 1fr auto !important;
    grid-template-rows: auto auto !important;
    grid-template-areas:
      "remove thumb name     name"
      "remove thumb subtotal qty" !important;
    align-items: center !important;
    gap: 4px 10px !important;
    padding: 10px 12px !important;
    border-bottom: 1px solid #f0f0f0 !important;
    background: #fff !important;
    border-radius: 12px !important;
    margin-bottom: 8px !important;
  }

  .woocommerce-cart table.cart td {
    display: block !important;
    padding: 0 !important;
    border: none !important;
    font-size: .8rem !important;
    word-break: break-word !important;
    overflow-wrap: break-word !important;
  }

  .woocommerce-cart table.cart td.product-remove   { grid-area: remove !important; align-self: start !important; padding-top: 4px !important; }
  .woocommerce-cart table.cart td.product-thumbnail { grid-area: thumb !important; align-self: start !important; }
  .woocommerce-cart table.cart td.product-name     { grid-area: name !important; font-size: .82rem !important; font-weight: 600 !important; line-height: 1.35 !important; min-width: 0 !important; align-self: start !important; }
  .woocommerce-cart table.cart td.product-quantity { grid-area: qty !important; align-self: center !important; justify-self: end !important; }
  .woocommerce-cart table.cart td.product-subtotal { grid-area: subtotal !important; font-weight: 700 !important; color: var(--ph-sage) !important; font-size: .82rem !important; align-self: center !important; }

  .woocommerce-cart table.cart td.product-remove a  { font-size: 1.1rem !important; color: #bbb !important; text-decoration: none !important; line-height: 1 !important; }
  .woocommerce-cart table.cart td.product-thumbnail img { width: 60px !important; height: 60px !important; border-radius: 8px !important; object-fit: contain !important; display: block !important; }
  .woocommerce-cart table.cart td.product-name a    { color: var(--ph-ink) !important; text-decoration: none !important; display: block !important; white-space: normal !important; word-break: normal !important; overflow-wrap: break-word !important; }

  /* Compact qty controls */
  .woocommerce-cart table.cart td.product-quantity .quantity { display: inline-flex !important; align-items: center !important; }
  .woocommerce-cart table.cart td.product-quantity input.qty {
    width: 44px !important;
    min-width: 44px !important;
    min-height: 32px !important;
    padding: 4px 6px !important;
    font-size: .82rem !important;
    text-align: center !important;
  }
  .woocommerce-cart table.cart td.product-quantity .ph-qty-btn,
  .woocommerce-cart table.cart td.product-quantity button {
    width: 28px !important;
    height: 32px !important;
    min-width: 28px !important;
    padding: 0 !important;
    font-size: .9rem !important;
  }

  .woocommerce-cart table.cart td.product-price { display: none !important; }

  .woocommerce-cart table.cart td.actions {
    display: block !important;
    padding: 10px 12px !important;
    background: #f8faf8 !important;
  }

  /* Cart collaterals: stack + totals inline (not fixed) */
  .woocommerce-cart .cart-collaterals {
    display: block !important;
    padding: 0 12px 12px !important;
  }

  /* Totals as normal card (not fixed) */
  .woocommerce-cart .cart-collaterals .cart_totals {
    position: static !important;
    width: 100% !important;
    flex: none !important;
    border-radius: 16px !important;
    box-shadow: 0 4px 16px rgba(0,0,0,.08) !important;
    padding: 16px !important;
    margin-top: 12px !important;
    background: #fff !important;
    border: 1px solid #e8f0e8 !important;
  }

  .woocommerce-cart .cart_totals h2 {
    font-size: .78rem !important;
    margin-bottom: 10px !important;
  }

  .woocommerce-cart .wc-proceed-to-checkout a.checkout-button,
  .woocommerce-cart .wc-proceed-to-checkout .button.checkout-button {
    width: 100% !important;
    min-height: 48px !important;
    border-radius: 12px !important;
    font-size: .82rem !important;
  }

  .woocommerce-cart .wc-proceed-to-checkout::after { display: none !important; }

  /* Cross-sells hidden on mobile (save space) */
  .woocommerce-cart .cross-sells { display: none !important; }

  /* ── CHECKOUT PAGE ── */
  .woocommerce-checkout .ph-page {
    padding: 12px !important;
  }

  .woocommerce-checkout form.checkout {
    display: block !important;
    padding: 0 !important;
  }

  .woocommerce-checkout #customer_details {
    padding: 16px !important;
    border-radius: 16px !important;
    background: #fff !important;
    margin-bottom: 16px !important;
    box-shadow: 0 2px 12px rgba(0,0,0,.06) !important;
    position: static !important;
    width: auto !important;
    float: none !important;
  }

  .woocommerce-checkout #order_review {
    position: static !important;
    border-radius: 16px !important;
    padding: 16px !important;
    background: #fff !important;
    box-shadow: 0 2px 12px rgba(0,0,0,.06) !important;
    max-height: none !important;
    overflow: visible !important;
    border: 1px solid #e8f0e8 !important;
    margin-bottom: 16px !important;
    float: none !important;
    width: auto !important;
  }

  #order_review_heading {
    font-size: .8rem !important;
    margin-bottom: 12px !important;
  }

  .woocommerce-checkout-review-order-table {
    font-size: .74rem !important;
  }

  .woocommerce #payment {
    margin-top: 12px !important;
  }

  .woocommerce #payment #place_order {
    min-height: 48px !important;
    border-radius: 12px !important;
    font-size: .82rem !important;
  }

  .woocommerce-checkout h3 {
    font-size: .76rem !important;
    margin-bottom: 12px !important;
  }

  .woocommerce-checkout .form-row label {
    font-size: .72rem !important;
  }

  /* Fixed order review panel */
  #order_review {
    position: static;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 100;
    border-radius: 20px 20px 0 0;
    padding: 16px;
    background: #fff;
    box-shadow: 0 -4px 20px rgba(0, 0, 0, .1);
    max-height: 60vh;
    overflow-y: auto;
  }

  #order_review.is-collapsed {
    max-height: 70px;
    overflow: hidden;
  }

  .ph-order-review-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    background: none;
    border: none;
    cursor: pointer;
    font-size: .82rem;
    font-weight: 700;
    color: #222;
    padding: 0 0 12px;
    border-bottom: 1px solid #eee;
    margin-bottom: 12px;
  }

  .ph-order-review-toggle .ph-toggle-arrow {
    font-size: .7rem;
    transition: transform .2s;
  }

  #order_review.is-collapsed .ph-toggle-arrow {
    transform: rotate(180deg);
  }

  .woocommerce-checkout-review-order-table {
    font-size: .78rem;
  }

  .woocommerce-checkout-review-order-table th,
  .woocommerce-checkout-review-order-table td {
    padding: 6px 0;
  }

  #order_review #payment {
    border-radius: 12px;
    padding: 12px !important;
  }

  #place_order,
  #order_review .place-order .button {
    width: 100%;
    height: 50px;
    border-radius: 12px;
    font-size: .9rem;
  }

  /* =========================================================
     ORDER RECEIVED / SUCCESS PAGE
     ========================================================= */

  .woocommerce-order-received .woocommerce,
  .woocommerce-order-received .entry-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 60px 24px;
  }

  .woocommerce-order-received .woocommerce-order {
    width: 100%;
  }

  /* Large success checkmark */
  .woocommerce-order-received .woocommerce-order::before {
    content: '';
    display: block;
    width: 80px;
    height: 80px;
    background: linear-gradient(135deg, #3e6f5b, #4fa77e);
    border-radius: 50%;
    margin: 0 auto 24px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
    background-size: 44px 44px;
    background-repeat: no-repeat;
    background-position: center;
  }

  .woocommerce-order-received h1,
  .woocommerce-order-received .woocommerce-thankyou-order-received {
    font-size: 1.4rem !important;
    font-weight: 800;
    color: #222;
    margin-bottom: 8px;
  }

  /* Order details card */
  .woocommerce-order-received .woocommerce-order-overview,
  .woocommerce-order-received .woocommerce-order-details {
    background: #fff;
    border-radius: 16px;
    padding: 16px;
    width: 100%;
    margin-top: 20px;
    box-shadow: 0 1px 8px rgba(0, 0, 0, .06);
    text-align: left;
  }

  .woocommerce-order-received .woocommerce-order-overview li {
    font-size: .8rem;
    padding: 6px 0;
    border-bottom: 1px solid #f0f0f0;
  }

  /* Continue shopping button */
  .woocommerce-order-received .woocommerce-bacs-bank-details + a,
  .woocommerce-order-received .return-to-shop a,
  .woocommerce-order-received .button {
    display: block;
    width: 100%;
    background: linear-gradient(135deg, #3e6f5b, #4fa77e);
    color: #fff;
    border-radius: 12px;
    padding: 14px;
    text-align: center;
    font-weight: 700;
    font-size: .88rem;
    text-decoration: none;
    margin-top: 20px;
    border: none;
  }

  /* =========================================================
     MY ACCOUNT PAGE
     ========================================================= */

  /* Login/Register stacked on mobile */
  .woocommerce-account .u-columns,
  .woocommerce-account .col2-set,
  .woocommerce-account #customer_login {
    display: flex !important;
    flex-direction: column !important;
    gap: 20px !important;
    grid-template-columns: unset !important;
  }

  .woocommerce-account .u-column1,
  .woocommerce-account .u-column2,
  .woocommerce-account .col2-set .col-1,
  .woocommerce-account .col2-set .col-2 {
    width: 100% !important;
    float: none !important;
  }

  .woocommerce-form-login,
  .woocommerce-form-register {
    padding: 18px !important;
  }

  .woocommerce-form-login__submit,
  .woocommerce-form-register__submit {
    width: 100% !important;
  }

  /* Account nav – horizontal scrolling pill tabs */
  .woocommerce-MyAccount-navigation {
    overflow: hidden;
  }

  .woocommerce-MyAccount-navigation ul {
    display: flex;
    overflow-x: auto;
    flex-wrap: nowrap;
    gap: 8px;
    padding: 0 16px 8px;
    list-style: none;
    margin: 0;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }

  .woocommerce-MyAccount-navigation ul::-webkit-scrollbar {
    display: none;
  }

  .woocommerce-MyAccount-navigation ul li {
    flex-shrink: 0;
  }

  .woocommerce-MyAccount-navigation ul li a {
    display: block;
    white-space: nowrap;
    padding: 8px 16px;
    border-radius: 20px;
    background: #fff;
    border: 1px solid var(--ph-line, #e8ede9);
    color: #444;
    text-decoration: none;
    font-size: .78rem;
    font-weight: 600;
    transition: background .15s, color .15s;
  }

  .woocommerce-MyAccount-navigation ul li.is-active a,
  .woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link--dashboard.is-active a,
  .woocommerce-MyAccount-navigation ul li a:hover {
    background: #3e6f5b;
    color: #fff;
    border-color: #3e6f5b;
  }

  .woocommerce-MyAccount-content {
    border-radius: 16px;
    background: #fff;
    margin-top: 12px;
    padding: 16px;
    box-shadow: 0 1px 8px rgba(0, 0, 0, .06);
  }

  /* =========================================================
     PAGE TRANSITIONS
     ========================================================= */

  body.ph-page-leaving {
    opacity: 0;
    transition: opacity .2s ease;
  }

  /* =========================================================
     GENERAL WC OVERRIDES (mobile-only)
     ========================================================= */

  .woocommerce .woocommerce-notices-wrapper,
  .woocommerce-notices-wrapper {
    padding: 0 16px;
  }

  .woocommerce-message,
  .woocommerce-error,
  .woocommerce-info {
    font-size: .8rem;
    padding: 10px 14px;
    border-radius: 10px;
    margin-bottom: 12px;
  }

  /* Breadcrumbs hide on mobile (space saver) */
  .woocommerce .woocommerce-breadcrumb,
  .woocommerce-breadcrumb {
    display: none;
  }

  /* Full width page wrapper */
  .ph-page,
  .entry-content,
  .woocommerce {
    max-width: 100% !important;
    width: 100% !important;
  }

  /* Padding reset for WC pages */
  .woocommerce-page .ph-page > .woocommerce {
    padding: 0 16px;
  }

  /* =========================================================
     CART DRAWER REDESIGN (BOTTOM SHEET)
     ========================================================= */

  .ph-cart-drawer {
    display: block !important;
    position: fixed !important;
    inset: 0 !important;
    z-index: 2000 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    opacity: 0 !important;
    transition: visibility 0s .4s, opacity .3s ease !important;
  }

  .ph-cart-drawer.is-open {
    visibility: visible !important;
    pointer-events: auto !important;
    opacity: 1 !important;
    transition: opacity .3s ease !important;
  }

  .ph-cart-drawer__overlay {
    position: absolute !important;
    inset: 0 !important;
    background: rgba(23, 35, 29, .45) !important;
    backdrop-filter: blur(4px) !important;
    opacity: 0;
    transition: opacity .3s ease !important;
    border: none !important;
    width: 100% !important;
    height: 100% !important;
    z-index: 5 !important;
  }

  .ph-cart-drawer.is-open .ph-cart-drawer__overlay {
    opacity: 1 !important;
  }

  .ph-cart-drawer__panel {
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    bottom: -100% !important;
    top: auto !important;
    width: 100% !important;
    height: auto !important;
    max-height: 96vh !important;
    border-radius: 32px 32px 0 0 !important;
    transition: bottom 0.4s cubic-bezier(0.4, 0, 0.2, 1) !important;
    transform: none !important;
    display: flex !important;
    flex-direction: column !important;
    padding-top: 24px !important;
    z-index: 10 !important;
    background: #fff !important;
    border: none !important;
    box-shadow: 0 -10px 40px rgba(0,0,0,0.12) !important;
    margin: 0 !important;
  }

  .ph-cart-drawer.is-open .ph-cart-drawer__panel {
    bottom: 0 !important;
  }

  /* Sheet handle */
  .ph-cart-drawer__panel::before {
    content: "";
    position: absolute;
    top: 10px;
    left: 50%;
    transform: translateX(-50%);
    width: 40px;
    height: 4px;
    background: #e0e6e2;
    border-radius: 2px;
    z-index: 10;
  }

  .ph-cart-drawer__header {
    padding: 14px 24px 12px !important;
    border-bottom: 1px solid #f0f3f1;
    display: flex !important;
    align-items: center;
    justify-content: space-between;
  }

  .ph-cart-drawer__eyebrow {
    font-size: .65rem !important;
    font-weight: 800 !important;
    text-transform: uppercase;
    color: var(--ph-sage) !important;
    letter-spacing: .08em;
    margin-bottom: 2px !important;
  }

  .ph-cart-drawer__header h2 {
    font-size: 1.1rem !important;
    font-weight: 900 !important;
    margin: 0 !important;
  }

  .ph-cart-drawer__close {
    background: #f4f7f5 !important;
    border: none !important;
    width: 40px !important;
    height: 40px !important;
    border-radius: 50% !important;
    color: #444 !important;
    display: grid !important;
    place-items: center !important;
    cursor: pointer !important;
    touch-action: manipulation !important;
  }

  .ph-cart-drawer__body {
    padding: 16px 20px !important;
    flex: 1;
    overflow-y: auto;
    background: #fbfdfc;
  }

  .ph-cart-drawer__list {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 0 !important;
    list-style: none !important;
    margin: 0 !important;
  }

  .ph-cart-item {
    background: #fff;
    border-radius: 18px;
    padding: 12px !important;
    border: 1px solid #eff3f1;
    display: grid !important;
    grid-template-columns: 70px 1fr auto !important;
    align-items: center !important;
    gap: 14px !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.02);
  }

  .ph-cart-item__thumb {
    width: 70px !important;
    height: 70px !important;
  }

  .ph-cart-item__thumb img {
    width: 70px !important;
    height: 70px !important;
    border-radius: 12px !important;
    object-fit: cover !important;
    background: #f9fbf9 !important;
  }

  .ph-cart-item__info {
    display: flex;
    flex-direction: column;
    gap: 2px;
  }

  .ph-cart-item__title {
    font-size: .82rem !important;
    font-weight: 700 !important;
    color: #222 !important;
    line-height: 1.3 !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    text-decoration: none;
  }

  .ph-cart-item__meta {
    font-size: .75rem !important;
    color: var(--ph-muted) !important;
    margin-top: 4px !important;
    display: block !important;
  }

  .ph-cart-item__tail {
    text-align: right !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-end !important;
    gap: 8px !important;
  }

  .ph-cart-item__tail strong {
    font-size: .85rem !important;
    color: var(--ph-sage) !important;
  }

  .ph-cart-item__remove {
    background: #fff0f0 !important;
    color: #e74c3c !important;
    width: 24px !important;
    height: 24px !important;
    border-radius: 50% !important;
    display: grid !important;
    place-items: center !important;
    font-size: 14px !important;
    border: 1.5px solid #ffecec !important;
    text-decoration: none;
  }

  .ph-cart-drawer__footer {
    padding: 24px !important;
    background: #fff;
    border-top: 1px solid #f0f3f1;
    box-shadow: 0 -8px 24px rgba(0,0,0,0.05);
  }

  .ph-cart-summary {
    margin-bottom: 18px !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
  }

  .ph-cart-summary span {
    font-size: .85rem !important;
    color: var(--ph-muted) !important;
    font-weight: 600 !important;
  }

  .ph-cart-summary strong {
    font-size: 1.1rem !important;
    color: var(--ph-ink) !important;
  }

  .ph-cart-drawer__actions {
    display: grid !important;
    grid-template-columns: 1fr 1.2fr !important;
    gap: 12px !important;
  }

  .ph-cart-drawer__actions .ph-button {
    height: 52px !important;
    border-radius: 14px !important;
    font-size: .88rem !important;
    font-weight: 800 !important;
    display: grid !important;
    place-items: center !important;
    text-decoration: none;
  }

  /* Cart suggestions in bottom sheet */
  .ph-cart-suggestions {
    margin-top: 24px !important;
    padding: 0 !important;
    border: none !important;
  }

  /* 2-column grid on mobile for cart suggestions */
  .ph-cart-suggestions .ph-product-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }

  .ph-cart-suggestions__head {
    margin-bottom: 12px !important;
    display: flex;
    justify-content: space-between;
    align-items: center;
  }

  .ph-cart-suggestions__head span {
    font-size: .85rem !important;
    font-weight: 800 !important;
    color: #222;
  }

  .ph-cart-suggestions__head a {
    font-size: .75rem;
    color: var(--ph-sage);
    font-weight: 700;
  }

  .ph-cart-suggestion {
    background: #fff !important;
    border: 1px solid #eff3f1 !important;
    border-radius: 16px !important;
    padding: 10px !important;
    box-shadow: 0 2px 6px rgba(0,0,0,0.02);
  }

} /* end @media (max-width: 1024px) */

/* Tablet layout: use the mobile shell, but keep cards comfortably sized. */
@media (min-width: 769px) and (max-width: 1024px) {
  body {
    padding-top: 64px;
    padding-bottom: 104px;
  }

  .ph-mobile-header {
    height: 64px;
  }

  .ph-mobile-header__inner {
    padding: 0 24px;
  }

  .ph-mobile-brand .ph-brand-logo {
    max-width: 112px;
    max-height: 48px;
  }

  .ph-bottom-nav {
    display: flex !important;
    height: 74px;
    padding: 0 24px env(safe-area-inset-bottom);
    z-index: 240;
  }

  .ph-shop-layout {
    padding: 0 !important;
  }

  .ph-shop-main {
    max-width: 960px;
    margin: 0 auto;
    padding: 0 24px 118px !important;
  }

  .ph-shop-toolbar {
    top: 64px !important;
    padding: 16px 0 !important;
    margin-bottom: 24px !important;
  }

  .ph-toolbar-right {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 12px;
    min-width: 0;
  }

  .ph-toolbar-right .woocommerce-result-count {
    display: none !important;
  }

  .ph-toolbar-right .woocommerce-ordering select {
    max-width: 220px !important;
    height: 40px !important;
  }

  #ph-shop-products ul.products,
  #ph-shop-products ul.ph-product-grid,
  #ph-shop-products .ph-product-grid,
  .ph-shop-products .ph-product-grid,
  .ph-shop-products ul.products,
  .ph-shop-main .ph-product-grid,
  .ph-shop-main ul.products {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 14px !important;
    padding-top: 4px !important;
  }

  .ph-product-card__img-wrap,
  .ph-product-card__image {
    height: 170px;
  }

  .ph-product-card__body {
    padding: 12px 12px 14px;
  }

  .ph-product-card__body h3,
  .ph-product-card__body h3 a {
    font-size: .78rem;
    -webkit-line-clamp: 2;
  }

  .ph-product-card__promo {
    font-size: .66rem;
  }

  .ph-price,
  .ph-product-card .price {
    font-size: .78rem;
  }

  .ph-card-add,
  .ph-product-card .button {
    height: 38px;
    font-size: .72rem;
    border-radius: 10px;
  }
}