/* =============================================================================
   e-Shop Salernitana 2027 - design system
   SA27.01 - valori presi dalla sezione 1a del design in template2027/
   ("Salernitana Store Restyling.dc.html"). Il design nasce con gli stili in
   linea: qui sono raccolti in classi, cosi' il markup PHP resta leggibile.

   Questo foglio viene caricato DOPO main.min.css e vince sul tema ereditato.
   Prefisso di tutte le classi: sa-
   ========================================================================== */

/* --- carattere ------------------------------------------------------------
   SA27.01 (Jordan 17/09/2026): Poppins (OFL, fonts/poppins/OFL.txt) servito dal sito
   al posto di Archivo/Inter da Google Fonts. Solo i pesi usati: 400 testo, 500 nomi
   prodotto, 600 etichette e pulsanti, 700 titoli, 800 il titolo grande della home.
   Niente corsivo: il sito non lo usa. Per aggiungere un peso: file woff2 + blocco. */
@font-face {
	font-family: 'Poppins';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url('/fonts/poppins/poppins-400.woff2') format('woff2');
}
@font-face {
	font-family: 'Poppins';
	font-style: normal;
	font-weight: 500;
	font-display: swap;
	src: url('/fonts/poppins/poppins-500.woff2') format('woff2');
}
@font-face {
	font-family: 'Poppins';
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url('/fonts/poppins/poppins-600.woff2') format('woff2');
}
@font-face {
	font-family: 'Poppins';
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url('/fonts/poppins/poppins-700.woff2') format('woff2');
}
@font-face {
	font-family: 'Poppins';
	font-style: normal;
	font-weight: 800;
	font-display: swap;
	src: url('/fonts/poppins/poppins-800.woff2') format('woff2');
}

:root {
	--sa-granata: #681A12;        /* brand primary: CTA, badge, hover, barre */
	--sa-granata-dark: #4A120C;   /* hover / press */
	--sa-granata-light: #8A2418;  /* hover su fondo scuro */
	--sa-ink: #111111;            /* testo principale, footer */
	--sa-gray: #6B6B6B;           /* testo secondario */
	--sa-muted: #A5A2A0;          /* testo disabilitato */
	--sa-surface: #F5F3F1;        /* fondo foto prodotto */
	--sa-bg: #FFFFFF;
	--sa-page: #E9E7E4;
	--sa-line: #E5E3E1;           /* linee 1px */
	--sa-line-strong: #D8D5D1;
	--sa-line-soft: #F0EEEC;

	--sa-font: Poppins, Helvetica, Arial, sans-serif;
	--sa-container: 1380px;   /* 1280 nel design; portato a 1380 su richiesta di Jordan (11/09/2026) */
	--sa-gutter: 80px;
}

/* --- base ---------------------------------------------------------------- */
/* tutto il sito in Poppins: main.min.css mette Inter !important su body, select2.css
   'Inter' sulle voci; le icone (FontAwesome, bootstrap-icons) hanno la loro famiglia */
body, .select2-results__option, .select2-container { font-family: var(--sa-font) !important; }
.sa-scope,
.sa-scope * { box-sizing: border-box; }

.sa-container {
	max-width: var(--sa-container);
	margin: 0 auto;
	padding-left: var(--sa-gutter);
	padding-right: var(--sa-gutter);
}

.sa-hero-container {
    max-width: var(--sa-container);
    padding-left: var(--sa-gutter);
    padding-right: var(--sa-gutter);
}

.sa-display, .sa-h1, .sa-h2, .sa-h3 {
	font-family: var(--sa-font);
	text-transform: uppercase;
	color: var(--sa-ink);
	margin: 0;
}
.sa-display { font-weight: 800; font-size: 64px; line-height: 1; letter-spacing: -.03em; }
.sa-h1 { font-weight: 700; font-size: 44px; line-height: 1.05; letter-spacing: -.02em; }
.sa-h2 { font-weight: 700; font-size: 30px; line-height: 1.1; letter-spacing: -.01em; }
.sa-h3 { font-weight: 600; font-size: 20px; line-height: 1.2; letter-spacing: 0; }

