/** Shopify CDN: Minification failed

Line 243:78 Unexpected "link"

**/
/* ===========================================
   ETG CUSTOM THEME -- Etowntec Gaming
   Retro Arcade Aesthetic Override Layer
   =========================================== */

@import url('https://fonts.googleapis.com/css2?family=Press+Start+2P&display=swap');

/* --- ROOT VARIABLES --- */
:root {
  --etg-black:        #121210;
  --etg-black-2:      #1B1B17;
  --etg-black-3:      #2a2a26;
  --etg-black-deep:   #0A0A08;
  --etg-white:        #F7F6F0;
  --etg-green:        #6FBE3A;
  --etg-green-dark:   #4C8A1F;
  --etg-orange:       #F2901E;
  --etg-teal:         #3FC6C9;
}

/* --- GLOBAL BODY --- */
body {
  background-color: var(--etg-black) !important;
}

/* --- SCROLLBAR --- */
::-webkit-scrollbar { width: 5px; }
::-webkit-scrollbar-track { background: var(--etg-black-2); }
::-webkit-scrollbar-thumb { background: var(--etg-green); border-radius: 3px; }

/* --- HEADING SHADOW -- Bungee gets the orange drop --- */
h1, h2, h3 {
  text-shadow: 2px 2px 0 rgba(242, 144, 30, 0.2);
}

/* --- NAV: GREEN BOTTOM BORDER + GRADIENT GLOW --- */
.header-section {
  position: relative;
}
.header-section::after {
  content: '';
  position: absolute;
  bottom: -4px;
  left: 0; right: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--etg-green) 0%, var(--etg-orange) 50%, var(--etg-teal) 100%);
  opacity: 0.45;
  z-index: 20;
  pointer-events: none;
}

/* --- NAV LINKS -- slightly dimmed, white on hover --- */
.header-section .menu-list__link {
  color: rgba(247, 246, 240, 0.7) !important;
  transition: color 0.15s;
}
.header-section .menu-list__link:hover,
.header-section .menu-list__link[aria-expanded="true"] {
  color: var(--etg-white) !important;
}

/* --- PRIMARY BUTTON -- green arcade style (sharper, bolder) --- */
[class*="button--primary"],
.shopify-payment-button__button--unbranded {
  background-color: var(--etg-green) !important;
  color: var(--etg-black-deep) !important;
  border: 2px solid var(--etg-black-deep) !important;
  border-radius: 5px !important;
  box-shadow: 0 5px 0 var(--etg-green-dark) !important;
  font-weight: 700 !important;
  letter-spacing: 0.5px !important;
  text-transform: uppercase !important;
  transition: transform 0.1s ease, box-shadow 0.1s ease !important;
}
[class*="button--primary"]:hover,
.shopify-payment-button__button--unbranded:hover {
  transform: translateY(3px) !important;
  box-shadow: 0 2px 0 var(--etg-green-dark) !important;
  color: var(--etg-black-deep) !important;
}
[class*="button--primary"]:active {
  transform: translateY(5px) !important;
  box-shadow: 0 0px 0 var(--etg-green-dark) !important;
}

/* --- PRODUCT CARDS -- dark bg with green hover border --- */
.card-wrapper,
.product-card,
[class*="card-product"] {
  transition: border-color 0.2s, transform 0.2s !important;
}
.card-wrapper:hover,
.product-card:hover,
[class*="card-product"]:hover {
  border-color: var(--etg-green) !important;
  transform: translateY(-3px) !important;
}

/* --- SECTION DIVIDERS --- */
.shopify-section + .shopify-section {
  position: relative;
}

/* --- ANNOUNCEMENT BAR -- green style --- */
.header-announcements .announcement-bar {
  background: var(--etg-green) !important;
  color: var(--etg-black-deep) !important;
  font-family: 'Press Start 2P', monospace !important;
  font-size: 8px !important;
  letter-spacing: 0.5px !important;
}

/* --- CART DRAWER --- */
.cart-drawer,
[id*="cart-drawer"] {
  background: var(--etg-black-2) !important;
}

/* --- CART DRAWER SUMMARY -- pin checkout area to bottom, always visible --- */
/* Horizon uses .cart-drawer__summary (not __footer) for the sticky checkout block */
.cart-drawer__summary {
  position: sticky !important;
  bottom: 0 !important;
  z-index: 10 !important;
  background: var(--etg-black-2) !important;
  /* Remove Horizon's built-in gradient fade that obscures the top of this block */
  mask-image: none !important;
  -webkit-mask-image: none !important;
  border-top: 1px solid var(--etg-black-3) !important;
  padding: 16px 20px 24px !important;
  margin-top: auto !important;
}

/* --- INPUTS -- dark style --- */
input, textarea, select {
  background-color: var(--etg-black-2) !important;
  color: var(--etg-white) !important;
  border-color: var(--etg-black-3) !important;
}
input::placeholder, textarea::placeholder {
  color: rgba(247, 246, 240, 0.35) !important;
}

/* --- FOCUS RING -- green --- */
*:focus-visible {
  outline-color: var(--etg-green) !important;
}

/* --- PRESS START 2P UTILITY --- */
.etg-ps2 {
  font-family: 'Press Start 2P', monospace;
}

/* --- SCANLINE OVERLAY UTILITY --- */
.etg-scanlines::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: repeating-linear-gradient(
    to bottom,
    rgba(255,255,255,0.018) 0px,
    rgba(255,255,255,0.018) 1px,
    transparent 1px,
    transparent 4px
  );
  pointer-events: none;
  z-index: 1;
}

