/* =========================================================
   SPORT SHOP BIH V3.0 — editorial performance commerce
   Crna + bijela + električno plava. Crvena je samo za SALE.
   ========================================================= */

:root {
  --ink: #07090d;
  --graphite: #101318;
  --graphite-2: #191e25;
  --paper: #ffffff;
  --surface: #f4f6f8;
  --surface-2: #e7ebf0;
  --line: #d2d8df;
  --text: #080b10;
  --muted: #5c6670;
  --blue: #145dff;
  --blue-dark: #0a3fc5;
  --blue-soft: #eaf1ff;
  --volt: #145dff;
  --volt-dark: #0a3fc5;
  --sale: #e33b35;
  --sale-dark: #b9201d;
  --sale-soft: #fff0ef;
  --shadow-sm: 0 18px 55px rgba(7, 15, 28, .1);
  --shadow-lg: 0 40px 110px rgba(3, 8, 16, .3);
}

::selection { color: #fff; background: var(--blue); }
body { color: var(--text); background: var(--surface); }
.button-primary { color: #fff; background: var(--blue); box-shadow: 0 13px 32px rgba(20, 93, 255, .22); }
.button-primary:hover { color: #fff; background: var(--blue-dark); box-shadow: 0 17px 38px rgba(20, 93, 255, .3); }
.button-primary:focus-visible { outline-color: #78a5ff; }
.button-light { color: var(--ink); background: #fff; }
.button-light:hover { color: #fff; background: var(--ink); }
.text-link { border-color: var(--blue); }

/* Header */
.announcement-inner > span:first-child::before {
  background: var(--blue);
  box-shadow: 0 0 0 4px rgba(20, 93, 255, .18);
}
.site-header { background: rgba(7, 9, 13, .96); }
.brand-mark { color: #fff; background: var(--blue); }
.brand-mark::after { border-color: rgba(255,255,255,.42); }
.brand-copy small { color: #72a0ff; }
.primary-nav a::after { background: var(--blue); }
.primary-nav .nav-sale { color: #ff7772; }
.primary-nav .nav-sale::before {
  width: 6px;
  height: 6px;
  display: inline-block;
  margin-right: 7px;
  background: var(--sale);
  border-radius: 50%;
  content: "";
  vertical-align: 1px;
}
.header-search:focus-within { border-color: #6d9bff; }
.cart-trigger:hover { color: #fff; background: var(--blue); border-color: var(--blue); }
.saved-trigger b, .mobile-shop-nav b { color: #fff; background: var(--blue); }
.saved-trigger:hover, .saved-trigger.has-items { border-color: rgba(91, 143, 255, .65); background: rgba(20, 93, 255, .13); }
.search-suggestions .search-all-link:hover,
.search-suggestions .search-all-link:focus-visible { color: #fff; background: var(--blue-dark); }

/* Hero */
.v2-hero {
  background:
    radial-gradient(circle at 56% 20%, rgba(20,93,255,.13), transparent 25%),
    linear-gradient(118deg, #07090d 0%, #090d14 62%, #07142e 100%);
}
.v2-hero::before { background: linear-gradient(90deg, var(--blue) 0 64%, transparent 64%); }
.hero-kicker span { color: #6f9eff; }
.v2-hero .hero-copy h1 .hero-line-accent::after { background: var(--blue); }
.v2-hero .button-primary { color: #fff; background: var(--blue); }
.v2-hero .button-primary:hover { background: #fff; color: var(--ink); }
.hero-shortcuts a:hover { color: #fff; background: var(--blue); }
.hero-shortcuts a:hover span { color: #fff; }
.v2-hero .hero-visual {
  background:
    radial-gradient(circle at 68% 32%, rgba(255,255,255,.92), transparent 23%),
    linear-gradient(145deg, #f7f9fc 0%, #dce6f2 56%, #b9cae0 100%);
  border: 1px solid rgba(255,255,255,.62);
  box-shadow: inset 0 0 0 1px rgba(20,93,255,.07), 0 34px 90px rgba(0,0,0,.23);
}
.v2-hero .hero-visual::after { width: 44%; background: var(--blue); }
.v2-hero .hero-product-main figcaption { border-left-color: var(--sale); }
.v2-hero .hero-product-main figcaption small {
  color: #9ca6af;
  font-size: .66rem;
  text-decoration: line-through;
}
.v2-hero .hero-product-main figcaption strong { color: #fff; font-size: 1.1rem; }
.hero-tech-card { background: var(--sale); box-shadow: 0 18px 42px rgba(227,59,53,.28); }
.hero-tech-card b { color: #fff; }
.hero-shop-link:hover { color: #fff; background: var(--blue); }
.hero-trust-rail b { color: #6f9eff; }

/* Activity */
.activity-card-featured {
  background: linear-gradient(145deg, #155fff, #092f8f);
  border-color: #155fff;
}
.activity-card-featured::before { background: radial-gradient(circle at 72% 52%, rgba(255,255,255,.18), transparent 39%); }
.activity-card-featured small,
.activity-card-featured .activity-number { color: #bcd2ff; }
.activity-card-featured .activity-arrow { color: var(--blue); background: #fff; }
.activity-card:hover .activity-arrow { color: #fff; background: var(--blue); }

/* SALE campaign */
.sale-section {
  position: relative;
  overflow: hidden;
  color: #fff;
  background: var(--sale);
  isolation: isolate;
}
.sale-section::before {
  position: absolute;
  z-index: -1;
  right: -3vw;
  top: -10vw;
  color: transparent;
  -webkit-text-stroke: 1px rgba(255,255,255,.17);
  content: "SALE";
  font-size: clamp(12rem, 28vw, 30rem);
  font-weight: 950;
  letter-spacing: -.1em;
  line-height: .8;
}
.sale-heading {
  display: grid;
  grid-template-columns: minmax(0,1.15fr) minmax(300px,.55fr);
  align-items: end;
  gap: clamp(32px, 7vw, 110px);
  margin-bottom: 52px;
}
.sale-heading .eyebrow { color: rgba(255,255,255,.72); }
.sale-heading h2 { margin: 0; color: #fff; font-size: clamp(3.4rem,7vw,7.6rem); line-height: .82; letter-spacing: -.065em; }
.sale-heading-copy { display: grid; gap: 17px; padding-bottom: 8px; }
.sale-heading-copy > strong { color: #fff; font-size: clamp(3.2rem,6vw,6.4rem); letter-spacing: -.07em; line-height: .8; }
.sale-heading-copy p { max-width: 430px; margin: 0; color: rgba(255,255,255,.82); line-height: 1.55; }
.sale-heading-copy .button { justify-self: start; }
.sale-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
.sale-grid .product-card { border-color: rgba(100,0,0,.18); box-shadow: 0 22px 60px rgba(93,10,7,.2); }

/* Product cards */
.bestsellers-section { background: #edf0f4; }
.product-grid { gap: 20px; }
.product-card {
  overflow: hidden;
  background: #fff;
  border: 1px solid #d5dbe2;
  border-radius: 18px;
  box-shadow: 0 1px 0 rgba(255,255,255,.8);
}
.product-card:hover { transform: translateY(-6px); border-color: #b9c3ce; box-shadow: var(--shadow-sm); }
.product-card-media-wrap { overflow: hidden; background: #e9edf2; border: 0; border-radius: 0; }
.product-card-media {
  aspect-ratio: 1.04 / 1;
  background:
    radial-gradient(circle at 70% 27%, rgba(255,255,255,.8), transparent 25%),
    linear-gradient(145deg, #f1f4f7, #dce3ea);
}
.product-card-media::after { width: 100%; height: 4px; background: var(--blue); transform: scaleX(.24); transform-origin: left; transition: transform 260ms ease; }
.product-card:hover .product-card-media::after { transform: scaleX(1); }
.product-card-media img { padding: 9%; filter: contrast(1.035) drop-shadow(0 18px 18px rgba(12,24,39,.12)); }
.product-badge-stack {
  position: absolute;
  z-index: 7;
  left: 13px;
  top: 13px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
}
.product-badge { position: static; display: inline-flex; padding: 7px 10px; color: #fff; border-radius: 999px; font-size: .63rem; line-height: 1; }
.product-badge-sale { background: var(--sale); box-shadow: 0 8px 18px rgba(227,59,53,.24); }
.product-badge-popular { background: var(--blue); }
.product-media-actions { left: auto; right: 12px; width: auto; }
.quick-view-button {
  position: static;
  order: -1;
  min-height: 42px;
  padding: 0 14px;
  opacity: 0;
  transform: translateY(-6px);
}
.product-card:hover .quick-view-button,
.quick-view-button:focus-visible { opacity: 1; transform: translateY(0); }
.quick-view-button:hover { color: #fff; background: var(--blue); }
.wishlist-button:hover,
.wishlist-button.is-active { color: #fff; background: var(--blue); }
.product-code { color: #68737e; }
.product-card-body { padding: 19px 19px 18px; }
.product-meta { margin-bottom: 8px; }
.product-brand { color: var(--blue); }
.product-name { margin-bottom: 6px; font-size: 1.16rem; line-height: 1.14; }
.product-rating,
.quick-view-rating,
.detail-rating {
  display: flex;
  align-items: center;
  gap: 5px;
  color: #67717b;
  font-size: .7rem;
}
.product-rating span,
.quick-view-rating span,
.detail-rating span { color: #f2a900; font-size: .82rem; }
.product-rating strong,
.quick-view-rating strong,
.detail-rating strong { color: var(--text); }
.product-rating small,
.quick-view-rating small,
.detail-rating small { font-size: inherit; }
.product-card-note { margin-top: 10px; }
.product-card-footer { align-items: center; min-height: 68px; padding-top: 12px; }
.product-price-block { display: grid; grid-template-columns: auto auto; align-items: baseline; justify-content: start; gap: 3px 8px; }
.product-price-block del { color: #7c858e; font-size: .73rem; }
.product-price-block strong { grid-row: 1 / span 2; color: var(--text); font-size: 1.23rem; letter-spacing: -.035em; }
.product-price-block.is-sale strong { grid-row: 2; color: var(--sale); }
.product-price-block span { grid-column: 1 / -1; color: var(--sale); font-size: .64rem; font-weight: 850; }
.product-actions { margin-top: 14px; }
.product-actions .button { min-height: 46px; }
.product-grid-featured { grid-template-columns: repeat(4,minmax(0,1fr)); grid-auto-flow: row; }
.product-grid-featured .product-card,
.product-grid-featured .product-card-lead,
.product-grid-featured .product-card-wide { grid-column: span 1; display: flex; }
.product-grid-featured .product-card-lead .product-card-media-wrap,
.product-grid-featured .product-card-wide .product-card-media-wrap { min-height: 0; }
.product-grid-featured .product-card-lead .product-card-media,
.product-grid-featured .product-card-wide .product-card-media { min-height: 0; aspect-ratio: 1.04 / 1; }
.product-grid-featured .product-card-lead .product-card-body,
.product-grid-featured .product-card-wide .product-card-body { display: flex; padding: 19px 19px 18px; background: #fff; border-radius: 0; }
.product-grid-featured .product-card-lead .product-name { font-size: 1.16rem; }

/* Editorial campaign */
.v2-editorial-section .editorial-banner::after { background: var(--blue); }
.v2-editorial-section .editorial-product { background: linear-gradient(145deg, #dce8ff, #78a5ff); }
.editorial-product > img { filter: drop-shadow(0 36px 25px rgba(9,30,74,.2)); }
.editorial-loop { color: rgba(7,9,13,.1); }
.benefit-number { color: #6e9dff; }

/* Catalog */
.catalog-hero {
  background:
    radial-gradient(circle at 84% 36%, rgba(20,93,255,.5), transparent 24%),
    linear-gradient(115deg,#07090d 0%,#0b1019 65%,#09245a 100%);
  border-bottom-color: var(--blue);
}
.catalog-hero::after { content: "FIND / MOVE"; }
.catalog-intro-note { border-left-color: #6f9eff; }
.catalog-intro-note span { color: #8bb0ff; }
.filters-panel { background: #0d1015; }
.category-filter.is-active,
.sport-filter.is-active { color: #fff; background: var(--blue); border-color: var(--blue); }
.category-filter.is-active span:last-child { color: #d8e4ff; }
.catalog-toolbar { grid-template-columns: minmax(220px,1fr) auto auto auto 170px; }
.sale-filter-toggle,
.saved-filter-toggle {
  min-height: 50px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0 14px;
  color: #303942;
  background: #fff;
  border: 1px solid #cbd3da;
  border-radius: 999px;
  font-size: .82rem;
  font-weight: 850;
  cursor: pointer;
  white-space: nowrap;
}
.sale-filter-toggle > span { color: var(--sale); font-size: .67rem; letter-spacing: .08em; }
.sale-filter-toggle:hover,
.sale-filter-toggle.is-active { color: #fff; background: var(--sale); border-color: var(--sale); }
.sale-filter-toggle.is-active > span,
.sale-filter-toggle:hover > span { color: #fff; }
.saved-filter-toggle:hover,
.saved-filter-toggle.is-active { color: #fff; background: var(--blue); border-color: var(--blue); }
.saved-filter-toggle.is-active span { color: var(--blue); background: #fff; }
.filters-apply { color: #fff; }

/* Product detail */
.product-page-main { background: #edf1f5; }
.gallery-main {
  background:
    radial-gradient(circle at 68% 32%, rgba(255,255,255,.84), transparent 24%),
    linear-gradient(145deg,#f1f5f9,#d6e0ea);
}
.detail-badge-stack { left: 20px; top: 20px; }
.gallery-code,
.gallery-main figcaption,
.gallery-zoom-trigger,
.detail-badge-stack { z-index: 4; }
.gallery-zoom-trigger:hover { color: #fff; background: var(--blue); }
.purchase-panel::before { background: var(--blue); }
.detail-rating { margin: -8px 0 18px; font-size: .78rem; }
.detail-commerce-row { align-items: center; }
.detail-price-stack { display: grid; grid-template-columns: auto auto; align-items: baseline; gap: 3px 10px; }
.detail-price-stack del { color: #79838d; font-size: .86rem; }
.detail-price-stack strong { grid-row: 1 / span 2; font-size: 1.72rem; letter-spacing: -.04em; }
.detail-price-stack.is-sale strong { grid-row: 2; color: var(--sale); }
.detail-price-stack span { grid-column: 1 / -1; color: var(--sale); font-size: .7rem; font-weight: 850; }
.size-choice.is-active { color: #fff; background: var(--blue); border-color: var(--blue); }
.purchase-row .button-primary,
.mobile-purchase-bar .button-primary { color: #fff; }
.detail-delivery > div > span { color: var(--blue); }

/* Quick view */
.commerce-modal-close:hover { color: #fff; background: var(--blue); }
.quick-view-media { background: linear-gradient(145deg,#f2f5f8,#d8e2ec); }
.quick-view-sale-badge {
  position: absolute;
  z-index: 5;
  left: 22px;
  top: 54px;
  padding: 8px 11px;
  color: #fff;
  background: var(--sale);
  border-radius: 999px;
  font-size: .72rem;
  font-weight: 950;
}
.quick-view-zoom { display: inline-flex; align-items: center; gap: 8px; }
.quick-view-zoom:hover { background: var(--blue); }
.quick-view-rating { margin: 0 0 15px; font-size: .78rem; }
.quick-view-price-stack { display: grid; grid-template-columns: auto auto; align-items: baseline; justify-content: start; gap: 3px 10px; margin-bottom: 20px; }
.quick-view-price-stack del { color: #7e8790; font-size: .84rem; }
.quick-view-price-stack strong { grid-row: 1 / span 2; font-size: 1.65rem; letter-spacing: -.04em; }
.quick-view-price-stack.is-sale strong { grid-row: 2; color: var(--sale); }
.quick-view-price-stack span { grid-column: 1 / -1; color: var(--sale); font-size: .72rem; font-weight: 850; }

/* Cart and checkout */
.shipping-progress-track i { background: var(--blue); }
.cart-savings {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 11px 12px;
  margin-bottom: 15px;
  color: var(--sale-dark);
  background: var(--sale-soft);
  border-radius: 9px;
  font-size: .7rem;
  font-weight: 850;
}
.cart-line-price,
.checkout-item-price { display: grid; justify-items: end; gap: 2px; white-space: nowrap; }
.cart-line-price del,
.checkout-item-price del { color: #8b949d; font-size: .62rem; }
.checkout-item-price strong { font-size: .75rem; }
.order-summary { border-top-color: var(--blue); }
.form-section-head > span { color: #fff; background: var(--blue); }
.promo-box button:hover { color: #fff; background: var(--blue); }
.field-hint { display: block; padding-top: 5px; color: var(--muted); font-size: .64rem; line-height: 1.35; }
.summary-totals #checkout-sale-row { color: #ff9c97; }
.summary-totals #checkout-sale-row strong { color: #ff9c97; }
.mobile-summary-toggle { display: none; }

/* Contact and footer */
.contact-hero::after { -webkit-text-stroke-color: rgba(105,153,255,.2); }
.contact-status { border-left-color: var(--blue); }
.contact-method > span { color: #fff; background: var(--blue); }
.footer-topline > span { color: #75a2ff; }
.brand-footer .brand-mark { color: #fff; }

@media (max-width: 1180px) {
  .product-grid-featured { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .product-grid-featured .product-card,
  .product-grid-featured .product-card-lead,
  .product-grid-featured .product-card-wide { grid-column: span 1; display: flex; }
  .catalog-toolbar { grid-template-columns: minmax(220px,1fr) auto auto 160px; }
  .results-count-desktop { display: none; }
}

@media (max-width: 980px) {
  .sale-heading { grid-template-columns: 1fr .6fr; }
  .sale-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .catalog-toolbar { grid-template-columns: minmax(0,1fr) auto auto; }
  .toolbar-sort { display: none; }
  .checkout-form-column { order: 0; }
  .order-summary { position: static; order: 0; }
}

@media (max-width: 760px) {
  .primary-nav .nav-sale { color: #ff7f79; }
  .primary-nav a.is-active { background: rgba(20,93,255,.16); border-left-color: var(--blue); }
  .hero-kicker { padding-bottom: 12px; }
  .sale-heading { grid-template-columns: 1fr; gap: 30px; margin-bottom: 34px; }
  .sale-heading h2 { font-size: clamp(3.3rem,15vw,5.4rem); }
  .sale-heading-copy > strong { font-size: 4rem; }
  .product-grid-featured { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .product-media-actions { top: 10px; right: 10px; gap: 6px; }
  .wishlist-button { min-width: 38px; min-height: 38px; padding: 0 9px; }
  .quick-view-button {
    width: 38px;
    min-height: 38px;
    padding: 0;
    opacity: 1;
    transform: none;
    font-size: 0;
  }
  .quick-view-button::before { content: "↗"; font-size: .95rem; }
  .product-card-note { display: none; }
  .product-actions { grid-template-columns: 1fr; }
  .product-actions .button-outline { display: none; }
  .catalog-toolbar { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
  .catalog-search-wrap { grid-column: 1 / -1; }
  .sale-filter-toggle,
  .saved-filter-toggle { width: 100%; min-height: 46px; padding-inline: 10px; font-size: .76rem; }
  .quick-view-zoom b { display: none; }
  .quick-view-zoom { width: 44px; justify-content: center; padding: 0; }
  .mobile-shop-nav a::before,
  .mobile-shop-nav button::before { background: var(--blue); }
}

@media (max-width: 640px) {
  .v2-hero .hero-visual { min-height: 410px; }
  .v2-hero .hero-product-main { bottom: 5%; height: 69%; }
  .hero-product-main figcaption { min-width: 132px; }
  .sale-section { padding-top: 72px; }
  .sale-grid,
  .product-grid,
  .product-grid-featured,
  .product-grid-related { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; }
  .product-card { border-radius: 12px; }
  .product-card-media { aspect-ratio: 1 / 1; }
  .product-card-media img { padding: 8%; }
  .product-card-body,
  .product-grid-featured .product-card-lead .product-card-body,
  .product-grid-featured .product-card-wide .product-card-body { padding: 12px 11px 11px; }
  .product-meta { margin-bottom: 6px; font-size: .61rem; }
  .product-meta > span { display: none; }
  .product-name,
  .product-grid-featured .product-card-lead .product-name { min-height: 2.25em; margin-bottom: 5px; font-size: .88rem; line-height: 1.12; }
  .product-rating { gap: 3px; font-size: .6rem; }
  .product-rating span { font-size: .7rem; }
  .product-card-footer { min-height: 62px; padding-top: 9px; gap: 4px; }
  .product-card-footer > span { display: none; }
  .product-price-block { gap: 1px 5px; }
  .product-price-block del { font-size: .62rem; }
  .product-price-block strong { font-size: .96rem; }
  .product-price-block span { font-size: .55rem; }
  .product-actions { margin-top: 9px; }
  .product-actions .button { width: 100%; min-height: 42px; padding: 0 8px; font-size: .72rem; }
  .product-badge-stack { left: 8px; top: 8px; gap: 4px; }
  .product-badge { padding: 6px 7px; font-size: .54rem; }
  .product-code { right: 8px; bottom: 8px; font-size: .52rem; }
  .purchase-panel { padding: 24px 20px; }
  .purchase-panel::before { margin: -24px 0 22px -20px; }
  .detail-price-stack strong { font-size: 1.48rem; }
  .mobile-purchase-price { display: grid; grid-template-columns: auto auto; align-items: baseline; gap: 1px 6px; }
  .mobile-purchase-price del { color: #7b848d; font-size: .63rem; }
  .mobile-purchase-price strong { grid-row: 1 / span 2; font-size: 1rem; }
  .mobile-purchase-price.is-sale strong { grid-row: 2; color: var(--sale); }
  .mobile-purchase-price span { grid-column: 1 / -1; color: var(--sale); font-size: .55rem; font-weight: 850; }
  .checkout-layout { display: grid; grid-template-columns: 1fr; }
  .checkout-form-column { order: 0; }
  .order-summary { order: 1; padding: 18px; }
  .mobile-summary-toggle {
    width: 100%;
    min-height: 52px;
    display: grid;
    grid-template-columns: 1fr auto auto;
    align-items: center;
    gap: 10px;
    padding: 0;
    color: #fff;
    background: transparent;
    border: 0;
    font: inherit;
    font-size: .76rem;
    font-weight: 850;
    text-align: left;
    cursor: pointer;
  }
  .mobile-summary-toggle strong { color: #7ba6ff; }
  .mobile-summary-toggle i { font-size: 1.2rem; font-style: normal; transition: transform 180ms ease; }
  .order-summary:not(.is-expanded) > :not(.mobile-summary-toggle) { display: none; }
  .order-summary.is-expanded .mobile-summary-toggle i { transform: rotate(180deg); }
  .order-summary.is-expanded .summary-head { margin-top: 8px; }
  .field-hint { font-size: .6rem; }
}

@media (max-width: 480px) {
  .product-grid,
  .product-grid-featured,
  .product-grid-related,
  .sale-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .product-card-note { display: none; }
  .product-actions { grid-template-columns: 1fr; }
  .product-actions .button-outline { display: none; }
  .catalog-toolbar { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .saved-filter-toggle { width: 100%; }
  .promo-box > div { grid-template-columns: 1fr auto; }
  .quick-view-content h2 { font-size: 2.5rem; }
}

@media (max-width: 350px) {
  .product-grid,
  .product-grid-featured,
  .product-grid-related,
  .sale-grid { grid-template-columns: 1fr; }
  .product-name,
  .product-grid-featured .product-card-lead .product-name { min-height: auto; font-size: 1rem; }
}

@media (prefers-reduced-motion: reduce) {
  .product-card-media::after { transform: none; }
}