/* Selector de seu i grup a la fitxa (botons de Variation Swatches).
   El botó triat, ple de morat perquè es vegi què has triat (Andrea, 6/10).
   La mida, la vora i amagar opcions es controlen des dels ajustos del plugin. */
.variations_form .cfvsw-label-option {
	padding: 8px 16px;
	font-weight: 500;
	transition: background-color .15s, color .15s;
}
.variations_form .cfvsw-swatches-option.cfvsw-label-option.cfvsw-selected-swatch {
	background: var(--passa-purple, #4c1b69);
	color: #fff;
}
.variations_form table.variations th.label label {
	font-size: 16px;
}
/* Grups amagats fins que es tria la seu. La classe la posa selector-seu.js:
   si el JS falla, es veu tot. */
.variations_form.passa-sense-seu table.variations tr + tr {
	display: none;
}
/* La fila de la seu no s'amaga mai: s'ha de poder canviar de seu sense «Neteja». */
.variations_form table.variations tr:first-child .cfvsw-swatches-option.cfvsw-swatches-hide,
.variations_form table.variations tr:first-child .cfvsw-swatches-option.cfvsw-swatches-hide-disable {
	display: flex;
}

/* 22/10 · Tecnificació: botons de sessions (Andrea a la reunió: «més net, sense parèntesis, botó no gegant, destacar
   el de 3 sessions»; Eric: «una mica més grans, no gaire», el de 3 marcat d'entrada). Només l'atribut «sessions».
   Receta: /opt/pasarela-dev/eines/productes/sessions-tecni/ */
.variations_form .cfvsw-swatches-container[swatches-attr="attribute_sessions"] {
	display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; padding-top: 12px;
}
.variations_form .cfvsw-swatches-container[swatches-attr="attribute_sessions"] .cfvsw-swatches-option {
	position: relative; margin: 0; min-height: 60px !important; padding: 10px 8px;
	display: flex; align-items: center; justify-content: center; text-align: center;
	border: 1px solid #d9cfe6; background: #fff; font-size: 16px; line-height: 1.25;
}
.variations_form .cfvsw-swatches-container[swatches-attr="attribute_sessions"] .cfvsw-swatches-option:hover { border-color: var(--passa-purple, #4c1b69); }
.variations_form .cfvsw-swatches-container[swatches-attr="attribute_sessions"] .cfvsw-swatch-inner { display: flex; flex-direction: column; gap: 2px; font-weight: 600; }
.cfvsw-swatches-container[swatches-attr="attribute_sessions"] .passa-ses-preu { font-size: 14px; font-weight: 500; opacity: .85; }
.cfvsw-swatches-container[swatches-attr="attribute_sessions"] .passa-ses-preu del { opacity: .7; margin-left: 4px; font-weight: 400; }
/* Fora el «(estalvies 15 €)» de fitxa-curs.css (5/10): ara ho diuen l'etiqueta i el preu ratllat. */
.cfvsw-swatches-container[swatches-attr="attribute_sessions"] .cfvsw-swatches-option[data-slug="3 sessions"] .cfvsw-swatch-inner::after { content: none; }
/* «Millor preu»: mostassa amb text morat fosc (la mostassa sobre blanc no es llegeix: CLAUDE.md). Sense JS també surt. */
.cfvsw-swatches-container[swatches-attr="attribute_sessions"] .cfvsw-swatches-option[data-slug="3 sessions"]::before {
	content: "Millor preu"; position: absolute; top: -11px; left: 50%; transform: translateX(-50%); white-space: nowrap;
	background: var(--passa-mustard, #E6A528); color: var(--passa-purple-dark, #2a0e3a);
	font-size: 11px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; padding: 3px 9px; border-radius: 999px;
}
html[lang^="es"] .cfvsw-swatches-container[swatches-attr="attribute_sessions"] .cfvsw-swatches-option[data-slug="3 sessions"]::before { content: "Mejor precio"; }
@media (max-width: 420px) {
	.variations_form .cfvsw-swatches-container[swatches-attr="attribute_sessions"] { gap: 8px; }
	.variations_form .cfvsw-swatches-container[swatches-attr="attribute_sessions"] .cfvsw-swatches-option { font-size: 15px; padding: 10px 4px; }
	.cfvsw-swatches-container[swatches-attr="attribute_sessions"] .passa-ses-preu { font-size: 13px; }
}
/* 22/10 · el triat, morat (si no, el fons blanc d'aquí dalt li guanya i el text blanc no es veu) */
.variations_form .cfvsw-swatches-container[swatches-attr="attribute_sessions"] .cfvsw-swatches-option.cfvsw-selected-swatch {
	background: var(--passa-purple, #4c1b69); border-color: var(--passa-purple, #4c1b69); color: #fff;
}
/* que la fila de botons ocupi tota l'amplada de la fitxa */
.variations_form table.variations:has([swatches-attr="attribute_sessions"]),
.variations_form table.variations:has([swatches-attr="attribute_sessions"]) tbody,
.variations_form table.variations:has([swatches-attr="attribute_sessions"]) tr,
.variations_form table.variations:has([swatches-attr="attribute_sessions"]) td.value { display: block; width: 100%; }
.variations_form .cfvsw-swatches-container[swatches-attr="attribute_sessions"] { width: 100%; float: none; }
