/*
 * Fenêtre de prise de rendez-vous. Couleurs, polices et espacements : préréglages de theme.json.
 * L'agenda lui-même est une page de Google (iframe) : ses couleurs ne peuvent pas être modifiées.
 * L'en-tête reste une bande sombre et chaude dans les deux modes ; la zone de l'agenda reste
 * claire (texte de Google foncé), même en mode sombre.
 */
.dkh-rdv-fenetre {
	width: min(60rem, calc(100vw - 2 * var(--wp--preset--spacing--30)));
	height: min(50rem, calc(100dvh - 2 * var(--wp--preset--spacing--30)));
	max-width: none;
	max-height: none;
	padding: 0;
	overflow: hidden;
	border: 0;
	background: var(--wp--custom--fond-agenda);
	color: var(--wp--custom--sombre--encre);
	box-shadow: var(--wp--preset--shadow--douce);
}
.dkh-rdv-fenetre[open] {
	display: flex;
	flex-direction: column;
}
.dkh-rdv-fenetre::backdrop {
	background: color-mix(in srgb, var(--wp--custom--sombre--papier) 75%, transparent);
	-webkit-backdrop-filter: blur(3px);
	backdrop-filter: blur(3px);
}

/* En-tête : bande sombre, liseré ocre. */
.dkh-rdv-fenetre__entete {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--wp--preset--spacing--30);
	padding: var(--wp--preset--spacing--30) var(--wp--preset--spacing--40);
	border-bottom: 4px solid var(--wp--preset--color--ocre);
	background: var(--wp--custom--sombre--sable);
	color: var(--wp--custom--sombre--encre);
}
.dkh-rdv-fenetre__titre {
	margin: 0;
	color: inherit;
	font-size: var(--wp--preset--font-size--chapo);
	line-height: 1.2;
	text-wrap: balance;
}
.dkh-rdv-fenetre__atouts {
	margin: var(--wp--preset--spacing--10) 0 0;
	color: var(--wp--preset--color--ocre);
	font-family: var(--wp--preset--font-family--titres);
	font-size: var(--wp--preset--font-size--petit);
	font-weight: 600;
}
.dkh-rdv-fenetre__fermer {
	display: inline-grid;
	flex: none;
	place-items: center;
	width: 2.75rem;
	height: 2.75rem;
	padding: 0;
	border: 1px solid var(--wp--custom--sombre--contour);
	border-radius: 50%;
	background: transparent;
	color: var(--wp--custom--sombre--encre);
	cursor: pointer;
}
.dkh-rdv-fenetre__fermer:hover {
	border-color: var(--wp--preset--color--ocre);
	background: var(--wp--preset--color--ocre);
	color: var(--wp--custom--sur-ocre);
}
.dkh-rdv-fenetre__fermer:focus-visible {
	outline: 2px solid var(--wp--preset--color--ocre);
	outline-offset: 3px;
}
.dkh-rdv-fenetre__fermer svg {
	width: 1.25rem;
	height: 1.25rem;
}

/* Agenda de Google, sur fond clair ; message de chargement retiré une fois la page affichée. */
.dkh-rdv-fenetre__cadre {
	position: relative;
	flex: 1;
	background: var(--wp--custom--fond-agenda);
	color-scheme: light;
}
.dkh-rdv-fenetre__chargement {
	position: absolute;
	inset: 0;
	display: grid;
	place-items: center;
	margin: 0;
	color: var(--wp--custom--sur-ocre);
	font-family: var(--wp--preset--font-family--titres);
}
.dkh-rdv-fenetre--chargee .dkh-rdv-fenetre__chargement {
	display: none;
}
.dkh-rdv-fenetre__agenda {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
	color-scheme: light;
}

/* Pied : lien de secours sur fond sable clair. */
.dkh-rdv-fenetre__secours {
	margin: 0;
	padding: var(--wp--preset--spacing--20) var(--wp--preset--spacing--40);
	border-top: 1px solid color-mix(in srgb, var(--wp--custom--sur-ocre) 12%, transparent);
	background: color-mix(in srgb, var(--wp--preset--color--ocre) 14%, var(--wp--custom--fond-agenda));
	color: var(--wp--custom--sur-ocre);
	font-size: var(--wp--preset--font-size--petit);
}
.dkh-rdv-fenetre__secours a {
	color: inherit;
	text-underline-offset: 0.2em;
}
.dkh-rdv-fenetre__secours a:focus-visible {
	outline: 2px solid var(--wp--custom--sur-ocre);
	outline-offset: 2px;
}

/* Petits écrans : fenêtre plein écran, sans marge perdue. */
@media (max-width: 599px) {
	.dkh-rdv-fenetre {
		width: 100vw;
		height: 100dvh;
	}
	.dkh-rdv-fenetre__entete {
		padding: var(--wp--preset--spacing--20) var(--wp--preset--spacing--30);
	}
	.dkh-rdv-fenetre__titre {
		font-size: var(--wp--preset--font-size--texte);
	}
	.dkh-rdv-fenetre__secours {
		padding: var(--wp--preset--spacing--20) var(--wp--preset--spacing--30);
	}
}