/* --- GRADIENT TOP BAR UTILITY --- */
.etg-gradient-top::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 4px;
  background: linear-gradient(90deg, var(--etg-green) 0%, var(--etg-orange) 50%, var(--etg-teal) 100%);
  z-index: 5;
  pointer-events: none;
}

/* --- FOOTER -- keep dark --- */
footer {
  background: var(--etg-black-2) !important;
  border-top: 1px solid var(--etg-black-3) !important;
}

/* --- SALE BADGE -- solid green, readable on any background --- */
.product-badges__badge.color-custom-badge-sale,
.color-custom-badge-sale {
  font-family: 'Press Start 2P', monospace !important;
  font-size: 6px !important;
  color: #0A0A08 !important;
  background: #6FBE3A !important;
  border: 1px solid #4C8A1F !important;
  border-radius: 3px !important;
  padding: 4px 8px !important;
  letter-spacing: 0.5px !important;
  text-transform: uppercase !important;
  line-height: 1.6 !important;
}

/* --- SOLD OUT BADGE -- solid dark, readable on any background --- */
.product-badges__badge.color-custom-badge-sold-out,
.color-custom-badge-sold-out {
  font-family: 'Press Start 2P', monospace !important;
  font-size: 6px !important;
  color: #F7F6F0 !important;
  background: #1B1B17 !important;
  border: 1px solid #2a2a26 !important;
  border-radius: 3px !important;
  padding: 4px 8px !important;
  letter-spacing: 1px !important;
  text-transform: uppercase !important;
}

/* --- HORIZON PRIMARY BUTTON (.button class) ------------------- */
/* Horizon OS 2.0 uses .button (Primary) / .button-secondary / .button-custom
   Our existing [class*="button--primary"] catches Dawn-style classes; these
   selectors cover Horizon's native primary button class.                     */
.button:not(.button-secondary):not(.button-custom):not(.button-unstyled):not(.link),
.submit-button.button {
  background-color: var(--etg-green) !important;
  color: var(--etg-black-deep) !important;
  border: 2px solid var(--etg-black-deep) !important;
  border-radius: 5px !important;
  box-shadow: 0 5px 0 var(--etg-green-dark) !important;
  font-weight: 700 !important;
  letter-spacing: 0.5px !important;
  text-transform: uppercase !important;
  transition: transform 0.1s ease, box-shadow 0.1s ease !important;
}
.button:not(.button-secondary):not(.button-custom):not(.button-unstyled):not(.link):hover,
.submit-button.button:hover {
  transform: translateY(3px) !important;
  box-shadow: 0 2px 0 var(--etg-green-dark) !important;
  color: var(--etg-black-deep) !important;
}
.button:not(.button-secondary):not(.button-custom):not(.button-unstyled):not(*link):active,
.submit-button.button:active {
  transform: translateY(5px) !important;
  box-shadow: 0 0px 0 var(--etg-green-dark) !important;
}

/* --- FOOTER EMAIL SIGNUP BUTTON ------------------------------- */
/* Horizon's email-signup block renders .email-signup__button with
   a dynamic style_class (button, button-custom, etc.).
   This catches ALL non-unstyled email signup buttons.              */
.email-signup__button:not(.button-unstyled) {
  background-color: var(--etg-green) !important;
  color: var(--etg-black-deep) !important;
  border: 2px solid var(--etg-black-deep) !important;
  border-radius: 5px !important;
  box-shadow: 0 5px 0 var(--etg-green-dark) !important;
  font-weight: 700 !important;
  letter-spacing: 0.5px !important;
  text-transform: uppercase !important;
  transition: transform 0.1s ease, box-shadow 0.1s ease !important;
  /* override inline CSS variables from button-custom-styles snippet */
  --button-background-color: var(--etg-green) !important;
  --button-color: var(--etg-black-deep) !important;
}
.email-signup__button:not(.button-unstyled):hover {
  transform: translateY(3px) !important;
  box-shadow: 0 2px 0 var(--etg-green-dark) !important;
  color: var(--etg-black-deep) !important;
}
.email-signup__button:not(.button-unstyled):active {
  transform: translateY(5px) !important;
  box-shadow: 0 0px 0 var(--etg-green-dark) !important;
}

/* === ETG HEADER FIX: Restore navigation when Horizon header-component JS fails to initialize ===
   Root cause: header.js registers a custom element that sets data-menu-style='menu' on desktop.
   If the custom element never registers, the inline nav stays display:none (Horizon default).
   These rules show the nav and mobile drawer without requiring the custom element. */

/* Desktop: show inline nav when JS has NOT set data-menu-style to 'drawer' */
@media screen and (min-width: 750px) {
  #header-component:not([data-menu-style='drawer']) :is(.header-menu, .dropdown-localization) {
    display: flex !important;
  }
  /* Force desktop column layout when data-menu-style is absent */
  #header-component:not([data-menu-style='drawer']):not([data-menu-style='menu']) .header__columns {
    grid-template-areas: 'left center right' !important;
    grid-template-columns: 1fr auto 1fr !important;
  }
  #header-component:not([data-menu-style='drawer']):not([data-menu-style='menu']) .header__column {
    display: flex !important;
  }
}

/* Mobile drawer: make it visible when the details element is open */
#Details-menu-drawer-container[open] .menu-drawer,
details[open].menu-drawer-container .menu-drawer {
  visibility: visible !important;
  transform: none !important;
}