/*
 * TRN FIT | REPAIRED UNIFIED CSS V5 (16 Oct 2026)
 * Replace the entire previous GLOBAL custom CSS with this file.
 * Do not append it to older V1/V2/V3/V4 patches.
 * Scope: storefront, product and cart. EXCLUDES hosted checkout/payment page.
 * Colors: black / olive / tan / warm cream. No global icon or form overrides.
 */

:root {
  --trn-black: #0A0A0A;
  --trn-olive: #6B7A40;
  --trn-tan: #C8B89A;
  --trn-cream: #F3E8D7;
  --trn-cream-border: #E5D5BE;
  --trn-ink: #242B1D;
  --trn-white: #FFFFFF;
  --trn-muted: #E1E5D7;
}

/* 1. Site foundations. No global color override on form controls. */
body { background: var(--trn-black) !important; }
.s-advertisement {
  background: var(--trn-olive) !important;
  color: var(--trn-white) !important;
}
.s-advertisement-content { color: var(--trn-white) !important; font-weight: 700; }

/* 2. HEADER. Keep header white; center ONLY the store logo.
   Based on Salla's #mainnav container; final logo markup may vary by theme. */
#mainnav .container { position: relative !important; }
#mainnav .container :is(.navbar-brand, .store-logo, .header-logo, a.logo),
#mainnav .container a:has(> img[alt*="TRN" i]) {
  position: absolute !important;
  inset-inline-start: auto !important;
  left: 50% !important;
  top: 50% !important;
  transform: translate(-50%, -50%) !important;
  z-index: 5;
  margin: 0 !important;
}
#mainnav .container :is(.navbar-brand, .store-logo, .header-logo, a.logo) img {
  max-height: 44px;
  width: auto;
}
@media (max-width: 767px) {
  #mainnav .container :is(.navbar-brand, .store-logo, .header-logo, a.logo) img {
    max-height: 35px;
  }
}
/* Cream backgrounds on actual header controls ONLY, not every button/ SVG. */
#mainnav :is(.header-btn, .header-icon-button, button.header-btn, a.header-btn) {
  background-color: var(--trn-cream) !important;
  border-color: var(--trn-cream-border) !important;
}
#mainnav :is(.header-btn__icon, .sicon-shopping-bag, .sicon-user, .sicon-search) {
  color: var(--trn-olive) !important;
}
/* Wishlist circular backgrounds, with no blanket styling of icons or badges. */
custom-salla-product-card :is(.s-product-card-wishlist-btn, .s-product-card-entry-wishlist, button[aria-label*="wishlist" i], button[aria-label*="favorite" i], button[aria-label*="المفضلة"]),
.s-product-card-entry :is(.s-product-card-wishlist-btn, .s-product-card-entry-wishlist, button[aria-label*="wishlist" i], button[aria-label*="favorite" i], button[aria-label*="المفضلة"]) {
  background-color: var(--trn-cream) !important;
  border-color: var(--trn-cream-border) !important;
  color: var(--trn-olive) !important;
}

/* 3. Storefront product cards: image remains untouched, details olive. */
custom-salla-product-card.s-product-card-entry,
custom-salla-product-card .s-product-card-content,
custom-salla-product-card .s-product-card-content-main,
custom-salla-product-card .s-product-card-content-sub,
custom-salla-product-card .s-product-card-content-footer,
.s-product-card-entry .s-product-card-content,
.s-product-card-entry .s-product-card-content-main,
.s-product-card-entry .s-product-card-content-sub,
.s-product-card-entry .s-product-card-content-footer {
  background-color: var(--trn-olive) !important;
}
custom-salla-product-card .s-product-card-content,
custom-salla-product-card .s-product-card-content :is(h3,h4,p,a,span),
.s-product-card-entry .s-product-card-content,
.s-product-card-entry .s-product-card-content :is(h3,h4,p,a,span) {
  color: var(--trn-white) !important;
}
custom-salla-product-card .s-product-card-content-footer button,
.s-product-card-entry .s-product-card-content-footer button {
  background: var(--trn-white) !important;
  color: var(--trn-olive) !important;
  border-color: var(--trn-white) !important;
  border-radius: 6px;
}
custom-salla-product-card .s-product-card-content-footer button *,
.s-product-card-entry .s-product-card-content-footer button * {
  color: var(--trn-olive) !important;
}

/* 4. Headings on black canvas. Avoid recoloring headings in white forms. */
#main-content .s-block__title,
#main-content .s-block__title :is(h2,h3,a),
#main-content .section-title { color: var(--trn-cream) !important; }