.sa-eyebrow {
	font: 600 11px/1 var(--sa-font);
	letter-spacing: .2em;
	text-transform: uppercase;
	color: var(--sa-granata);
}
.sa-body { font: 400 16px/1.6 var(--sa-font); color: var(--sa-ink); margin: 0; }
.sa-muted { color: var(--sa-gray); }
.sa-price { font: 600 17px/1 var(--sa-font); color: var(--sa-ink); }  /* mai granata */
.sa-price--lg { font-size: 22px; }
.sa-price__prefix { font: 400 12px/1 var(--sa-font); color: var(--sa-gray); }
.sa-price__old { font: 400 13px/1 var(--sa-font); color: #9A9A9A; text-decoration: line-through; }

/* --- bottoni (radius 0-2px, nessuna ombra) ------------------------------- */
.sa-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 52px;
	padding: 0 34px;
	border-radius: 0;
	border: none;
	cursor: pointer;
	font: 600 13px/1 var(--sa-font);
	letter-spacing: .16em;
	text-transform: uppercase;
	text-decoration: none;
	transition: background .2s ease, color .2s ease, border-color .2s ease;
}
.sa-btn--primary { background: var(--sa-granata); color: #fff; }
.sa-btn--primary:hover, .sa-btn--primary:focus { background: var(--sa-granata-dark); color: #fff; text-decoration: none; }
.sa-btn--secondary { background: transparent; border: 1px solid var(--sa-ink); color: var(--sa-ink); }
.sa-btn--secondary:hover, .sa-btn--secondary:focus { background: var(--sa-ink); color: #fff; text-decoration: none; }
.sa-btn--onphoto { background: transparent; border: 1px solid #fff; color: #fff; }
.sa-btn--onphoto:hover, .sa-btn--onphoto:focus { background: #fff; color: var(--sa-ink); text-decoration: none; }
/* SA27.01: bianco pieno su fondo colorato (CTA "Maglie match worn" in home), al passaggio nero (Jordan 14/09/2026) */
.sa-btn--white { background: #fff; border: 1px solid #fff; color: var(--sa-ink); }
.sa-btn--white:hover, .sa-btn--white:focus { background: var(--sa-ink); border-color: var(--sa-ink); color: #fff; text-decoration: none; }
.sa-btn--tertiary {
	height: 44px; padding: 0 22px;
	background: transparent; border: 1px solid var(--sa-line); color: var(--sa-ink);
	font-size: 12px; letter-spacing: .12em;
}
.sa-btn--tertiary:hover, .sa-btn--tertiary:focus { border-color: var(--sa-ink); text-decoration: none; }
.sa-btn[disabled], .sa-btn--disabled {
	height: 44px; padding: 0 22px;
	background: var(--sa-line-soft); color: var(--sa-muted);
	border: none; cursor: not-allowed;
}
.sa-link {
	font: 600 13px/1 var(--sa-font);
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--sa-granata);
	text-decoration: none;
	border-bottom: 1px solid var(--sa-granata);
	padding-bottom: 3px;
}
.sa-link:hover, .sa-link:focus { color: var(--sa-granata-dark); border-bottom-color: var(--sa-granata-dark); text-decoration: none; }

.sa-scope a:focus-visible,
.sa-scope button:focus-visible,
.sa-scope input:focus-visible {
	outline: 2px solid var(--sa-granata);
	outline-offset: 2px;
}

/* --- badge --------------------------------------------------------------- */
.sa-badge {
	display: inline-block;
	background: var(--sa-granata);
	color: #fff;
	font: 600 10px/1 var(--sa-font);
	letter-spacing: .16em;
	text-transform: uppercase;
	padding: 8px 10px;
}
.sa-badge--ink { background: var(--sa-ink); }
.sa-badge--outline { background: #fff; color: var(--sa-ink); border: 1px solid var(--sa-ink); padding: 7px 9px; }
.sa-badge--muted { background: var(--sa-line-soft); color: var(--sa-gray); }

/* =============================================================================
   Testata
   ========================================================================== */
.sa-utilitybar { background: var(--sa-granata); }
.sa-utilitybar__inner {
	display: flex; align-items: center; justify-content: space-between;
	height: 40px;
}
.sa-utilitybar__claim {
	font: 600 11px/1 var(--sa-font);
	letter-spacing: .16em; text-transform: uppercase; color: #fff;
}
.sa-utilitybar__links { display: flex; align-items: center; gap: 28px; }
.sa-utilitybar__links a, .sa-utilitybar__links span {
	font: 500 11px/1 var(--sa-font);
	letter-spacing: .14em; text-transform: uppercase;
	color: #fff; text-decoration: none; opacity: .85;
}
.sa-utilitybar__links a:hover { opacity: 1; color: #fff; text-decoration: none; }
.sa-utilitybar__sep { width: 1px; height: 14px; background: rgba(255,255,255,.3); opacity: 1 !important; }

.sa-header { background: var(--sa-bg); border-bottom: 1px solid var(--sa-line); }
.sa-header__inner { display: flex; align-items: center; gap: 48px; height: 88px; }
.sa-header__brand { display: flex; align-items: center; gap: 14px; text-decoration: none; }
.sa-header__brand img { display: block; height: 56px; width: auto; }
.sa-header__brandtext { display: flex; flex-direction: column; gap: 2px; border-left: 1px solid var(--sa-line); padding-left: 14px; }
.sa-header__brandtext b {
	font: 700 13px/1 var(--sa-font); letter-spacing: .2em;
	text-transform: uppercase; color: var(--sa-ink);
}
.sa-header__brandtext span {
	font: 500 10px/1 var(--sa-font); letter-spacing: .16em;
	text-transform: uppercase; color: var(--sa-gray);
}

.sa-nav { display: flex; align-items: center; gap: 26px; margin-left: auto; }
.sa-nav a {
	font: 600 12px/1 var(--sa-font);
	letter-spacing: .12em; text-transform: uppercase;
	color: var(--sa-ink); text-decoration: none;
	padding: 34px 0 32px;
	border-bottom: 2px solid transparent;
}
.sa-nav a:hover, .sa-nav a:focus, .sa-nav a.is-current {
	color: var(--sa-granata);
	border-bottom-color: var(--sa-granata);
	text-decoration: none;
}

.sa-header__actions { display: flex; align-items: center; gap: 8px; margin-left: 8px; }
.sa-iconbtn {
	width: 44px; height: 44px;
	display: flex; align-items: center; justify-content: center;
	background: transparent; border: 1px solid transparent;
	color: var(--sa-ink); cursor: pointer; text-decoration: none;
}
.sa-iconbtn:hover, .sa-iconbtn:focus { border-color: var(--sa-line); color: var(--sa-ink); text-decoration: none; }
.sa-cartbtn {
	height: 44px; display: flex; align-items: center; gap: 10px;
	padding: 0 16px; background: var(--sa-ink); border: none;
	color: #fff; cursor: pointer; text-decoration: none;
}
.sa-cartbtn:hover, .sa-cartbtn:focus { background: var(--sa-granata); color: #fff; text-decoration: none; }
.sa-cartbtn__label { font: 600 12px/1 var(--sa-font); letter-spacing: .12em; text-transform: uppercase; }
.sa-cartbtn__qty {
	min-width: 20px; height: 20px;
	display: flex; align-items: center; justify-content: center;
	background: #fff; color: var(--sa-ink);
	font: 700 11px/1 var(--sa-font); padding: 0 5px;
}
.sa-burger { display: none; }

/* barra di ricerca a scomparsa */
.sa-searchbar { display: none; border-top: 1px solid var(--sa-line); background: var(--sa-bg); }
.sa-searchbar.is-open { display: block; }
.sa-searchbar form { display: flex; align-items: stretch; gap: 0; padding: 18px 0; }
.sa-searchbar input {
	flex: 1; height: 52px; padding: 0 18px;
	border: 1px solid var(--sa-line); border-radius: 2px 0 0 2px;
	font: 400 15px/1 var(--sa-font); color: var(--sa-ink); outline: none;
}
.sa-searchbar input:focus { border-color: var(--sa-ink); }
.sa-searchbar button { border-radius: 0 2px 2px 0; }

/* =============================================================================
   Home
   ========================================================================== */
.sa-hero { position: relative; height: 720px; overflow: hidden; background: var(--sa-ink); }
.sa-hero__img { display: block; width: 100%; height: 100%; object-fit: cover; }
.sa-hero__scrim {
	position: absolute; inset: 0;
	background: linear-gradient(90deg, rgba(17,17,17,.82) 0%, rgba(17,17,17,.45) 45%, rgba(17,17,17,0) 75%);
}
.sa-hero__content { position: absolute; inset: 0; display: flex; align-items: center; }
.sa-hero__box { max-width: 650px; display: flex; flex-direction: column; gap: 22px; }
.sa-hero__eyebrow { display: flex; align-items: center; gap: 10px; color: #fff; font: 600 11px/1 var(--sa-font); letter-spacing: .2em; text-transform: uppercase; }
.sa-hero__eyebrow i { width: 28px; height: 2px; background: var(--sa-granata); display: inline-block; }
.sa-hero__box .sa-display { color: #fff; }
.sa-hero__box p { font: 400 16px/1.6 var(--sa-font); color: rgba(255,255,255,.8); margin: 0; max-width: 460px; }
.sa-hero__cta { display: flex; flex-wrap: wrap; gap: 14px; }

.sa-section { padding: 88px 0; }
.sa-section--tight { padding: 64px 0; }
.sa-section--surface { background: var(--sa-page); }
.sa-section__head {
	display: flex; align-items: flex-end; justify-content: space-between;
	gap: 32px; margin-bottom: 40px;
}
.sa-section__title { display: flex; flex-direction: column; gap: 12px; }

.sa-catgrid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; }
.sa-catcard { position: relative; display: block; overflow: hidden; text-decoration: none; background: var(--sa-surface); }
.sa-catcard img { display: block; width: 100%; aspect-ratio: 3/4; object-fit: cover; transition: transform .4s ease; }
.sa-catcard:hover img { transform: scale(1.04); }
.sa-catcard__scrim { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(17,17,17,0) 45%, rgba(17,17,17,.75) 100%); }
.sa-catcard__label { position: absolute; left: 0; right: 0; bottom: 0; padding: 24px; display: flex; flex-direction: column; gap: 4px; }
.sa-catcard__label b { font: 700 18px/1.2 var(--sa-font); letter-spacing: .04em; text-transform: uppercase; color: #fff; }
.sa-catcard__label span { font: 400 12px/1 var(--sa-font); color: rgba(255,255,255,.75); }

.sa-prodgrid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px 24px; }
.sa-prodcard { display: flex; flex-direction: column; gap: 14px; background: var(--sa-bg); }
.sa-prodcard__media { position: relative; background: var(--sa-surface); aspect-ratio: 4/5; overflow: hidden; }
.sa-prodcard__media img { display: block; width: 100%; height: 100%; object-fit: cover; }
.sa-prodcard__media .sa-badge { position: absolute; top: 0; left: 0; }
.sa-prodcard__hover {
	position: absolute; inset: 0;
	display: flex; align-items: flex-end; justify-content: center;
	padding: 20px; opacity: 0; transition: opacity .25s ease;
}
.sa-prodcard:hover .sa-prodcard__hover { opacity: 1; }
.sa-prodcard__hover span {
	background: #fff; color: var(--sa-ink);
	font: 600 11px/1 var(--sa-font); letter-spacing: .18em; text-transform: uppercase;
	padding: 14px 26px; border: 1px solid var(--sa-ink);
}
.sa-prodcard__body { display: flex; flex-direction: column; gap: 6px; padding-right: 8px; }
.sa-prodcard__name {
	font: 500 15px/1.3 var(--sa-font); letter-spacing: .01em;
	text-transform: uppercase; color: var(--sa-ink); text-decoration: none;
}
.sa-prodcard__name:hover { color: var(--sa-granata); text-decoration: none; }
.sa-prodcard__price { display: flex; align-items: baseline; gap: 6px; }

.sa-split { display: grid; grid-template-columns: 1fr 1fr; min-height: 520px; }
.sa-split__media { background: var(--sa-surface); overflow: hidden; }
.sa-split__media img { display: block; width: 100%; height: 100%; object-fit: cover; }
.sa-split__text {
	background: var(--sa-granata); color: #fff;
	display: flex; align-items: center;
	padding: 64px var(--sa-gutter);
}
.sa-split__inner { display: flex; flex-direction: column; gap: 22px; max-width: 460px; }
.sa-split__text .sa-h2 { color: #fff; }
.sa-split__text p { font: 400 15px/1.7 var(--sa-font); color: rgba(255,255,255,.72); margin: 0; }

.sa-trust { border-top: 1px solid var(--sa-line); border-bottom: 1px solid var(--sa-line); }
.sa-trust__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px; padding: 80px 0; }
.sa-trust__item { display: flex; align-items: center; gap: 16px; }
.sa-trust__item b { display: block; font: 600 12px/1.3 var(--sa-font); letter-spacing: .1em; text-transform: uppercase; color: var(--sa-ink); }
.sa-trust__item span span { display: block; font: 400 12px/1.5 var(--sa-font); color: var(--sa-gray); margin-top: 4px; }

/* =============================================================================
   Footer
   ========================================================================== */
.sa-footer { background: var(--sa-ink); color: #fff; }
.sa-footer a { color: rgba(255,255,255,.7); text-decoration: none; }
.sa-footer a:hover { color: #fff; text-decoration: none; }

.sa-footer__nl { border-bottom: 1px solid rgba(255,255,255,.12); }
.sa-footer__nl-inner {
	display: flex; align-items: center; justify-content: space-between;
	gap: 64px; padding: 56px 0;
}
.sa-footer__nl-text { display: flex; flex-direction: column; gap: 8px; max-width: 520px; }
.sa-footer__nl-text b { font: 700 26px/1.1 var(--sa-font); letter-spacing: -.01em; text-transform: uppercase; }
.sa-footer__nl-text span { font: 400 14px/1.6 var(--sa-font); color: rgba(255,255,255,.7); }
.sa-footer__nl form { display: flex; align-items: stretch; min-width: 460px; }
.sa-footer__nl input {
	flex: 1; height: 52px; padding: 0 18px;
	background: transparent; border: 1px solid rgba(255,255,255,.35);
	color: #fff; font: 400 14px/1 var(--sa-font); outline: none;
}
.sa-footer__nl input::placeholder { color: rgba(255,255,255,.55); }
.sa-footer__nl input:focus { border-color: #fff; }
.sa-footer__nl button {
	height: 52px; padding: 0 30px;
	background: var(--sa-granata); border: none; color: #fff;
	font: 600 12px/1 var(--sa-font); letter-spacing: .16em; text-transform: uppercase; cursor: pointer;
}
.sa-footer__nl button:hover { background: var(--sa-granata-light); }
.sa-footer__nl-msg { font: 400 13px/1.5 var(--sa-font); color: rgba(255,255,255,.75); margin-top: 10px; }

.sa-footer__cols { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 48px; padding: 64px 0; }
.sa-footer__brand { display: flex; flex-direction: column; gap: 24px; }
.sa-footer__brand img { display: block; height: 64px; width: auto; object-fit: contain; object-position: left; }
.sa-footer__brand p { font: 400 13px/1.7 var(--sa-font); color: rgba(255,255,255,.65); max-width: 280px; margin: 0; }
.sa-footer__social { display: flex; gap: 10px; }
.sa-footer__social a {
	width: 40px; height: 40px;
	display: flex; align-items: center; justify-content: center;
	border: 1px solid rgba(255,255,255,.25);
	color: #fff; font-size: 17px;
}
.sa-footer__social a:hover { background: var(--sa-granata); border-color: var(--sa-granata); color: #fff; }
.sa-footer__col { display: flex; flex-direction: column; gap: 16px; }
.sa-footer__col b {
	font: 600 11px/1 var(--sa-font); letter-spacing: .18em; text-transform: uppercase;
	color: #fff; padding-bottom: 8px; border-bottom: 1px solid rgba(255,255,255,.15);
}
.sa-footer__col a { font: 400 13px/1 var(--sa-font); }

.sa-footer__legal { border-top: 1px solid rgba(255,255,255,.12); }
.sa-footer__legal-inner {
	display: flex; align-items: center; justify-content: space-between;
	gap: 32px; padding: 24px 0;
}
.sa-footer__legal-inner > span {
	font: 400 11px/1.6 var(--sa-font); letter-spacing: .06em;
	text-transform: uppercase; color: rgba(255,255,255,.55);
}
.sa-footer__pay { display: flex; align-items: center; gap: 20px; }
.sa-footer__pay > span:first-child {
	font: 400 8px/1 var(--sa-font); letter-spacing: .14em;
	text-transform: uppercase; color: rgba(255,255,255,.45);
}
.sa-footer__pay em { font: 600 8px/1 var(--sa-font); letter-spacing: .1em; text-transform: uppercase; color: rgba(255,255,255,.55); font-style: normal; }
.sa-footer__pay img { display: block; height: 22px; width: auto; object-fit: contain; }

/* =============================================================================
   Adattamenti: tablet e telefono (sezione 1f del design)
   ========================================================================== */
@media (max-width: 1200px) {
	:root { --sa-gutter: 40px; }
	.sa-nav { gap: 18px; }
	.sa-nav a { font-size: 11px; letter-spacing: .1em; }
	.sa-header__inner { gap: 24px; }
}

@media (max-width: 992px) {
	.sa-catgrid, .sa-prodgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.sa-trust__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.sa-footer__cols { grid-template-columns: 1fr 1fr; }
	.sa-split { grid-template-columns: 1fr; }
	.sa-split__media img { height: 360px; }
	.sa-display { font-size: 48px; }
	.sa-h1 { font-size: 34px; }
	.sa-h2 { font-size: 24px; }
	.sa-hero { height: 480px; }
	.sa-nav { display: none; }
	.sa-burger { display: flex; }
	.sa-footer__nl-inner { flex-direction: column; align-items: flex-start; gap: 24px; }
	.sa-footer__nl form { min-width: 0; width: 100%; }
}

@media (max-width: 640px) {
	:root { --sa-gutter: 20px; }
	.sa-utilitybar__links { display: none; }
	.sa-utilitybar__claim { font-size: 10px; letter-spacing: .1em; }
	.sa-header__inner { height: 68px; }
	.sa-header__brand img { height: 40px; }
	.sa-header__brandtext { display: none; }
	.sa-cartbtn__label { display: none; }
	.sa-cartbtn { padding: 0 12px; }
	.sa-hero { height: 420px; }
	.sa-display { font-size: 38px; }
	.sa-section { padding: 48px 0; }
	.sa-section__head { flex-direction: column; align-items: flex-start; gap: 16px; margin-bottom: 24px; }
	.sa-prodgrid { gap: 24px 12px; }
	.sa-catgrid { gap: 12px; }
	.sa-footer__cols { grid-template-columns: 1fr; gap: 32px; }
	.sa-footer__legal-inner { flex-direction: column; align-items: flex-start; gap: 16px; }
	.sa-trust__grid { grid-template-columns: 1fr; gap: 20px; padding: 28px 0; }
	.sa-split__text { padding: 40px var(--sa-gutter); }
}

/* --- widget newsletter dentro la fascia scura del footer ------------------ */
/* Il widget (include/newsletter.php) resta quello funzionante, con il consenso
   esplicito richiesto dal doppio opt-in: qui viene solo rivestito. */
.sa-footer__nlwidget { min-width: 460px; max-width: 520px; color: #fff; }
.sa-footer__nlwidget .widget-title { display: none; }          /* il titolo lo da' gia' la fascia */
.sa-footer__nlwidget .form-control {
	height: 52px; padding: 0 18px;
	background: transparent; border: 1px solid rgba(255,255,255,.35); border-radius: 0;
	color: #fff; font: 400 14px/1 var(--sa-font); box-shadow: none;
}
.sa-footer__nlwidget .form-control::placeholder { color: rgba(255,255,255,.55); }
.sa-footer__nlwidget .form-control:focus { border-color: #fff; background: transparent; color: #fff; }
.sa-footer__nlwidget .checkbox-nl label { color: rgba(255,255,255,.7); }
.sa-footer__nlwidget .checkbox-nl a { color: #fff; }
.sa-footer__nlwidget #submitButton {
	height: 52px; padding: 0 30px; margin-top: 14px;
	background: var(--sa-granata); border: none; border-radius: 0;
	color: #fff; font: 600 12px/1 var(--sa-font); letter-spacing: .16em; text-transform: uppercase;
}
.sa-footer__nlwidget #submitButton:hover { background: var(--sa-granata-light); }

/* Il vecchio contenitore del footer non deve piu' mettere bocca sull'aspetto */
#MainFooter { background: none; border: none; margin-top: 0 !important; padding-bottom:0 !important;}
#MainFooter .sa-footer { margin: 0; padding-bottom:0 !important; }

@media (max-width: 992px) {
	.sa-footer__nlwidget { min-width: 0; max-width: none; width: 100%; }
}

/* =============================================================================
   Card prodotto nelle liste (listBox in include/list_functions.php)
   Le regole sono su selettori composti perche' devono avere la meglio su
   .itemBox e .imgbox di main.min.css.
   ========================================================================== */
.sa-prodcard.itemBox {
	padding: 0 0 24px;
	display: flex;
	flex-direction: column;
	gap: 14px;
	background: var(--sa-bg);
	font-family: var(--sa-font);
}
.sa-prodcard .imgbox.sa-prodcard__media {
	position: relative;
	height: auto;
	aspect-ratio: 4/5;
	background: var(--sa-surface);
	overflow: hidden;
}
.sa-prodcard .sa-prodcard__media > a,
.sa-prodcard .sa-prodcard__media .carousel,
.sa-prodcard .sa-prodcard__media .flickity-viewport,
.sa-prodcard .sa-prodcard__media .carousel-cell {
	width: 100%;
	height: 100%;
}
/* SA27.01 (Jordan, 14/09/2026): le frecce del carosello (piu' di una foto) non avevano
   z-index, quindi restavano sotto l'overlay "Vai al prodotto" (.sa-prodcard__hover,
   z-index:2): il click ci finiva sempre sopra e portava alla scheda invece di cambiare
   foto. Verificato con un click reale nel browser (elementFromPoint sul centro della
   freccia restituiva l'overlay, non il bottone). */
.sa-prodcard .sa-prodcard__media .flickity-prev-next-button { z-index: 4; }
.sa-prodcard .sa-prodcard__media img {
	display: block;
	width: 100%;
	height: 100%;
	max-width: 100%;
	object-fit: cover;
}
.sa-prodcard .sa-prodcard__media .picNotFound {
	display: flex; flex-direction: column; align-items: center; justify-content: center;
	height: 100%; gap: 10px;
	font: 400 12px/1.4 var(--sa-font); color: var(--sa-gray); text-align: center;
}
.sa-prodcard .sa-prodcard__media .picNotFound img { width: auto; height: auto; object-fit: contain; }

.sa-prodcard__badges {
	position: absolute; top: 0; left: 0; z-index: 3;
	display: flex; flex-direction: column; align-items: flex-start; gap: 4px;
}
.sa-prodcard .toFavouriteButton {
	position: absolute; top: 10px; right: 10px; z-index: 3;
	color: var(--sa-ink); font-size: 18px; cursor: pointer;
	opacity: 0; transition: opacity .2s ease;
}
.sa-prodcard:hover .toFavouriteButton,
.sa-prodcard .toFavouriteButton.fa-heart { opacity: 1; }

.sa-prodcard__hover {
	position: absolute; inset: 0; z-index: 2;
	display: flex; align-items: flex-end; justify-content: center;
	padding: 20px; opacity: 0; transition: opacity .25s ease;
	text-decoration: none;
}
.sa-prodcard:hover .sa-prodcard__hover { opacity: 1; }
.sa-prodcard__hover span {
	background: #fff; color: var(--sa-ink);
	font: 600 11px/1 var(--sa-font); letter-spacing: .18em; text-transform: uppercase;
	padding: 14px 26px; border: 1px solid var(--sa-ink);
}

.sa-prodcard__body { display: flex; flex-direction: column; gap: 6px; padding-right: 8px; }
.sa-prodcard .productTitle { display: block; margin: 0; padding: 0; }
.sa-prodcard a.itemName.sa-prodcard__name {
	display: block;
	font: 500 15px/1.3 var(--sa-font);
	letter-spacing: .01em; text-transform: uppercase;
	color: var(--sa-ink); text-decoration: none;
}
.sa-prodcard a.itemName.sa-prodcard__name:hover { color: var(--sa-granata); text-decoration: none; }
.sa-prodcard__note { font: 400 11px/1.4 var(--sa-font); color: var(--sa-gray); margin: 0; }

.sa-prodcard .priceblock.sa-prodcard__price { margin: 0; padding: 0; }
.sa-prodcard.itemBox .itemPrice {
	display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px;
	font: 600 17px/1 var(--sa-font); color: var(--sa-ink);   /* il prezzo non e' mai granata */
	line-height: 1;
	padding: 0; margin: 0;
}
.sa-prodcard.itemBox .itemPriceList {
	font: 400 13px/1 var(--sa-font); color: #9A9A9A; text-decoration: line-through;
}
.sa-prodcard.itemBox .itemDiscountPerc {
	background: var(--sa-ink); color: #fff;
	font: 600 10px/1 var(--sa-font); letter-spacing: .1em;
	padding: 5px 7px; border-radius: 0;
}
.sa-prodcard.itemBox .itemOffer {
	font: 400 11px/1.4 var(--sa-font); color: var(--sa-granata);
	text-transform: uppercase; letter-spacing: .08em;
}

@media (max-width: 640px) {
	.sa-prodcard.itemBox { padding-bottom: 16px; gap: 10px; }
	.sa-prodcard a.itemName.sa-prodcard__name { font-size: 13px; }
	.sa-prodcard.itemBox .itemPrice { font-size: 15px; }
	.sa-prodcard .toFavouriteButton { opacity: 1; }
}

/* =============================================================================
   Pagina categoria (sezione 1c del design)
   ========================================================================== */
.sa-listing__head.CategoryHeader { margin: 0 0 32px; padding: 32px 0 0; }

.sa-crumbs {
	display: flex; align-items: center; flex-wrap: wrap; gap: 8px;
	margin-bottom: 22px;
	font: 500 11px/1 var(--sa-font); letter-spacing: .14em; text-transform: uppercase;
	color: var(--sa-gray);
}
.sa-crumbs a { color: var(--sa-gray); text-decoration: none; }
.sa-crumbs a:hover { color: var(--sa-granata); text-decoration: none; }
.sa-crumbs [aria-current="page"] { color: var(--sa-ink); }

.listingTitle.sa-listing__title {
	display: flex; align-items: flex-end; flex-wrap: wrap; gap: 16px;
	padding: 0; margin: 0 0 8px;
	border: none; font-size: inherit; text-transform: none;
}
.sa-listing__title .sa-h1 { margin: 0; }
.sa-listing__count {
	font: 400 13px/1 var(--sa-font); color: var(--sa-gray);
	padding-bottom: 4px;
}
.listingOrderSelect.sa-listing__order { margin-left: auto; float: none; }
.sa-listing__order select.form-control {
	height: 44px; padding: 0 34px 0 16px;
	border: 1px solid var(--sa-line); border-radius: 2px;
	background-color: #fff; box-shadow: none;
	font: 600 12px/1 var(--sa-font); letter-spacing: .1em; text-transform: uppercase;
	color: var(--sa-ink); cursor: pointer;
}
.sa-listing__order select.form-control:focus { border-color: var(--sa-ink); box-shadow: none; }

.sa-listing__head .CategoryDescription {
	font: 400 15px/1.7 var(--sa-font); color: var(--sa-gray);
	max-width: 760px; margin-top: 12px;
}

/* la griglia resta quella di bootstrap: qui si regolano solo respiro e linee */
.listingArea.row { margin-top: 8px; }
.listingArea.row > .itemBox { margin-bottom: 16px; }

/* barra dei filtri (il cassetto #mainFilter resta quello esistente) */
.filter-wrapper #toggleFilters {
	font: 600 12px/1 var(--sa-font) !important;
	letter-spacing: .12em; text-transform: uppercase; color: var(--sa-ink);
	border: 1px solid var(--sa-line); padding: 14px 22px; margin-left: 0 !important;
}
.filter-wrapper #toggleFilters:hover { border-color: var(--sa-ink); }
.filter-chip, .filter-summary-chip {
	border-radius: 2px !important;
	font-family: var(--sa-font) !important;
}

@media (max-width: 640px) {
	.sa-listing__head.CategoryHeader { padding-top: 16px; margin-bottom: 20px; }
	.listingTitle.sa-listing__title { gap: 8px; }
	.listingOrderSelect.sa-listing__order { margin-left: 0; width: 100%; }
	.sa-listing__order select.form-control { width: 100%; }
}

/* --- paginazione (PaginationNav in list_functions.php) -------------------- */
.PaginationNav {
	display: flex; align-items: center; justify-content: center; flex-wrap: wrap;
	gap: 16px; padding: 40px 0;
	font: 400 12px/1 var(--sa-font); letter-spacing: .1em; text-transform: uppercase;
	color: var(--sa-gray);
}
.PaginationNav .pagesList { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.PaginationNav .pageLink { text-decoration: none; }
.PaginationNav .page {
	min-width: 44px; height: 44px;
	display: flex; align-items: center; justify-content: center;
	padding: 0 12px;
	border: 1px solid var(--sa-line); background: #fff;
	font: 600 12px/1 var(--sa-font); letter-spacing: .06em; color: var(--sa-ink);
	transition: border-color .2s ease, background .2s ease, color .2s ease;
}
.PaginationNav .pageLink:hover .page { border-color: var(--sa-ink); }
.PaginationNav .page.currentpage {
	background: var(--sa-ink); border-color: var(--sa-ink); color: #fff;
}
.PaginationNav .pageLabel { line-height: 1; }

@media (max-width: 640px) {
	.PaginationNav { gap: 10px; padding: 24px 0; flex-direction: column; }
	.PaginationNav .page { min-width: 38px; height: 38px; padding: 0 8px; }
}

/* =============================================================================
   SA27.01 - Convivenza con il tema ereditato (main.min.css)
   -----------------------------------------------------------------------------
   Il bundle vecchio usa selettori con ID (specificita' 100) e alcune !important:
   le classi sa- da sole non bastano a scavalcarli. Qui si spengono, una per una,
   le regole del vecchio tema che combattono con il disegno 2027. Ogni blocco dice
   quale regola sta neutralizzando, cosi' quando main.min.css verra' ripulito
   sara' chiaro che cosa si puo' togliere da qui.
   ========================================================================== */

/* main.min.css: #up_menu{background-color:#f5f5f5;position:fixed;top:0;z-index:1000}
   La barra di servizio del disegno e' granata e sta nel flusso della pagina. */
#up_menu.sa-utilitybar {
	position: static;
	top: auto;
	z-index: auto;
	width: auto;
	background: var(--sa-granata);
	background-color: var(--sa-granata);
}

/* main.min.css: #mainHeader{position:fixed;text-align:center;background:linear-gradient(...#344556...);padding:0 0 16px}
   La testata nuova ha fondo bianco, testo allineato a sinistra e sta nel flusso. */
#mainHeader {
	position: relative;
	width: auto;
	padding: 0;
	background: #fff;
	background-image: none;
	text-align: left;
	z-index: auto;
}

/* main.min.css: #mainHeader #HeaderButtonsRight{position:absolute;right:15px;top:10px}
   -> i pulsanti finivano fuori dalla riga e "Carrello" veniva tagliato. */
#mainHeader #HeaderButtonsRight.sa-header__actions {
	position: static;
	right: auto;
	top: auto;
	margin: 0 0 0 8px;
}

/* main.min.css: #siteContent{margin-top:142px} / {margin-top:112px} / {margin-top:212px!important}
   Serviva a compensare la testata a posizione fissa: ora non c'e' piu' nulla da compensare. */
#siteContent { margin-top: 0 !important; }

/* main.min.css: #MainContainer{padding:20px;margin:9px auto} e #MainContainerContent{padding-top:55px} */
#MainContainer { padding: 0; margin: 0 auto; }
#MainContainerContent { padding-top: 0; }

/* Il pulsante del menu a scomparsa serve solo sotto i 992px: sopra c'e' la navigazione. */
#mainHeader #trigger { display: none; }
@media (max-width: 992px) {
	#mainHeader #trigger {
		display: block;
		position: absolute;
		left: 16px;
		top: 22px;
		margin: 0;
		z-index: 5;
	}
	.sa-header__inner { padding-left: 68px; }
}

/* --- card prodotto ------------------------------------------------------- */

/* main.min.css: .productTitle{display:-webkit-box;-webkit-line-clamp:2;height:68px}
   -> lasciava un buco fisso di 68px fra foto e nome. */
.sa-prodcard .productTitle {
	display: block;
	height: auto;
	overflow: visible;
	-webkit-line-clamp: initial;
}

/* SA27.01 (Jordan 15/09/2026): prezzo centrato in ogni card, in tutte le liste
   (categoria, ricerca, preferiti, vetrina in home, Completa il kit). */
.sa-prodcard.itemBox .itemPrice { justify-content: center; text-align: center; }
.sa-prodcard .priceblock.sa-prodcard__price { width: 100%; justify-content: center; } /* il contenitore e' flex (riga 280): centra il figlio .itemPrice */
.sa-prodcard.itemBox .itemPrice .itemOffer { text-align: center; }

/* main.min.css: .priceblock{background:#e2e2e2;border-radius:5px;float:right;padding:5px}
   e .priceblock{width:fit-content;margin:20px auto 0} -> pillola grigia centrata. */
.sa-prodcard .priceblock.sa-prodcard__price {
	background: none;
	border-radius: 0;
	float: none;
	width: auto;
	margin: 0;
	padding: 0;
}

/* main.min.css: .itemBox .toFavouriteButton{display:none;border-radius:50%;width:40px;height:40px}
   e .itemBox:hover .toFavouriteButton{display:block} -> qui il cuore e' un'icona semplice. */
.sa-prodcard .toFavouriteButton,
.sa-prodcard:hover .toFavouriteButton {
	display: block;
	width: auto;
	height: auto;
	padding: 0;
	border-radius: 0;
	text-align: right;
}

/* --- testata della lista -------------------------------------------------- */

/* main.min.css: .listingTitle{width:100%;display:block;font-size:30px;font-weight:600}
   e .listingOrderSelect{float:right;margin-top:5px} */
.listingTitle.sa-listing__title {
	width: 100%;
	font-size: inherit;
	font-weight: inherit;
	color: inherit;
}
.sa-listing__title > .sa-h1 { flex: 0 1 auto; width: auto; }
.sa-listing__title > .sa-listing__count { flex: 0 0 auto; }
.listingOrderSelect.sa-listing__order { float: none; margin-top: 0; width: auto; flex: 0 0 auto; }

/* main.min.css: .CategoryHeader{border-bottom:1px solid silver;padding-bottom:10px} */
.CategoryHeader.sa-listing__head {
	border-bottom: 1px solid var(--sa-line);
	padding-bottom: 24px;
}

/* Le etichette della navigazione non vanno spezzate a meta' parola. */
.sa-nav a { white-space: nowrap; }
@media (max-width: 1400px) { .sa-nav { gap: 18px; } .sa-nav a { letter-spacing: .08em; } }

/* =============================================================================
   SA27.01 - Correzioni richieste da Jordan (11/09/2026, msg 577416 e 577418)
   ========================================================================== */

/* --- testata: margine, bordo e colore del tema vecchio ---------------------
   main.min.css: #mainHeader{margin:72px 0 20px;border-bottom:1px solid #1c285c}
                 #mainHeader{color:#1c285c!important}  .height-nav{height:67px} */
#mainHeader,
#mainHeader.height-nav {
	margin: 0 !important;
	height: auto !important;
	border: 0 !important;
	color: var(--sa-ink) !important;
}

/* --- menu principale centrato fra marchio e pulsanti ------------------------ */
.sa-nav {
	flex: 1 1 auto;
	justify-content: center;
	margin-left: 0;
	min-width: 0;
}

/* --- icone a 19px: main.min.css ha svg{width:1.8em;height:1.8em;fill:#fff} e
       #mainAccountIcon,#mainLoginIcon,#openSearchButton{float:right;font-size:25px} */
#mainHeader .sa-iconbtn,
#mainHeader #openSearchButton,
#mainHeader #mainAccountIcon,
#mainHeader #mainLoginIcon {
	float: none;
	margin: 0;
	font-size: 0;
	line-height: 0;
	width: 44px;
	height: 44px;
}
.sa-header svg,
#mainHeader .sa-iconbtn svg,
#mainHeader .sa-cartbtn svg {
	width: 19px;
	height: 19px;
	fill: none;
}
#mainHeader .sa-cartbtn svg { width: 18px; height: 18px; }

/* --- pulsante carrello come nel disegno: main.min.css lo faceva diventare un
       cerchio bianco da 38px (#mainCartIcon{width:38px;border-radius:50%;background:#fff})
       con il contatore blu in posizione assoluta (#cartCount) e testo #222 !important. */
#mainHeader #mainCartIcon.sa-cartbtn {
	position: static;
	float: none;
	width: auto;
	height: 44px;
	margin: 0;
	padding: 0 16px;
	border-radius: 0;
	background: var(--sa-ink);
	background-color: var(--sa-ink);
	font-size: 12px;
	line-height: 1;
	color: #fff !important;
}
#mainHeader #mainCartIcon.sa-cartbtn:hover { background: var(--sa-granata); background-color: var(--sa-granata); }
#mainHeader .sa-cartbtn .sa-cartbtn__label { color: #fff !important; }
#mainHeader #cartCount.sa-cartbtn__qty {
	position: static;
	top: auto;
	left: auto;
	width: auto;
	min-width: 20px;
	height: 20px;
	border-radius: 0;
	background: #fff;
	color: var(--sa-ink) !important;
	font-size: 11px;
	line-height: 1;
	vertical-align: baseline;
}

/* --- preferiti e selettore lingua/paese nascosti per ora ------------------- */
.sa-utilitybar .langSelectHeaderContainer,
.sa-utilitybar .sa-utilitybar__sep { display: none; }

/* --- palette: il blu PGN #1c285c del tema vecchio diventa granata ---------- */
a { color: var(--sa-granata); }
a:hover { color: var(--sa-granata-dark); }
.btn { background-color: var(--sa-granata); }
/* velo delle finestre/caricamento (Jordan, 14/09/2026): ink al 30% */
#fade { background-color: var(--sa-ink); opacity: .3; }
.btn:hover, .btn:active,
#CountrySettings .btn:hover { background-color: var(--sa-granata-light) !important; color: #fff !important; }
#CountrySettings .shopLightboxTitle,
#searchLightBox .shopLightboxTitle,
#AccountLightbox .shopLightboxTitle,
#AccountLightbox .shopLightbox,
#accountArea .accountBox .accountBoxTitle,
.order-box-header,
.cartStepButtonActive .cartStepNumber,
.cartStepButtonActive .cartStepNumberLabel { background-color: var(--sa-granata) !important; }
.cartStepButtonActive,
.cartStepNumber,
.cartStepButtonActive .cartStepNumberLabel,
.langSelectFooter,
.shopLightbox,
#searchLightBox .searchButton,
.cat_box_title,
#CategoriesCarousel h4,
.ShareBoxTitle,
.shippingInfos .cart-info-text,
.removeFromCartButton:hover { color: var(--sa-granata) !important; }
.OrderCartRow, .OrderTitle,
.OrderCol.CartTotCol,
.OrderCol.CartTotCol .OrderTitle,
.shippingInfos .selectShippingAddressBox.selectedAddress,
.cartStepButtonActive .cartStepNumberLabel { border-color: var(--sa-granata) !important; }
.AccountLightboxRow { border-bottom-color: rgba(104, 26, 18, .16); }
#MainContainer .fa-heart, #MainContainer .fa-heart-o { color: var(--sa-granata); }

/* --- bottoni granata: in hover granata piu' chiaro, mai nero ---------------- */
.sa-btn--primary:hover, .sa-btn--primary:focus { background: var(--sa-granata-light); }
.sa-footer__nl button:hover,
.sa-footer__nlwidget #submitButton:hover,
.sa-footer__nlwidget #submitButton:active { background: var(--sa-granata-light) !important; background-color: var(--sa-granata-light) !important; }
.sa-footer__nlwidget #submitButton { background-color: var(--sa-granata) !important; border-radius: 0 !important; }

/* =============================================================================
   SA27.01 - Home, richieste di Jordan (11/09/2026, msg 577442)
   ========================================================================== */

/* Hero a tutto schermo: la sezione sta dentro una colonna bootstrap e nel contenitore
   del vecchio tema, quindi si allarga da sola fino ai bordi della finestra. */

/* Barra di rassicurazione su fondo chiaro, a tutto schermo come la hero. */
.sa-trust {
	background: var(--sa-surface);
	border-top: 0;
	border-bottom: 0;
}

/* Sezione prodotti della home (card della categoria in griglia, stessa larghezza di
   "Acquista per linea"). */
.sa-featured .sa-prodgrid { margin-top: 8px; }
.sa-featured .noResultsText { font: 400 15px/1.6 var(--sa-font); color: var(--sa-gray); }

/* =============================================================================
   SA27.01 - Terza tornata di Jordan (11/09/2026, msg 577462 e 577465)
   ========================================================================== */

/* Home senza padding laterale: header.php apre #MainContainerContent come colonna
   bootstrap (15px per lato) e dentro ci sta il contenitore della home. Il contenitore
   della home annulla quei 15px, cosi' hero, "Maglie match worn" e barra di
   rassicurazione arrivano ai bordi della finestra e le altre sezioni si allineano con
   .sa-container. Le pagine interne non cambiano. */
/* 14/09/2026: la colonna la apre header.php gia' con le classi del disegno (index.php ne
   apriva una seconda, larga il 100% di quella esterna e spostata di -15px: 30px vuoti a
   destra dalla hero al footer). #MainContainer non ha piu' i margini negativi della .row,
   quindi alla colonna basta togliere il padding: e' larga tutta la finestra. */
#MainContainerContent.sa-scope {
	padding: 0 !important;
	float: none;
	width: 100%;
}

/* header.php mette #mainHeader in display:flex (Jordan): la testata deve restare
   larga tutta la riga, altrimenti il bordo inferiore si ferma al contenuto. */
#mainHeader > .sa-header,
#mainHeader .sa-header { width: 100%; flex: 1 1 100%; }

/* Voci del menu su due righe ("Kit / Gara", "Maglie Match / Worn"): l'a capo e' un
   <br class="sa-nav__br"> che esiste solo nella testata, quindi solo su desktop. */
.sa-nav a {
	display: flex;
	align-items: center;
	text-align: center;
	height: 88px;
	padding: 0;
	line-height: 1.25;
}
.sa-nav a .sa-nav__br { display: inline; }

/* SA27.01 - Consenso newsletter (screenshot 477423, Jordan 15/09/2026). La casella prendeva
   l'altezza 52px di ".sa-footer__nl input" e alzava la prima riga: qui e' una riga flex con
   la casella da 14px allineata alla prima riga e il testo su righe strette. */
.sa-footer__nlwidget .checkbox-nl {
	display: flex !important; align-items: flex-start; gap: 10px;
	width: 100%; margin: 12px 0 0 !important; line-height: 1.45;
}
.sa-footer__nl .checkbox-nl input[type="checkbox"], .sa-footer__nlwidget .checkbox-nl input[type="checkbox"] {
	flex: 0 0 auto; width: 14px; height: 14px; min-height: 0; margin: 3px 0 0 !important; padding: 0;
	accent-color: var(--sa-granata); vertical-align: top; cursor: pointer;
}
.sa-footer__nlwidget .checkbox-nl label {
	display: block !important; margin: 0; flex: 1 1 auto;
	font: 400 12px/1.45 var(--sa-font) !important; color: rgba(255,255,255,.85);
}
.sa-footer__nlwidget .checkbox-nl label a { color: #fff; text-decoration: underline; text-underline-offset: 2px; }

/* =============================================================================
   SA27.01 - Quarta tornata di Jordan (11/09/2026, msg 577472)
   ========================================================================== */

/* Card a immagine singola (modalita' noCarousel di listBox): main.min.css la
   centrava con padding e position:sticky, qui la foto riempie il riquadro. */
.sa-prodcard.noCarousel .imgbox.sa-prodcard__media { padding: 0; text-align: left; }
.sa-prodcard.noCarousel .imgbox.sa-prodcard__media img { position: static; top: auto; max-height: none; }

/* Pagina categoria (e ricerca, preferiti, marca): la lista e la barra dei filtri
   stanno nello stesso contenitore da 1380px delle sezioni della home. */
#MainContainer > .filter-wrapper,
#MainContainerContent > #listingContainer {
	box-sizing: border-box;
	width: 100%;
	max-width: var(--sa-container);
	margin-left: auto;
	margin-right: auto;
	padding-left: var(--sa-gutter);
	padding-right: var(--sa-gutter);
}
#MainContainer > .filter-wrapper { margin-top: 24px; }
@media (max-width: 640px) {
	#MainContainer > .filter-wrapper,
	#MainContainerContent > #listingContainer { padding-left: 10px; padding-right: 10px; }
}

/* =============================================================================
   SA27.01 - Pagina categoria: filtri fissi a 1/4, lista a 3/4 (Jordan, msg 577476)
   -----------------------------------------------------------------------------
   Solo CSS: PHP e JavaScript del cassetto non cambiano (il pulsante "Filtri", l'overlay
   e il ricaricamento del pannello dopo ogni filtro continuano a funzionare). Sotto i
   992px resta il cassetto laterale di oggi. Gli stili del cassetto stanno in linea in
   header.php (#mainFilter position:fixed, left:-1000px, width:400px...): qui vengono
   scavalcati con selettori piu' specifici. #MainContainer:has(> #mainFilter) individua
   le sole pagine con i filtri; i browser senza :has() tengono il cassetto.
   ========================================================================== */
@media (min-width: 992px) {

	/* Il contenitore della pagina categoria e' una griglia a due colonne (25% / 75%)
	   larga come le sezioni della home. I contenitori intermedi della lista
	   (#MainContainerContent > #listingContainer > #listingContainerContent) passano a
	   display:contents: esistono ancora nel DOM (il ricaricamento AJAX li sostituisce
	   come prima) ma non generano un riquadro, quindi la testata della categoria e la
	   griglia dei prodotti diventano celle dirette e si possono disporre come nel mockup:
	   pillole dei filtri | testata a tutta larghezza | pannello + lista. */
	#MainContainer:has(> #mainFilter) {
		box-sizing: border-box;
		max-width: var(--sa-container);
		margin: 0 auto;
		padding: 0 var(--sa-gutter);
		display: grid;
		grid-template-columns: minmax(0, 25fr) minmax(0, 75fr);
		column-gap: 32px;
		align-items: start;
	}
	#MainContainer:has(> #mainFilter) > .filter-wrapper {
		grid-column: 1 / -1;
		grid-row: 1;
		max-width: none;
		padding: 0;
		margin: 24px 0 8px !important;
	}
	/* su desktop il pannello e' sempre visibile: il pulsante di apertura non serve */
	#MainContainer:has(> #mainFilter) > .filter-wrapper > #toggleFilters { display: none !important; }
	#MainContainer:has(> #mainFilter) > .filter-wrapper > #filter-summary-container { margin-left: 0 !important; }
	#MainContainer:has(> #mainFilter) > #overlay { display: none !important; }

	/* header.php: #mainFilter{position:fixed;top:0;left:-1000px;width:400px;height:100%;...} */
	#MainContainer:has(> #mainFilter) > #mainFilter,
	#MainContainer:has(> #mainFilter) > #mainFilter.active {
		grid-column: 1;
		grid-row: 3;
		position: static;
		top: auto;
		left: auto;
		z-index: auto;
		width: auto;
		max-width: none;
		height: auto;
		overflow: visible;
		padding: 0;
		border-right: 0;
		background: transparent;
		transition: none;
		box-sizing: border-box;
	}
	#MainContainer:has(> #mainFilter) > #MainContainerContent,
	#MainContainer:has(> #mainFilter) > #MainContainerContent > #listingContainer,
	#MainContainer:has(> #mainFilter) > #MainContainerContent > #listingContainer > #listingContainerContent {
		display: contents;
	}
	/* testata della categoria: tutta la riga, sopra pannello e lista */
	#MainContainer:has(> #mainFilter) #listingContainerContent > .CategoryHeader {
		grid-column: 1 / -1;
		grid-row: 2;
		margin: 0 0 32px;
		padding-top: 0;
	}
	/* tutto il resto della lista (griglia, paginazione, nessun risultato) nella colonna destra */
	#MainContainer:has(> #mainFilter) #listingContainerContent > :not(.CategoryHeader) {
		grid-column: 2;
		min-width: 0;
	}
	#MainContainer:has(> #mainFilter) .listingArea.row { margin-left: -8px; margin-right: -8px; }
	#MainContainer:has(> #mainFilter) .listingArea.row > .itemBox { padding-left: 8px; padding-right: 8px; }

	/* intestazione "Filtra per" con la x: serve solo al cassetto su telefono */
	#MainContainer:has(> #mainFilter) #mainFilter .mainFilterArea:has(> div > #closeMainFiltersBtn) { display: none; }
}

