/* theme-navy-yellow-20261029-r2.css
   t137: PDP Add-to-Cart yellow+navy (beat modern-ui --cj-accent navy bg)
        + sticky .jersey-sticky-submit (was orange #e94927)
        + homepage cj-home polish in navy/yellow
   Additive; load LAST in default.xml AND last in catalog_product_view.xml
   (product layout CSS otherwise loads after Magento_Theme default).
   Do not break Subscribe / FILTER / price red. */

:root{
  --cj-navy:#2c4482;
  --cj-navy-deep:#1e3270;
  --cj-yellow:#FFCC03;
  --cj-yellow-hover:#e6b800;
  --cj-price-red:#d0342c;
}

/* —— PDP primary ATC: beat .catalog-product-view #product-addtocart-button
      (modern-ui sets background:var(--cj-accent)=navy; r1 color=navy → invisible) —— */
html body.catalog-product-view .box-tocart .action.tocart,
html body.catalog-product-view .box-tocart .action.primary.tocart,
html body.catalog-product-view button.action.primary.tocart,
html body.catalog-product-view #product-addtocart-button,
html body.catalog-product-view .product-add-form #product-addtocart-button,
html body.catalog-product-view .product-options-bottom .action.tocart,
html body.catalog-product-view .product-item .action.tocart,
html body.catalog-product-view .block.related .action.tocart,
html body.catalog-product-view .block.upsell .action.tocart,
html body.catalog-product-view .block.crosssell .action.tocart{
  background:var(--cj-yellow)!important;
  background-color:var(--cj-yellow)!important;
  border:1px solid var(--cj-yellow)!important;
  border-color:var(--cj-yellow)!important;
  color:var(--cj-navy)!important;
  font-weight:800!important;
  box-shadow:0 8px 18px rgba(44,68,130,.18)!important;
  text-shadow:none!important;
  -webkit-text-fill-color:var(--cj-navy)!important;
}
html body.catalog-product-view .box-tocart .action.tocart:hover,
html body.catalog-product-view .box-tocart .action.primary.tocart:hover,
html body.catalog-product-view button.action.primary.tocart:hover,
html body.catalog-product-view #product-addtocart-button:hover,
html body.catalog-product-view .product-add-form #product-addtocart-button:hover,
html body.catalog-product-view .product-options-bottom .action.tocart:hover,
html body.catalog-product-view .block.related .action.tocart:hover,
html body.catalog-product-view .block.upsell .action.tocart:hover{
  background:var(--cj-yellow-hover)!important;
  background-color:var(--cj-yellow-hover)!important;
  border-color:var(--cj-yellow-hover)!important;
  color:var(--cj-navy)!important;
  -webkit-text-fill-color:var(--cj-navy)!important;
}
/* Force visible label / icon (Luma span + :before) */
html body.catalog-product-view #product-addtocart-button span,
html body.catalog-product-view .box-tocart .action.tocart span,
html body.catalog-product-view .action.tocart span,
html body.catalog-product-view #product-addtocart-button:before,
html body.catalog-product-view .box-tocart .action.tocart:before,
html body.catalog-product-view .action.tocart:before{
  color:var(--cj-navy)!important;
  -webkit-text-fill-color:var(--cj-navy)!important;
  opacity:1!important;
  visibility:visible!important;
}

/* Global shopper ATC reinforce (category cards etc.) — yellow+navy */
html body .action.tocart,
html body button.action.tocart,
html body .action.primary.tocart,
html body #product-addtocart-button{
  background:var(--cj-yellow)!important;
  background-color:var(--cj-yellow)!important;
  border-color:var(--cj-yellow)!important;
  color:var(--cj-navy)!important;
  -webkit-text-fill-color:var(--cj-navy)!important;
}
html body .action.tocart:hover,
html body button.action.tocart:hover,
html body #product-addtocart-button:hover{
  background:var(--cj-yellow-hover)!important;
  border-color:var(--cj-yellow-hover)!important;
  color:var(--cj-navy)!important;
  -webkit-text-fill-color:var(--cj-navy)!important;
}
html body .action.tocart span,
html body #product-addtocart-button span{
  color:var(--cj-navy)!important;
  -webkit-text-fill-color:var(--cj-navy)!important;
}