/* 5. FAQ theme variables only; FAQ custom Shadow CSS may also be needed. */
salla-faq {
  --ink: var(--trn-white);
  --olive: var(--trn-olive);
  --oliveL: var(--trn-olive);
  --faq-question-text-color: var(--trn-white);
  --faq-answer-text-color: var(--trn-white);
}

/* 6. Individual product pages, from inspected product DOM. */
#main-content .product-entry__title,
#main-content h1.text-gray-800 { color: var(--trn-white) !important; }
#main-content .product-entry__sub-title,
#main-content h2.text-gray-500 { color: var(--trn-tan) !important; }
#main-content [data-testid="store-product-description"],
#main-content [data-testid="store-product-description"] :is(p,li,ul,span,strong,h2,h3) {
  color: var(--trn-cream) !important;
}
#main-content [data-testid="store-product-price"] { color: var(--trn-white) !important; }
#main-content [data-testid="store-product-price"] :is(del,s) { color: #CECECE !important; }

/* 7. Cart item shell: scoped to confirmed cart-item class. */
body.cart #main-content section.cart-item,
#main-content section.cart-item.bg-white {
  background: var(--trn-olive) !important;
  color: var(--trn-white) !important;
  border-radius: 8px !important;
}/* TRN FIT | V5.2 precision patch | CART + BREADCRUMB ONLY
   Paste at the VERY END of the currently active V5 global CSS.
   Tested for CSS syntax and in a local DOM mock, NOT on live Salla. */
:root { --trn-cream:#F3E8D7; --trn-ink:#242B1D; }

/* Quantity: fix the WHITE digit on the cream input. */
html body #main-content section.cart-item salla-quantity-input input.s-quantity-input-input,
html body #main-content section.cart-item salla-quantity-input input[aria-label="Quantity"],
html body #main-content section.cart-item .s-quantity-input-container > input {
  color: #242B1D !important;
  -webkit-text-fill-color: #242B1D !important;
  background: #F3E8D7 !important;
  text-shadow: none !important;
  caret-color: #242B1D !important;
  filter: none !important;
  opacity: 1 !important;
  color-scheme: light !important;
}
html body #main-content section.cart-item salla-quantity-input .s-quantity-input-button {
  color: #242B1D !important;
  -webkit-text-fill-color: #242B1D !important;
  background: #F3E8D7 !important;
}
html body #main-content section.cart-item salla-quantity-input .s-quantity-input-button :is(i,svg) {
  color: #242B1D !important;
  stroke: currentColor !important;
}

/* Breadcrumb: white text inside the Salla web component's Shadow DOM. */
html body #main-content salla-breadcrumb {
  color: #F5F3F0 !important;
  -webkit-text-fill-color: #F5F3F0 !important;
  filter: none !important;
  opacity: 1 !important;
}
html body #main-content nav.breadcrumbs,
html body #main-content .container-breadcrumbs { opacity: 1 !important; }

/* Product title and current price on olive cart cards. */
html body #main-content section.cart-item a[href]:not(.btn),
html body #main-content section.cart-item :is(h2,h3,h4,.cart-item-price,.cart-item-total) {
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
}
/* TRN FIT — 3D Logo Spin */

@keyframes trn3DSpin {
  0%, 15% {
    transform: rotateY(0deg);
  }

  50% {
    transform: rotateY(180deg);
  }

  85%, 100% {
    transform: rotateY(0deg);
  }
}

#mainnav .container
:is(.navbar-brand, .store-logo, .header-logo, a.logo),
#mainnav .container
a:has(> img[alt*="TRN" i]) {
  perspective: 800px;
}

#mainnav .container
:is(.navbar-brand, .store-logo, .header-logo, a.logo) img,
#mainnav .container
a:has(> img[alt*="TRN" i]) > img {
  animation: trn3DSpin 4s ease-in-out infinite;
  transform-origin: center;
  backface-visibility: visible;
}

@media (prefers-reduced-motion: reduce) {
  #mainnav .container
  :is(.navbar-brand, .store-logo, .header-logo, a.logo) img,
  #mainnav .container
  a:has(> img[alt*="TRN" i]) > img {
    animation: none;
  }
}
/* TRN FIT — BIGGER 3D ROTATING LOGO */

@keyframes trnLogoSpinLarge {
  0%, 15% {
    transform: rotateY(0deg) scale(1.7);
  }

  50% {
    transform: rotateY(180deg) scale(1.7);
  }

  85%, 100% {
    transform: rotateY(0deg) scale(1.7);
  }
}/* TRN FIT — BIGGER FULL 360 ROTATING LOGO */

@keyframes trnLogoSpinFull {
  0% {
    transform: rotateY(0deg) scale(1.7);
  }

  100% {
    transform: rotateY(360deg) scale(1.7);
  }
}