/* --- aspetto del pannello (vale anche nel cassetto su telefono) ------------ */
#mainFilter .mainFilterTitle {
	font: 600 11px/1 var(--sa-font);
	letter-spacing: .2em;
	text-transform: uppercase;
	color: var(--sa-granata);
	padding: 0 0 12px;
	margin: 0 0 16px;
	border-bottom: 1px solid var(--sa-line);
}
#mainFilter > .mainFilterTitle {          /* "Filtri", con l'icona: intestazione del pannello */
	font: 700 13px/1 var(--sa-font);
	letter-spacing: .16em;
	color: var(--sa-ink);
	border-bottom: 2px solid var(--sa-ink);
	margin-bottom: 24px;
	cursor: pointer;
}
#mainFilter .mainFilterArea { margin-bottom: 28px; }
#mainFilter .mainFilterArea:empty { display: none; }
#mainFilter .mainFilterSubTitle {
	font: 600 12px/1 var(--sa-font) !important;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--sa-ink);
	padding: 10px 0 !important;
}
#mainFilter .mainFilterItem { font: 400 14px/1.5 var(--sa-font); color: var(--sa-ink); padding: 5px 0; cursor: pointer; }
#mainFilter .mainFilterItem:hover { color: var(--sa-granata); }
#mainFilter #priceRange,
#mainFilter .inputRangeText {
	border: 0;
	background: transparent;
	padding: 0;
	margin: 0 0 6px;
	width: 100%;
	font: 600 14px/1 var(--sa-font);
	color: var(--sa-ink);
}
#mainFilter #slider-range { margin: 14px 10px 6px !important; background: var(--sa-line) !important; border-radius: 0 !important; }
#mainFilter #slider-range .ui-slider-range { background: var(--sa-granata) !important; border-radius: 0 !important; }
#mainFilter #slider-range .ui-slider-handle {
	background: #fff !important;
	border: 2px solid var(--sa-granata) !important;
	border-radius: 0 !important;
	width: 18px !important;
	height: 18px !important;
	top: -6px !important;
}
.filter-chip {
	font: 600 11px/1 var(--sa-font) !important;
	letter-spacing: .1em;
	text-transform: uppercase;
	border: 1px solid var(--sa-line) !important;
	border-radius: 2px !important;
	background: #fff !important;
	color: var(--sa-ink) !important;
}

/* --- pulsanti del pannello filtri (stili in linea in filter_mgr.php) ---------- */
#mainFilter #applyFiltersBtn {
	background: var(--sa-granata) !important;
	border-radius: 0 !important;
	font: 600 12px/1 var(--sa-font) !important;
	letter-spacing: .14em;
	text-transform: uppercase;
	padding: 16px 12px !important;
}
#mainFilter #applyFiltersBtn:hover { background: var(--sa-granata-light) !important; }
#mainFilter #resetFiltersBtn {
	background: #fff !important;
	border: 1px solid var(--sa-line) !important;
	border-radius: 0 !important;
	color: var(--sa-ink) !important;
}
#mainFilter #resetFiltersBtn:hover { border-color: var(--sa-ink) !important; }
.itemBox:hover,.listItem:hover{box-shadow:none !important;}

