/**
 * Fiche technique de la fiche produit (cf. inc/fiche-technique.php).
 *
 * Tableau à deux colonnes, lignes alternées, sans bordure : l'information se lit
 * en diagonale sans que la grille prenne le pas sur le contenu. Les fonds et le
 * texte des libellés sont des dilutions du bleu marine de marque #0b1c36, pas
 * des gris neutres, et le rayon de 4 px reprend celui du bouton d'achat. Le
 * bouton + / − de l'accordéon est celui du site, il n'est pas retouché.
 *
 * L'accordéon masque ses enfants par `height: 0`, la mise en page ne touche
 * donc pas à la hauteur.
 */

/*
 * Le repli de l'accordéon est porté par le thème, mais sa règle ne vise que
 * `ul` et `p` (assets/css/style.css) : un tableau resterait donc toujours
 * ouvert et le clic n'aurait aucun effet visible. La même mécanique, hauteur
 * nulle puis auto, est reprise ici pour le conteneur du tableau. La marge
 * haute n'existe qu'à l'état ouvert, sinon elle laisse un blanc de 10 px sous
 * un titre replié.
 */
.sous-cta-accordion-item .glow-fiche {
	height: 0;
	overflow: hidden;
	margin: 0;
	font-size: 14px;
	border-radius: 4px;
}

.sous-cta-accordion-item.item-active .glow-fiche {
	height: auto;
	margin-top: 10px;
}

.sous-cta-accordion-item .glow-fiche__table {
	width: 100%;
	margin: 0;
	border: none;
	border-collapse: collapse;
	table-layout: fixed;
}

.sous-cta-accordion-item .glow-fiche__table tr {
	border: none;
}

.sous-cta-accordion-item .glow-fiche__table tr:nth-child(odd) {
	background-color: rgba(11, 28, 54, 0.05);
}

.sous-cta-accordion-item .glow-fiche__table th,
.sous-cta-accordion-item .glow-fiche__table td {
	padding: 11px 16px;
	border: none;
	line-height: 1.45;
	vertical-align: top;
	text-align: left;
}

.sous-cta-accordion-item .glow-fiche__table th {
	width: 42%;
	font-weight: 400;
	color: #5d6a80;
	white-space: normal;
}

.sous-cta-accordion-item .glow-fiche__table td {
	font-weight: 500;
	color: #1e1e1e;
	word-break: break-word;
}

@media only screen and (max-width: 767px) {
	.sous-cta-accordion-item .glow-fiche {
		font-size: 13.5px;
	}

	.sous-cta-accordion-item .glow-fiche__table th {
		width: 46%;
	}

	.sous-cta-accordion-item .glow-fiche__table th,
	.sous-cta-accordion-item .glow-fiche__table td {
		padding: 10px 12px;
	}
}

/* ---------------------------------------------------------------
   Bloc « Description » (cf. inc/description-produit.php)
   ---------------------------------------------------------------
   Le texte est mis au même cadre que le tableau de la fiche technique et la
   liste des livraisons : panneau blanc, filet en dilution du marine, rayon
   4 px. Le retrait et le filet n'existent qu'à l'état ouvert, sinon la règle
   `height: 0` du thème laisserait une bande bordée sous le titre replié.

   La mesure est bornée à 68 caractères : sur grand écran, une ligne de 1 100 px
   se lit mal, et le bloc se retrouvait deux fois plus large que les deux
   autres. L'emphase passe au marine de marque, pour que le nom du produit
   ressorte comme une intention et non comme du gras isolé. */

.sous-cta-accordion-item p.glow-description {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 14.5px;
	line-height: 1.62;
	color: #333;
	max-width: 68ch;
}

.sous-cta-accordion-item.item-active p.glow-description {
	margin-top: 10px;
	padding: 14px 16px;
	border: 1px solid rgba(11, 28, 54, 0.09);
	border-radius: 4px;
}

.sous-cta-accordion-item p.glow-description strong,
.sous-cta-accordion-item p.glow-description b {
	font-weight: 600;
	color: #0b1c36;
}

@media only screen and (max-width: 767px) {
	.sous-cta-accordion-item p.glow-description {
		font-size: 14px;
		line-height: 1.6;
	}

	.sous-cta-accordion-item.item-active p.glow-description {
		padding: 12px 13px;
	}
}

/* ---------------------------------------------------------------
   Bouton de notice (cf. inc/notice-produit.php)
   ---------------------------------------------------------------
   Secondaire : contour marine sur fond blanc, quand le bouton d'achat est un
   aplat marine. Même rayon de 4 px et même graisse que lui, pour qu'ils se
   lisent comme deux boutons de la même famille. */

a.glow-notice {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 9px;
	width: 100%;
	margin: 18px 0 0;
	padding: 12px 16px;
	border: 1px solid rgba(11, 28, 54, 0.35);
	border-radius: 4px;
	background-color: #fff;
	color: #0b1c36;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.6px;
	line-height: 1.2;
	text-transform: uppercase;
	text-decoration: none;
	transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

a.glow-notice:hover,
a.glow-notice:focus {
	background-color: #0b1c36;
	border-color: #0b1c36;
	color: #fff;
	text-decoration: none;
}

a.glow-notice:focus-visible {
	outline: 2px solid #0b1c36;
	outline-offset: 2px;
}

.glow-notice__icone {
	flex: 0 0 auto;
}

@media only screen and (max-width: 767px) {
	a.glow-notice {
		padding: 11px 14px;
		letter-spacing: 0.4px;
	}
}