/**
 * La liste d'attente sous le calendrier.
 *
 * Elle ne doit jamais ressembler à un créneau disponible : pas de doré plein,
 * pas de bouton qui appelle le clic. Un encart sobre, replié, qui se remarque
 * seulement quand on cherche une porte de sortie — et qui s'ouvre franchement
 * quand on la pousse.
 */

.lpwa-att {
	--att-encre: #1A1714;
	--att-doux: #6F675E;
	--att-filet: #EFE7DA;
	--att-or: #C9A227;
	--att-or-fonce: #8A6D12;

	margin: 20px 0 6px;
	border: 1px solid var(--att-filet);
	border-radius: 18px;
	background: #fff;
	overflow: hidden;
}

.lpwa-att.is-ouvert { border-color: rgba(201, 162, 39, .45); }
.lpwa-att.is-inscrite { background: #FFFDF7; border-color: rgba(201, 162, 39, .45); }

/* --- L'en-tête cliquable --------------------------------------------- */

.lpwa-att__ouvrir {
	appearance: none;
	display: block;
	width: 100%;
	text-align: left;
	background: none;
	border: 0;
	padding: 16px 18px;
	font: inherit;
	cursor: pointer;
}

.lpwa-att__ouvrir:hover { background: #FBF7F2; }
.lpwa-att.is-inscrite .lpwa-att__ouvrir { cursor: default; }
.lpwa-att.is-inscrite .lpwa-att__ouvrir:hover { background: none; }

.lpwa-att__titre {
	display: block;
	font-size: 15px;
	font-weight: 600;
	color: var(--att-encre);
}

.lpwa-att__sous {
	display: block;
	margin-top: 3px;
	font-size: 13.5px;
	line-height: 1.5;
	color: var(--att-doux);
}

/* --- Le formulaire --------------------------------------------------- */

.lpwa-att__form {
	padding: 4px 18px 20px;
	border-top: 1px solid var(--att-filet);
}

.lpwa-att__intro {
	margin: 14px 0 16px;
	font-size: 13.5px;
	line-height: 1.6;
	color: var(--att-doux);
}

.lpwa-att__duo {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 12px;
}

.lpwa-att__form label,
.lpwa-att__bloc {
	display: block;
	margin-bottom: 12px;
	font-size: 12.5px;
	font-weight: 600;
	color: var(--att-encre);
}

.lpwa-att__form label small {
	font-weight: 400;
	color: var(--att-doux);
}

.lpwa-att__form input,
.lpwa-att__form select,
.lpwa-att__form textarea {
	display: block;
	width: 100%;
	margin-top: 5px;
	padding: 11px 12px;
	font: inherit;
	/* Sous 16 px, Safari iOS zoome au focus et déforme toute la page. */
	font-size: 16px;
	font-weight: 400;
	color: var(--att-encre);
	background: #fff;
	border: 1px solid var(--att-filet);
	border-radius: 11px;
	-webkit-appearance: none;
	appearance: none;
}

.lpwa-att__form select {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236F675E' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M5 9l7 7 7-7'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 11px center;
	background-size: 16px;
	padding-right: 36px;
}

.lpwa-att__form input:focus,
.lpwa-att__form select:focus,
.lpwa-att__form textarea:focus {
	outline: none;
	border-color: var(--att-or);
	box-shadow: 0 0 0 3px rgba(201, 162, 39, .15);
}

.lpwa-att__form textarea { resize: vertical; min-height: 62px; }

.lpwa-att__envoyer {
	width: 100%;
	min-height: 48px;
	margin-top: 4px;
	padding: 13px 18px;
	font: inherit;
	font-size: 15px;
	font-weight: 600;
	color: var(--att-or-fonce);
	background: linear-gradient(170deg, #FFFDF7, #FDF4E2);
	border: 1px solid rgba(201, 162, 39, .55);
	border-radius: 999px;
	cursor: pointer;
}

.lpwa-att__envoyer:hover { background: linear-gradient(170deg, #FFFDF7, #FBEDD0); border-color: var(--att-or); }
.lpwa-att__envoyer:disabled { opacity: .6; cursor: default; }

.lpwa-att__message {
	margin: 12px 0 0;
	padding: 10px 12px;
	border-radius: 10px;
	font-size: 13.5px;
}

.lpwa-att__message.is-souci {
	background: #FDF1F1;
	border: 1px solid #F3D6D6;
	color: #8A2B2B;
}

/* --- Les demandes déjà posées ---------------------------------------- */

.lpwa-att-mienne {
	padding: 0 18px 14px;
	border-top: 1px solid var(--att-filet);
}

.lpwa-att-ligne {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 14px;
	padding: 13px 0 0;
}

.lpwa-att-ligne strong {
	display: block;
	font-size: 13.5px;
	color: var(--att-encre);
}

.lpwa-att-ligne em {
	display: block;
	font-style: normal;
	font-size: 12.5px;
	color: var(--att-doux);
}

.lpwa-att-flag { color: var(--att-or-fonce) !important; font-weight: 600; }

.lpwa-att-retirer {
	flex: 0 0 auto;
	appearance: none;
	background: none;
	border: 0;
	padding: 0;
	font: inherit;
	font-size: 12.5px;
	color: var(--att-doux);
	text-decoration: underline;
	text-underline-offset: 3px;
	cursor: pointer;
}

.lpwa-att-retirer:hover { color: #8A2B2B; }

/* --- Le bandeau d'une proposition ------------------------------------ */

.lpwa-att-bandeau {
	margin: 0 0 20px;
	padding: 16px 18px;
	border-radius: 16px;
	background: linear-gradient(170deg, #FFFDF7, #FBEDD0);
	border: 1px solid rgba(201, 162, 39, .55);
}

.lpwa-att-bandeau strong {
	display: block;
	font-size: 15.5px;
	color: #6E5410;
}

.lpwa-att-bandeau span {
	display: block;
	margin-top: 3px;
	font-size: 13.5px;
	line-height: 1.55;
	color: #7A6427;
}

@media (max-width: 560px) {
	.lpwa-att__duo { grid-template-columns: 1fr; gap: 0; }
}