/* =============================================================================
   SA27.01 - Scheda prodotto (sezione 1d del disegno; Jordan, 14/09/2026)
   Struttura in product.php: .sa-pdp-page > #ProductDetails.sa-pdp (galleria | informazioni)
   + .sa-pdp__related ("Completa il kit"). Le classi del motore (#priceBlocks, .VariantBox,
   .addtocart, .AvailLabel, .itemCode...) restano: il JS di checkVariant le usa.
   ========================================================================== */
.sa-pdp-page {
	max-width: var(--sa-container);
	margin: 0 auto;
	padding: 28px var(--sa-gutter) 0;
	font-family: var(--sa-font);
	color: var(--sa-ink);
}
.sa-pdp-page .sa-crumbs { margin-bottom: 28px; }
#ProductDetails.sa-pdp > .sa-pdp__crumbs { grid-column: 1 / -1; margin-bottom: 4px; }

#ProductDetails.sa-pdp {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 456px;
	gap: 64px;
	align-items: start;
	max-width: none; margin: 0; padding: 0;
}
/* fade (Jordan, 14/09/2026): opacity .3 e colore ink, sia sul caricamento della variante
   sia sulle taglie esaurite */
#ProductDetails.sa-pdp.sa-pdp--loading .sa-pdp__pricerow,
#ProductDetails.sa-pdp.sa-pdp--loading .sa-pdp__buy { opacity: .3; pointer-events: none; }

/* --- galleria: miniature a sinistra, immagine grande a destra ------------------- */
.sa-pdp__gallery { display: grid; grid-template-columns: 88px minmax(0, 1fr); gap: 16px; align-items: start; }
.sa-pdp__gallery.sa-pdp__gallery--nothumbs { grid-template-columns: minmax(0, 1fr); }
.sa-pdp__thumbs { display: flex; flex-direction: column; gap: 12px; }
.sa-pdp__thumb {
	display: block; width: 100%; aspect-ratio: 4/5; padding: 0;
	background: #fff; border: 1px solid var(--sa-line);
	cursor: pointer; overflow: hidden; border-radius: 0;
}
.sa-pdp__thumb:hover { border-color: var(--sa-gray); }
.sa-pdp__thumb.is-active { border-color: var(--sa-ink); }
.sa-pdp__thumb img { display: block; width: 100%; height: 100%; object-fit: cover; }

/* le foto prodotto sono su fondo bianco: il riquadro 4/5 resta bianco per non incorniciarle */
.sa-pdp__main { position: relative; background: #fff; }
#product_images_container.sa-pdp__gallery { position: static; }
#product_images_container .imgBadgesStackProduct { top: 0; left: 0; gap: 0; z-index: 5; }
#product_images_container .imgBadgesStackProduct .imgBadge {
	font: 600 10px/1 var(--sa-font); letter-spacing: .16em; text-transform: uppercase;
	padding: 9px 12px; border-radius: 0; background: var(--sa-granata); color: #fff;
}
#product_images_container .imgBadgesStackProduct .imgBadge-discount { background: var(--sa-ink); }
/* il carosello (flickity) resta: le celle prendono le proporzioni 4/5 del disegno */
#ProductDetails .sa-pdp__main #product_images { position: static; width: auto; max-width: none; height: auto !important; left: auto; }
#ProductDetails .sa-pdp__main .carousel-cell,
#ProductDetails .sa-pdp__main .carousel-cell-container {
	width: 100% !important; height: auto !important; aspect-ratio: 4/5; margin: 0;
	display: flex; align-items: center; justify-content: center;
}
#ProductDetails .sa-pdp__main .carousel-cell.flickity-lazyloaded { width: 100% !important; margin: 0; }
#ProductDetails .sa-pdp__main .carousel-cell-image {
	position: static; transform: none; right: auto;
	width: 100%; height: 100%; max-height: none; object-fit: contain; cursor: zoom-in;
}
/* l'altezza della viewport la scrive flickity in linea (= altezza della cella): non va forzata */
#ProductDetails .sa-pdp__main .flickity-page-dots { display: none; }
#ProductDetails .sa-pdp__main .flickity-prev-next-button { display: none; }
#ProductDetails .sa-pdp__main .no-image-placeholder { aspect-ratio: 4/5; display: flex; flex-direction: column; justify-content: center; }

/* --- colonna informazioni ---------------------------------------------------- */
.sa-pdp__info.addToCartBox { display: flex; flex-direction: column; gap: 26px; padding: 0 !important; height: auto; }
.sa-pdp__head { display: flex; flex-direction: column; gap: 10px; }
.sa-pdp__eyebrow { font: 600 11px/1 var(--sa-font); letter-spacing: .24em; text-transform: uppercase; color: var(--sa-granata); }
#ProductDetails h1#ProductTitle.sa-pdp__title {
	margin: 0; font: 700 40px/1.05 var(--sa-font); letter-spacing: -.025em;
	text-transform: uppercase; color: var(--sa-ink); font-style: normal;
}
.sa-pdp__meta { display: flex; flex-wrap: wrap; gap: 4px 16px; }
.sa-pdp__meta #itemCodes { display: contents; }
.sa-pdp__meta .itemCode, .sa-pdp__code {
	display: inline-block; margin: 0; line-height: 1;
	font: 400 12px/1 var(--sa-font); letter-spacing: .1em; text-transform: uppercase; color: var(--sa-gray);
}

.sa-pdp__pricerow {
	display: flex; align-items: baseline; flex-wrap: wrap; gap: 14px;
	padding-bottom: 22px; border-bottom: 1px solid var(--sa-line);
}
#ProductDetails .sa-pdp__pricerow #priceBlocks { min-height: 34px; }
#ProductDetails .sa-pdp__pricerow .priceblock {
	float: none; width: auto; margin: 0; padding: 0; background: transparent; text-align: left; display: block;
}
#ProductDetails .sa-pdp__pricerow .itemPrice {
	font: 700 34px/1 var(--sa-font); color: var(--sa-ink); padding: 0; line-height: 1; white-space: normal;
	display: flex; align-items: baseline; flex-wrap: wrap; gap: 10px;
}
#ProductDetails .sa-pdp__pricerow .itemPrice .itemPriceList { font: 400 16px/1 var(--sa-font); color: #9A9A9A; margin: 0; }
#ProductDetails .sa-pdp__pricerow .itemPrice .itemDiscountPerc {
	font: 600 10px/1 var(--sa-font); letter-spacing: .16em; background: var(--sa-ink); color: #fff; padding: 6px 8px;
}
#ProductDetails .sa-pdp__pricerow .itemPrice .itemOffer { flex-basis: 100%; font: 400 12px/1.4 var(--sa-font); color: var(--sa-gray); border-left: 3px solid var(--sa-granata); padding-left: 10px; }
#ProductDetails .sa-pdp__pricerow .AvailLabel,
#ProductDetails .sa-pdp__pricerow .AvailLabel.AvailLabelGreen {
	display: inline-flex; align-items: center; gap: 8px; margin: 0; padding: 0;
	font: 500 13px/1 var(--sa-font); letter-spacing: 0; text-transform: none;
	background: transparent; color: #2E6B3E; text-align: left;
}
#ProductDetails .sa-pdp__pricerow .AvailLabel:not(:empty)::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: currentColor; }
#ProductDetails .sa-pdp__pricerow .AvailLabel.AvailLabelYellow { color: #B7791F; }
#ProductDetails .sa-pdp__pricerow .AvailLabel.AvailLabelRed { color: var(--sa-granata); }

/* taglie */
#ProductDetails #ChooseVariants { display: flex; flex-direction: column; gap: 14px; }
#ProductDetails .ChooseVariantsLevel { margin: 0; display: flex; flex-direction: column; gap: 14px; }
.sa-pdp__sizehead { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; }
#ProductDetails .ChooseVariants_label {
	margin: 0; font: 600 11px/1 var(--sa-font); letter-spacing: .18em; text-transform: uppercase; color: var(--sa-ink);
}
.sa-pdp__sizeguide { font: 500 12px/1 var(--sa-font); color: var(--sa-granata); text-decoration: none; border-bottom: 1px solid var(--sa-granata); padding-bottom: 2px; }
.sa-pdp__sizeguide:hover { color: var(--sa-granata-dark); text-decoration: none; }
#ProductDetails .ChooseVariantsLevel .VariantBox,
#ProductDetails .VariantBox {
	min-width: 56px; height: 48px; padding: 0 14px; margin: 0;
	display: inline-flex; align-items: center; justify-content: center;
	background: #fff; border: 1px solid var(--sa-line); border-radius: 0;
	font: 500 13px/1 var(--sa-font); color: var(--sa-ink); cursor: pointer; transition: border-color .2s;
}
#ProductDetails .ChooseVariantsLevel { flex-direction: row; flex-wrap: wrap; gap: 8px; }
#ProductDetails .ChooseVariantsLevel .sa-pdp__sizehead { flex-basis: 100%; }
#ProductDetails .VariantBox:hover { border-color: var(--sa-ink); }
#ProductDetails .VariantBox.is-available, #ProductDetails .VariantBox.is-available-last { border-color: var(--sa-line); }
#ProductDetails .VariantBox.is-unavailable {
	background: #fff; border-color: var(--sa-ink); color: var(--sa-ink); opacity: .3; font-weight: 400; text-decoration: line-through; cursor: pointer;
}
#ProductDetails .VariantBox.is-unavailable:hover { opacity: .5; }
#ProductDetails .VariantBox.VariantBoxSelected,
#ProductDetails .VariantBox.is-unavailable.VariantBoxSelected {
	background: var(--sa-ink) !important; border-color: var(--sa-ink) !important; color: #fff !important; font-weight: 600;
}

/* riga di acquisto: quantita' | aggiungi al carrello | preferiti */
#ProductDetailsActions { display: flex; flex-direction: column; gap: 16px; }
.sa-pdp__buy { display: flex; align-items: stretch; gap: 12px; }
.sa-qty { display: flex; align-items: center; border: 1px solid var(--sa-line); flex: 0 0 auto; }
.sa-qty__btn {
	width: 48px; height: 54px; background: transparent; border: none; padding: 0;
	font: 400 18px/1 var(--sa-font); color: var(--sa-ink); cursor: pointer;
}
.sa-qty__btn:hover { background: var(--sa-surface); }
.sa-qty__val {
	width: 44px; height: 54px; border: none; padding: 0; text-align: center; background: transparent;
	font: 600 15px/1 var(--sa-font); color: var(--sa-ink); -moz-appearance: textfield; appearance: textfield;
}
.sa-qty__val::-webkit-outer-spin-button, .sa-qty__val::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.sa-pdp__cart { flex: 1 1 auto; min-width: 0; display: flex; }
#ProductDetails .sa-pdp__cart .addtocart,
#ProductDetails .addtocart {
	flex: 1 1 auto; width: auto; max-width: none; height: 56px; margin: 0 !important; padding: 0 16px !important;
	display: inline-flex; align-items: center; justify-content: center; gap: 10px;
	background: var(--sa-granata); border: 1px solid var(--sa-granata); border-radius: 0; color: #fff;
	font: 600 14px/1 var(--sa-font); letter-spacing: .16em; text-transform: uppercase; cursor: pointer;
	white-space: nowrap; overflow: hidden; text-overflow: ellipsis; transition: background .2s;
}
#ProductDetails .addtocart:hover { background: var(--sa-granata-light); border-color: var(--sa-granata-light); }
#ProductDetails .addtocart .fa.fa-cart-plus { display: none; }
.sa-pdp__soldout { flex: 1 1 auto; display: flex; align-items: center; min-height: 56px; padding: 0 16px; border: 1px solid var(--sa-line); font: 400 13px/1.4 var(--sa-font); color: var(--sa-gray); }
.sa-pdp__fav {
	flex: 0 0 56px; width: 56px; height: 56px; padding: 0; background: transparent; border: 1px solid var(--sa-line); border-radius: 0;
	display: inline-flex; align-items: center; justify-content: center; cursor: pointer; transition: border-color .2s;
}
.sa-pdp__fav:hover { border-color: var(--sa-ink); }
.sa-pdp__fav .toFavouriteButton {
	display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; margin: 0;
	font-size: 18px; color: var(--sa-ink); cursor: pointer;
}
.sa-pdp__fav .toFavouriteButton.fa-heart { color: var(--sa-granata); }
.sa-pdp__loading { font: 400 13px/1 var(--sa-font); color: var(--sa-ink); opacity: .3; margin: 0; }

/* PayPal express sotto la riga di acquisto, discreto */
.sa-pdp__express:empty { display: none; }
.sa-pdp__express { display: flex; flex-direction: column; gap: 8px; }
.sa-pdp__express .etichette_express { margin: 0; }
.sa-pdp__express .etichette_express p { margin: 0; }
.sa-pdp__express .etichette_express_titolo { font: 600 11px/1.4 var(--sa-font); letter-spacing: .14em; text-transform: uppercase; color: var(--sa-ink); }
.sa-pdp__express .etichette_express_testo { font: 400 12px/1.4 var(--sa-font); color: var(--sa-gray); }
.sa-pdp__express [id^="paypal-button-container-"] { max-width: 100%; }

.sa-pdp__note { margin: 0; font: 400 13px/1.6 var(--sa-font); color: var(--sa-gray); }
.sa-pdp__note .shipto { font-size: inherit; color: var(--sa-ink); cursor: pointer; border-bottom: 1px solid var(--sa-line); }
.sa-pdp__note .shipto:hover { border-bottom-color: var(--sa-ink); }
.sa-pdp__note .shipto .flag-icon { margin-left: 5px; vertical-align: middle; }

/* soffietto: descrizione, caratteristiche, spedizioni, resi, pagamenti */
#product-DescriptionArea.sa-acc { width: auto; height: auto; padding: 0; margin-top: 6px; color: var(--sa-ink); border-top: 1px solid var(--sa-line); display: flex; flex-direction: column; }
.sa-acc__item { border-bottom: 1px solid var(--sa-line); }
.sa-acc__head {
	display: flex; align-items: center; justify-content: space-between; gap: 16px;
	padding: 22px 0; cursor: pointer; list-style: none;
	font: 600 12px/1 var(--sa-font); letter-spacing: .14em; text-transform: uppercase; color: var(--sa-ink);
}
.sa-acc__head::-webkit-details-marker { display: none; }
.sa-acc__head::marker { content: ""; }
.sa-acc__icon { font-style: normal; font: 400 16px/1 var(--sa-font); color: var(--sa-ink); }
.sa-acc__icon::before { content: "+"; }
.sa-acc__item[open] > .sa-acc__head .sa-acc__icon { color: var(--sa-granata); }
.sa-acc__item[open] > .sa-acc__head .sa-acc__icon::before { content: "\2212"; }
.sa-acc__body { padding: 0 0 22px; font: 400 15px/1.75 var(--sa-font); color: var(--sa-gray); }
.sa-acc__body p { margin: 0 0 10px; }
.sa-acc__body p:last-child { margin-bottom: 0; }
.sa-acc__body a { color: var(--sa-granata); text-decoration: underline; }
.sa-acc__body.ItemDesc { font-size: 15px; }
.sa-acc__body.ItemDesc p { margin: 0; }
#product-tab-attributes.sa-acc__body { border: none; padding-top: 0; }
#product-tab-attributes .attrTable { width: 100%; font-size: 14px; }
#product-tab-attributes .attrTableCell { padding: 6px 0 !important; border-bottom: 1px solid var(--sa-line-soft); }

/* condividi */
#ProductDetails .ShareBox { margin: 0; padding: 0; display: flex; align-items: center; gap: 14px; }
#ProductDetails .ShareBoxTitle { margin: 0; padding: 0; font: 600 11px/1 var(--sa-font); letter-spacing: .18em; color: var(--sa-gray); }
#ProductDetails .ShareBoxIcons { display: flex; align-items: center; gap: 14px; }
#ProductDetails .ShareBoxIcons a { color: var(--sa-ink); display: inline-flex; }
#ProductDetails .ShareBoxIcons i.fa { margin: 0; font-size: 18px; color: var(--sa-ink); }
#ProductDetails .ShareBoxIcons a:hover i.fa { color: var(--sa-granata); }
#ProductDetails .ShareBoxIcons img { width: 16px !important; margin: 0 !important; }

/* =============================================================================
   SA27.01 - Opzioni della scheda prodotto (product.php, .ProductOptions; Jordan 16/09/2026,
   screenshot 477781): titolo "NOME + prezzo", due scelte affiancate "Nessuna" | etichetta
   del campo (la seconda e' la testata storica .ProductOptionHead, che tiene la logica),
   area di inserimento su fondo chiaro con i campi del sito. La scelta attiva e' ink pieno,
   come le taglie. Il CSS in linea di product.php viene scavalcato con l'id.
   ========================================================================== */
#ProductDetails .ProductOptions { padding: 0; margin: 0 0 4px; }
#ProductDetails .ProductOptionsTitle { display: none; }                 /* ogni opzione ha il proprio titolo */
#ProductDetails .ProductOption { margin: 0 0 20px; }
#ProductDetails .ProductOption > .row { margin: 0; padding: 0 !important; }
#ProductDetails .ProductOption > .row > [class*="col-"] { padding: 0 !important; float: none; width: 100%; max-width: none; flex: none; }
#ProductDetails .ProductOption .ProductOptionImage img { width: 72px; }
#ProductDetails .sa-opt__title {
	display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; margin: 0 0 10px;
	font: 600 12px/1.3 var(--sa-font); letter-spacing: .14em; text-transform: uppercase; color: var(--sa-ink);
}
#ProductDetails .sa-opt__price { font: 600 12px/1.3 var(--sa-font); letter-spacing: .14em; color: var(--sa-ink); }
#ProductDetails .sa-opt__price .itemPriceList { font: 400 11px/1 var(--sa-font); color: #9A9A9A; text-decoration: line-through; margin: 0 0 0 6px; }
#ProductDetails .sa-opt__price .itemDiscountPerc, #ProductDetails .sa-opt__price .itemOffer { display: none; }
#ProductDetails .sa-opt__choices { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
#ProductDetails .sa-opt__none,
#ProductDetails .ProductOption .ProductOptionHead {
	display: flex; align-items: center; justify-content: center; min-height: 48px; margin: 0; padding: 0 12px;
	background: #fff; border: 1px solid var(--sa-line); border-radius: 0; box-shadow: none;
	font: 600 12px/1.3 var(--sa-font); letter-spacing: .12em; text-transform: uppercase; text-align: center; color: var(--sa-ink);
	cursor: pointer; user-select: none; transition: border-color .2s ease, background .2s ease, color .2s ease;
}
#ProductDetails .sa-opt__none:hover,
#ProductDetails .ProductOption .ProductOptionHead:hover { border-color: var(--sa-ink); }
#ProductDetails .ProductOption:not(.selected) .sa-opt__none,
#ProductDetails .ProductOption.selected .ProductOptionHead { background: var(--sa-ink) !important; border-color: var(--sa-ink); color: #fff !important; }
#ProductDetails .ProductOption .ProductOptionHead > div { display: none; }   /* nome, descrizione e prezzo stanno nel titolo sopra */
#ProductDetails .ProductOption .ProductOptionHead .sa-opt__chiplabel { display: block; }

