/*
 * Page Tarifs — [centre_laser_tarifs].
 * CSS minimal, au-dessus des classes UIkit (uk-list, uk-list-divider,
 * uk-subnav-pill, uk-grid, uk-button, uk-text-primary...) déjà chargées par
 * le thème YOOtheme — pas de réécriture de ce qu'UIkit fournit déjà.
 *
 * Ligne de soin : nom + prix à gauche, boutons à droite, tout en
 * uk-flex-wrap. Aucune media query nécessaire pour le responsive : les
 * blocs passent naturellement à la ligne quand la largeur manque (mobile),
 * sans jamais déborder.
 */

.clc-ta-page {
	--clc-ta-border: rgba(0, 0, 0, 0.08);
}

/* Sommaire — uk-subnav-pill (UIkit) pour un rendu "onglets" sobre, cohérent
   avec YOOtheme, plutôt qu'une liste de boutons ou un select. Retombe
   proprement sur plusieurs lignes quand la largeur manque (mobile, ou
   beaucoup de catégories) — comportement flex-wrap natif d'UIkit, on se
   contente de resserrer l'espacement vertical entre les lignes. */
.clc-ta-toc {
	margin-bottom: 32px;
}

.clc-ta-toc-list.uk-subnav {
	row-gap: 8px;
}

.clc-ta-toc-list a {
	white-space: nowrap;
}

/* Catégories */
.clc-ta-category {
	margin-bottom: 56px;
}

.clc-ta-category:last-child {
	margin-bottom: 0;
}

.clc-ta-category-title {
	margin-bottom: 4px;
	padding-bottom: 12px;
	border-bottom: 2px solid var(--clc-ta-border);
}

/* Sous-catégories : légèrement indentées et détachées visuellement du
   groupe de soins directs de la catégorie mère. */
.clc-ta-subcategory {
	margin: 20px 0 28px 16px;
	padding-left: 16px;
	border-left: 2px solid var(--clc-ta-border);
}

.clc-ta-subcategory:last-child {
	margin-bottom: 0;
}

.clc-ta-subcategory-title {
	font-size: 1rem;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	opacity: 0.75;
	margin-bottom: 8px;
}

/* Liste des soins */
.clc-ta-list {
	margin: 0;
}

.clc-ta-list > li.clc-ta-row {
	padding-top: 16px;
	padding-bottom: 16px;
	gap: 10px 24px;
}

.clc-ta-row-info {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 4px 14px;
	flex: 1 1 220px;
	min-width: 0;
}

.clc-ta-row-name {
	font-weight: 600;
}

/* Prix chiffré : lecture rapide prioritaire — gras, couleur primaire du
   thème (variable UIkit/YOOtheme via la classe utilitaire uk-text-primary,
   jamais une couleur codée en dur : un changement de couleur primaire dans
   le thème se répercute automatiquement ici), taille légèrement supérieure. */
.clc-ta-row-price {
	white-space: nowrap;
}

.clc-ta-row-price--value {
	font-size: 1.08em;
}

/* Texte de repli (pas de prix WooCommerce renseigné) : identifiable mais
   nettement plus discret qu'un prix chiffré (uk-text-muted, taille normale,
   italique, sans emphase de couleur). */
.clc-ta-row-price--text {
	font-style: italic;
	font-weight: 400;
	white-space: normal;
}

.clc-ta-row-actions {
	flex: 0 0 auto;
}

/* Espacement entre "Voir le soin" et "Prendre rendez-vous" : géré par
   uk-grid-small (gouttière native UIkit, cf. markup) plutôt qu'une marge
   CSS ad hoc — reste cohérent si le thème change ses variables d'espacement.
   Les deux boutons passent naturellement l'un sous l'autre si la largeur
   manque (comportement natif de uk-grid). */
.clc-ta-btn-view,
.clc-ta-btn-book {
	white-space: nowrap;
}