/*your custom css goes here*/
/* ============================================================
   JJ FITNESS LINE — Gymshark-style theme layer
   Loaded last (after aiz-core.css). Safe to remove to revert.
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Archivo:wght@400;500;600;700;800;900&family=Inter:wght@400;500;600;700&display=swap');

:root{
  --jj-ink:#111111;
  --jj-muted:#6b6b6b;
  --jj-line:#e7e7e7;
  --jj-tile:#f4f3f1;      /* warm off-white product tile */
}

/* ---------- Typography ---------- */
body, .aiz-main-wrapper{ font-family:'Inter',-apple-system,Segoe UI,Roboto,sans-serif; color:var(--jj-ink); }
h1,h2,h3,h4,h5,h6,.fw-700,.fw-800,.fw-900{ font-family:'Archivo','Inter',sans-serif; }

/* Section titles -> bold uppercase, Gymshark style */
section h3.fw-700, section h2, .section-title{
  font-weight:800 !important;
  text-transform:uppercase;
  letter-spacing:.01em;
  font-size:1.6rem !important;
  color:var(--jj-ink);
}
@media (min-width:768px){ section h3.fw-700{ font-size:2rem !important; } }

/* ---------- Monochrome palette (black/white) ---------- */
.text-primary, .hov-text-primary:hover{ color:var(--jj-ink) !important; }
.bg-primary{ background-color:var(--jj-ink) !important; }
.border-primary{ border-color:var(--jj-ink) !important; }
a{ color:var(--jj-ink); }