#ProductDetails .ProductOptionInputArea { margin-top: 8px; padding: 16px; background: var(--sa-surface); }
#ProductDetails .ProductOptionInput { margin: 0; }
#ProductDetails .ProductOptionInput + .ProductOptionInput { margin-top: 12px; }
#ProductDetails .ProductOptionInputLabel { margin-bottom: 8px; font: 600 11px/1.3 var(--sa-font); font-style: normal; letter-spacing: .16em; text-transform: uppercase; color: var(--sa-gray); }
#ProductDetails .ProductOptionInputField .form-control {
	height: 48px !important; padding: 0 14px !important; border: 1px solid var(--sa-line); border-radius: 0 !important; box-shadow: none;
	background: #fff; font: 400 15px/1.3 var(--sa-font); text-transform: uppercase; color: var(--sa-ink);
}
#ProductDetails .ProductOptionInputField .form-control:focus { border-color: var(--sa-ink); box-shadow: none; outline: none; }
#ProductDetails .ProductOptionInputField input.form-control[type="number"] { width: 100px; }
#ProductDetails .ProductOptionInputAlert { padding-top: 10px; font: 400 13px/1.4 var(--sa-font); color: var(--sa-granata); }
#ProductDetails .itemOptionOffer { display: none; }

/* --- "Completa il kit" ------------------------------------------------------- */
.sa-pdp__related .sa-section.sa-pdp__kit { padding: 96px 0; }
.sa-pdp__kithead { align-items: flex-end; padding-bottom: 20px; margin-bottom: 36px; border-bottom: 2px solid var(--sa-ink); }
.sa-pdp__kitlink { font: 600 12px/1 var(--sa-font); letter-spacing: .14em; text-transform: uppercase; color: var(--sa-ink); text-decoration: none; white-space: nowrap; }
.sa-pdp__kitlink:hover { color: var(--sa-granata); text-decoration: none; }

/* --- responsive --------------------------------------------------------------- */
@media (max-width: 1199px) {
	#ProductDetails.sa-pdp { grid-template-columns: minmax(0, 1fr) 400px; gap: 40px; }
	#ProductDetails h1#ProductTitle.sa-pdp__title { font-size: 32px; }
}
@media (max-width: 991px) {
	.sa-pdp-page { padding: 16px 20px 0; }
	.sa-pdp-page .sa-crumbs { margin-bottom: 16px; }
	#ProductDetails.sa-pdp { grid-template-columns: minmax(0, 1fr); gap: 32px; }
	.sa-pdp__gallery { grid-template-columns: minmax(0, 1fr); }
	.sa-pdp__thumbs { order: 2; flex-direction: row; overflow-x: auto; gap: 8px; padding-bottom: 2px; }
	.sa-pdp__thumb { width: 64px; flex: 0 0 64px; }
	#ProductDetails .sa-pdp__main .flickity-prev-next-button { display: block; }
	#ProductDetails h1#ProductTitle.sa-pdp__title { font-size: 28px; }
	#ProductDetails .sa-pdp__pricerow .itemPrice { font-size: 28px; }
	.sa-pdp__related .sa-section.sa-pdp__kit { padding: 56px 0; }
	.sa-pdp__kithead { margin-bottom: 24px; }
}
@media (max-width: 575px) {
	/* main.min.css forza .flickity-viewport{height:375px!important} sotto i 576px: la cella si adegua */
	#ProductDetails .sa-pdp__main .carousel-cell,
	#ProductDetails .sa-pdp__main .carousel-cell-container { aspect-ratio: auto; height: 375px !important; }
	.sa-pdp__buy { flex-wrap: wrap; }
	.sa-qty { order: 1; }
	.sa-pdp__fav { order: 2; }
	.sa-pdp__cart { order: 3; flex-basis: 100%; }
	#ProductDetails .VariantBox { min-width: 48px; height: 44px; padding: 0 10px; }
	.sa-pdp__kithead { flex-direction: column; align-items: flex-start; gap: 12px; }
}
span.pageLabel { top: auto !important; }

/* =============================================================================
   SA27.01 - Pagine interne con contenitore e stato vuoto (sezione 2B del disegno;
   Jordan, 14/09/2026). Prima i preferiti, poi il carrello.
   ========================================================================== */
.sa-page {
	max-width: var(--sa-container);
	margin: 0 auto;
	padding: 28px var(--sa-gutter) 72px;
	font-family: var(--sa-font);
	color: var(--sa-ink);
}
.sa-page__head { display: flex; align-items: flex-end; flex-wrap: wrap; gap: 16px; margin: 4px 0 28px; }
.sa-page__head .sa-h1 { margin: 0; }
.sa-page__head .sa-listing__count { padding-bottom: 6px; }

.sa-empty {
	display: flex; flex-direction: column; align-items: center; gap: 24px;
	text-align: center; padding: 68px 0 40px;
}
.sa-empty__title {
	margin: 0; font: 800 44px/1 var(--sa-font); letter-spacing: -.03em;
	text-transform: uppercase; color: var(--sa-ink);
}
.sa-empty__text { margin: 0; font: 400 16px/1.7 var(--sa-font); color: var(--sa-gray); max-width: 480px; }
.sa-empty__cta { display: flex; flex-wrap: wrap; justify-content: center; gap: 14px; margin-top: 8px; }
.sa-empty__cta .sa-btn { height: 56px; padding: 0 38px; }
.sa-empty__cta .sa-btn--secondary { padding: 0 34px; }

/* sezione "Inizia da qui" sotto il carrello vuoto (SA27.01): stesso vestito del blocco
   "Completa il kit" della scheda prodotto (.sa-pdp__kithead), riproposto qui perche' vive
   dentro .sa-page invece che in una .sa-section a tutta larghezza */
.sa-start { margin-top: 56px; }
.sa-start__head { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; padding-bottom: 20px; margin-bottom: 32px; border-bottom: 2px solid var(--sa-ink); }
.sa-start__head h2 { margin: 0; }
.sa-start__link { font: 600 12px/1 var(--sa-font); letter-spacing: .14em; text-transform: uppercase; color: var(--sa-ink); text-decoration: none; white-space: nowrap; }
.sa-start__link:hover { color: var(--sa-granata); text-decoration: none; }

/* griglia dei preferiti: le card sono quelle delle liste (colonne bootstrap), su 4 colonne
   a tutta larghezza come le altre griglie del disegno */
.sa-favourites .favouritesArea .listingArea.row { margin-top: 0; }
@media (min-width: 1200px) { .sa-favourites .listingArea.row > .itemBox.col-md-4 { width: 25%; flex: 0 0 25%; max-width: 25%; } } /* bootstrap 4: col-md-4 fissa anche flex e max-width */
.sa-favourites .favouritesArea .noResultsText { font: 400 15px/1.6 var(--sa-font); color: var(--sa-gray); }

/* carrello: contenitore del sito su tutti e 3 i passi (#cartNavigation resta in cima come
   chiesto) */
/* Stepper del carrello (#cartNavigation), coerente col resto della pagina (Jordan,
   14/09/2026): cerchio sottile + etichetta maiuscola al posto della "pillola" grigia
   spessa del tema vecchio. Solo aspetto: le classi che il JS accende/spegne
   (cartStepButtonActive, clickable, il contenuto di cartStepNumberLabel) restano
   quelle di sempre; il comportamento mobile (un solo passo visibile alla volta, testo
   "Passo X di 3", freccia indietro) e' invariato, qui cambiano solo i colori/font. */
.sa-cart #cartNavigation { margin: 0 0 40px; text-align: center; }
.sa-cart .cartStepButton {
	font: 600 12px/1 var(--sa-font); letter-spacing: .1em; text-transform: uppercase;
	color: var(--sa-muted);
}
.sa-cart .cartStepButtonActive { color: var(--sa-ink); }
.sa-cart .cartStepNumber { background-color: var(--sa-line); height: 1px; border-radius: 0; }
.sa-cart .cartStepButtonActive .cartStepNumber { background-color: var(--sa-granata); }
.sa-cart .cartStepNumberLabel {
	width: 32px; height: 32px; margin-left: calc(50% - 16px); padding: 0; top: -16px;
	background-color: var(--sa-bg); border: 1px solid var(--sa-line); border-radius: 50%;
	display: flex; align-items: center; justify-content: center;
}
.sa-cart .cartStepButtonActive .cartStepNumberLabel { border-color: var(--sa-granata); background-color: var(--sa-granata); }
.sa-cart .cartStepButtonNumberSpan { position: static; transform: none; max-width: none; font: 600 13px/1 var(--sa-font); color: var(--sa-gray); }
.sa-cart .cartStepButtonActive .cartStepButtonNumberSpan { color: #fff; }
.sa-cart .cartStepNumberLabel .fa-check { font-size: 13px; color: var(--sa-gray); }
.sa-cart .cartStepButtonActive .cartStepNumberLabel .fa-check { color: #fff; }
.sa-cart .cartStepLabel { margin-top: 16px; }
.sa-cart .cartStepButton.clickable { cursor: pointer; }
.sa-cart .cartStepButton.clickable:hover { color: var(--sa-granata); }
.sa-cart .cartStepButton.clickable:hover .cartStepNumber { background-color: var(--sa-granata); }
.sa-cart .cartStepButton.clickable:hover .cartStepNumberLabel { border-color: var(--sa-granata); }
@media (max-width: 768px) {
	.sa-cart #cartNavigation { text-align: left; }
	.sa-cart .cartStepNumberLeftLabel, .sa-cart .cartStepNumberRightLabel { color: var(--sa-gray); font: 400 12px/1 var(--sa-font); text-transform: none; letter-spacing: 0; }
	.sa-cart .MobileCartStepBackButton { color: var(--sa-ink); }
}

@media (max-width: 991px) {
	.sa-page { padding: 16px 20px 48px; }
	.sa-empty { padding: 40px 0 24px; }
	.sa-empty__title { font-size: 32px; }
	.sa-start__head { flex-direction: column; align-items: flex-start; gap: 12px; }
}
@media (max-width: 575px) {
	.sa-empty__cta { flex-direction: column; align-items: stretch; width: 100%; }
	.sa-empty__cta .sa-btn { width: 100%; }
}

/* =============================================================================
   SA27.01 - Carrello con prodotti (sezione 1e del disegno; Jordan, 14/09/2026).
   Il markup di cart_step1.php e' quello del motore (id/classi usati dal JS): qui
   .sa-cart__main e .sa-cart__summary lo dispongono in due colonne. I 3 passi
   (#cartNavigation) restano in cima.
   ========================================================================== */
.sa-cart #cartContainer { margin-top: 0; border-top: none; padding: 0; }
.sa-cart #cartReview { padding: 0; border-radius: 0; }
/* la testata del passo 1 e' dentro il contenuto ("Carrello" + conteggio): il titolo generico si nasconde */
.sa-cart #cartTitle:has(+ #cartContainer .sa-cart__head) { display: none; }

.sa-cart__head { display: flex; align-items: flex-end; flex-wrap: wrap; gap: 16px; margin: 0 0 28px; }
.sa-cart__head .sa-h1 { margin: 0; }
.sa-cart__head .sa-listing__count { padding-bottom: 6px; }

@media (min-width: 992px) {
	.sa-cart #cartReview {
		display: grid;
		grid-template-columns: minmax(0, 1fr) 400px;
		gap: 0 48px;
		align-items: start;
	}
	.sa-cart__head { grid-column: 1 / -1; }
	.sa-cart__main { grid-column: 1; }
	.sa-cart__summary { grid-column: 2; grid-row: 2 / span 3; position: sticky; top: 24px; }
	.sa-cart #ToStep2Alert { grid-column: 1 / -1; }
	/* carrello vuoto: .sa-empty e .sa-start (sezione "Inizia da qui") sono figli diretti di
	   #cartReview come .sa-cart__head/__main/__summary, quindi la griglia a due colonne del
	   carrello con prodotti li metteva uno affianco all'altro invece che impilati */
	.sa-cart #cartReview .sa-empty,
	.sa-cart #cartReview .sa-start { grid-column: 1 / -1; }
}

/* intestazione delle colonne e righe prodotto */
.sa-cart__cols, .sa-cart .cartReviewItem.row {
	display: grid;
	grid-template-columns: 140px minmax(0, 1fr) 120px 110px;
	gap: 0 24px;
	align-items: center;
}
.sa-cart__cols {
	padding: 0 0 12px; border-bottom: 1px solid var(--sa-ink);
	font: 600 11px/1 var(--sa-font); letter-spacing: .18em; text-transform: uppercase; color: var(--sa-ink);
}
.sa-cart__cols span:nth-child(1) { grid-column: 1 / 3; }
.sa-cart__cols span:nth-child(2) { grid-column: 3; text-align: center; }
.sa-cart__cols span:nth-child(3) { grid-column: 4; text-align: right; }

.sa-cart .cartReviewItem.row { padding: 24px 0; margin: 0; border: none; border-bottom: 1px solid var(--sa-line); }
.sa-cart .cartReviewItem.row:first-child { padding-top: 24px; }
.sa-cart .cartReviewItem.row[data-type="3"] { border: none; border-bottom: 1px solid var(--sa-line); border-radius: 0; padding: 24px 0; }
.sa-cart .cartItemImgContainer { grid-column: 1; width: auto !important; max-width: none !important; flex: none; float: none; padding: 0; height: auto; text-align: center; } /* le classi col-* (bootstrap 4: max-width 25%) darebbero un quarto della cella */
.sa-cart .cartItemImgContainer a { display: block; }
.sa-cart .cartItemImgContainer img { display: block; width: 100%; max-height: 170px; object-fit: contain; }
/* il contenitore del testo non fa da riquadro: titolo, quantita' e prezzo sono celle della riga */
.sa-cart .cartItemTextContainer { display: contents; }
.sa-cart .cartItemTitle { grid-column: 2; padding: 0; font: 400 13px/1.5 var(--sa-font); color: var(--sa-gray); }
.sa-cart .cartItemTitle .itemName { font: 600 15px/1.3 var(--sa-font); text-transform: uppercase; color: var(--sa-ink); }
.sa-cart .cartItemTitle a { color: var(--sa-ink); text-decoration: none; }
.sa-cart .cartItemTitle a:hover .itemName { color: var(--sa-granata); }
.sa-cart .cartItemTitle .fa-external-link { display: none; }
.sa-cart .cartItemTitle .ItemAttributes, .sa-cart .cartItemTitle .ItemDetails, .sa-cart .cartItemTitle .itemCode { font-size: 13px; color: var(--sa-gray); }
.sa-cart .cartItemTitle .itemCode { display: inline; margin: 0; line-height: inherit; }
.sa-cart .removeFromCartButton, .sa-cart .removeFromCartButton.link {
	display: block; width: fit-content; margin-top: 8px;
	font: 600 11px/1 var(--sa-font) !important; letter-spacing: .14em; text-transform: uppercase;
	color: var(--sa-gray) !important; text-decoration: none !important; border-bottom: 1px solid transparent; cursor: pointer;
}
.sa-cart .removeFromCartButton:hover { color: var(--sa-granata) !important; border-bottom-color: var(--sa-granata); }
.sa-cart .CartElementOptions { grid-column: 2 / -1; }

/* quantita': riquadro [ - 1 + ] come nella scheda prodotto */
.sa-cart .cartQtyContainer { grid-column: 3; margin: 0; display: inline-flex; align-items: stretch; justify-self: center; border: 1px solid var(--sa-line); text-align: center; }
.sa-cart .cartQtyMinus, .sa-cart .cartQtyPlus {
	width: 40px; height: 44px; margin: 0; padding: 0; border: none; border-radius: 0;
	color: var(--sa-ink); background: transparent; font: 400 16px/1 var(--sa-font);
}
.sa-cart .cartQtyMinus:hover, .sa-cart .cartQtyPlus:hover { border: none; background-color: var(--sa-surface) !important; color: var(--sa-ink); }
.sa-cart .cartQty { width: 36px; height: 44px; margin: 0; padding: 0; display: inline-flex; align-items: center; justify-content: center; font: 600 15px/1 var(--sa-font); color: var(--sa-ink); }

/* prezzo di riga */
.sa-cart .cartItemPrice { grid-column: 4; margin: 0; text-align: right; font: 600 15px/1.3 var(--sa-font); color: var(--sa-ink); }
.sa-cart .cartItemPrice .itemPriceList { font-size: 12px; color: #9A9A9A; }
.sa-cart .cartItemPrice .itemOffer { font-size: 11px; border-left-color: var(--sa-granata); }

/* coupon sotto la lista */
.sa-cart #CartCouponForm { margin-top: 24px; font: 400 14px/1.4 var(--sa-font); }
.sa-cart #CartCouponForm > div { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; }
.sa-cart #CartCouponForm_Title { margin: 0 !important; font: 600 11px/1 var(--sa-font); letter-spacing: .14em; text-transform: uppercase; color: var(--sa-ink); }
.sa-cart #CartCouponForm_Input { display: flex; gap: 8px; }
.sa-cart #CartCouponForm .form-control { height: 44px; border: 1px solid var(--sa-line); border-radius: 0; box-shadow: none; font: 400 14px/1 var(--sa-font); min-width: 240px; }
.sa-cart #CartCouponForm .form-control:focus { border-color: var(--sa-ink); }
.sa-cart #CartCouponForm .btn.btn-primary {
	width: auto; height: 44px; margin: 0; padding: 0 18px; border: 1px solid var(--sa-ink); border-radius: 0;
	background: transparent !important; color: var(--sa-ink) !important;
	font: 600 11px/1 var(--sa-font); letter-spacing: .14em; text-transform: uppercase;
}
.sa-cart #CartCouponForm .btn.btn-primary:hover { background: var(--sa-ink) !important; color: #fff !important; }
.sa-cart #cartComboPromo { margin: 16px 0 0 !important; border-radius: 0 !important; background: var(--sa-surface) !important; border-color: var(--sa-line) !important; color: var(--sa-ink) !important; font: 400 13px/1.5 var(--sa-font); }

.sa-cart__continue {
	display: inline-block; margin-top: 24px;
	font: 600 12px/1 var(--sa-font); letter-spacing: .14em; text-transform: uppercase;
	color: var(--sa-ink); text-decoration: none; border-bottom: 1px solid var(--sa-ink); padding-bottom: 3px;
}
.sa-cart__continue:hover { color: var(--sa-granata); border-bottom-color: var(--sa-granata); text-decoration: none; }

/* riepilogo ordine */
.sa-cart__summary { border: 1px solid var(--sa-line); padding: 32px; margin-top: 0; font-family: var(--sa-font); color: var(--sa-ink); }
.sa-cart__summarytitle { margin: 0 0 18px; padding-bottom: 18px; border-bottom: 1px solid var(--sa-line); font: 700 20px/1.2 var(--sa-font); text-transform: uppercase; letter-spacing: -.01em; color: var(--sa-ink); }
.sa-cart__summary #cartSelectShipment.shippingInfos { margin: 0; padding: 0; background: transparent; max-width: none; width: auto; }
.sa-cart__summary #cartSelectShipmentTitle { margin: 0 0 12px; font: 600 11px/1 var(--sa-font); letter-spacing: .16em; text-transform: uppercase; color: var(--sa-ink); display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.sa-cart__summary #cartSelectShipmentTitle a.link { font: 500 12px/1 var(--sa-font); letter-spacing: 0; text-transform: none; color: var(--sa-granata); text-decoration: none !important; border-bottom: 1px solid var(--sa-granata); }
.sa-cart__summary .shipmentBox { margin: 0 0 8px; padding: 10px 0; border: none; border-bottom: 1px solid var(--sa-line); display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.sa-cart__summary .shipmentBox.selectedShipment { display: flex; }
.sa-cart__summary .shipmentBox .shipmentBoxTitle { font: 500 14px/1.4 var(--sa-font); color: var(--sa-ink); }
.sa-cart__summary .shipmentBox .shipmentBoxTitle .fa { color: var(--sa-granata); margin-right: 8px; }
.sa-cart__summary .shipmentBox .discount_description { font: 400 12px/1.4 var(--sa-font); color: var(--sa-gray); font-style: normal; }
.sa-cart__summary .shipmentBoxPrice { margin: 0; font: 600 14px/1 var(--sa-font); color: var(--sa-granata); white-space: nowrap; }
.sa-cart__summary .shippingInfos > form > a, .sa-cart__summary .shippingInfos > a { display: inline-block; margin-top: 8px; font: 400 12px/1.4 var(--sa-font); color: var(--sa-gray); text-decoration: none; border-bottom: 1px solid var(--sa-line); }
.sa-cart__summary .shippingInfos > form > a:hover { color: var(--sa-ink); border-bottom-color: var(--sa-ink); }
.sa-cart__summary #ShipmentPriceByAddress { font: 400 13px/1.5 var(--sa-font); color: var(--sa-gray); }
.sa-cart__summary .text-shoppingCart, .sa-cart__summary #AmountToFreeShipmentMsg {
	width: 100%; margin: 12px 0 0; padding: 14px 16px; text-align: left;
	background: var(--sa-surface); color: var(--sa-ink); font: 400 13px/1.5 var(--sa-font);
}
.sa-cart__summary .text-shoppingCart .fa { display: none; }
.sa-cart__summary .shippingInfos .selectShippingAddressBox { border-radius: 0; border-color: var(--sa-line); font: 400 13px/1.5 var(--sa-font); }
.sa-cart__summary .shippingInfos .selectShippingAddressBox.selectedAddress { border: 1px solid var(--sa-ink); }
/* indirizzi (utente loggato): titolo su una riga, "Cambia" sotto, elenco con respiro, "Gestisci indirizzi" in coda (Jordan, 14/09/2026) */
.sa-cart__summary .shippingInfos .shippingTableTitle {
	display: flex; flex-direction: column; align-items: flex-start; gap: 10px;
	margin: 0 0 14px; font: 600 11px/1.4 var(--sa-font); letter-spacing: .16em; text-transform: uppercase;
}
.sa-cart__summary .shippingInfos .changeShippingAddress { float: none; margin: 0; font: 500 12px/1 var(--sa-font); letter-spacing: 0; text-transform: none; color: var(--sa-granata); text-decoration: none !important; border-bottom: 1px solid var(--sa-granata); }
.sa-cart__summary .shippingInfos .standardShipping { margin: 0 0 16px; }
.sa-cart__summary .shippingInfos .selectShippingAddressBox { margin: 0 0 8px; padding: 12px 14px; }
.sa-cart__summary .shippingInfos .selectShippingAddressBox .shipping_address_label { font-weight: 600; margin-bottom: 2px; }
.sa-cart__summary .shippingInfos .sa-cart__manageaddr { display: inline-block; margin: 0 0 20px; color: var(--sa-gray); border-bottom-color: var(--sa-line); }
.sa-cart__summary .shippingInfos .sa-cart__manageaddr:hover { color: var(--sa-ink); border-bottom-color: var(--sa-ink); }
.sa-cart__summary .shippingInfos .cart-info-text { border-radius: 0; border-color: var(--sa-line); background: var(--sa-surface); color: var(--sa-ink); }
.sa-cart__summary #cartReviewCoupon { font: 400 13px/1.5 var(--sa-font); color: var(--sa-gray); margin-top: 12px; }
.sa-cart__summary #cartReviewCoupon span { border-radius: 0 !important; border-color: var(--sa-granata) !important; color: var(--sa-granata) !important; }
.sa-cart__summary .cartReviewTotalPrice {
	display: flex; align-items: baseline; justify-content: space-between; gap: 16px;
	margin-top: 20px; padding-top: 20px; border-top: 2px solid var(--sa-ink);
	text-align: left; font: 600 12px/1 var(--sa-font); letter-spacing: .16em; text-transform: uppercase; color: var(--sa-ink);
}
.sa-cart__summary .cartReviewTotalPrice br { display: none; }
.sa-cart__summary .cartTotalPrice { font: 700 30px/1 var(--sa-font); letter-spacing: -.02em; text-transform: none; color: var(--sa-ink); }
.sa-cart__summary .cartTotalPrice .btn-primary { margin: 0; }
.sa-cart #loadCartStep2Button, .sa-cart #loadCartStep2Button.btn.btn-primary {
	display: block; width: 100%; max-width: none; height: 56px; margin: 20px 0 0; padding: 0 16px !important;
	background: var(--sa-granata) !important; border: none; border-radius: 0; color: #fff !important;
	font: 600 13px/1 var(--sa-font) !important; letter-spacing: .16em; text-transform: uppercase; cursor: pointer;
}
.sa-cart #loadCartStep2Button:hover { background: var(--sa-granata-light) !important; }
.sa-cart__summary > div[style*="text-align: right"], .sa-cart__summary > div[style*="text-align:right"] { text-align: left !important; font: 400 13px/1.5 var(--sa-font); }
.sa-cart__paynote { margin-top: 16px; }
.sa-cart__paynote p { margin: 0 0 10px; font: 400 12px/1.5 var(--sa-font); color: var(--sa-gray); }
.sa-cart__paynote img { display: block; height: 22px; width: auto; object-fit: contain; object-position: left; }

