/*
Theme Name:   Ekdotis — Ormara
Template:     ekdotis
Author:       Sitedit
Description:  Thème enfant de la Librairie ancienne Ormara, dupliqué d'ekdotis-client (CDC § 21). Il ne porte que ce que l'écran ne peut pas porter : la paire « Siècle / Siècles », des auteurs sans pages, un menu sans greffe, des notices sans image, l'accueil par siècle, le pied en trois colonnes et l'habillage de librairie ancienne. Source hors dépôt : import-recette\ormara-montage\theme\.
Version:      1.3.0
Requires PHP: 8.1
License:      GPL-2.0-or-later
Text Domain:  ekdotis-ormara
*/

/*
 * Habillage d'Ormara (session 2, 3 novembre 2026), direction Classique.
 *
 * LES COULEURS : la page en #FAF7F0 (`couleur_fond_page`), les bandeaux —
 * en-tête, pied, tête de fiche — en #F3EDE0 (`surface-alt` de la palette
 * « ormara ») ; l'encre, les titres, le menu et les liens en vert #1E3A2F
 * (l'accent de la palette est ce vert) ; l'or #7F682C seulement pour les
 * filets, les fleurons et le prix. Contrastes au journal de montage.
 */
:root {
	--ormara-or: #7f682c;
}

/* En-tête : le socle le peint du fond de page ; ici, du fond des bandeaux. */
.bandeau-site {
	background: var(--surface-alt);
}

/* Fil d'Ariane en vert, comme les liens. */
.fil-ariane a,
.fil-ariane__entree {
	color: var(--text);
}

/* Le prix, en or : sous les vignettes et sur la fiche. */
.livre-vignette__mentions,
.livre-caracteristiques__ligne[data-cle="prix"] .livre-caracteristiques__valeur {
	color: var(--ormara-or);
}

/*
 * Le siècle en lettres ordinaires, le « e » en exposant (session 3) — sans
 * petites capitales nulle part. L'exposant ne décale pas la ligne : sa
 * hauteur de ligne est nulle.
 */
.ormara-exposant {
	font-size: 0.7em;
	line-height: 0;
	position: relative;
	top: -0.45em;
	vertical-align: baseline;
}

/* ------------------------------------------------------------------------
 * Notices : grille à quatre colonnes en écran large, deux dessous ; texte à
 * 16 px au moins ; titre, auteur, siècle, prix.
 * --------------------------------------------------------------------- */