/* ---------- Buttons: square, black, uppercase ---------- */
.btn{ border-radius:0 !important; text-transform:uppercase; font-weight:700; letter-spacing:.03em; font-family:'Archivo',sans-serif; }
.btn-primary, .btn-styled, .cart-btn{ background:var(--jj-ink) !important; border-color:var(--jj-ink) !important; color:#fff !important; }
.btn-primary:hover, .cart-btn:hover{ background:#000 !important; }
.btn-outline-primary{ background:#fff !important; color:var(--jj-ink) !important; border:2px solid var(--jj-ink) !important; }

/* ---------- Product cards: flat, tall uniform tiles ---------- */
.aiz-card-box{
  border:1px solid transparent !important;
  box-shadow:none !important;
  background:#fff !important;
  padding:0 !important;
  transition:border-color .2s ease;
}
.aiz-card-box:hover{ border-color:var(--jj-line) !important; }
/* taller, uniform image tile with warm bg; keep theme's own img-fit sizing */
.aiz-card-box .h-140px,
.aiz-card-box .h-md-200px{
  height:300px !important;
  background:var(--jj-tile);
}
@media (min-width:768px){
  .aiz-card-box .h-140px,
  .aiz-card-box .h-md-200px{ height:420px !important; }
}
.aiz-card-box .img-fit img, .aiz-card-box img.img-fit{ object-fit:contain !important; }
.hov-scale-img:hover img{ transform:scale(1.04); }

/* product name: left aligned, medium, tidy */
.aiz-card-box h3, .aiz-card-box h3 a{ text-align:left !important; }
.aiz-card-box h3{ font-weight:600 !important; font-size:.9rem !important; font-family:'Inter',sans-serif; }
.aiz-card-box .p-2, .aiz-card-box .p-md-3{ padding:.75rem .25rem !important; text-align:left !important; }
.aiz-card-box .d-flex.justify-content-center{ justify-content:flex-start !important; }

/* "New"/discount badge -> small square */
.aiz-card-box .absolute-top-left{ border-radius:0 !important; background:var(--jj-ink) !important; text-transform:uppercase; }

/* ---------- Hero slider: full-bleed, full banner ---------- */
.home-banner-area{ padding:0 !important; margin-bottom:0 !important; }
.home-banner-area > .container{ max-width:100% !important; padding:0 !important; }
/* hide the old category sidebar next to the hero (categories still in top nav) */
.home-banner-area .d-none.d-xl-block{ display:none !important; }
.home-banner-area .home-slider{ width:100% !important; flex:1 1 100% !important; max-width:100% !important; }
.home-slider .carousel-box, .home-slider .aiz-carousel{ width:100% !important; }
.home-slider img{ width:100% !important; height:auto !important; max-height:none !important; object-fit:contain !important; background:#0d0d0d; }

/* ---------- Featured category tiles: bigger, image-forward ---------- */
section .w-150px{ width:100% !important; max-width:220px; }
section .border-top.border-right .col-xl-4 img{ height:200px; object-fit:contain; }

/* ---------- Header: cleaner, uppercase nav ---------- */
.top-navbar .nav-link, .aiz-category-menu .nav-link, .navbar .nav-link{
  text-transform:uppercase; font-weight:700; letter-spacing:.03em; font-family:'Archivo',sans-serif; font-size:.85rem;
}

/* tighten container gutters so grid feels editorial */
@media (min-width:1200px){ .container{ max-width:1280px; } }

/* ---------- Header polish: centered logo, slim search, sticky ---------- */
.logo-bar-area .container > .d-flex{ position:relative; justify-content:center !important; align-items:center; min-height:76px; }
/* logo absolutely centered */
.logo-bar-area .col-auto.pl-0.pr-3{ position:absolute; left:50%; transform:translateX(-50%); padding:0 !important; z-index:2; }
.logo-bar-area .col-auto.pl-0.pr-3 img{ height:34px !important; width:auto !important; }
/* search: slim, pinned left (not center-dominant) */
.logo-bar-area .front-header-search{ flex-grow:0 !important; max-width:280px; margin-left:0 !important; margin-right:auto !important; }
/* sticky header */
header .top-navbar, header .logo-bar-area{ position:relative; }
.aiz-main-wrapper > header{ position:sticky; top:0; z-index:1040; background:#fff; }

/* ---------- Product page: black cart button, hide seller cruft ---------- */
.btn-secondary-base, .btn-soft-secondary-base, .btn-outline-secondary-base{
  background:#111 !important; border-color:#111 !important; color:#fff !important;
}
.btn-secondary-base:hover, .add-to-cart:hover{ background:#000 !important; }

/* ---------- Shop by Category tiles ---------- */
.jj-cat-tile{ background:var(--jj-tile); }
.jj-cat-tile img{ height:300px; width:100%; object-fit:contain; transition:transform .45s ease; }
@media (min-width:768px){ .jj-cat-tile img{ height:440px; } }
.jj-cat-tile:hover img{ transform:scale(1.05); }
.jj-cat-label{
  position:absolute; left:0; bottom:0; width:100%; padding:22px 24px;
  background:linear-gradient(transparent, rgba(0,0,0,.62));
  color:#fff; font-family:'Archivo',sans-serif; font-weight:800;
  font-size:1.5rem; line-height:1.05; text-transform:uppercase;
  display:flex; flex-direction:column; align-items:flex-start;
}
.jj-cat-label small{ font-size:.68rem; font-weight:700; letter-spacing:.12em; margin-top:6px;
  background:#fff; color:#111; padding:6px 14px; }

/* ---------- Shop by Gender lifestyle split ---------- */
.jj-split{ display:grid; grid-template-columns:1fr 1fr; gap:4px; margin:0 0 6px; }
.jj-split-tile{ overflow:hidden; display:block; line-height:0; }
.jj-split-tile img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .6s ease; }
.jj-split-tile:hover img{ transform:scale(1.05); }
@media (max-width:640px){ .jj-split{ grid-template-columns:1fr; } }

/* ---------- Train Your Way theme tiles ---------- */
.jj-themes-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:10px; }
.jj-theme-tile{ overflow:hidden; display:block; line-height:0; }
.jj-theme-tile img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .55s ease; }
.jj-theme-tile:hover img{ transform:scale(1.06); }
@media (max-width:768px){ .jj-themes-grid{ grid-template-columns:1fr 1fr; } }