@media (max-width: 768px) {
	/* main.min.css mette la barra "Passo 1 di 3" in position:absolute (contava sui 55px di
	   padding-top del vecchio contenitore): qui torna nel flusso, sopra la testata */
	.sa-cart #cartNavigation { position: static; width: 100%; padding: 4px 0 20px; margin: 0 0 8px; }
}
@media (max-width: 991px) {
	.sa-cart__summary { margin-top: 32px; padding: 24px 20px; }
	.sa-cart #CartCouponForm > div { width: 100%; }
	.sa-cart #CartCouponForm_Input { flex-direction: row; flex-wrap: nowrap; width: 100%; }
	.sa-cart #CartCouponForm .form-control { min-width: 0; width: auto; flex: 1 1 0; height: 44px; }
	.sa-cart #CartCouponForm .btn.btn-primary { flex: 0 0 auto; }
	.sa-cart__cols, .sa-cart .cartReviewItem.row { grid-template-columns: 96px minmax(0, 1fr); gap: 0 16px; }
	.sa-cart__cols span:nth-child(2), .sa-cart__cols span:nth-child(3) { display: none; }
	.sa-cart .cartItemImgContainer { grid-row: 1 / span 2; }
	.sa-cart .cartQtyContainer { grid-column: 2; justify-self: start; margin-top: 12px; }
	.sa-cart .cartItemPrice { grid-column: 2; text-align: left; margin-top: 8px; }
	.sa-cart .cartTotalPrice { font-size: 26px; }
}
#loadCartStep3Button { border-radius: 0 !important; }

/* =============================================================================
   SA27.01 - Pannello del menu mobile (#mp-menu, plugin mlpushmenu; Jordan, 14/09/2026).
   Il disegno 1f non mostra il pannello aperto: qui si usa lo stesso linguaggio del sito
   (Archivo, maiuscole spaziate, linee 1px, granata sui link attivi). Desktop invariato.
   ========================================================================== */
#mp-menu.mp-menu { width: min(320px, 88vw); font-family: var(--sa-font); }
#mp-menu .mp-level { background: #fff; color: var(--sa-ink) !important; display: flex; flex-direction: column; }
#mp-menu .sa-mob__head {
	display: flex; align-items: center; justify-content: space-between; gap: 12px;
	margin: 0; padding: 12px 8px 12px 20px !important; min-height: 64px;
	border-bottom: 1px solid var(--sa-line); text-align: left; font-size: 1em; text-shadow: none;
}
#mp-menu .sa-mob__brand { display: block; line-height: 0; }
#mp-menu .sa-mob__logo { display: block; height: 40px; width: auto; max-width: none; margin: 0; }
#mp-menu .sa-mob__close {
	width: 44px; height: 44px; padding: 0; background: transparent; border: none;
	font: 400 20px/1 var(--sa-font); color: var(--sa-ink) !important; cursor: pointer;
}
#mp-menu ul { flex: 0 0 auto; overflow-y: visible; }
#mp-menu ul li { position: static; }
#mp-menu ul li::before { display: none; }
#mp-menu ul li > a, #mp-menu .mp-level > ul > li:first-child > a {
	display: flex; align-items: center; justify-content: space-between;
	min-height: 54px; padding: 0 20px; box-shadow: none; text-shadow: none;
	border-bottom: 1px solid var(--sa-line); background: transparent;
}
#mp-menu ul li > a::after {
	content: ""; width: 7px; height: 7px; flex: 0 0 auto;
	border-right: 1.5px solid var(--sa-gray); border-top: 1.5px solid var(--sa-gray); transform: rotate(45deg);
}
#mp-menu .menuItem { display: flex; align-items: center; gap: 10px; }
#mp-menu .menuItem, #mp-menu .menuItem a, #mp-menu .menuItemText {
	font: 600 13px/1.3 var(--sa-font) !important; letter-spacing: .14em; text-transform: uppercase;
	color: var(--sa-ink) !important;
}
#mp-menu ul li > a:active .menuItemText, #mp-menu ul li > a:hover .menuItemText { color: var(--sa-granata) !important; }
#mp-menu .menuItem .fa-chevron-left { margin: 0; font-size: 12px; color: var(--sa-gray); }
/* blocco di servizio: e' l'ultimo <li> della lista (mlpushmenu.js da alla ul un'altezza fissa
   in linea = finestra - 100px, con scorrimento interno) */
#mp-menu li.sa-mob__foot {
	margin-top: 0; padding: 18px 20px 24px; border-top: none;
	display: flex; flex-direction: column; gap: 14px; background: var(--sa-surface);
}
#mp-menu ul li.sa-mob__foot > a {
	display: flex; align-items: center; justify-content: flex-start; gap: 10px; min-height: 0; padding: 0; border: none;
	font: 500 13px/1 var(--sa-font) !important; color: var(--sa-ink) !important; text-decoration: none;
}
#mp-menu ul li.sa-mob__foot > a::after { display: none; }
#mp-menu .sa-mob__foot a svg { color: var(--sa-granata); flex: 0 0 auto; }
/* velo sul contenuto quando il pannello e' aperto: ink al 30% come #fade */
.mp-pusher.mp-pushed::after { background: rgba(17, 17, 17, .3); }

/* =============================================================================
   SA27.01 - Carrello, passo 3 "Conferma l'ordine" (cart_step3.php; Jordan, 14/09/2026).
   Solo CSS sul markup esistente (#Items_OrderRow: .CartListCol + .CartTotCol). Il blocco
   dei metodi di pagamento resta com'e' in attesa della decisione: qui cambia solo il vestito.
   ========================================================================== */
/* il display:contents del passo 1 (.cartItemTextContainer) qui metteva nome, taglia e codice
   sulla stessa riga: nel passo 3 il contenitore torna un blocco */
.sa-cart .OrderCartRow .cartItemTextContainer { display: block; width: auto !important; max-width: none !important; flex: 1 1 auto; padding: 0; }

.sa-cart #cartTitle { margin: 0 0 28px; font: 700 44px/1.05 var(--sa-font); letter-spacing: -.02em; text-transform: uppercase; color: var(--sa-ink); }
.sa-cart .OrderSection { margin-bottom: 0; }
.sa-cart #Items_OrderRow.OrderRow.row { padding: 0; margin: 0; display: block; }
@media (min-width: 992px) {
	.sa-cart #Items_OrderRow.OrderRow.row { display: grid; grid-template-columns: minmax(0, 1fr) 400px; gap: 0 48px; align-items: start; }
}
.sa-cart #Items_OrderRow > .OrderCol { width: auto !important; max-width: none !important; flex: none; float: none; padding: 0; }

/* righe prodotto: foto | nome, taglia, codice, quantita' x prezzo */
.sa-cart .OrderCartRow.row {
	display: flex; align-items: flex-start; gap: 24px;
	margin: 0 !important; padding: 24px 0 !important; border: none !important; border-bottom: 1px solid var(--sa-line) !important;
}
.sa-cart .OrderCartRow.row:first-child { border-top: 1px solid var(--sa-ink) !important; }
.sa-cart .OrderCartRow .cartItemImgContainer { width: 140px !important; max-width: none !important; flex: 0 0 140px; padding: 0; height: auto; }
.sa-cart .OrderCartRow .cartItemImgContainer img { display: block; width: 100%; max-height: 170px; object-fit: contain; }
.sa-cart .OrderCartRow .itemName { display: block; font: 600 15px/1.3 var(--sa-font) !important; text-transform: uppercase; color: var(--sa-ink) !important; text-decoration: none; }
.sa-cart .OrderCartRow a.itemName:hover { color: var(--sa-granata) !important; }
.sa-cart .OrderCartRow .ItemAttributes, .sa-cart .OrderCartRow .itemCode, .sa-cart .OrderCartRow .itemDetails {
	display: block; margin: 4px 0 0; font: 400 13px/1.5 var(--sa-font) !important; color: var(--sa-gray) !important;
}
.sa-cart .OrderCartRow .cartItemPrice { margin-top: 10px !important; font: 600 15px/1.3 var(--sa-font); color: var(--sa-ink); text-align: left; }
.sa-cart .OrderCartRow .cartItemPrice .itemPriceList { font-size: 12px; color: #9A9A9A; }
.sa-cart .OrderCartRow[data-type="3"] { border: none !important; border-bottom: 1px solid var(--sa-line) !important; border-radius: 0; color: var(--sa-ink); font-size: 13px !important; font-weight: 500; }

/* indirizzo di spedizione sotto la lista */
.sa-cart .CartListCol .shipping_address_label { font: 600 11px/1 var(--sa-font); letter-spacing: .16em; text-transform: uppercase; color: var(--sa-ink); margin-bottom: 8px; }
.sa-cart .CartListCol .shipping_address_label b { font-weight: 600; }
.sa-cart .CartListCol > div:not(.OrderCartRow) { font: 400 14px/1.6 var(--sa-font); color: var(--sa-ink); }

/* riquadro "Dettaglio pagamento" come il riepilogo del passo 1 */
.sa-cart .OrderCol.CartTotCol {
	background: #fff !important; padding: 32px !important; border-radius: 0 !important;
	border: 1px solid var(--sa-line) !important; box-shadow: none; text-align: left; height: auto;
	font-family: var(--sa-font); color: var(--sa-ink);
}
@media (min-width: 992px) { .sa-cart .OrderCol.CartTotCol { position: sticky; top: 24px; } }
.sa-cart .CartTotCol h4 { margin: 0 0 18px !important; padding-bottom: 18px; border-bottom: 1px solid var(--sa-line); font: 700 20px/1.2 var(--sa-font); text-transform: uppercase; letter-spacing: -.01em; }
.sa-cart .CartTotCol > div { font-family: var(--sa-font); }
.sa-cart .CartTotCol h5 { margin: 0 0 12px !important; font: 600 11px/1 var(--sa-font) !important; letter-spacing: .16em; text-transform: uppercase; color: var(--sa-ink); }
.sa-cart .CartTotCol #Step3_ShippingAmount, .sa-cart .CartTotCol > div > span { font-size: 14px; color: var(--sa-ink); }
.sa-cart .CartTotCol > div[style*="border-bottom"] { border-bottom-color: var(--sa-line) !important; }

/* metodi di pagamento: stesso vestito (bordo sottile, granata sulla scelta); blocco lasciato visibile */
.sa-cart .payment-method-btn {
	border: 1px solid var(--sa-line); border-radius: 0; padding: 14px 12px; margin-bottom: 8px;
	background: #fff; color: var(--sa-ink); font: 600 12px/1.3 var(--sa-font); letter-spacing: .12em; text-transform: uppercase;
	display: flex; align-items: center; justify-content: center; gap: 8px; transition: border-color .2s, background .2s;
}
.sa-cart .payment-method-btn small { font: 400 12px/1 var(--sa-font); letter-spacing: 0; text-transform: none; color: var(--sa-gray); }
.sa-cart .payment-method-btn:hover { border: 1px solid var(--sa-ink); background: #fff; color: var(--sa-ink); }
.sa-cart .payment-method-btn.selected { border: 1px solid var(--sa-granata); background: var(--sa-surface); color: var(--sa-ink); }
.sa-cart .payment-method-btn .check-icon { color: var(--sa-granata); }
.sa-cart .CartTotCol > div[style*="font-size: 14px"] { font: 400 12px/1.5 var(--sa-font) !important; color: var(--sa-gray); }

.sa-cart .CartTotCol .OrderTotalRow {
	display: flex; align-items: baseline; justify-content: space-between; gap: 16px;
	margin: 20px 0 0 !important; padding: 20px 0 0 !important; border-top: 2px solid var(--sa-ink);
	font: 600 12px/1 var(--sa-font) !important; letter-spacing: .16em; text-transform: uppercase; color: var(--sa-ink);
}
.sa-cart .CartTotCol .OrderTotalRow > span:last-child { float: none !important; }
.sa-cart .CartTotCol #cartRecapTotal { float: none !important; font: 700 30px/1 var(--sa-font); letter-spacing: -.02em; text-transform: none; }
.sa-cart #cartCheckoutButton, .sa-cart #cartCheckoutButton.btn.btn-primary {
	display: block; width: 100%; height: 56px; margin: 20px 0 0 !important; padding: 0 16px !important;
	background: var(--sa-granata) !important; border: none; border-radius: 0; color: #fff !important;
	font: 600 13px/1 var(--sa-font) !important; letter-spacing: .16em; text-transform: uppercase; cursor: pointer;
}
.sa-cart #cartCheckoutButton:hover { background: var(--sa-granata-light) !important; }
.sa-cart #cartCheckoutButton.disabled, .sa-cart #cartCheckoutButton.disabled:hover { background: var(--sa-granata) !important; opacity: .35; cursor: default; }

@media (max-width: 991px) {
	.sa-cart #cartTitle { font-size: 32px; margin-bottom: 20px; }
	.sa-cart .OrderCol.CartTotCol { margin-top: 32px; padding: 24px 20px !important; }
	.sa-cart .OrderCartRow .cartItemImgContainer { width: 96px !important; flex-basis: 96px; }
}

.shippingInfos .select2-container, .shippingInfos input[type=text], .shippingInfos textarea {
    border-radius: 0px !important;
}

/* =============================================================================
   SA27.01 - Pagina dell'ordine (order.php, /it/ordini/<numero>; Jordan, 14/09/2026).
   La colonna ha le classi sa-scope sa-cart sa-page--order: riusa le regole del passo 3
   (#Items_OrderRow, .OrderCartRow, .CartTotCol). Qui il resto: contenitore, titolo,
   avvisi, stato, pulsante PayPal, annullamento, sezioni a soffietto.
   ========================================================================== */
#MainContainerContent.sa-page--order {
	max-width: var(--sa-container); margin: 0 auto;
	padding: 28px var(--sa-gutter) 72px !important; float: none; width: 100%;
	font-family: var(--sa-font); color: var(--sa-ink);
}
.sa-cart .OrderSection { margin-bottom: 40px; }
.sa-cart .pageTitleContainer { margin: 0 0 6px; padding: 0; border: none; }
.sa-cart .pageTitle.OrderTitle { font: 700 34px/1.1 var(--sa-font); letter-spacing: -.02em; text-transform: uppercase; color: var(--sa-ink); border: none; padding: 0; }
.sa-cart .pageTitle.OrderTitle b { font-weight: 700; }
.sa-cart .OrderSection > div[style*="font-size: 12px"] { font: 400 13px/1.5 var(--sa-font) !important; color: var(--sa-gray); }
.sa-cart .OrderSection > .d-flex { gap: 4px; margin: 4px 0 20px; flex-wrap: wrap; }
.sa-cart .OrderSection > .d-flex > div { margin: 0 !important; font-size: 12px !important; }
.sa-cart .OrderSection > .d-flex a.link {
	font: 600 11px/1 var(--sa-font) !important; letter-spacing: .14em; text-transform: uppercase;
	color: var(--sa-ink) !important; text-decoration: none !important; border-bottom: 1px solid var(--sa-ink); padding-bottom: 3px;
}
.sa-cart .OrderSection > .d-flex a.link:hover { color: var(--sa-granata) !important; border-bottom-color: var(--sa-granata); }

