/* RAMA WORLD mobile fixes 20261112 - PREVIEW ONLY (loaded only when rw_mpreview cookie is set).
   Everything layout-related is inside (max-width: 767px) so desktop is unaffected. */

/* ---------- Preview badge (all widths, preview only) ---------- */
#rw-mp-badge{position:static;display:block;width:100%;box-sizing:border-box;background:#111;color:#fff;font:600 12px/1.2 Arial,sans-serif;padding:5px 8px;text-align:center;text-decoration:none}

/* ---------- 6) Cart page (all widths, preview only) ---------- */
.rw-billing-note{max-width:1200px;margin:0 auto 12px;padding:10px 14px;background:#fff4f2;border:1px solid #b3261e;border-left:5px solid #b3261e;color:#7a1712;font-size:16px;line-height:1.45;border-radius:4px}
.rw-billing-note a{color:#7a1712;text-decoration:underline;font-weight:700}
body.rw-cart-empty .rw-billing-note{display:none}
body.rw-cart-empty .main-cart-table + ul.btns{display:none}

/* Phone-only widgets are hidden on tablet/desktop */
#rw-mini-bar,#rw-sticky-atc,.rw-subcats-toggle,.rw-catintro-toggle{display:none}

@media (max-width: 767px){

  html{scroll-padding-top:56px}

  /* ---------- 1) Compact header ---------- */
  header.rama-header{position:relative;display:grid;grid-template-columns:48px 1fr 46px 46px;grid-template-areas:"menu logo call cart" "search search search search";align-items:center;column-gap:6px;row-gap:6px;padding:6px 8px 8px;background-color:var(--primary)}
  header.rama-header > section,
  header.rama-header > section > .boxed,
  header.rama-header .rama-header-info,
  header.rama-header .rama-header-buttons,
  header.rama-header .rama-header-ctas{display:contents}
  header.rama-header .rama-header-links,
  header.rama-header .rama-header-button-account,
  header.rama-header .rama-header-buttons > a.btn,
  header.rama-header a.rama-header-cta:not(.rama-header-cta-emphasized),
  header.rama-header .nav-wrapper{display:none !important}

  header.rama-header .nav-mobile-wrapper{grid-area:menu;display:block;position:static}
  header.rama-header a.nav-mobile-toggle-btn{width:44px;height:44px;border-radius:4px}
  header.rama-header a.nav-mobile-toggle-btn i{font-size:26px}
  header.rama-header ul.nav-mobile{top:100%;margin-top:0;max-height:75vh;overflow-y:auto;box-shadow:0 6px 14px rgba(0,0,0,.35)}
  header.rama-header ul.nav-mobile a{padding:13px 16px;font-size:16px;color:var(--white);border-bottom:1px solid rgba(255,255,255,.12)}
  header.rama-header ul.nav-mobile li.rw-extra a{background:rgba(0,0,0,.18)}

  header.rama-header .rama-header-logo{grid-area:logo;flex-basis:auto;min-width:0;display:flex;align-items:center}
  header.rama-header .rama-header-logo a{display:block;line-height:0}
  header.rama-header .rama-header-logo img{height:46px;width:auto;max-width:100%}

  header.rama-header a.rama-header-cta-emphasized{grid-area:call;display:flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;border-radius:50%;font-size:0;color:var(--white)}
  header.rama-header a.rama-header-cta-emphasized:before{content:"\f095";font-family:FontAwesome;font-size:22px;line-height:1}

  header.rama-header .rama-header-button-cart{grid-area:cart;position:relative;justify-self:center}
  header.rama-header .rama-header-button-cart > a.dropdown-toggle{display:flex;align-items:center;justify-content:center;width:44px;height:44px;color:var(--white)}
  header.rama-header .rama-header-button-cart .rama-header-button-label{display:none}
  header.rama-header .rama-header-button-cart .rama-header-button-icon{margin:0}
  header.rama-header .rama-header-button-cart .rama-header-button-icon i{font-size:24px}
  header.rama-header .rama-header-button-cart .dropdown-menu-outer{display:none !important}
  header.rama-header .rama-header-button-badge{left:auto;right:0;top:2px;bottom:auto;color:#fff}
  header.rama-header .rama-header-button-badge.is-visible{display:flex}

  header.rama-header .rama-header-search{grid-area:search;flex-basis:auto}
  header.rama-header .rama-header-search-form input[type="text"]{padding-top:11px;padding-bottom:11px;font-size:16px;border-radius:4px}

  /* thin sticky call/cart bar after scrolling past the header */
  #rw-mini-bar{position:fixed;left:0;right:0;top:0;z-index:9990;display:flex;align-items:stretch;height:44px;background:var(--primary);box-shadow:0 2px 8px rgba(0,0,0,.3);transform:translateY(-110%);transition:transform .2s ease}
  #rw-mini-bar.is-shown{transform:none}
  #rw-mini-bar a{flex:1;display:flex;align-items:center;justify-content:center;gap:8px;color:#fff;font:600 15px/1 var(--family-header);text-transform:uppercase;text-decoration:none;border-right:1px solid rgba(255,255,255,.15)}
  #rw-mini-bar a:last-child{border-right:0}
  #rw-mini-bar a.rw-call{background:var(--accent)}
  #rw-mini-bar i{font-size:18px}

  /* ---------- 3) Sticky Add to Cart on product pages ---------- */
  #rw-sticky-atc{position:fixed;left:0;right:0;bottom:0;z-index:9991;display:flex;align-items:center;gap:8px;padding:8px 10px calc(8px + env(safe-area-inset-bottom));background:#fff;border-top:1px solid #ddd;box-shadow:0 -3px 10px rgba(0,0,0,.18);transform:translateY(110%);transition:transform .2s ease}
  #rw-sticky-atc.is-shown{transform:none}
  #rw-sticky-atc .rw-price{font:700 20px/1 var(--family-header);color:var(--text);white-space:nowrap}
  #rw-sticky-atc .rw-qty{display:flex;align-items:center;gap:4px;font-size:13px;color:#555}
  #rw-sticky-atc .rw-qty input{width:52px;height:40px;text-align:center;font-size:16px;border:1px solid #bbb;border-radius:4px}
  #rw-sticky-atc button{flex:1;height:46px;border:0;border-radius:4px;background:var(--accent);color:#fff;font:600 17px/1 var(--family-header);text-transform:uppercase}
  body.rw-has-sticky-atc{padding-bottom:66px}

  /* ---------- 4) First 8 sub-category tiles shown; the rest behind a toggle ---------- */
  .rw-subcats-collapsible:not(.rw-subcats-open) .filter-option-sub-category-outer:nth-child(n+9){display:none !important}
  .rw-subcats-toggle{display:block;width:100%;margin:6px 0 8px;padding:12px 14px;min-height:44px;background:var(--secondary);color:var(--text);border:0;border-radius:4px;font:600 16px/1.2 var(--family-header);text-transform:uppercase;text-align:left}
  .rw-subcats-toggle:after{content:"\f107";font-family:FontAwesome;float:right;font-size:20px}
  .rw-subcats-open .rw-subcats-toggle:after{content:"\f106"}
  .rw-subcats-collapsible details > summary{display:none}

  /* ---------- 7) Category intro hidden on phones; Read more / Show less ---------- */
  .rw-catintro.rw-catintro-collapsed .rw-catintro-inner{display:none}
  .rw-catintro-toggle{
    display:flex;
    align-items:center;
    justify-content:center;
    width:100%;
    min-height:44px;
    min-width:44px;
    margin:4px 0 8px;
    padding:10px 14px;
    background:#fff;
    color:var(--text);
    border:1px solid #bbb;
    border-radius:4px;
    font:600 16px/1.2 var(--family-header);
    cursor:pointer;
    text-align:center;
  }

  /* ---------- 5) Tap-friendly pagination ---------- */
  .pagination-container{text-align:center;line-height:1.4}
  ul.pagination{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:10px 0}
  ul.pagination > li{margin:0}
  ul.pagination > li > a,
  ul.pagination > li > span{display:flex;align-items:center;justify-content:center;min-width:44px;height:44px;padding:0 10px;font-size:17px;border-radius:4px;background:#fff;border:1px solid #bbb;text-decoration:none}
  ul.pagination > li.active > span{background:var(--primary);border-color:var(--primary);color:#fff}
}