/* Mobile logo */
@media (max-width: 767px) {
  #mainnav .container
  :is(.navbar-brand, .store-logo, .header-logo, a.logo) img,
  #mainnav .container
  a:has(> img[alt*="TRN" i]) > img {
    animation: trnLogoSpinFull 3s linear infinite !important;
    transform-origin: center center;
    transform-style: preserve-3d;
    backface-visibility: visible;
  }
}
/* Reduce motion accessibility */
@media (prefers-reduced-motion: reduce) {
  #mainnav .container
  :is(.navbar-brand, .store-logo, .header-logo, a.logo) img {
    animation: none !important;
  }
 }
  /* ================================================================
   TRN FIT | FOOTER DOM-TARGETED FIX | 16 Oct 2026
   Based on DevTools: footer.store-footer >
   div.store-footer__inner > div.container.grid.grid-cols-1
   REPLACES ALL PRIOR FOOTER CUSTOM CSS BLOCKS ONLY.
   Do not remove V5 + V5.2 storefront/cart working code.
   No global selectors outside footer.
   ================================================================ */

:root {
  --trn-footer-bg: #1E1F1D;
  --trn-footer-cream: #F3E8D7;
  --trn-footer-olive: #6B7A40;
}

footer.store-footer {
  background: var(--trn-footer-bg) !important;
  border-top: 3px solid var(--trn-footer-olive) !important;
  color: var(--trn-footer-cream) !important;
}
footer.store-footer > .store-footer__inner {
  background: var(--trn-footer-bg) !important;
  padding-block: 32px 24px !important;
}

/* 1. Brand: first GRID CHILD regardless of internal anchor wrappers. */
footer.store-footer > .store-footer__inner > .container > :first-child {
  min-width: 0 !important;
  text-align: center !important;
}
footer.store-footer > .store-footer__inner > .container > :first-child :is(h3,h2) {
  box-sizing: border-box !important;
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 100px !important;
  margin: 0 auto 12px !important;
  padding: 80px 0 0 !important;
  background-image: url("data:image/png;base64,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") !important;
  background-position: center top !important;
  background-size: 178px auto !important;
  background-repeat: no-repeat !important;
  font-size: 0 !important;
  line-height: 0 !important;
  color: transparent !important;
  -webkit-text-fill-color: transparent !important;
}
/* Place slogan IN FLOW: no absolute positioning or clipped text. */
footer.store-footer > .store-footer__inner > .container > :first-child :is(h3,h2)::after {
  content: "TRAIN RISE NEVER QUIT" !important;
  display: block !important;
  position: static !important;
  transform: none !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  font-family: inherit !important;
  font-size: 10px !important;
  line-height: 18px !important;
  font-weight: 800 !important;
  letter-spacing: 1.1px !important;
  color: var(--trn-footer-cream) !important;
  -webkit-text-fill-color: var(--trn-footer-cream) !important;
  text-align: center !important;
  white-space: normal !important;
  background: none !important;
}
/* Avoid duplicate slogan left by the old first-footer patch. */
footer.store-footer > .store-footer__inner > .container > :first-child a::after {
  content: none !important;
}
footer.store-footer > .store-footer__inner > .container > :first-child p {
  color: #F3E8D7 !important;
  text-align: center !important;
}

/* 2. Existing footer links. Avoid touching icon/svg fills. */
footer.store-footer .store-footer__inner h3,
footer.store-footer .store-footer__inner h4 {
  color: var(--trn-footer-cream) !important;
}
footer.store-footer .store-footer__inner a,
footer.store-footer .store-footer__inner p {
  overflow-wrap: anywhere;
}
footer.store-footer .store-footer__inner a:hover {
  color: var(--trn-footer-cream) !important;
}

/* 3. MOBILE: the inspected container is grid-cols-1 by default. */
@media (max-width: 767px) {
  footer.store-footer > .store-footer__inner > .container.grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    column-gap: 14px !important;
    row-gap: 22px !important;
    align-items: start !important;
  }
  /* Brand occupies BOTH columns; links + contact each occupy one. */
  footer.store-footer > .store-footer__inner > .container.grid > :first-child {
    grid-column: 1 / -1 !important;
    justify-self: stretch !important;
  }
  footer.store-footer > .store-footer__inner > .container.grid > :nth-child(2),
  footer.store-footer > .store-footer__inner > .container.grid > :nth-child(3) {
    grid-column: auto !important;
    min-width: 0 !important;
    width: 100% !important;
    margin: 0 !important;
  }
  footer.store-footer > .store-footer__inner > .container.grid > :nth-child(n+4) {
    grid-column: 1 / -1 !important;
  }
  footer.store-footer > .store-footer__inner > .container.grid > :nth-child(2) h3,
  footer.store-footer > .store-footer__inner > .container.grid > :nth-child(3) h3 {
    font-size: 15px !important;
    line-height: 1.5 !important;
  }
  footer.store-footer > .store-footer__inner > .container.grid > :nth-child(3) {
    font-size: 12px !important;
  }
}
/* Very narrow phones: prioritize legibility over two squeezed columns. */
@media (max-width: 359px) {
  footer.store-footer > .store-footer__inner > .container.grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  footer.store-footer > .store-footer__inner > .container.grid > * {
    grid-column: 1 / -1 !important;
  }
}
/* TRN FIT — SOCIAL ICONS FAR RIGHT */