/* avvisi (articoli bloccati, offerte in scadenza, ordine pagato) */
.sa-cart .CartListCol .alert { border-radius: 0; border: 1px solid var(--sa-line); background: var(--sa-surface); color: var(--sa-ink); font: 400 13px/1.6 var(--sa-font); padding: 14px 16px; margin-bottom: 8px; }
.sa-cart .CartListCol .alert-success { border-color: var(--sa-line); background: var(--sa-surface); }

/* righe: la prima riga ha la linea sopra come nel passo 3, l'ultima non ha bordo doppio */
.sa-cart .OrderCartRow.row:last-child { border-bottom: 1px solid var(--sa-line) !important; }
.sa-cart .OrderCartRow[data-type="2"] .cartItemImgContainer { display: none; }
.sa-cart .OrderCartRow[data-type="2"] .cartItemTextContainer, .sa-cart .OrderCartRow[data-type="5"] .cartItemTextContainer { padding-left: 164px; }

/* riquadro dei totali (stessa cornice del passo 3) */
.sa-cart .OrderCol.CartTotCol { text-align: left !important; font: 400 14px/1.7 var(--sa-font); }
.sa-cart .OrderCol.CartTotCol > div { text-align: left; }
.sa-cart .OrderCol.CartTotCol .OrderTitle.OrderTotalRow {
	margin: 16px 0 0 !important; padding: 16px 0 0 !important; border: none !important; border-top: 2px solid var(--sa-ink) !important;
	display: block; font: 400 14px/1.6 var(--sa-font) !important; letter-spacing: 0; text-transform: none;
}
.sa-cart .OrderCol.CartTotCol .OrderTotalRow > .col-xs-12 { padding: 0 0 10px; }
.sa-cart .OrderCol.CartTotCol .OrderTotalRow b { display: block; font: 700 26px/1.1 var(--sa-font); letter-spacing: -.02em; }
.sa-cart .OrderCol.CartTotCol .payment-status-label {
	display: inline-block; margin: 6px 0 4px; padding: 6px 10px;
	font: 600 11px/1.5 var(--sa-font); letter-spacing: .14em; text-transform: uppercase;
	background: var(--sa-surface); border-left: 3px solid currentColor;
}
.sa-cart .OrderCol.CartTotCol .payment-status-label span { font: 400 12px/1.4 var(--sa-font) !important; letter-spacing: 0; text-transform: none; color: var(--sa-gray); }

/* "Paga con PayPal" = unico metodo: e' l'azione principale della pagina */
.sa-cart .payment-methods-container > div[class$="-box"] { margin-top: 16px !important; }
.sa-cart #auth_submit, .sa-cart #bancasella_button, .sa-cart #contrassegno_button, .sa-cart #bonifico_button, .sa-cart #ritiro_button {
	display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; height: 56px; margin: 0 !important;
	padding: 0 16px !important; border: none !important; border-radius: 0 !important;
	background: var(--sa-granata) !important; color: #fff !important;
	font: 600 13px/1 var(--sa-font) !important; letter-spacing: .16em; text-transform: uppercase; cursor: pointer;
}
.sa-cart #auth_submit:hover { background: var(--sa-granata-light) !important; border-color: var(--sa-granata-light) !important; color: #fff !important; }
.sa-cart #auth_submit img { height: 18px !important; filter: brightness(0) invert(1); }
.sa-cart #bancasella_button, .sa-cart #contrassegno_button, .sa-cart #bonifico_button, .sa-cart #ritiro_button {
	background: #fff !important; color: var(--sa-ink) !important; border: 1px solid var(--sa-ink) !important;
}

/* annullamento: link discreto, campo e pulsante squadrati */
.sa-cart #cancelOrderLink { font: 500 12px/1 var(--sa-font) !important; color: var(--sa-gray) !important; text-decoration: none !important; border-bottom: 1px solid var(--sa-line); display: inline-block !important; padding-bottom: 2px; margin-top: 18px !important; }
.sa-cart #cancelOrderLink:hover { color: var(--sa-ink) !important; border-bottom-color: var(--sa-ink); }
.sa-cart #cancelOrderTextarea { margin-top: 20px !important; }
.sa-cart #cancelOrderTextarea textarea.form-control { border: 1px solid var(--sa-line); border-radius: 0 !important; box-shadow: none; font: 400 14px/1.5 var(--sa-font); padding: 12px; resize: vertical; }
.sa-cart #cancelOrderTextarea textarea.form-control:focus { border-color: var(--sa-ink); }
.sa-cart #cancelOrderConfirmBtn, .sa-cart #cancelOrderConfirmBtn.btn.btn-primary {
	display: block; width: 100%; height: 48px; margin: 12px 0 0; padding: 0 16px !important; line-height: 46px;
	background: #fff !important; border: 1px solid var(--sa-ink); border-radius: 0 !important; color: var(--sa-ink) !important;
	font: 600 12px/46px var(--sa-font) !important; letter-spacing: .14em; text-transform: uppercase; text-align: center; cursor: pointer;
}
.sa-cart #cancelOrderConfirmBtn:hover { background: var(--sa-ink) !important; color: #fff !important; }
.sa-cart #cancelOrderTextarea > a { font: 400 12px/1 var(--sa-font) !important; color: var(--sa-gray) !important; text-decoration: none !important; border-bottom: 1px solid var(--sa-line); display: inline-block !important; margin-top: 14px !important; }
.sa-cart #cancelOrderResponseMessage { font: 400 13px/1.5 var(--sa-font); margin-top: 12px; }

/* sezioni sotto (cronologia stato, spedizione, acquirente, fatturazione) */
.sa-cart .OrderSection .OrderTitle:not(.pageTitle):not(.OrderTotalRow) {
	margin: 0 0 12px; padding: 0 0 12px; border: none; border-bottom: 1px solid var(--sa-ink);
	font: 600 12px/1 var(--sa-font); letter-spacing: .16em; text-transform: uppercase; color: var(--sa-ink);
}
.sa-cart .OrderSection .OrderTitle b { font-weight: 600; }
.sa-cart .OrderSection .OrderTitleToggle { cursor: pointer; display: flex; align-items: center; gap: 10px; }
.sa-cart .OrderSection .OrderTitleToggle .fa-chevron { font-size: 11px; color: var(--sa-gray); margin: 0; }
.sa-cart .OrderSection .OrderRow { padding: 0; margin: 0; }
.sa-cart .OrderSection .OrderRow .OrderCol.CartListCol { width: auto !important; max-width: none !important; float: none; padding: 0; font: 400 14px/1.7 var(--sa-font); color: var(--sa-ink); }
.sa-cart .OrderRowHidden .OrderCol { background: var(--sa-surface); margin: 0 !important; width: auto !important; padding: 16px 20px !important; }
.sa-cart .OrderSection .OrderRow[style*="margin-bottom: 5px"] { padding: 10px 0 !important; border-bottom: 1px solid var(--sa-line); }

@media (max-width: 991px) {
	#MainContainerContent.sa-page--order { padding: 16px 20px 48px !important; }
	.sa-cart .pageTitle.OrderTitle { font-size: 24px; }
	.sa-cart .OrderCartRow[data-type="2"] .cartItemTextContainer, .sa-cart .OrderCartRow[data-type="5"] .cartItemTextContainer { padding-left: 0; }
}

/* =============================================================================
   SA27.01 - "I miei ordini" (orders.php, /it/ordini; Jordan, 14/09/2026).
   Stesso linguaggio del carrello e dei preferiti: testata con conteggio, righe con
   la linea sopra e le linee sottili, etichette maiuscole spaziate, stato con il
   pallino del colore del CMS, "Vedi dettagli" come pulsante secondario. Nel profilo
   (account.php) il blocco vive senza .sa-page: stesse regole, titolo di secondo livello.
   ========================================================================== */
.sa-orders { font-family: var(--sa-font); color: var(--sa-ink); }
.sa-orders .sa-page__head .sa-h2 { margin: 0; }
.sa-orders__list { border-top: 1px solid var(--sa-ink); }
.sa-order {
	display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1.3fr) 150px 180px;
	gap: 24px 32px; align-items: center;
	padding: 26px 0; border-bottom: 1px solid var(--sa-line);
}
.sa-order__num { display: block; font: 600 12px/1.4 var(--sa-font); letter-spacing: .14em; text-transform: uppercase; color: var(--sa-ink); }
.sa-order__num b { font-weight: 700; letter-spacing: .02em; }
.sa-order__date { display: block; margin-top: 4px; font: 400 13px/1.5 var(--sa-font); color: var(--sa-gray); }
.sa-order__status {
	display: inline-flex; align-items: center; gap: 8px; margin-top: 12px; padding: 6px 10px;
	background: var(--sa-surface); font: 600 11px/1.4 var(--sa-font); letter-spacing: .12em; text-transform: uppercase; color: var(--sa-ink);
}
.sa-order__status::before { content: ""; width: 8px; height: 8px; border-radius: 50%; flex: 0 0 auto; background: var(--sa-status, var(--sa-gray)); }
.sa-order__status small { font: 400 12px/1 var(--sa-font); letter-spacing: 0; text-transform: none; color: var(--sa-gray); }
.sa-order__label { display: block; margin-bottom: 6px; font: 600 11px/1 var(--sa-font); letter-spacing: .16em; text-transform: uppercase; color: var(--sa-gray); }
.sa-order__items { font: 400 14px/1.7 var(--sa-font); color: var(--sa-ink); }
.sa-order__total { text-align: right; }
.sa-order__total b { display: block; font: 700 22px/1.1 var(--sa-font); letter-spacing: -.02em; color: var(--sa-ink); }
.sa-order__actions { text-align: right; }
.sa-order__actions .sa-btn { height: 48px; padding: 0 22px; font-size: 12px; white-space: nowrap; }
@media (max-width: 991px) {
	.sa-order { grid-template-columns: minmax(0, 1fr) auto; gap: 18px 24px; }
	.sa-order__meta, .sa-order__items { grid-column: 1 / -1; }
	.sa-order__total { text-align: left; }
}
@media (max-width: 575px) {
	.sa-order { grid-template-columns: 1fr; gap: 14px; padding: 22px 0; }
	.sa-order__actions { text-align: left; }
	.sa-order__actions .sa-btn { width: 100%; }
}
#searchLightBox .searchButton:hover {
    color: #FFF !important;
}

/* =============================================================================
   SA27.01 - Pagina di ricerca (search.php, /it/cerca/<testo>; Jordan, 14/09/2026).
   Stessa testata dei preferiti (titolo con il testo cercato + conteggio) e griglia
   a 4 colonne; senza risultati lo stato vuoto .sa-empty gia' definito sopra.
   ========================================================================== */
.sa-search .sa-page__head .sa-h1 { overflow-wrap: anywhere; }
.sa-search .sa-search__list .listingArea.row { margin-top: 0; }
@media (min-width: 1200px) { .sa-search .listingArea.row > .itemBox.col-md-4 { width: 25%; flex: 0 0 25%; max-width: 25%; } }
.sa-search .sa-search__list .noResultsText { font: 400 15px/1.6 var(--sa-font); color: var(--sa-gray); }

/* =============================================================================
   SA27.01 - Pagine del CMS (content.php: condizioni di vendita, cookie policy, privacy,
   resi; Jordan, 14/09/2026). Contenitore .sa-page, titolo come le altre pagine interne,
   corpo su una misura leggibile con la tipografia del sito.
   ========================================================================== */
/* main.min.css: #contentDetails{max-width:1440px;margin:auto;padding:0} vince sulla classe: qui l'id */
#contentDetails.sa-content { max-width: var(--sa-container); margin: 0 auto; padding: 28px var(--sa-gutter) 72px; }
.sa-content .sa-content__head { margin-bottom: 32px; padding-bottom: 20px; border-bottom: 1px solid var(--sa-ink); }
.sa-content .sa-content__head .sa-h1 { overflow-wrap: anywhere; }
.sa-content .EventDates { margin: -20px 0 24px; font: 400 14px/1.5 var(--sa-font); color: var(--sa-gray); }
.sa-content__body { max-width: 960px; font: 400 16px/1.75 var(--sa-font); color: var(--sa-ink); }
.sa-content__body p { margin: 0 0 18px; font: inherit; color: inherit; }
.sa-content__body p:last-child { margin-bottom: 0; }
.sa-content__body b, .sa-content__body strong { font-weight: 700; color: var(--sa-ink); }
.sa-content__body h1, .sa-content__body h2, .sa-content__body h3, .sa-content__body h4 {
	margin: 36px 0 12px; font-family: var(--sa-font); font-weight: 700; color: var(--sa-ink); text-transform: uppercase; letter-spacing: -.01em;
}
.sa-content__body h1 { font-size: 26px; line-height: 1.15; }
.sa-content__body h2 { font-size: 22px; line-height: 1.2; }
.sa-content__body h3, .sa-content__body h4 { font-size: 17px; line-height: 1.3; }
.sa-content__body ul, .sa-content__body ol { margin: 0 0 18px; padding-left: 22px; }
.sa-content__body li { margin-bottom: 6px; }
.sa-content__body a { color: var(--sa-granata); text-decoration: underline; text-underline-offset: 3px; overflow-wrap: anywhere; }
.sa-content__body a:hover { color: var(--sa-ink); }
.sa-content__body img { max-width: 100%; height: auto; }
.sa-content__body table { width: 100%; max-width: 100%; margin: 0 0 18px; border-collapse: collapse; font-size: 14px; }
.sa-content__body table td, .sa-content__body table th { padding: 10px 12px; border: 1px solid var(--sa-line); vertical-align: top; }
.sa-content__body table th { background: var(--sa-surface); font-weight: 600; text-align: left; }
.sa-content__body .attachments_row { display: flex; align-items: center; gap: 10px; margin-top: 12px; font-size: 14px; }
.sa-content__body .attachments_row .docImg { color: var(--sa-granata); }
@media (max-width: 767px) {
	#contentDetails.sa-content { padding: 16px 20px 48px; }
	.sa-content .sa-content__head { margin-bottom: 24px; padding-bottom: 16px; }
	.sa-content .sa-content__head .sa-h1 { font-size: 30px; }
	.sa-content__body { font-size: 15px; line-height: 1.7; }
	.sa-content__body h1 { font-size: 22px; }
	.sa-content__body h2 { font-size: 19px; }
	.sa-content__body h3, .sa-content__body h4 { font-size: 16px; }
	.sa-content__body table { display: block; overflow-x: auto; }
}

/* =============================================================================
   SA27.01 - Profilo (account.php, /it/profilo; Jordan, 15/09/2026). Contenitore .sa-page,
   titolo come le altre pagine interne; i blocchi dei dati personali e degli indirizzi
   (accountUserData.php, accountAddressBoxes.php) e i moduli di modifica (editAccountArea.php)
   arrivano via AJAX con il markup storico: qui solo il vestito, con l'id perche' main.min.css
   usa "#accountArea .accountBox ...".
   ========================================================================== */
#accountArea.sa-account { margin-bottom: 0; }
.sa-account .sa-page__head { margin-bottom: 36px; }
.sa-account__section { margin-bottom: 48px; }
.sa-account__sechead {
	display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap;
	margin: 0 0 20px; padding-bottom: 16px; border-bottom: 1px solid var(--sa-ink);
}
.sa-account__sechead .sa-h2 { margin: 0; }
.sa-account .newAccountAddressButton.sa-btn {
	float: none; height: 44px; padding: 0 22px !important; font-size: 12px !important;
	text-decoration: none !important; cursor: pointer;
}
.sa-account .sa-orders .sa-page__head { margin: 0 0 20px; padding-bottom: 16px; border-bottom: 1px solid var(--sa-ink); }

