/* SwankageTCG — Launch 02 mobile navigation finish. Desktop untouched. */
@media (max-width: 991px) {
  #header .mobile-nav-container {
    background: var(--sw-header, #071014) !important;
    border-bottom: 1px solid var(--sw-border, #2c4034) !important;
  }
  #header .nav-mobile-header {
    background: var(--sw-header, #071014) !important;
    border-bottom: 1px solid var(--sw-border, #2c4034) !important;
    box-shadow: 0 5px 20px rgba(0,0,0,.24) !important;
  }
  #header .nav-mobile-header-container .item-menu-icon button,
  #header .nav-mobile-header-container .a-search-icon,
  #header .nav-mobile-header-container .a-mobile-cart {
    color: var(--sw-text, #f3f8f5) !important;
    border-radius: 5px;
    min-width: 44px;
    min-height: 44px;
  }
  #header .nav-mobile-header-container .item-menu-icon button:focus-visible,
  #header .nav-mobile-header-container .a-search-icon:focus-visible,
  #header .nav-mobile-header-container .a-mobile-cart:focus-visible {
    outline: 2px solid var(--sw-accent, #a8ff2a);
    outline-offset: 2px;
  }
  #header .nav-mobile-header-container .a-mobile-cart .notification {
    background: var(--sw-accent, #a8ff2a) !important;
    color: #06100a !important;
  }
  #header .mobile-search-form {
    background: var(--sw-header, #071014) !important;
    border-top: 1px solid var(--sw-border, #2c4034);
    padding: 10px 14px !important;
    margin: 0 !important;
    max-width: none !important;
  }
  #header .mobile-search-form form { background: var(--sw-panel, #0d1810); }
  #header .mobile-search-form input {
    background: var(--sw-panel, #0d1810) !important;
    color: var(--sw-text, #f3f8f5) !important;
    border: 1px solid var(--sw-border, #2c4034) !important;
    border-radius: 5px !important;
  }
  #header .mobile-search-form input::placeholder { color: var(--sw-muted, #96ab9a) !important; }
  #header .mobile-search-form .btn-search {
    background: var(--sw-accent, #a8ff2a) !important;
    color: #06100a !important;
    border-radius: 5px !important;
  }
  #overlay_bg.overlay-bg {
    background: rgba(0, 0, 0, .75) !important;
    z-index: 10500 !important;
  }
  #navMobile.nav-mobile {
    top: 0 !important;
    left: 0 !important;
    width: min(360px, 94vw) !important;
    height: 100vh !important;
    height: 100dvh !important;
    z-index: 10501 !important;
    background: var(--sw-bg, #071014) !important;
    color: var(--sw-text, #f3f8f5) !important;
    border-right: 1px solid var(--sw-border, #2c4034) !important;
    box-shadow: 12px 0 40px rgba(0,0,0,.35) !important;
    transform: translateX(-105%);
    visibility: hidden;
    pointer-events: none;
    text-align: left;
    transition: transform .22s ease, visibility 0s linear .22s !important;
  }
  #navMobile.nav-mobile.nav-mobile-open {
    transform: translateX(0);
    visibility: visible;
    pointer-events: auto;
    transition: transform .22s ease, visibility 0s !important;
  }
  #navMobile .nav-mobile-sc {
    width: 100%; height: 100%; overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-color: var(--sw-border, #2c4034) transparent;
  }
  #navMobile .nav-mobile-inner {
    box-sizing: border-box; width: 100%; min-width: 0;
    padding: 14px 18px 56px;
    top: 0; bottom: auto;
  }
  #navMobile .sw-mobile-drawer-head {
    display: flex; align-items: center; justify-content: space-between;
    gap: 12px; padding: 8px 1px 19px; margin-bottom: 14px;
    border-bottom: 1px solid var(--sw-border, #2c4034);
  }
  #navMobile .sw-mobile-drawer-brand { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; }
  #navMobile .sw-mobile-drawer-name { color: var(--sw-text, #f3f8f5); font: 900 italic 24px/1 Tahoma,Arial,sans-serif; }
  #navMobile .sw-mobile-drawer-name strong { color: var(--sw-accent, #a8ff2a); }
  #navMobile .sw-mobile-drawer-brand small { color: var(--sw-muted, #96ab9a); font: 700 10px/1.1 Tahoma,Arial,sans-serif; letter-spacing: .13em; }
  #navMobile .sw-mobile-drawer-close {
    width: 44px; height: 44px; flex: 0 0 44px;
    display: grid; place-items: center; cursor: pointer;
    background: var(--sw-panel, #0d1810);
    border: 1px solid var(--sw-border, #2c4034); border-radius: 5px;
    color: var(--sw-text, #f3f8f5); font-size: 19px;
  }
  #navMobile .sw-mobile-drawer-close:hover { border-color: var(--sw-accent, #a8ff2a); color: var(--sw-accent, #a8ff2a); }
  #navMobile .nav-mobile-inner > .row { margin-inline: -8px; }
  #navMobile .nav-mobile-inner > .row > div { padding-inline: 8px; }
  #navMobile .mobile-nav-buttons { width: 100% !important; margin: 0 0 14px; }
  #navMobile .mobile-nav-buttons .btn {
    min-height: 46px; width: 100%; padding: 11px 14px !important;
    background: var(--sw-accent, #a8ff2a) !important;
    border: 1px solid var(--sw-accent, #a8ff2a) !important;
    border-radius: 5px !important;
    font: 800 13px/1.4 Tahoma,Arial,sans-serif;
    color: #071014 !important; box-shadow: none !important;
  }
  #navMobile .nav-tabs-mobile-menu {
    display: flex; gap: 6px; margin-bottom: 8px;
    border: none !important;
  }
  #navMobile .nav-tabs-mobile-menu .nav-link {
    flex: 1 1 0; min-width: 0; min-height: 42px;
    background: var(--sw-panel, #0d1810) !important;
    border: 1px solid var(--sw-border, #2c4034) !important;
    border-radius: 5px !important;
    font: 800 12px/1.3 Tahoma,Arial,sans-serif;
    color: var(--sw-muted, #96ab9a) !important;
    padding: 10px 7px !important;
  }
  #navMobile .nav-tabs-mobile-menu .nav-link.active {
    background: var(--sw-panel2, #142218) !important;
    border-color: var(--sw-accent, #a8ff2a) !important;
    color: var(--sw-accent, #a8ff2a) !important;
  }
  #navMobile .tab-content-mobile-menu { padding-top: 2px !important; }
  #navMobile .navbar-nav { width: 100% !important; padding: 0 0 30px !important; }
  #navMobile .navbar-nav > .nav-item {
    width: 100%; border-bottom: 1px solid var(--sw-border, #2c4034) !important;
  }
  #navMobile .navbar-nav .nav-item > .nav-link {
    display: flex; align-items: center; gap: 8px; width: 100%;
    min-height: 44px; padding: 11px 11px !important;
    border-radius: 4px; border-left: 2px solid transparent;
    background: transparent !important;
    color: var(--sw-text, #f3f8f5) !important;
    font: 700 13px/1.35 Tahoma,Arial,sans-serif;
    text-align: left; text-decoration: none !important;
    white-space: normal;
  }
  #navMobile .navbar-nav .nav-item > .nav-link:hover,
  #navMobile .navbar-nav .nav-item > .nav-link:focus-visible,
  #navMobile .navbar-nav .nav-item > .nav-link.sw-mobile-current {
    background: color-mix(in srgb, var(--sw-accent, #a8ff2a) 11%, transparent) !important;
    border-left-color: var(--sw-accent, #a8ff2a);
    color: var(--sw-accent, #a8ff2a) !important;
  }
  #navMobile .navbar-nav .nav-item > .nav-link:focus-visible,
  #navMobile .sw-mobile-drawer-close:focus-visible {
    outline: 2px solid var(--sw-accent, #a8ff2a); outline-offset: 2px;
  }
  #navMobile .sw-mobile-section-label {
    list-style: none; margin: 16px 0 7px; padding: 0 11px;
    font: 800 10px/1.4 Tahoma,Arial,sans-serif; letter-spacing: .1em;
    color: var(--sw-accent, #a8ff2a);
  }
  #navMobile .profile-dropdown .image-profile-drop,
  #navMobile .profile-dropdown .dropdown-menu > li > a,
  #navMobile .profile-dropdown .dropdown-menu > li .btn-logout {
    color: var(--sw-text, #f3f8f5) !important;
  }
  #navMobile .profile-dropdown .dropdown-menu,
  #navMobile .navbar-nav > .nav-item > .dropdown-menu {
    background: var(--sw-panel, #0d1810) !important;
    border: 1px solid var(--sw-border, #2c4034) !important;
    border-radius: 5px !important;
    margin: 5px 0 10px !important;
    left: 0 !important;
    top: 0 !important;
    width: 100%;
  }
  #navMobile .profile-dropdown .dropdown-menu > li > a:hover,
  #navMobile .profile-dropdown .dropdown-menu > li .btn-logout:hover { color: var(--sw-accent, #a8ff2a) !important; }
  #navMobile .mobile-flex-dropdowns { flex-wrap: wrap; gap: 8px; padding: 12px 0; }
  #navMobile .mobile-flex-dropdowns .nav-link { color: var(--sw-text, #f3f8f5) !important; }
  body.sw-mobile-drawer-open { overflow: hidden !important; }
  [dir="rtl"] #navMobile.nav-mobile { left: auto !important; right: 0 !important; transform: translateX(105%); border-right: 0 !important; border-left: 1px solid var(--sw-border, #2c4034) !important; }
  [dir="rtl"] #navMobile.nav-mobile.nav-mobile-open { transform: translateX(0); }
}
@media (max-width: 360px) {
  #header .nav-mobile-header-container .mobile-logo { width: min(142px, 100%); }
  #navMobile .nav-mobile-inner { padding-inline: 14px; }
}
@media (prefers-reduced-motion: reduce) {
  #navMobile.nav-mobile { transition: none !important; }
}

/* Launch 14 — Mobile search: keep the input and submit control inside one aligned row.
   The legacy absolute button was anchored to the outer .top-search-bar rather
   than the padded inner form. Do not force the initially hidden form visible. */
@media (max-width: 991px) {
  #header .mobile-nav-container .mobile-search-form {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 100% !important;
    float: none !important;
    margin: 0 !important;
    padding: 10px 14px !important;
    border-top: 1px solid var(--sw-border, #2c4034) !important;
  }
  #header .mobile-nav-container .mobile-search-form form {
    position: relative !important;
    display: flex !important;
    align-items: stretch !important;
    gap: 8px !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    box-sizing: border-box !important;
  }
  #header .mobile-nav-container .mobile-search-form form .input-search {
    flex: 1 1 0 !important;
    display: block !important;
    width: 0 !important;
    min-width: 0 !important;
    max-width: none !important;
    height: 44px !important;
    min-height: 44px !important;
    padding: 0 13px !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    border: 1px solid var(--sw-border, #2c4034) !important;
    border-radius: 5px !important;
    box-shadow: none !important;
    font-size: 13px !important;
    line-height: normal !important;
  }
  #header .mobile-nav-container .mobile-search-form form .btn-search {
    position: static !important;
    inset: auto !important;
    display: flex !important;
    flex: 0 0 44px !important;
    align-items: center !important;
    justify-content: center !important;
    width: 44px !important;
    min-width: 44px !important;
    max-width: 44px !important;
    height: 44px !important;
    min-height: 44px !important;
    padding: 0 !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    border: 1px solid var(--sw-accent, #a8ff2a) !important;
    border-radius: 5px !important;
    background: var(--sw-accent, #a8ff2a) !important;
    color: var(--sw-accent-contrast, #06100a) !important;
    line-height: 1 !important;
    box-shadow: none !important;
  }
  #header .mobile-nav-container .mobile-search-form form .btn-search i,
  #header .mobile-nav-container .mobile-search-form form .btn-search i::before {
    margin: 0 !important;
    padding: 0 !important;
    color: var(--sw-accent-contrast, #06100a) !important;
  }
  /* Legacy AJAX results remain an overlay, never an extra flex child. */
  #header .mobile-nav-container .mobile-search-form form .search-results-ajax {
    position: absolute !important;
    top: calc(100% + 4px) !important;
    left: 0 !important;
    width: 100% !important;
    z-index: 20 !important;
  }
}

/* Launch 24 — match the 3px gap ABOVE and BELOW each marketplace link.
   This extends Launch 23 without touching account links, theme selector or desktop. */
@media (max-width: 991px) {
  #navMobile #navbar_mobile_links > li.nav-item:not(.profile-dropdown):not(.mobile-flex-dropdowns) > a.nav-link {
    margin-top: 3px !important;
    margin-bottom: 3px !important;
  }
}

/* Launch 25 — signed-in mobile drawer account icons (member, vendor, admin).
   The shared profile dropdown includes inline SVGs with hardcoded #666666
   presentation attributes. Override only visible icon paint; leave fill="none"
   and stroke="none" untouched so outline icons keep their original shapes.
   Default: white. Hover/keyboard focus: current site theme accent.
   Desktop, dropdown behavior, spacing, and game-navigation icons unchanged. */
@media (max-width: 991px) {
  #navMobile .profile-dropdown .dropdown-menu > li > a .icon,
  #navMobile .profile-dropdown .dropdown-menu > li .btn-logout .icon {
    color: #ffffff !important;
    transition: color .15s ease;
  }
  /* Icon-font glyphs, including the wishlist heart. */
  #navMobile .profile-dropdown .dropdown-menu .icon i,
  #navMobile .profile-dropdown .dropdown-menu .icon i::before {
    color: inherit !important;
  }
  /* Stop the legacy SVG's hardcoded color attribute inheriting grey. */
  #navMobile .profile-dropdown .dropdown-menu .icon svg {
    color: inherit !important;
  }
  #navMobile .profile-dropdown .dropdown-menu .icon svg[stroke]:not([stroke="none"]),
  #navMobile .profile-dropdown .dropdown-menu .icon svg [stroke]:not([stroke="none"]) {
    stroke: currentColor !important;
  }
  #navMobile .profile-dropdown .dropdown-menu .icon svg[fill]:not([fill="none"]),
  #navMobile .profile-dropdown .dropdown-menu .icon svg [fill]:not([fill="none"]) {
    fill: currentColor !important;
  }
  #navMobile .profile-dropdown .dropdown-menu > li:hover > a .icon,
  #navMobile .profile-dropdown .dropdown-menu > li:focus-within > a .icon,
  #navMobile .profile-dropdown .dropdown-menu > li:hover .btn-logout .icon,
  #navMobile .profile-dropdown .dropdown-menu > li:focus-within .btn-logout .icon {
    color: var(--sw-accent, #a8ff2a) !important;
  }
}

/* Launch 26 — equalize the account-menu icon column on mobile.
   Icon-font Wishlist had a 22px intrinsic glyph box within a 20px wrapper,
   while SVG icons used ~19px. Center both in the same 20px flex slot.
   Preserve the 8px text gap, 19px SVG size, link padding and Launch 25 paint. */
@media (max-width: 991px) {
  #navMobile .profile-dropdown .dropdown-menu > li > a > .icon,
  #navMobile .profile-dropdown .dropdown-menu > li .btn-logout > .icon {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 20px !important;
    width: 20px !important;
    min-width: 20px !important;
    max-width: 20px !important;
    height: 20px !important;
    padding: 0 !important;
    margin-right: 8px !important;
    line-height: 1 !important;
    box-sizing: border-box !important;
  }
  #navMobile .profile-dropdown .dropdown-menu > li > a > .icon > svg,
  #navMobile .profile-dropdown .dropdown-menu > li .btn-logout > .icon > svg {
    display: block !important;
    width: 19px !important;
    height: 19px !important;
    flex: 0 0 auto !important;
    margin: 0 !important;
  }
  #navMobile .profile-dropdown .dropdown-menu > li > a > .icon > i,
  #navMobile .profile-dropdown .dropdown-menu > li .btn-logout > .icon > i {
    display: block !important;
    width: auto !important;
    min-width: 0 !important;
    height: auto !important;
    flex: 0 0 auto !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1 !important;
    text-align: center !important;
  }
  #navMobile .profile-dropdown .dropdown-menu > li > a > .icon > i::before,
  #navMobile .profile-dropdown .dropdown-menu > li .btn-logout > .icon > i::before {
    display: block !important;
    width: auto !important;
    margin: 0 !important;
    text-align: center !important;
  }
  [dir="rtl"] #navMobile .profile-dropdown .dropdown-menu > li > a > .icon,
  [dir="rtl"] #navMobile .profile-dropdown .dropdown-menu > li .btn-logout > .icon {
    margin-right: 0 !important;
    margin-left: 8px !important;
  }
}