@media (max-width: 767px) {

  /* Full footer layout */
  footer.store-footer
  .store-footer__inner > .container {
    position: relative !important;
    padding-bottom: 85px !important;
  }

  /* Move social icons to far right */
  footer.store-footer .contact-social {
    position: absolute !important;
    right: 0 !important;
    left: auto !important;
    bottom: 0 !important;

    display: flex !important;
    justify-content: flex-end !important;
    align-items: center !important;

    width: max-content !important;
    max-width: 100% !important;
    margin: 0 !important;
    text-align: right !important;
  }

  footer.store-footer .contact-social salla-social {
    display: block !important;
    width: max-content !important;
    margin: 0 !important;
  }
}
/* TRN FIT — FOOTER CERTIFICATE POSITION */

footer.store-footer
.store-footer__inner > .container.grid {
  position: relative !important;
  padding-bottom: 160px !important;
}

/* Keep brand block from trapping the badge */
footer.store-footer
.store-footer__inner > .container.grid
> :first-child {
  position: static !important;
}

/* Certificate: bottom center */
footer.store-footer salla-trust-badges {
  position: absolute !important;
  left: 50% !important;
  right: auto !important;
  bottom: 15px !important;

  width: max-content !important;
  max-width: 100% !important;
  margin: 0 !important;

  transform: translateX(-50%) scale(0.75) !important;
  transform-origin: center bottom !important;
  z-index: 2;
}

/* Keep social icons above certificate */
@media (max-width: 767px) {
  footer.store-footer .contact-social {
    bottom: 90px !important;
  }
}
/* TRN FIT — Raise Social Icons */

@media (max-width: 767px) {
  footer.store-footer .contact-social {
    bottom: 190px !important;
  }
}
/* ====================================
   TRN FIT — COMPACT FOOTER LAYOUT
   Mobile only
   ==================================== */

@media (max-width: 767px) {

  /* Reduce unused space at footer bottom */
  footer.store-footer
  > .store-footer__inner
  > .container.grid {
    position: relative !important;
    padding-bottom: 64px !important;
  }

  /* Keep certificate positioned relative
     to the main footer container */
  footer.store-footer
  > .store-footer__inner
  > .container.grid
  > :first-child {
    position: static !important;
  }

  /* Social icons: right, below policy */
  footer.store-footer .contact-social {
    position: absolute !important;
    right: 16px !important;
    left: auto !important;
    bottom: 94px !important;

    display: flex !important;
    justify-content: flex-end !important;
    align-items: center !important;

    width: max-content !important;
    max-width: calc(100% - 32px) !important;
    margin: 0 !important;
    direction: ltr !important;
  }

  footer.store-footer .contact-social salla-social {
    display: block !important;
    width: max-content !important;
    margin: 0 !important;
  }

  /* Certificate: smaller, centered and closer */
  footer.store-footer salla-trust-badges {
    position: absolute !important;
    left: 50% !important;
    right: auto !important;
    bottom: 8px !important;

    width: max-content !important;
    max-width: 100% !important;
    margin: 0 !important;

    transform: translateX(-50%) scale(0.72) !important;
    transform-origin: center bottom !important;
  }
}/* TRN FIT — Card motion: lift + image zoom on hover, press effect on touch */
.s-product-card-entry {
  transition: transform .35s cubic-bezier(.2,.8,.2,1), border-color .25s, box-shadow .35s;
}
.s-product-card-entry .s-product-card-image { overflow: hidden; }
.s-product-card-entry img { transition: transform .6s cubic-bezier(.2,.8,.2,1); }

@media (hover: hover) {
  .s-product-card-entry:hover {
    transform: translateY(-6px);
    border-color: #6B7A40 !important;
    box-shadow: 0 14px 30px rgba(107,122,64,.35);
  }
  .s-product-card-entry:hover img { transform: scale(1.08); }
}

.s-product-card-entry:active { transform: scale(.97); }

@media (prefers-reduced-motion: reduce) {
  .s-product-card-entry, .s-product-card-entry img { transition: none !important; }
  .s-product-card-entry:hover,
  .s-product-card-entry:active,
  .s-product-card-entry:hover img { transform: none !important; }
}