@charset "UTF-8";
/* Mobile Floating Menu and Cart V3.0.9 styles. Moved verbatim out of the header.tpl inline <style>
   at the closing head tag (was V3.0.8 lines 124-405). Linked as mfm_storefront.css?v=3.0.9; bump ?v= with every change. */
  /* === THE DEVICE WIDTH LOCK === */
  html.mf-mobile-active, html.mf-mobile-active body {
    max-width: 100vw !important;
    overflow-x: hidden !important; 
    width: 100% !important;
  }
  body.mf-mobile.lock-scroll { overscroll-behavior: none !important; }
  body.mf-mobile .navbar-header { cursor: pointer; }

  /* === MICRO-TARGET SCROLL WINDOWS (Quarantine) === */
  .m-scroll-window {
    width: 100% !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important; 
    display: block !important;
    margin-bottom: 15px;
  }

  /* ============================================================
     GHOST CHEVRON SYSTEM — Tables (Horizontal)
  ============================================================ */
  .m-table-wrapper { position: relative; margin-bottom: 15px; }
  .m-scroll-window { margin-bottom: 0 !important; }

  .m-ghost-h {
    position: absolute;
    top: 50%;
    color: rgba(233, 30, 99, 0.7);
    font-size: 20px;
    line-height: 1;
    pointer-events: none;
    z-index: 10;
    opacity: 0;
    transition: opacity 0.4s ease-in-out;
  }
  .m-ghost-h.instant { transition: none !important; }
  .m-ghost-h.left  { left: 6px;  transform: translateY(-50%); animation: mGhostL 2s infinite; }
  .m-ghost-h.right { right: 6px; transform: translateY(-50%); animation: mGhostR 2s infinite; }

  @keyframes mGhostL {
    0%, 20%, 50%, 80%, 100% { transform: translateY(-50%) translateX(0);    }
    40%                      { transform: translateY(-50%) translateX(-8px); }
    60%                      { transform: translateY(-50%) translateX(-4px); }
  }
  @keyframes mGhostR {
    0%, 20%, 50%, 80%, 100% { transform: translateY(-50%) translateX(0);   }
    40%                      { transform: translateY(-50%) translateX(8px); }
    60%                      { transform: translateY(-50%) translateX(4px); }
  }

  #tab-description img, .category-info img { max-width: 100% !important; height: auto !important; }
  #tab-description, .category-info { word-wrap: break-word !important; overflow-wrap: break-word !important; }

  /* === FLOATING BUTTONS === */
  body.mf-mobile .floating-action-btn {
    z-index: 2147483647 !important;
    background-color: #FADADD !important;
    border: 1px solid #d8a4ab !important;
    padding: 0 18px !important;
    height: 44px !important;
    min-width: 44px !important;
    border-radius: 4px !important;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    touch-action: manipulation !important;
    box-shadow: 0 4px 8px rgba(0,0,0,0.2) !important;
    display: flex !important;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
  }
  body.mf-mobile .floating-action-btn i { color: #333333 !important; font-size: 17px !important; }
  body.mf-mobile.is-scrolled #float-menu-btn,
  body.mf-mobile.is-scrolled #float-cart-btn { opacity: 1 !important; visibility: visible !important; }
  body.mf-mobile.on-cart-page #float-cart-btn { display: none !important; }
  body.mf-mobile.modal-open .floating-action-btn { display: none !important; }
  /* V3.0.6 A: fade-away - layered on is-scrolled; visibility switches only at the end of the fade, so a half-faded button still takes a tap */
  body.mf-mobile.is-scrolled.mf-fab-away #float-menu-btn,
  body.mf-mobile.is-scrolled.mf-fab-away #float-cart-btn { opacity: 0 !important; visibility: hidden !important; }
  @media (prefers-reduced-motion: reduce) { body.mf-mobile .floating-action-btn { transition: none !important; } }
  /* V3.0.6 F6: an ASM free-shipping box or the HDM "Why we offer this" box is showing - the buttons step aside (browsers without :has keep today's behaviour) */
  body.mf-mobile:has(#fs-modal-backdrop[style*="display: flex"], #abs-modal-backdrop[style*="display: flex"], #fs-hire-modal-backdrop[style*="display: flex"], #fs-greyed-modal-backdrop[style*="display: flex"], #fs-po-modal-backdrop[style*="display: flex"], #hdcs-modal-backdrop[style*="display: flex"]) .floating-action-btn { display: none !important; }
  /* V3.0.6 F10: past the 768 px breakpoint the page shows its desktop menu - no floating menu button */
  @media (min-width: 768px) { body.mf-mobile #float-menu-btn { display: none !important; } }

  /* === OVERLAY MENUS === */
  body.mf-mobile .collapsing { transition-duration: 0.2s !important; overflow: hidden !important; }
  body.mf-mobile #cart .dropdown-menu {
    transition: all 0.2s ease-in-out !important;
    overflow-y: auto !important;
    overscroll-behavior: none !important;
    box-shadow: 0 10px 25px rgba(0,0,0,0.3) !important;
    border-radius: 4px !important;
    z-index: 2147483645 !important;
  }
  body.mf-mobile #cart .dropdown-menu {
    position: fixed !important;
    left: 10px !important;
    width: calc(100vw - 20px) !important;
    right: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    background-color: #ffffff !important;
    border: 1px solid #ccc !important;
    margin: 0 !important;
  }
  @media (max-width: 767px) { /* V3.0.6 F10: phone menu rules only - the cart panel keeps its look at every width */
  body.mf-mobile .navbar-ex1-collapse {
    transition: all 0.2s ease-in-out !important;
    overflow-y: auto !important;
    overscroll-behavior: none !important;
    box-shadow: 0 10px 25px rgba(0,0,0,0.3) !important;
    border-radius: 4px !important;
    z-index: 2147483645 !important;
  }
  body.mf-mobile .navbar-ex1-collapse {
    position: fixed !important;
    background-color: #F2E8DF !important;
    border: 1px solid #e0d5cb !important;
    left: 10px !important;
    width: calc(100vw - 20px) !important;
    right: auto !important;
  }
  body.mf-mobile .navbar-ex1-collapse.float-opened.in,
  body.mf-mobile .navbar-ex1-collapse.float-opened.collapsing {
    position: fixed !important;
    top: 10vh !important;
    left: 10px !important;
    width: calc(100vw - 20px) !important;
    right: auto !important;
    margin: 0 !important;
    height: auto !important;
  }
  }
  
  body.mf-mobile #cart .dropdown-menu.float-opened {
    position: fixed !important;
    top: 10vh !important;
    left: 10px !important;
    width: calc(100vw - 20px) !important;
    right: auto !important;
    margin: 0 !important;
    height: auto !important;
  }

  /* === THE 90% MATCH LAYOUT === */
  body.mf-mobile .m-close-link { color: #e91e63 !important; text-decoration: underline !important; font-size: 14px; font-weight: bold; margin-left: 12px; cursor: pointer; }
  body.mf-mobile .cart-top-buttons-wrapper { 
    position: sticky; 
    top: 0 !important; 
    background: #ffffff; 
    z-index: 10; 
    padding: 12px 10px; 
    border-bottom: 2px solid #eee; 
    margin: 0; 
    list-style: none; 
    transform: translate3d(0, 0, 0); 
    -webkit-transform: translate3d(0, 0, 0); 
    will-change: transform; 
    margin-top: 0 !important;
  }
  body.mf-mobile .cart-top-buttons-wrapper p { margin: 0 !important; text-align: center; }
  body.mf-mobile #cart .dropdown-menu > div > table + table,
  body.mf-mobile #cart .dropdown-menu > li > div > p.text-right:last-child { display: none !important; }
  body.mf-mobile .cart-top-buttons-wrapper p.text-right { display: block !important; }

  body.mf-mobile #cart .dropdown-menu li:first-child table { border-collapse: collapse !important; border: none !important; width: 100% !important; }
  body.mf-mobile #cart .dropdown-menu li:first-child table tr { display: block !important; border-bottom: 1px solid #eee !important; }
  body.mf-mobile #cart .dropdown-menu li:first-child table tr:last-child { border-bottom: none !important; }
  
  body.mf-mobile .mc-app-row { padding: 15px 10px !important; display: flex !important; flex-direction: row !important; flex-wrap: nowrap !important; align-items: flex-start !important; width: 100% !important; box-sizing: border-box !important; border: none !important; }
  body.mf-mobile .mc-img { width: 85px !important; min-width: 85px !important; flex-shrink: 0 !important; margin-right: 15px !important; }
  body.mf-mobile .mc-img img { width: 100% !important; height: auto !important; border: 1px solid #f1f1f1 !important; border-radius: 4px !important; display: block !important; }
  body.mf-mobile .mc-img.mc-no-img { background: #fafafa; border: 1px dashed #ddd; border-radius: 4px; height: 85px; align-items: center; justify-content: center; display: flex; }
  body.mf-mobile .mc-body { flex-grow: 1 !important; min-width: 0 !important; display: flex !important; flex-direction: column !important; }
  body.mf-mobile .mc-title { color: #e91e63 !important; font-family: 'Montserrat', sans-serif !important; font-size: 15px !important; font-weight: 500 !important; line-height: 1.3 !important; margin-bottom: 6px !important; text-decoration: none !important; display: block !important; }
  body.mf-mobile .mc-opt { font-family: 'Montserrat', sans-serif !important; font-size: 14px !important; color: #333 !important; margin-bottom: 2px !important; line-height: 1.3 !important; }
  body.mf-mobile .mc-qty-line { font-family: 'Montserrat', sans-serif !important; font-size: 14px !important; color: #000 !important; margin-top: 8px !important; margin-bottom: 4px !important; display: flex !important; align-items: center !important; }
  body.mf-mobile .mc-remove { color: #e91e63 !important; font-weight: bold !important; text-decoration: underline !important; margin-left: 10px !important; cursor: pointer !important; }
  body.mf-mobile .mc-price { font-family: 'Montserrat', sans-serif !important; font-size: 15px !important; font-weight: 700 !important; color: #000 !important; margin-top: 2px !important; }

  /* ============================================================
     GHOST CHEVRON SYSTEM — Cart (Vertical, Dual-Direction)
  ============================================================ */
  #mc-ghost-up {
    position: sticky;
    top: 54px; 
    height: 0;
    overflow: visible;
    text-align: center;
    line-height: 0;
    pointer-events: none;
    z-index: 9;
    opacity: 0;
    transition: opacity 0.4s ease-in-out;
  }
  #mc-ghost-up.instant { transition: none !important; }
  #mc-ghost-up i {
    display: inline-block;
    position: relative;
    top: 4px; 
    color: rgba(233, 30, 99, 0.7);
    font-size: 18px;
    width: 28px;
    height: 28px;
    line-height: 28px;
    text-align: center;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.92);
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.25); /* V3.0.6 F12: reads as an overlay hint, not over the text */
    animation: mcGhostBounceU 2s infinite;
  }
  @keyframes mcGhostBounceU {
    0%, 20%, 50%, 80%, 100% { transform: translateY(0);    }
    40%                      { transform: translateY(-8px); }
    60%                      { transform: translateY(-4px); }
  }

  #mc-ghost-down {
    position: sticky;
    bottom: 0;
    height: 0;
    overflow: visible;
    text-align: center;
    line-height: 0;
    pointer-events: none;
    z-index: 100;
    opacity: 0;
    transition: opacity 0.4s ease-in-out;
  }
  #mc-ghost-down.instant { transition: none !important; }
  #mc-ghost-down i {
    display: inline-block;
    position: relative;
    top: -34px; 
    color: rgba(233, 30, 99, 0.7);
    font-size: 18px;
    width: 28px;
    height: 28px;
    line-height: 28px;
    text-align: center;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.92);
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.25); /* V3.0.6 F12: reads as an overlay hint, not over the text */
    animation: mcGhostBounceD 2s infinite;
  }
  @keyframes mcGhostBounceD {
    0%, 20%, 50%, 80%, 100% { transform: translateY(0);   }
    40%                      { transform: translateY(8px); }
    60%                      { transform: translateY(4px); }
  }

  /* === V2.0.1 STABILITY UPGRADES === */
  body.mf-mobile #cart .dropdown-menu, body.mf-mobile #cart .dropdown-menu *:not(i):not(.fa) { font-family: 'Montserrat', sans-serif !important; }
  body.mf-mobile #cart .dropdown-menu { padding-top: 0 !important; }
  
  /* Flexbox Alignment Fix */
  body.mf-mobile.on-cart-page #m-float-wrapper { justify-content: flex-end !important; }
  
  .mc-unit-price-flag { font-weight: 300 !important; font-size: 12px !important; background: #eeeeee; padding: 2px 6px; border-radius: 4px; margin-left: 8px; color: #333; display: inline-block; vertical-align: middle; }
  
  /* Narrowed Shipping Accordion */
  .mc-shipping-accordion { width: 80%; margin: 15px auto; }
  .mc-shipping-accordion, .mc-shipping-accordion *:not(.fa) { font-family: 'Comfortaa', cursive !important; }
  .mc-shipping-header { background: #eeeeee; padding: 10px 15px; cursor: pointer; color: #333; font-weight: normal !important; text-align: left; }
  .mc-shipping-content { display: none; padding: 15px 10px; background: #fafafa; border-radius: 0 0 4px 4px; border: 1px solid #eee; border-top: none; }
  .mc-shipping-btn { 
    background-color: #FADADD !important; 
    background-image: none !important;
    border: 1px solid #d8a4ab !important;
    border-radius: 0px !important;
    color: #333333 !important; 
    padding: 10px 15px; 
    width: 100%; 
    margin-top: 5px; 
    font-weight: normal !important; 
    cursor: pointer; 
  }
  .mc-shipping-content .form-control { margin-bottom: 10px; width: 100%; padding: 8px; border: 1px solid #ccc; border-radius: 4px; box-sizing: border-box; }
  body.mf-mobile .mc-shipping-content input, body.mf-mobile .mc-shipping-content select { font-size: 16px !important; } /* V3.0.7 F15: 16 px or iOS zooms the page */
  .mc-calc-msg { margin-top: 12px; color: #c2185b; font-size: 13px; text-align: center; line-height: 1.4; }