/* —— Sticky bar: real selector is .jersey-sticky-submit (not .action.tocart) —— */
html body.catalog-product-view .jersey-sticky-buy .jersey-sticky-submit,
html body .jersey-sticky-buy .jersey-sticky-submit,
html body.catalog-product-view .jersey-sticky-buy button.jersey-sticky-submit{
  background:var(--cj-yellow)!important;
  background-color:var(--cj-yellow)!important;
  border:1px solid var(--cj-yellow)!important;
  border-color:var(--cj-yellow)!important;
  color:var(--cj-navy)!important;
  -webkit-text-fill-color:var(--cj-navy)!important;
  font-weight:700!important;
  box-shadow:none!important;
  text-shadow:none!important;
}
html body.catalog-product-view .jersey-sticky-buy .jersey-sticky-submit:hover:not(:disabled),
html body.catalog-product-view .jersey-sticky-buy .jersey-sticky-submit:active:not(:disabled),
html body .jersey-sticky-buy .jersey-sticky-submit:hover:not(:disabled){
  background:var(--cj-yellow-hover)!important;
  border-color:var(--cj-yellow-hover)!important;
  color:var(--cj-navy)!important;
  -webkit-text-fill-color:var(--cj-navy)!important;
}
html body.catalog-product-view .jersey-sticky-buy .jersey-sticky-submit span,
html body .jersey-sticky-buy .jersey-sticky-submit span{
  color:var(--cj-navy)!important;
  -webkit-text-fill-color:var(--cj-navy)!important;
}
/* Keep sticky price readable; brand red for price if present */
html body.catalog-product-view .jersey-sticky-buy .jersey-sticky-price{
  color:var(--cj-price-red)!important;
}

/* —— Homepage polish (cms-index / .cj-home) — navy+yellow, white cards —— */
html body.cms-index-index .cj-home,
html body .cj-home{
  padding-top:16px!important;
  padding-bottom:48px!important;
}
html body.cms-index-index .cj-home .cj-section,
html body .cj-home .cj-section{
  margin-top:52px!important;
}
html body.cms-index-index .cj-home #cj-leagues,
html body .cj-home #cj-leagues{
  margin-top:8px!important;
}
html body.cms-index-index .cj-home .cj-heading,
html body .cj-home .cj-heading{
  margin-bottom:22px!important;
}
html body.cms-index-index .cj-home .cj-heading .cj-eyebrow,
html body .cj-home .cj-heading .cj-eyebrow,
html body.cms-index-index .cj-home .cj-eyebrow,
html body .cj-home .cj-eyebrow{
  color:var(--cj-navy)!important;
}
html body.cms-index-index .cj-home #cj-leagues h1,
html body .cj-home #cj-leagues h1,
html body.cms-index-index .cj-home h2,
html body .cj-home h2{
  color:var(--cj-navy-deep)!important;
  letter-spacing:-.02em;
}
/* League logo discs: soft navy ring on hover */
html body.cms-index-index .cj-home .cj-leagues .cj-league-logo,
html body .cj-home .cj-leagues .cj-league-logo{
  border-color:rgba(44,68,130,.16)!important;
  box-shadow:0 6px 18px rgba(44,68,130,.08)!important;
  background:#fff!important;
  transition:border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}
html body.cms-index-index .cj-home .cj-leagues>a:hover .cj-league-logo,
html body .cj-home .cj-leagues>a:hover .cj-league-logo{
  border-color:var(--cj-yellow)!important;
  box-shadow:0 10px 24px rgba(44,68,130,.14)!important;
  transform:translateY(-2px);
}
html body.cms-index-index .cj-home .cj-leagues strong,
html body .cj-home .cj-leagues strong{
  color:var(--cj-navy)!important;
}
/* Featured product cards */
html body.cms-index-index .cj-home .cj-product,
html body .cj-home .cj-product{
  border:1px solid rgba(44,68,130,.12)!important;
  border-radius:14px!important;
  background:#fff!important;
  box-shadow:0 4px 16px rgba(44,68,130,.05)!important;
  transition:border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}
