/* STAMPON.GR Premium Mobile 3-Level Menu v1.2.0
   Isolated from the Blocksy offcanvas. No desktop changes. */
#stampon-premium-mobile-nav[hidden] { display: none !important; }

@media (max-width: 999.98px) {
  body.spmn-open { overflow: hidden !important; }

  #stampon-premium-mobile-nav {
    --spmn-red: #e60012;
    --spmn-deep-red: #b90012;
    --spmn-ink: #17191e;
    --spmn-mist: #f4f5f7;
    --spmn-line: #e4e6ea;
    position: fixed !important;
    inset: 0 !important;
    z-index: 2147483000 !important;
    width: 100vw !important;
    height: 100vh !important;
    height: 100dvh !important;
    padding: 0 !important;
    margin: 0 !important;
    background: var(--spmn-mist) !important;
    color: var(--spmn-ink) !important;
    font-family: inherit !important;
    isolation: isolate !important;
    overscroll-behavior: contain !important;
    -webkit-font-smoothing: antialiased;
  }

  #stampon-premium-mobile-nav *,
  #stampon-premium-mobile-nav *::before,
  #stampon-premium-mobile-nav *::after { box-sizing: border-box !important; }

  #stampon-premium-mobile-nav .spmn__shell {
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
    min-height: 0 !important;
    width: 100% !important;
    overflow: hidden !important;
  }

  #stampon-premium-mobile-nav .spmn__top {
    flex: 0 0 auto !important;
    background: var(--spmn-red) !important;
    color: #fff !important;
    padding: max(8px, env(safe-area-inset-top)) 18px 18px !important;
    box-shadow: 0 8px 24px rgba(75, 10, 18, .10);
  }

  #stampon-premium-mobile-nav .spmn__toolbar {
    display: grid !important;
    grid-template-columns: 48px minmax(0, 1fr) 48px !important;
    align-items: center !important;
    gap: 6px !important;
    min-height: 52px !important;
  }

  #stampon-premium-mobile-nav .spmn__eyebrow {
    display: block !important;
    font-size: 11px !important;
    letter-spacing: .12em !important;
    font-weight: 700 !important;
    text-align: center !important;
    color: rgba(255,255,255,.86) !important;
  }

  #stampon-premium-mobile-nav .spmn__eyebrow span { opacity: .6; padding: 0 3px; }

  #stampon-premium-mobile-nav .spmn__icon-button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 48px !important;
    height: 48px !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 14px !important;
    background: rgba(255,255,255,.10) !important;
    color: #fff !important;
    cursor: pointer !important;
  }

  #stampon-premium-mobile-nav .spmn__icon-button svg {
    display: block !important;
    width: 25px !important;
    height: 25px !important;
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 2.1 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
  }

  #stampon-premium-mobile-nav .spmn__heading-row {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    min-height: 62px !important;
    padding: 7px 0 0 !important;
  }

  #stampon-premium-mobile-nav .spmn__title {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #fff !important;
    font-size: clamp(23px, 5.5vw, 31px) !important;
    font-weight: 800 !important;
    letter-spacing: -.03em !important;
    line-height: 1.18 !important;
    overflow-wrap: anywhere !important;
  }

  #stampon-premium-mobile-nav .spmn__view-all {
    flex: 0 0 auto !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    margin: 0 !important;
    padding: 13px 15px !important;
    min-height: 46px !important;
    text-decoration: none !important;
    border-radius: 15px !important;
    background: #fff !important;
    color: var(--spmn-red) !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    line-height: 1.1 !important;
    box-shadow: 0 3px 12px rgba(90,0,0,.08) !important;
  }

  #stampon-premium-mobile-nav .spmn__scroll {
    display: block !important;
    flex: 1 1 auto !important;
    min-height: 0 !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    overscroll-behavior-y: contain !important;
    scrollbar-width: thin;
    scrollbar-color: #c5c8ce transparent;
    padding: 0 !important;
  }

  #stampon-premium-mobile-nav .spmn__content {
    padding: 20px 16px 25px !important;
    max-width: 900px !important;
    margin: 0 auto !important;
  }

  #stampon-premium-mobile-nav .spmn__list,
  #stampon-premium-mobile-nav .spmn__chips {
    display: flex !important;
    flex-direction: column !important;
    gap: 9px !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
  }

  #stampon-premium-mobile-nav .spmn__card {
    display: flex !important;
    width: 100% !important;
    min-height: 67px !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 12px 16px !important;
    margin: 0 !important;
    background: #fff !important;
    border: 1px solid var(--spmn-line) !important;
    border-radius: 18px !important;
    color: var(--spmn-ink) !important;
    text-decoration: none !important;
    text-align: left !important;
    font-family: inherit !important;
    cursor: pointer !important;
    font-size: 16px !important;
    font-weight: 650 !important;
    line-height: 1.35 !important;
    box-shadow: 0 1px 2px rgba(0,0,0,.025) !important;
    transition: border-color .18s ease, background-color .18s ease, transform .18s ease !important;
  }

  #stampon-premium-mobile-nav .spmn__card:active { transform: scale(.99) !important; }
  #stampon-premium-mobile-nav .spmn__card:focus-visible,
  #stampon-premium-mobile-nav .spmn__chip:focus-visible,
  #stampon-premium-mobile-nav button:focus-visible,
  #stampon-premium-mobile-nav .spmn__view-all:focus-visible {
    outline: 3px solid #ffadad !important;
    outline-offset: 3px !important;
  }

  #stampon-premium-mobile-nav .spmn__symbol {
    flex: 0 0 auto !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 42px !important;
    height: 42px !important;
    border-radius: 13px !important;
    background: #f2f3f5 !important;
    color: var(--spmn-ink) !important;
  }

  #stampon-premium-mobile-nav .spmn__symbol svg {
    display: block !important;
    height: 24px !important;
    width: 24px !important;
    stroke: currentColor !important;
    stroke-width: 1.8 !important;
    fill: none !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
  }

  #stampon-premium-mobile-nav .spmn__card-label {
    display: block !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
    overflow-wrap: anywhere !important;
  }

  #stampon-premium-mobile-nav .spmn__chevron {
    display: block !important;
    width: 21px !important;
    height: 21px !important;
    flex: 0 0 auto !important;
    color: var(--spmn-ink) !important;
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 2.2 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
  }

  /* The terminal level alone becomes densely packed rounded chips. */
  #stampon-premium-mobile-nav .spmn__chips {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    gap: 9px !important;
    align-content: flex-start !important;
  }

  #stampon-premium-mobile-nav .spmn__chips > li { flex: 0 0 auto !important; min-width: 0 !important; }

  #stampon-premium-mobile-nav .spmn__chip {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    max-width: calc(100vw - 32px) !important;
    min-height: 48px !important;
    padding: 12px 15px !important;
    border: 1px solid transparent !important;
    border-radius: 16px !important;
    background: #fff !important;
    color: var(--spmn-ink) !important;
    text-decoration: none !important;
    text-align: left !important;
    font-family: inherit !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    line-height: 1.32 !important;
    overflow-wrap: anywhere !important;
    cursor: pointer !important;
    box-shadow: 0 1px 0 rgba(0,0,0,.015) !important;
  }

  #stampon-premium-mobile-nav .spmn__card:hover,
  #stampon-premium-mobile-nav .spmn__chip:hover {
    color: var(--spmn-deep-red) !important;
    border-color: #ffb7bc !important;
    background: #fffafa !important;
  }

  #stampon-premium-mobile-nav .spmn__empty {
    margin: 12px !important;
    color: #51545c !important;
    font-size: 15px !important;
  }

  #stampon-premium-mobile-nav .spmn__bottom {
    display: flex !important;
    flex: 0 0 auto !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
    padding: 9px 18px max(9px, env(safe-area-inset-bottom)) !important;
    border-top: 1px solid #e9eaed !important;
    color: #8b8c90 !important;
    background: var(--spmn-mist) !important;
    font-size: 10px !important;
    font-weight: 650 !important;
    letter-spacing: .04em !important;
  }
}