.liste-entrees--grille {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

@media (min-width: 64rem) {
	.liste-entrees--grille {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
}

.livre-vignette__titre,
.livre-vignette__contributeurs,
.livre-vignette__siecle,
.livre-vignette__mentions {
	font-size: max(1rem, 1em);
}

.livre-vignette__siecle {
	margin: 0;
}

/*
 * LA CELLULE FIXE LA LARGEUR DE LA NOTICE, JAMAIS L'IMAGE (session 3). Le
 * socle borne le texte d'une vignette à la largeur de sa couverture
 * (`--cover-width`) : une couverture étroite (« Voyage de Russie ») réduisait
 * le titre à une colonne de quelques lettres et coupait le prix
 * (« 1 600,00 € » sur deux lignes). Le texte prend la cellule ; l'image garde
 * sa largeur, plafonnée à la cellule, calée à gauche.
 */
.liste-entrees--grille .livre-vignette :is(.livre-vignette__titre, .livre-vignette__contributeurs, .livre-vignette__siecle, .livre-vignette__mentions, .livre-vignette__collection, .livre-etats) {
	max-width: none;
}

.liste-entrees--grille .livre-vignette .couverture__cadre {
	max-width: 100%;
}

.livre-vignette__mentions {
	white-space: nowrap;
}

/*
 * PAS D'ÉTAGÈRE DANS LES GRILLES (session 2). Le socle donne à la boîte de
 * couverture la hauteur du plus grand format et y pose l'image par le bas :
 * avec quatre notices sur cinq sans image et des planches en paysage, cela
 * laissait 170 px de blanc au-dessus d'une couverture (accueil à 375) et les
 * notices sans image en haut, les autres en bas, dans la même rangée. Ici la
 * boîte prend la hauteur de son image et toutes les notices partent du haut.
 */
.liste-entrees--grille {
	align-items: start;
}

.liste-entrees--grille .livre-vignette .couverture {
	align-items: flex-start;
	aspect-ratio: auto;
	height: auto;
	justify-content: flex-start;
}

/* Les tuiles d'accueil du socle réservent la boîte d'une couverture. */
.catalogue-tuile > .catalogue-tuile__lien:not(:has(.bloc-couverture))::before,
.livre-tuile > .livre-tuile__lien:not(:has(.bloc-couverture))::before {
	display: none;
}

/* « Tous les livres de X » mènerait à la fiche auteur, qui n'est pas servie. */
.rubrique__pied:has(> .rubrique__tout-voir[href=""]) {
	display: none;
}

/* ------------------------------------------------------------------------
 * Fiche sans couverture : plus de colonne d'image. Titraille et mesures
 * reprennent leur grille sur toute la largeur, le descriptif dessous.
 * --------------------------------------------------------------------- */
.livre:not(.has-post-thumbnail) .livre__couverture {
	display: none;
}

.livre:not(.has-post-thumbnail) .livre__centre {
	margin-inline-start: 0;
}

.livre:not(.has-post-thumbnail) .livre__colonne {
	float: none;
	width: auto;
}

/* ------------------------------------------------------------------------
 * Sous-menus de l'en-tête (Rubriques, Siècles) : 16 px de marge intérieure,
 * entrées alignées sur le libellé du parent.
 * --------------------------------------------------------------------- */
@media (min-width: 64rem) {
	.navigation__entree > .sous-menu {
		left: -16px;
		padding: 16px;
	}
}

/* ------------------------------------------------------------------------
 * Accueil (front-page.php du thème enfant) : présentation, un rang par
 * siècle, les rubriques. Le filet double or sous les titres de rang est le
 * filet unique de la page.
 * --------------------------------------------------------------------- */
.ormara-accueil {
	display: flex;
	flex-direction: column;
	gap: var(--space-2xl);
	padding-block: var(--space-xl) var(--space-l);
}

.ormara-accueil__presentation {
	font-family: var(--font-editorial);
	font-size: var(--font-size-l);
	line-height: var(--leading-snug);
	margin: 0;
	max-width: 40rem;
}

.ormara-rang__entete {
	align-items: baseline;
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-2xs) var(--space-m);
	justify-content: space-between;
	padding-bottom: var(--space-xs);
	position: relative;
}

/* Le filet double : deux traits de 1 px, 3 px d'écart. */
.ormara-rang__entete::after {
	border-block: 1px solid var(--ormara-or);
	bottom: 0;
	box-sizing: border-box;
	content: "";
	height: 5px;
	inset-inline: 0;
	position: absolute;
}

.ormara-rang__titre {
	color: var(--accent);
	font-family: var(--section-title-family);
	font-size: var(--font-size-xl);
	font-weight: var(--section-title-weight);
	line-height: var(--leading-snug);
	margin: 0;
}

/* Le fleuron des titres de rang : un SVG en ligne, or, 0,9 em (session 3). */
.ormara-fleuron {
	display: inline-block;
	height: 0.9em;
	margin-inline-end: 0.35em;
	vertical-align: -0.05em;
	width: auto;
}

.ormara-rang__tout {
	font-family: var(--font-ui);
	font-size: 1rem;
	text-decoration: none;
}

.ormara-rang__tout:hover,
.ormara-rang__tout:focus-visible {
	text-decoration: underline;
}

.ormara-rang .liste-entrees--grille {
	padding-block-start: var(--space-l);
}

.ormara-rubriques__liste {
	columns: 2 14rem;
	column-gap: var(--space-xl);
	font-size: 1rem;
	list-style: none;
	margin: var(--space-l) 0 0;
	padding: 0;
}

.ormara-rubriques__liste li {
	break-inside: avoid;
	display: flex;
	gap: var(--space-xs);
	justify-content: space-between;
	padding-block: 0.3rem;
}

.ormara-rubriques__liste a {
	text-decoration: none;
}

.ormara-rubriques__liste a:hover,
.ormara-rubriques__liste a:focus-visible {
	text-decoration: underline;
}

.ormara-rubriques__compte {
	color: var(--text-muted);
	font-variant-numeric: tabular-nums;
}

/* ------------------------------------------------------------------------
 * Pied en trois colonnes (site-footer.php du thème enfant) : Rubriques sur
 * deux colonnes internes, Siècles, Le site ; le logo et la gravure à gauche.
 * --------------------------------------------------------------------- */
.ormara-pied__colonnes {
	display: grid;
	gap: var(--space-l) var(--space-xl);
	grid-template-columns: 1fr;
}

@media (min-width: 48rem) {
	.ormara-pied__colonnes {
		grid-template-columns: minmax(12rem, 1fr) 2fr 1fr 1fr;
	}
}

.ormara-pied__titre {
	color: var(--text);
	font-family: var(--font-ui);
	font-size: var(--font-size-s);
	font-weight: 600;
	margin: 0 0 var(--space-xs);
}

.ormara-pied__liste {
	font-size: var(--font-size-s);
	list-style: none;
	margin: 0;
	padding: 0;
}

.ormara-pied__liste li {
	break-inside: avoid;
	padding-block: 0.15rem;
}

.ormara-pied__liste--deux {
	columns: 2;
	column-gap: var(--space-l);
}

.ormara-pied__liste a {
	color: var(--text);
	text-decoration: none;
}

.ormara-pied__liste a:hover,
.ormara-pied__liste a:focus-visible {
	text-decoration: underline;
}

.ormara-pied__gravure {
	display: block;
	height: 96px;
	margin-top: var(--space-m);
	width: auto;
}
