/* NDB Restauration - Menus PDF
   Toutes les couleurs passent par des variables : Elementor peut les surcharger. */

.ndb-menus {
	--ndb-accent: #b8232f;
	--ndb-accent-contraste: #ffffff;
	--ndb-texte: #1f2328;
	--ndb-texte-doux: #5c6570;
	--ndb-carte-fond: #ffffff;
	--ndb-bordure: #e3e6ea;
	--ndb-rayon: 12px;
	--ndb-gap: 24px;
	--ndb-visionneuse-h: 70vh;

	color: var(--ndb-texte);
	font-size: 16px;
	line-height: 1.55;
}

.ndb-menus *,
.ndb-menus *::before,
.ndb-menus *::after {
	box-sizing: border-box;
}

.ndb-menus__titre {
	margin: 0 0 var(--ndb-gap);
	font-size: 1.6em;
	line-height: 1.2;
}

.ndb-menus__sous-titre {
	margin: calc(var(--ndb-gap) * 1.2) 0 8px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .04em;
	font-size: .82em;
	color: var(--ndb-texte-doux);
}

.ndb-menus__vide {
	margin: 0;
	padding: 20px;
	border: 1px dashed var(--ndb-bordure);
	border-radius: var(--ndb-rayon);
	color: var(--ndb-texte-doux);
	text-align: center;
}

/* ------------------------------- Cartes ---------------------------------- */

.ndb-menus__grille {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: var(--ndb-gap);
}

.ndb-menus--cols-1 .ndb-menus__grille { grid-template-columns: minmax(0, 1fr); }
.ndb-menus--cols-2 .ndb-menus__grille { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ndb-menus--cols-4 .ndb-menus__grille { grid-template-columns: repeat(4, minmax(0, 1fr)); }

.ndb-menus__carte {
	display: flex;
	flex-direction: column;
	overflow: hidden;
	background: var(--ndb-carte-fond);
	border: 1px solid var(--ndb-bordure);
	border-radius: var(--ndb-rayon);
	transition: transform .18s ease, box-shadow .18s ease;
}

.ndb-menus__carte:hover {
	transform: translateY(-2px);
	box-shadow: 0 10px 28px rgba(15, 23, 42, .10);
}

.ndb-menus__carte.is-highlight {
	border-color: var(--ndb-accent);
	box-shadow: 0 0 0 1px var(--ndb-accent) inset;
}

.ndb-menus__vignette {
	aspect-ratio: 16 / 10;
	overflow: hidden;
	background: #f3f4f6;
}

.ndb-menus__vignette img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.ndb-menus__contenu {
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding: 18px 18px 20px;
	flex: 1 1 auto;
}

.ndb-menus__badge {
	align-self: flex-start;
	padding: 3px 10px;
	border-radius: 999px;
	background: var(--ndb-accent);
	color: var(--ndb-accent-contraste);
	font-size: .72em;
	font-weight: 700;
	letter-spacing: .05em;
	text-transform: uppercase;
}

.ndb-menus__types {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin: 0;
}

.ndb-menus__type {
	padding: 2px 9px;
	border: 1px solid var(--ndb-bordure);
	border-radius: 999px;
	font-size: .76em;
	color: var(--ndb-texte-doux);
}

.ndb-menus__nom {
	margin: 0;
	font-size: 1.12em;
	line-height: 1.3;
	color: inherit;
}

.ndb-menus__periode {
	margin: 0;
	font-size: .86em;
	color: var(--ndb-texte-doux);
}

.ndb-menus__extrait {
	margin: 0;
	font-size: .92em;
	color: var(--ndb-texte-doux);
}

.ndb-menus__actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 14px;
	margin-top: auto;
	padding-top: 12px;
}

.ndb-menus__bouton {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 10px 16px;
	border: 0;
	border-radius: calc(var(--ndb-rayon) - 4px);
	background: var(--ndb-accent);
	color: var(--ndb-accent-contraste);
	font-size: .92em;
	font-weight: 600;
	text-decoration: none;
	cursor: pointer;
	transition: filter .15s ease;
}

.ndb-menus__bouton:hover,
.ndb-menus__bouton:focus {
	filter: brightness(.92);
	color: var(--ndb-accent-contraste);
	text-decoration: none;
}

.ndb-menus__lien {
	font-size: .88em;
	color: var(--ndb-texte-doux);
	text-decoration: underline;
}

.ndb-menus__lien:hover { color: var(--ndb-accent); }

.ndb-menus__poids { white-space: nowrap; }

.ndb-menus__icone {
	width: 20px;
	height: 20px;
	flex: 0 0 auto;
}

/* -------------------------------- Liste ---------------------------------- */

.ndb-menus__liste {
	list-style: none;
	margin: 0;
	padding: 0;
	border: 1px solid var(--ndb-bordure);
	border-radius: var(--ndb-rayon);
	overflow: hidden;
	background: var(--ndb-carte-fond);
}

.ndb-menus__ligne + .ndb-menus__ligne {
	border-top: 1px solid var(--ndb-bordure);
}

.ndb-menus__ligne-lien {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 14px 18px;
	color: inherit;
	text-decoration: none;
	transition: background .15s ease;
}

.ndb-menus__ligne-lien:hover {
	background: rgba(0, 0, 0, .035);
	color: inherit;
}

.ndb-menus__ligne-lien .ndb-menus__icone { color: var(--ndb-accent); }

.ndb-menus__ligne-texte {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	min-width: 0;
}

.ndb-menus__ligne-texte .ndb-menus__nom {
	font-size: 1em;
	font-weight: 600;
}

.ndb-menus__ligne .ndb-menus__poids {
	font-size: .82em;
	color: var(--ndb-texte-doux);
}

/* ----------------------------- Visionneuse -------------------------------- */

.ndb-menus__entete { margin-bottom: 12px; }

.ndb-menus__visionneuse {
	position: relative;
	width: 100%;
	height: var(--ndb-visionneuse-h);
	border: 1px solid var(--ndb-bordure);
	border-radius: var(--ndb-rayon);
	overflow: hidden;
	background: #f3f4f6;
}

.ndb-menus__visionneuse iframe {
	width: 100%;
	height: 100%;
	border: 0;
	display: block;
}

/* ------------------------------- Messages --------------------------------- */

.ndb-depot__message {
	margin: 0 0 16px;
	padding: 12px 16px;
	border-radius: calc(var(--ndb-rayon) - 4px);
	border-left: 4px solid;
}

.ndb-depot__message--succes { background: #ecfdf3; border-color: #12855a; color: #08553a; }
.ndb-depot__message--erreur { background: #fef2f2; border-color: #b8232f; color: #8a1b24; }
.ndb-depot__message--info   { background: #eff6ff; border-color: #2563eb; color: #1d4ed8; }

/* ------------------------------ Responsive -------------------------------- */

@media (max-width: 1024px) {
	.ndb-menus--cols-3 .ndb-menus__grille,
	.ndb-menus--cols-4 .ndb-menus__grille { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 640px) {
	.ndb-menus__grille,
	.ndb-menus--cols-2 .ndb-menus__grille,
	.ndb-menus--cols-3 .ndb-menus__grille,
	.ndb-menus--cols-4 .ndb-menus__grille { grid-template-columns: minmax(0, 1fr); }

	.ndb-menus { --ndb-visionneuse-h: 60vh; }
}

@media print {
	.ndb-menus__actions { display: none; }
}