/* scatole: bordo sottile, niente ombra, titolo maiuscolo spaziato con le icone a destra */
#accountArea.sa-account .accountBox {
	background: #fff; border: 1px solid var(--sa-line) !important; border-radius: 0 !important; box-shadow: none !important;
	font-family: var(--sa-font); color: var(--sa-ink);
}
#accountArea.sa-account .accountBox .accountBoxTitle {
	display: flex; align-items: center; gap: 14px;
	padding: 16px 20px !important; background: var(--sa-surface) !important; color: var(--sa-ink) !important;
	border-bottom: 1px solid var(--sa-line) !important;
	font: 600 12px/1.3 var(--sa-font) !important; letter-spacing: .14em; text-transform: uppercase;
}
#accountArea.sa-account .accountBox .accountBoxTitle .AddressLabel { margin: 0; font-weight: 700; }
#accountArea.sa-account .accountBox .accountBoxTitle .defaultAddressButton {
	display: inline-flex; align-items: center; gap: 6px; margin: 0;
	font: 500 11px/1 var(--sa-font); letter-spacing: .08em; text-transform: uppercase; color: var(--sa-gray); cursor: pointer;
}
#accountArea.sa-account .accountBox .accountBoxTitle .defaultAddressButton .fa { margin: 0; color: var(--sa-granata); font-size: 15px; }
#accountArea.sa-account .accountBox .accountBoxTitle .defaultAddressButton:hover { color: var(--sa-ink); }
#accountArea.sa-account .accountBox a.editAccountBoxButton { float: none; margin: 0 0 0 auto; line-height: 0; cursor: pointer; }
#accountArea.sa-account .accountBox a.editAccountBoxButton + a.editAccountBoxButton { margin-left: 0; }
#accountArea.sa-account .accountBox a.editAccountBoxButton .fa { color: var(--sa-ink) !important; font-size: 15px; }
#accountArea.sa-account .accountBox a.editAccountBoxButton:hover .fa { color: var(--sa-granata) !important; }

#accountArea.sa-account .accountBox .accountBoxContent { padding: 22px 20px 6px !important; margin: 0; }
#accountArea.sa-account .accountBox .accountBoxContent > .col-xs-12 {
	padding: 0 16px 18px 0 !important; margin: 0 !important; float: none;
	font: 400 15px/1.5 var(--sa-font); color: var(--sa-ink); overflow-wrap: anywhere;
}
#accountArea.sa-account .accountBox .accountBoxContent > .col-xs-12 > b {
	display: block; margin-bottom: 4px;
	font: 600 11px/1 var(--sa-font); letter-spacing: .16em; text-transform: uppercase; color: var(--sa-gray);
}
#accountArea.sa-account .accountBox .accountBoxContent > .col-xs-12 > br { display: none; }
#accountArea.sa-account .accountBox .accountBoxContent a.link {
	font: 600 12px/1 var(--sa-font); letter-spacing: .14em; text-transform: uppercase;
	color: var(--sa-ink); text-decoration: none; border-bottom: 1px solid var(--sa-ink); padding-bottom: 3px;
}
#accountArea.sa-account .accountBox .accountBoxContent a.link:hover { color: var(--sa-granata); border-bottom-color: var(--sa-granata); text-decoration: none; }
#accountArea.sa-account .accountBox .accountBoxContent.row + .accountBoxContent.row { padding-top: 0 !important; margin-top: -4px; }

/* indirizzi: griglia a due colonne */
#accountArea.sa-account #AddressBoxesContainer { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
#accountArea.sa-account .accountBox.addressBox { width: auto; display: block; margin: 0; }

/* moduli di modifica (dati personali, indirizzo): stessa colonna di lettura del sito */
.sa-account .accountAreaForm { width: 100%; max-width: 640px; margin: 0; font-family: var(--sa-font); color: var(--sa-ink); }
.sa-account .accountAreaForm > div:first-child { margin-bottom: 20px !important; }
.sa-account .accountAreaForm > div:first-child a.link {
	font: 600 11px/1 var(--sa-font); letter-spacing: .14em; text-transform: uppercase;
	color: var(--sa-ink); text-decoration: none; border-bottom: 1px solid var(--sa-ink); padding-bottom: 3px;
}
.sa-account .accountAreaForm > div:first-child a.link:hover { color: var(--sa-granata); border-bottom-color: var(--sa-granata); text-decoration: none; }
.sa-account .accountAreaForm > div[style*="font-size: 20px"] {
	margin: 0 0 28px !important; padding-bottom: 16px; border-bottom: 1px solid var(--sa-ink);
	font: 700 26px/1.1 var(--sa-font) !important; letter-spacing: -.01em; text-transform: uppercase;
}
.sa-account .accountAreaFormRow { padding: 0; margin: 0 0 20px; }
.sa-account .accountAreaFormLabel { margin-bottom: 8px; font: 600 11px/1.3 var(--sa-font); letter-spacing: .16em; text-transform: uppercase; color: var(--sa-ink); }
.sa-account .accountAreaFormLabel > div { margin-top: 4px; font: 400 12px/1.4 var(--sa-font) !important; letter-spacing: 0; text-transform: none; color: var(--sa-gray) !important; }
.sa-account .accountAreaFormField .form-control,
.sa-account .accountAreaFormField input[type="text"], .sa-account .accountAreaFormField input[type="date"], .sa-account .accountAreaFormField input[type="email"] {
	height: 48px; padding: 0 14px; border: 1px solid var(--sa-line); border-radius: 0; box-shadow: none;
	background: #fff; font: 400 15px/1.3 var(--sa-font); color: var(--sa-ink);
}
.sa-account .accountAreaFormField .form-control:focus { border-color: var(--sa-ink); box-shadow: none; outline: none; }
.sa-account .accountAreaFormField textarea.form-control { height: auto; min-height: 96px; padding: 12px 14px; line-height: 1.5; }
.sa-account .accountAreaFormField select.form-control { height: 48px; }
.sa-account .accountAreaFormField .select2-container .select2-selection--single {
	height: 48px; border: 1px solid var(--sa-line); border-radius: 0; background: #fff;
}
.sa-account .accountAreaFormField .select2-container .select2-selection--single .select2-selection__rendered { line-height: 46px; padding-left: 14px; font: 400 15px/46px var(--sa-font); color: var(--sa-ink); }
.sa-account .accountAreaFormField .select2-container .select2-selection--single .select2-selection__arrow { height: 46px; right: 8px; }
.sa-account .accountAreaFormField .select2-container--focus .select2-selection--single, .sa-account .accountAreaFormField .select2-container--open .select2-selection--single { border-color: var(--sa-ink); }
.sa-account .accountAreaFormField .iti { width: 100%; }
.sa-account .accountAreaFormField span[id^="error"] { display: block; margin-top: 6px; font: 400 12px/1.4 var(--sa-font); }
.sa-account .accountAreaForm .btn.btn-primary {
	display: block; width: 100%; height: 52px; margin-top: 8px; padding: 0 16px;
	background: var(--sa-granata) !important; border: none; border-radius: 0 !important; color: #fff !important;
	font: 600 13px/1 var(--sa-font); letter-spacing: .16em; text-transform: uppercase; box-shadow: none;
}
.sa-account .accountAreaForm .btn.btn-primary:hover, .sa-account .accountAreaForm .btn.btn-primary:focus { background: var(--sa-granata-light) !important; }
.sa-account .accountAreaForm .btn.btn-primary[disabled] { opacity: .6; }

@media (max-width: 767px) {
	.sa-account .sa-page__head { margin-bottom: 24px; }
	.sa-account__section { margin-bottom: 36px; }
	#accountArea.sa-account #AddressBoxesContainer { grid-template-columns: 1fr; }
	#accountArea.sa-account .accountBox .accountBoxTitle { flex-wrap: wrap; padding: 14px 16px !important; }
	#accountArea.sa-account .accountBox .accountBoxContent { padding: 18px 16px 4px !important; }
	.sa-account .newAccountAddressButton.sa-btn { width: 100%; }
	.sa-account .accountAreaForm > div[style*="font-size: 20px"] { font-size: 22px !important; }
}

/* =============================================================================
   SA27.01 - Pagina non trovata (include/404.php; Jordan, 15/09/2026): stato vuoto 2B.
   main.min.css mette #PageNotFound in absolute al centro dello schermo: qui torna
   nel flusso, con il contenitore delle pagine interne.
   ========================================================================== */
#PageNotFound.sa-notfound {
	position: static; top: auto; left: auto; transform: none; max-width: var(--sa-container);
	font-size: inherit; color: var(--sa-ink); text-align: center;
}

/* =============================================================================
   SA27.01 - Paese, lingua e valuta nel footer (include/lang-selector.php nella barra
   legale; Jordan, 15/09/2026). Pillola con bordo sottile sul fondo scuro, le tre voci
   separate da un punto (main.min.css ne mostrava solo la prima); apre #CountrySettings.
   ========================================================================== */
.sa-footer__legal-inner { flex-wrap: wrap; }
.sa-footer__locale { flex: 0 0 auto; }
.sa-footer__locale .langSelectFooter {
	display: inline-flex; align-items: center; gap: 0; width: auto;
	margin: 0; padding: 0 12px 0 10px; height: 36px;
	background: transparent; border: 1px solid rgba(255,255,255,.28); border-radius: 0;
	color: #fff !important; font: 500 11px/1 var(--sa-font); letter-spacing: .1em; text-transform: uppercase; cursor: pointer; /* !important: la palette (riga ~874) fa granata ogni .langSelectFooter */
	transition: border-color .2s ease;
}
.sa-footer__locale .langSelectFooter:hover { border-color: #fff; }
.sa-footer__locale .langSelectFooterSection { display: inline-flex !important; align-items: center; gap: 8px; padding: 0; border: 0; }
.sa-footer__locale .langSelectFooterSection + .langSelectFooterSection::before { content: ""; width: 3px; height: 3px; border-radius: 50%; background: rgba(255,255,255,.45); margin: 0 10px; }
.sa-footer__locale .flag-icon { width: 18px; height: 13px; line-height: 13px; border-radius: 1px; }
.sa-footer__locale .langSelectFooter::after {
	content: ""; width: 6px; height: 6px; margin-left: 10px; flex: 0 0 auto;
	border-right: 1.5px solid rgba(255,255,255,.7); border-bottom: 1.5px solid rgba(255,255,255,.7); transform: translateY(-2px) rotate(45deg);
}
/* il lightbox #CountrySettings (footer.php) che il selettore apre: stesso vestito dei moduli del sito */
#CountrySettings .CountrySettingsSection > div:first-child {
	margin-bottom: 8px; font: 600 11px/1.3 var(--sa-font); letter-spacing: .16em; text-transform: uppercase; color: var(--sa-ink) !important;
}
#CountrySettings .select2-container .select2-selection--single { height: 48px; border: 1px solid var(--sa-line); border-radius: 0; }
#CountrySettings .select2-container .select2-selection--single .select2-selection__rendered { line-height: 46px; padding-left: 14px; font: 400 15px/46px var(--sa-font); color: var(--sa-ink); }
#CountrySettings .select2-container .select2-selection--single .select2-selection__arrow { height: 46px; right: 8px; }
#CountrySettings #CountrySettingsButton {
	width: 100%; height: 52px; border: none; border-radius: 0 !important;
	font: 600 13px/1 var(--sa-font); letter-spacing: .16em; text-transform: uppercase;
}
/* lingua unica (engine $ShowLanguageSelector = 0): nella pillola restano paese e valuta */
.sa-footer__locale--nolang .langSelectFooterSection:nth-child(2) { display: none !important; }
@media (max-width: 992px) {
	.sa-footer__locale { width: 100%; }
}

/* =============================================================================
   SA27.01 - Categoria senza prodotti (listing.php mette #saCatEmpty; Jordan 16/09/2026):
   niente pannello dei filtri, pulsante Filtri e ordinamento; il "Nessun risultato" della
   lista lascia il posto allo stato vuoto .sa-cat-empty, che nella griglia della pagina
   categoria prende tutta la riga.
   ========================================================================== */
#MainContainer:has(#saCatEmpty) > #mainFilter,
#MainContainer:has(#saCatEmpty) > .filter-wrapper,
#MainContainer:has(#saCatEmpty) > #overlay { display: none !important; }
#MainContainer:has(#saCatEmpty) #listingContainerContent .listingOrderSelect,
#MainContainer:has(#saCatEmpty) #listingContainerContent .noResultsText { display: none !important; }
#MainContainer:has(#saCatEmpty) .sa-cat-empty { grid-column: 1 / -1; padding: 24px 12px 48px; }
@media (min-width: 992px) {
	/* senza pannello la griglia a due colonne non serve: testata e stato vuoto a tutta larghezza */
	#MainContainer:has(#saCatEmpty) { display: block; }
	#MainContainer:has(#saCatEmpty) #listingContainerContent > .CategoryHeader { margin: 24px 0 0; }
}

/* =============================================================================
   SA27.01 - Limited edition a mosaico (index.php #saLimitedEdition, .sa-bento; Jordan
   17/09/2026). Griglia a 12 colonne su 2 righe: tessera di testo granata (5 colonne,
   come "Maglie match worn"), foto 1 verticale su due righe, foto 2 e 3 piccole, foto 4
   orizzontale sotto di loro. I segnaposto .sa-bento__ph spariscono quando al loro posto
   c'e' una <img> (engine $HomeLimitedImages). Sotto i 992px: testo a tutta larghezza,
   poi il mosaico su due colonne.
   ========================================================================== */
.sa-bento__grid {
	display: grid; gap: 16px;
	grid-template-columns: repeat(12, minmax(0, 1fr));
	grid-template-rows: repeat(2, 272px);
}
.sa-bento__text {
	grid-column: 1 / span 4; grid-row: 1 / span 2;
	display: flex; flex-direction: column; justify-content: center; gap: 22px;
	padding: 48px; background: var(--sa-granata); color: #fff;
}
.sa-bento__text .sa-eyebrow { color: rgba(255,255,255,.75); }
.sa-bento__text .sa-h1 { color: #fff; margin: 0; max-width: 420px; }
.sa-bento__text p { font: 400 15px/1.7 var(--sa-font); color: rgba(255,255,255,.72); margin: 0; max-width: 420px; }
.sa-bento__text .sa-btn { align-self: flex-start; }
.sa-bento__tile { position: relative; display: block; overflow: hidden; background: var(--sa-surface); text-decoration: none; }
.sa-bento__tile--tall  { grid-column: 5 / span 4; grid-row: 1 / span 2; }
.sa-bento__tile--small { grid-column: span 2; grid-row: 1; }
.sa-bento__tile--wide  { grid-column: 9 / span 4; grid-row: 2; }
.sa-bento__tile img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
.sa-bento__tile:hover img { transform: scale(1.04); }
/* segnaposto in attesa delle foto: fondo chiaro, bordo tratteggiato, etichetta con la misura consigliata */
.sa-bento__ph {
	position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px;
	border: 1px dashed var(--sa-line-strong); text-align: center; padding: 12px;
}
.sa-bento__ph b { font: 600 12px/1 var(--sa-font); letter-spacing: .16em; text-transform: uppercase; color: var(--sa-gray); }
.sa-bento__ph span { font: 400 11px/1.4 var(--sa-font); color: var(--sa-muted); }
@media (max-width: 992px) {
	.sa-bento__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: none; grid-auto-rows: minmax(180px, auto); gap: 12px; } /* le righe del testo crescono se serve */
	.sa-bento__text { grid-column: 1 / -1; grid-row: 1 / span 2; padding: 32px var(--sa-gutter); }
	.sa-bento__tile--tall  { grid-column: 1; grid-row: 3 / span 2; }
	.sa-bento__tile--small { grid-column: 2; grid-row: auto; }
	.sa-bento__tile--wide  { grid-column: 1 / -1; grid-row: auto; }
}

/* =============================================================================
   SA27.01 - Prodotti esauriti in lista e in scheda (engine $ProductList_ShowOnlyAvailable = 0;
   Jordan 17/09/2026). Card: foto attenuata, badge "Esaurito" bianco a contorno (quello grigio
   chiaro spariva sul fondo delle foto), nome in grigio; l'invito "Vai al prodotto" resta.
   Scheda: senza giacenza il contaquantita' non serve, il messaggio prende tutta la riga.
   ========================================================================== */
.sa-prodcard--soldout .sa-prodcard__media img { opacity: .55; }
.sa-prodcard--soldout .sa-prodcard__media .picNotFound img { opacity: .55; }
.sa-prodcard--soldout a.itemName.sa-prodcard__name { color: var(--sa-gray); }
.sa-prodcard--soldout.itemBox .itemPrice { color: var(--sa-gray); }
.sa-prodcard__badges .sa-badge--soldout { background: #fff; color: var(--sa-ink); border: 1px solid var(--sa-ink); padding: 7px 9px; }
.sa-pdp__buy--soldout .sa-qty { display: none; }
.sa-pdp__buy--soldout .sa-pdp__soldout { min-height: 56px; }

/* =============================================================================
   SA27.01 - Edizione numerata, contatore in scheda (product.php #saEdition; Jordan 17/09/2026):
   etichetta granata, "Ne restano N su 219" con il numero in evidenza e una barra sottile che
   scende con le vendite. A zero: "Edizione esaurita".
   ========================================================================== */
#ProductDetails .sa-edition { margin: 18px 0 0; padding: 0 0 22px; border-bottom: 1px solid var(--sa-line); }
#ProductDetails .sa-edition__row { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
#ProductDetails .sa-edition__label { font: 600 11px/1 var(--sa-font); letter-spacing: .16em; text-transform: uppercase; color: var(--sa-granata); }
#ProductDetails .sa-edition__count { font: 400 14px/1.3 var(--sa-font); color: var(--sa-gray); }
#ProductDetails .sa-edition__count b { font: 700 18px/1 var(--sa-font); color: var(--sa-ink); }
#ProductDetails .sa-edition__bar { height: 3px; margin-top: 10px; background: var(--sa-line); overflow: hidden; }
#ProductDetails .sa-edition__bar i { display: block; height: 100%; background: var(--sa-granata); transition: width .5s ease; }
#ProductDetails .sa-edition--out .sa-edition__count { font-weight: 600; color: var(--sa-granata); }

/* SA27.01 (Jordan 17/09/2026): "+" del carrello spento per le maglie dell'edizione limitata (una per tifoso) */
.sa-cart .cartQtyPlus--disabled, .sa-cart .cartQtyPlus--disabled:hover { color: var(--sa-muted); cursor: not-allowed; background: transparent !important; }