/* Sholin Fight Spirit — rapprochement visuel léger de Classic, 25/10/2026.
 * Feuille indépendante : aucune dépendance à Bestwidget.
 */
@import url("sfs-oswald.css");

:root {
  --sfs-red: #c43e43;
  --sfs-red-dark: #a52830;
  --sfs-ink: #282a2d;
  --sfs-paper: #f5f5f5;
}
body { color: #333; font-family: Arial, Helvetica, sans-serif; }
h1, h2, h3, h4, .h1, .h2, .h3, .h4,
.btn, #header .top-menu > li > a, .block-category h1,
.footer-container .h3, .footer-container .h4 {
  font-family: "Oswald", "Arial Narrow", sans-serif;
}
a { color: #a52830; }
a:hover, a:focus { color: #7d1f25; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible {
  outline: 3px solid #c43e43;
  outline-offset: 3px;
}
#wrapper { background: var(--sfs-paper); box-shadow: none; }
#header {
  color: #fff;
  background: var(--sfs-ink);
  border-bottom: 4px solid var(--sfs-red);
  box-shadow: 0 2px 8px #0002;
}
#header .header-nav {
  max-height: none;
  margin: 0;
  background: #1c1d1f;
  border-bottom: 1px solid #ffffff1a;
  color: #eee;
}
#header .header-nav a, #header .header-nav .user-info,
#header .header-nav .cart-preview .header { color: #eee; }
#header .header-nav a:hover { color: #ff969b; }
#header .header-nav .blockcart { background: #36383c; color: #fff; }
#header .header-nav .cart-preview.active { background: var(--sfs-red-dark); }
#header .header-top {
  padding: 14px 0 16px;
  background: linear-gradient(48deg, #c43e43 0, #c43e43 15%, #151618 15%, #151618 15.8%, #4b4d50 15.8%, #4b4d50 17%, #282a2d 17%);
}
#header #_desktop_logo { padding-top: 14px; text-align: center; }
#header #_desktop_logo .logo { width: 65px; height: auto; max-height: 94px; object-fit: contain; }
#header .header-top-right::before {
  content: "";
  display: block;
  height: 65px;
  margin: 0 0 12px;
  background: url("../img/sfs-banniere.jpg") left center / contain no-repeat;
}
#header .header-top a { color: #fff; }
#header .top-menu[data-depth="0"] { margin-bottom: 0; }
#header .top-menu[data-depth="0"] > li > a {
  padding: 12px 11px;
  font-size: 17px;
  font-weight: 500;
  letter-spacing: .15px;
  color: #fff;
}
#header .top-menu[data-depth="0"] > li > a:hover,
#header .top-menu[data-depth="0"] > li > a:focus { color: #ff969b; }
#header .top-menu .sub-menu {
  border-top: 3px solid var(--sfs-red);
  background: #fff;
  box-shadow: 0 6px 16px #0002;
}
#header .top-menu .sub-menu a { color: #333; }
#header .top-menu .sub-menu a:hover { color: #a52830; }
#header .header-top .search-widgets { margin-top: 5px; }
#header .header-top .search-widgets input {
  background: #fff;
  border: 1px solid #666;
  border-radius: 2px;
  color: #222;
}
#header .header-top .search-widgets input::placeholder { color: #666; opacity: 1; }
#header .header-top .search-widgets button { color: #444; }
.btn-primary, .btn-primary:focus, .btn-primary:active,
.btn-primary.disabled, .btn-primary:disabled {
  color: #fff;
  background-color: var(--sfs-red-dark);
  border-color: var(--sfs-red-dark);
}
.btn-primary:hover { background-color: #282a2d; border-color: #282a2d; }
.btn { border-radius: 2px; letter-spacing: .35px; }
.btn-secondary { color: #333; }
.product-price, .product-prices .current-price, .product-miniature .price {
  color: #a52830;
}
.product-flags li.product-flag { background: var(--sfs-red-dark); }
.product-flags li.new { background: var(--sfs-ink); }
.product-flags li.discount, .product-discount .discount-percentage,
.product-discount .discount-amount { background: var(--sfs-red-dark); }
.tabs .nav-tabs .nav-link.active, .tabs .nav-tabs .nav-link:hover {
  color: #a52830;
  border-bottom-color: var(--sfs-red);
}
.product-miniature .thumbnail-container {
  border: 1px solid #e4e4e4;
  box-shadow: none;
  transition: border-color .15s ease;
}
.product-miniature .thumbnail-container:hover { border-color: var(--sfs-red); }
.product-miniature .product-title { font-family: Arial, Helvetica, sans-serif; font-weight: 600; }
.featured-products .products-section-title,
.product-accessories .products-section-title,
.productscategory-products .products-section-title {
  position: relative;
  margin: 28px 0 24px;
  padding-bottom: 16px;
  font-size: 27px;
  font-weight: 500;
}
.featured-products .products-section-title::after,
.product-accessories .products-section-title::after {
  content: "";
  position: absolute;
  width: 64px;
  height: 3px;
  bottom: 0;
  left: calc(50% - 32px);
  background: var(--sfs-red);
}
.block-category { border-top: 3px solid var(--sfs-red); box-shadow: none; }
#search_filters .facet .facet-label a { color: #444; }
.pagination .current a { color: #a52830; }
.carousel .carousel-inner { border-radius: 0; }
#footer { padding-top: 28px; background: #f5f5f5; }
#footer .block_newsletter { color: #333; }
.footer-container {
  position: relative;
  overflow: hidden;
  border-top: 4px solid var(--sfs-red);
  background: var(--sfs-ink);
  color: #eee;
  box-shadow: none;
  padding-bottom: 25px;
}
.footer-container::after {
  content: "";
  position: absolute;
  z-index: 0;
  width: 200px;
  height: 350px;
  right: -165px;
  bottom: -160px;
  transform: rotate(43deg);
  border-left: 12px solid #111;
  background: var(--sfs-red);
  pointer-events: none;
}
.footer-container > .container { position: relative; z-index: 1; }
.footer-container .h3, .footer-container .h4,
.footer-container h3, .footer-container h4,
.footer-container #block_myaccount_infos .myaccount-title a,
.footer-container .block-contact-title { color: #fff; font-size: 19px; font-weight: 500; }
.footer-container li a, .footer-container a, .footer-container p,
.footer-container .block-contact, .footer-container .block-contact a { color: #ddd; }
.footer-container a:hover { color: #ff969b; }
.footer-container li { margin-bottom: 10px; }
.footer-container .copyright a { color: #bbb; }

@media (min-width: 768px) and (max-width: 1199px) {
  #header .header-top .search-widgets { width: 100%; margin-top: 8px; }
  #header .top-menu[data-depth="0"] > li > a { font-size: 16px; padding: 10px 8px; }
}
@media (max-width: 767px) {
  #header .header-nav { background: var(--sfs-ink); }
  #header .header-nav .top-logo { padding-top: 8px; }
  #header .header-nav .top-logo img { width: auto; height: 48px; max-height: 48px; }
  #header .header-nav #menu-icon, #header .header-nav .user-info,
  #header .header-nav .material-icons { color: #fff; }
  #header .header-nav .blockcart { background: transparent; }
  #header .header-top { padding: 12px 0; background: #282a2d; }
  #header .header-top-right::before { height: 38px; margin: 0 0 10px; background-position: center; }
  #header .header-top .search-widgets { width: 100%; margin-top: 0; }
  #header .header-top .search-widgets input { width: 100%; }
  #header #mobile_top_menu_wrapper { background: #fff; }
  #header #mobile_top_menu_wrapper a { color: #333; }
  #header #mobile_top_menu_wrapper .top-menu a[data-depth="0"] { border-bottom: 1px solid #eee; color: #333; }
  #header #mobile_top_menu_wrapper .material-icons { color: #555; }
  .footer-container .title, .footer-container .navbar-toggler { color: #fff; }
  .featured-products .products-section-title { font-size: 24px; }
}
@media (prefers-reduced-motion: reduce) {
  .product-miniature .thumbnail-container { transition: none; }
}

/* Classic 3 utilise des icônes dans le formulaire de recherche. */
#header .header-top .search-widgets .material-icons { color: #555; }
#header .header-top .search-widgets input { background: #fff; color: #222; }
#header .header-top .search-widgets input::placeholder { color: #666; opacity: 1; }
.product-miniature .discount-percentage, .product-miniature .discount-amount,
.product-miniature .product-flags li.product-flag.discount { background: #a52830 !important; color: #fff; }

/* Les listes de liens ne sont pas encore configurées dans la recette. */
.footer-container > .container > .row > .col-md-6.links:not(:has(a)) { display: none; }
@media (min-width: 768px) {
  .footer-container > .container > .row { display: flex; flex-wrap: wrap; }
  .footer-container > .container > .row > .links { float: none; flex: 1 1 260px; width: auto; }
}
/* Les dialogues natifs (listes d'envies) gardent un fond clair lisible. */
.footer-container .modal, .footer-container .modal p { color: #333; }
.footer-container .modal a { color: #a52830; }

/* Fiche produit : photos / description et détails / achat sur grand écran. */
.sfs-product-details { clear: both; }
@media (min-width: 1200px) {
  #product .sfs-product-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 1.15fr) minmax(280px, 1fr);
    grid-template-areas: "media details purchase";
    gap: 24px;
    align-items: start;
    margin-left: 0;
    margin-right: 0;
  }
  #product .sfs-product-layout::before,
  #product .sfs-product-layout::after { display: none; }
  #product .sfs-product-layout > .sfs-product-media,
  #product .sfs-product-layout > .sfs-product-purchase,
  #product .sfs-product-layout > .sfs-product-details {
    float: none;
    width: 100%;
    min-width: 0;
    padding-left: 0;
    padding-right: 0;
    clear: none;
  }
  #product .sfs-product-media { grid-area: media; }
  #product .sfs-product-details { grid-area: details; }
  #product .sfs-product-purchase { grid-area: purchase; }
  #product .sfs-product-media .product-cover img { width: 100%; height: auto; }
  #product .sfs-product-details .tabs { margin-top: 0; padding: 18px; }
  #product .sfs-product-details .nav-tabs { display: flex; flex-wrap: wrap; }
  #product .sfs-product-details .nav-tabs .nav-item { margin-right: 0; }
  #product .sfs-product-details .nav-tabs .nav-link { padding: 10px 8px; font-size: 15px; }
  #product .sfs-product-details .product-description { font-size: 14px; line-height: 1.65; overflow-wrap: anywhere; }
  #product .sfs-product-details img,
  #product .sfs-product-details table { max-width: 100%; }
  #product .sfs-product-purchase > h1 { font-size: 25px; line-height: 1.25; }
  #product .sfs-product-purchase .product-description { font-size: 14px; line-height: 1.55; }
  #product .sfs-product-purchase .product-description h1 { font-size: 21px; }
  #product .sfs-product-purchase .product-quantity { display: flex; flex-wrap: wrap; gap: 8px; }
  #product .sfs-product-purchase .product-quantity .qty,
  #product .sfs-product-purchase .product-quantity .add { margin: 0; }
}