html body.cms-index-index .cj-home .cj-product:hover,
html body .cj-home .cj-product:hover{
  border-color:var(--cj-yellow)!important;
  box-shadow:0 10px 28px rgba(44,68,130,.12)!important;
  transform:translateY(-2px);
}
html body.cms-index-index .cj-home .cj-product-image,
html body .cj-home .cj-product-image{
  background:linear-gradient(180deg,#f7f8fa 0%,#eef1f6 100%)!important;
  border-bottom:1px solid rgba(44,68,130,.08)!important;
}
html body.cms-index-index .cj-home .cj-product-league,
html body .cj-home .cj-product-league{
  color:var(--cj-navy)!important;
  font-weight:700!important;
}
html body.cms-index-index .cj-home .cj-price,
html body .cj-home .cj-price{
  color:var(--cj-price-red)!important;
  font-weight:800!important;
}
/* Size-guide / fit CTA band */
html body.cms-index-index .cj-home .cj-fit,
html body .cj-home .cj-fit{
  border:1px solid rgba(44,68,130,.14)!important;
  border-left:4px solid var(--cj-yellow)!important;
  border-radius:12px!important;
  background:linear-gradient(110deg,#f4f6fb,#fafbfc)!important;
  box-shadow:0 6px 18px rgba(44,68,130,.06)!important;
}
html body.cms-index-index .cj-home a.cj-button,
html body .cj-home a.cj-button,
html body.cms-index-index .cj-home .cj-fit .cj-button,
html body .cj-home .cj-fit .cj-button{
  background:var(--cj-yellow)!important;
  background-color:var(--cj-yellow)!important;
  border:1px solid var(--cj-yellow)!important;
  color:var(--cj-navy)!important;
  -webkit-text-fill-color:var(--cj-navy)!important;
  font-weight:800!important;
  border-radius:999px!important;
  box-shadow:0 8px 18px rgba(44,68,130,.16)!important;
}
html body.cms-index-index .cj-home a.cj-button:hover,
html body .cj-home a.cj-button:hover{
  background:var(--cj-yellow-hover)!important;
  border-color:var(--cj-yellow-hover)!important;
  color:var(--cj-navy)!important;
  -webkit-text-fill-color:var(--cj-navy)!important;
}
/* Hero leftovers (if CMS reintroduces): navy panel + yellow CTA accents */
html body.cms-index-index .cj-home .cj-hero,
html body .cj-home .cj-hero{
  background:linear-gradient(125deg,var(--cj-navy),var(--cj-navy-deep))!important;
  border-radius:16px!important;
  box-shadow:0 12px 32px rgba(44,68,130,.14)!important;
}
html body.cms-index-index .cj-home .cj-hero-copy .cj-eyebrow:before,
html body .cj-home .cj-hero-copy .cj-eyebrow:before{
  background:var(--cj-yellow)!important;
}

/* Subscribe stays yellow+navy (explicit; do not regress) */
html body .page-wrapper .page-footer .block.newsletter .action.subscribe{
  background:var(--cj-yellow)!important;
  color:var(--cj-navy)!important;
  -webkit-text-fill-color:var(--cj-navy)!important;
}

@media (max-width:767px){
  html body.cms-index-index .cj-home,
  html body .cj-home{
    padding-top:10px!important;
    padding-bottom:36px!important;
  }
  html body.cms-index-index .cj-home .cj-section,
  html body .cj-home .cj-section{
    margin-top:36px!important;
  }
  html body.cms-index-index .cj-home .cj-product,
  html body .cj-home .cj-product{
    border-radius:12px!important;
  }
}

/* —— Category title: smaller + centered (user 碳碳 t137) —— */
html body.catalog-category-view .page-title-wrapper,
html body.catalogsearch-result-index .page-title-wrapper{
  text-align:center!important;
}
html body.catalog-category-view .page-title-wrapper .page-title,
html body.catalog-category-view .page-title,
html body.catalog-category-view h1.page-title,
html body.catalogsearch-result-index .page-title{
  text-align:center!important;
  font-size:26px!important;
  line-height:1.25!important;
  font-weight:750!important;
  letter-spacing:-.02em!important;
  color:var(--cj-navy)!important;
  margin-left:auto!important;
  margin-right:auto!important;
}
html body.catalog-category-view .page-title span.base,
html body.catalog-category-view .page-title-wrapper .page-title span,
html body.catalogsearch-result-index .page-title span.base{
  display:inline-block!important;
  text-align:center!important;
  max-width:100%;
}
/* Keep short yellow underline centered under title */
html body.catalog-category-view .page-title span.base:after,
html body.catalog-category-view .page-title-wrapper .page-title span:after,
html body.catalog-category-view .page-title span.base::after{
  display:block!important;
  margin-left:auto!important;
  margin-right:auto!important;
  background:var(--cj-yellow)!important;
  border-color:var(--cj-yellow)!important;
}
@media (max-width:767px){
  html body.catalog-category-view .page-title-wrapper .page-title,
  html body.catalog-category-view .page-title,
  html body.catalog-category-view h1.page-title,
  html body.catalogsearch-result-index .page-title{
    font-size:20px!important;
    line-height:1.3!important;
    letter-spacing:-.015em!important;
  }
}
@media (min-width:768px) and (max-width:1100px){
  html body.catalog-category-view .page-title-wrapper .page-title,
  html body.catalog-category-view .page-title{
    font-size:24px!important;
  }
}