@media (max-width: 359px) {
  #stampon-premium-mobile-nav .spmn__top { padding-left: 12px !important; padding-right: 12px !important; }
  #stampon-premium-mobile-nav .spmn__content { padding-left: 12px !important; padding-right: 12px !important; }
  #stampon-premium-mobile-nav .spmn__title { font-size: 21px !important; }
  #stampon-premium-mobile-nav .spmn__view-all { font-size: 12px !important; padding: 11px !important; }
}

@media (prefers-reduced-motion: reduce) {
  #stampon-premium-mobile-nav .spmn__card,
  #stampon-premium-mobile-nav .spmn__chip { transition: none !important; }
}

/* Secondary saved WP menu links remain available below the product categories. */
@media (max-width: 999.98px) {
  #stampon-premium-mobile-nav .spmn__extras {
    margin: 26px 0 0 !important;
    padding: 16px 2px 8px !important;
    border-top: 1px solid #dce0e5 !important;
    display: flex !important;
    gap: 8px !important;
    flex-wrap: wrap !important;
  }
  #stampon-premium-mobile-nav .spmn__extras-title {
    flex: 0 0 100% !important;
    margin: 0 0 5px !important;
    color: #69717b !important;
    font-size: 11px !important;
    letter-spacing: .1em !important;
    font-weight: 800 !important;
  }
  #stampon-premium-mobile-nav .spmn__extras-link {
    color: #34363b !important;
    border: 1px solid #dfe1e6 !important;
    background: #fff !important;
    border-radius: 12px !important;
    padding: 10px 13px !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    line-height: 1.2 !important;
  }
}