/* ==========================================================================
   ChannelNews — Vote Channel Awards
   Mêmes repères visuels que le formulaire de réservation : couleurs, rayons,
   boutons et champs sont alignés sur assets/css/form.css du plugin
   channelnews-reservation. Tout est scopé sous .cnas-wrap.
   ========================================================================== */

.cnas-wrap {
	--cnas-accent: #e2001a;
	--cnas-accent-2: #151748;
	--cnas-soft: #f6f7f9;
	--cnas-line: #e4e7ec;
	--cnas-text: #1d2230;
	--cnas-muted: #6b7280;
	--cnas-radius: 14px;

	box-sizing: border-box;
	max-width: 1120px;
	margin: 0 auto;
	color: var(--cnas-text);
	font-size: 15px;
	line-height: 1.55;
	-webkit-font-smoothing: antialiased;
}

.cnas-wrap *, .cnas-wrap *::before, .cnas-wrap *::after { box-sizing: border-box; }

/* L'attribut hidden doit primer sur les display: flex/grid ci-dessous. */
.cnas-wrap [hidden] { display: none !important; }

.cnas-wrap p { margin: 0 0 .6em; }

/* ---------- En-tête ---------- */

.cnas-head { margin-bottom: 26px; }

.cnas-wrap .cnas-title {
	margin: 0 0 .25em;
	font-size: clamp(24px, 3vw, 34px);
	line-height: 1.15;
	font-weight: 800;
	letter-spacing: -.02em;
	color: var(--cnas-accent-2);
}

/* Deux colonnes : introduction à gauche, visuel à droite. */
.cnas-head__cols {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 300px;
	gap: 30px;
	align-items: start;
}

.cnas-head__cols--single { grid-template-columns: minmax(0, 1fr); }

/* Visuel au-dessus du titre : pleine largeur du bloc, image entière. */
.cnas-head__banner {
	margin: 0 0 24px;
	width: 100%;
}

.cnas-head__banner .cnas-head__thumb img { width: 100%; }

.cnas-wrap .cnas-head__banner .cnas-head__caption { margin: 14px 0 0; }

.cnas-head__media { min-width: 0; }

.cnas-head__thumb {
	display: block;
	overflow: hidden;
	border: 1.5px solid var(--cnas-line);
	border-radius: var(--cnas-radius);
	background: var(--cnas-soft);
	transition: transform .22s ease, border-color .22s ease;
}

a.cnas-head__thumb:hover {
	transform: translateY(-2px);
	border-color: var(--cnas-accent);
}

.cnas-head__thumb img {
	display: block;
	width: 100%;
	height: auto;
	margin: 0;
	border-radius: 0;
}

/* Le préfixe .cnas-wrap est nécessaire pour primer sur « .cnas-wrap p ». */
.cnas-wrap .cnas-head__caption {
	margin: 18px 0 0;
	font-size: 13px;
	line-height: 1.45;
	color: var(--cnas-muted);
}

.cnas-wrap .cnas-head__caption a {
	color: var(--cnas-accent);
	font-weight: 700;
	text-decoration: none;
	border-bottom: 1px solid transparent;
	transition: border-color .18s ease;
}

.cnas-wrap .cnas-head__caption a:hover { border-bottom-color: currentColor; }

.cnas-head__arrow { display: inline-block; transition: transform .18s ease; }
.cnas-wrap .cnas-head__caption a:hover .cnas-head__arrow { transform: translateX(3px); }

.cnas-intro { color: var(--cnas-muted); max-width: 68ch; }
.cnas-intro > *:last-child { margin-bottom: 0; }

.cnas-intro .cnas-lead {
	margin-bottom: .7em;
	font-size: clamp(16px, 1.7vw, 19px);
	font-weight: 700;
	line-height: 1.35;
	color: var(--cnas-accent-2);
	letter-spacing: -.01em;
}

.cnas-intro .cnas-instruction {
	margin-top: 1.1em;
	font-size: 14.5px;
	font-weight: 700;
	color: var(--cnas-text);
}

/* Consigne d'inscription : sans objet pour un membre déjà connecté. */
.cnas-wrap--member .cnas-intro .cnas-instruction { display: none; }

/* ---------- Bandeaux de message ---------- */

.cnas-wrap .cnas-notice {
	margin: 0 0 18px;
	padding: 14px 18px;
	border-radius: 12px;
	font-size: 14px;
	font-weight: 600;
	border: 1.5px solid transparent;
}

.cnas-notice--ok { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
.cnas-notice--ko { background: #fef2f2; border-color: #fecaca; color: #b91c1c; }

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

.cnas-card {
	padding: 28px 30px;
	background: linear-gradient(135deg, rgba(226, 0, 26, .05), var(--cnas-soft));
	border: 1.5px solid var(--cnas-line);
	border-radius: var(--cnas-radius);
}

.cnas-card + .cnas-card { margin-top: 18px; }

.cnas-card--go { border-color: var(--cnas-accent); }

.cnas-card--done {
	background: linear-gradient(135deg, rgba(5, 150, 105, .08), var(--cnas-soft));
	border-color: #a7f3d0;
}

.cnas-card--wait {
	background: linear-gradient(135deg, rgba(234, 179, 8, .1), var(--cnas-soft));
	border-color: #fde68a;
}

.cnas-wrap .cnas-card__title {
	margin: 0 0 10px;
	font-size: 20px;
	font-weight: 800;
	line-height: 1.3;
	color: var(--cnas-accent-2);
}

.cnas-card__text { margin: 0 0 18px; font-size: 14.5px; color: var(--cnas-muted); }
.cnas-card__text > *:last-child { margin-bottom: 0; }

.cnas-card__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 18px; margin: 20px 0 0; }

/* Les deux chemins — voter, déposer un dossier — ont le même poids : deux
   moitiés égales, séparées, et détachées de la ligne d'identité au-dessus. */
.cnas-wrap .cnas-card__actions--duo {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 16px;
	margin-top: 26px;
}

.cnas-wrap .cnas-card__actions--duo .cnas-btn {
	width: 100%;
	justify-content: center;
	text-align: center;
}

@media (max-width: 620px) {
	.cnas-wrap .cnas-card__actions--duo { grid-template-columns: minmax(0, 1fr); }
}

.cnas-seal {
	width: 46px;
	height: 46px;
	margin: 0 0 14px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 999px;
	background: #059669;
	color: #fff;
	font-size: 22px;
	font-weight: 700;
	line-height: 1;
}

.cnas-wrap .cnas-meta { margin: 12px 0 0; font-size: 12.5px; color: var(--cnas-muted); }

/* ---------- Boutons ---------- */

.cnas-wrap .cnas-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 48px;
	padding: 0 28px;
	border: 1.5px solid transparent;
	border-radius: 999px;
	font-family: inherit;
	font-size: 14.5px;
	font-weight: 700;
	text-decoration: none;
	cursor: pointer;
	transition: transform .15s ease, background .2s ease;
}

.cnas-wrap .cnas-btn--primary {
	background: linear-gradient(120deg, var(--cnas-accent-2), var(--cnas-accent));
	color: #fff;
	box-shadow: 0 8px 20px -8px rgba(226, 0, 26, .6);
}

.cnas-wrap .cnas-btn--primary:hover { transform: translateY(-1px); color: #fff; }

.cnas-wrap .cnas-btn--ghost {
	background: #fff;
	border-color: var(--cnas-line);
	color: var(--cnas-text);
}

.cnas-wrap .cnas-btn--ghost:hover { border-color: #c3c9d4; color: var(--cnas-text); }

.cnas-wrap .cnas-link {
	color: var(--cnas-muted);
	font-size: 13.5px;
	font-weight: 600;
	text-decoration: none;
	border-bottom: 1px solid var(--cnas-line);
}

.cnas-wrap .cnas-link:hover { color: var(--cnas-accent); border-bottom-color: currentColor; }

.cnas-wrap .cnas-refresh { border-bottom: 0; }
.cnas-wrap .cnas-refresh span { display: inline-block; margin-right: 3px; transition: transform .4s ease; }
.cnas-wrap .cnas-refresh:hover span { transform: rotate(180deg); }

/* ---------- Identité ---------- */

/* La ligne d'identité précède le formulaire : l'air se met en dessous. */
.cnas-wrap .cnas-identity + form { display: block; margin-top: 18px; }

.cnas-wrap .cnas-identity {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px 10px;
	margin: 0 0 4px;
	padding: 12px 16px;
	background: #fff;
	border: 1.5px solid var(--cnas-line);
	border-radius: 10px;
	font-size: 13.5px;
	font-weight: 600;
}

.cnas-sep { color: var(--cnas-line); }

.cnas-badge {
	padding: 3px 12px;
	border-radius: 999px;
	background: var(--cnas-accent-2);
	color: #fff;
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: .04em;
	text-transform: uppercase;
}

/* ---------- Session en cours ---------- */

.cnas-wrap .cnas-session {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px 16px;
	margin: 16px 0 0;
	padding: 12px 18px;
	background: #fff;
	border: 1.5px solid var(--cnas-line);
	border-radius: 10px;
	font-size: 13px;
	color: var(--cnas-muted);
}

.cnas-session__who strong { color: var(--cnas-text); }
.cnas-session__mail { color: var(--cnas-muted); }
.cnas-session__mail::before { content: "·"; margin: 0 7px; color: var(--cnas-line); }

.cnas-wrap .cnas-session__out {
	margin-left: auto;
	color: var(--cnas-accent);
	font-weight: 700;
	text-decoration: none;
	border-bottom: 1px solid transparent;
	transition: border-color .18s ease;
}

.cnas-wrap .cnas-session__out:hover { border-bottom-color: currentColor; }

.cnas-wrap .cnas-session__hint { margin: 8px 2px 0; font-size: 12px; color: var(--cnas-muted); }

@media (max-width: 600px) {
	.cnas-wrap .cnas-session__out { margin-left: 0; }
}

/* ---------- Onglets compte ---------- */

.cnas-tabs {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: 16px;
}

.cnas-wrap .cnas-tabs__btn {
	min-height: 44px;
	padding: 0 22px;
	background: #fff;
	border: 1.5px solid var(--cnas-line);
	border-radius: 999px;
	font-family: inherit;
	font-size: 14px;
	font-weight: 700;
	color: var(--cnas-muted);
	cursor: pointer;
	transition: border-color .18s ease, color .18s ease;
}

.cnas-wrap .cnas-tabs__btn:hover { border-color: #c3c9d4; }

.cnas-wrap .cnas-tabs__btn.is-active {
	border-color: var(--cnas-accent);
	background: var(--cnas-accent-2);
	color: #fff;
}

/* Sans JavaScript les onglets ne servent à rien : ils restent masqués. */
.cnas-account .cnas-tabs { display: none; }
.cnas-account--js .cnas-tabs { display: flex; }

/* ---------- Formulaires ---------- */

.cnas-form { margin-top: 4px; }

.cnas-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 16px 18px;
	margin-bottom: 16px;
}

.cnas-field--full { grid-column: 1 / -1; }

.cnas-field { margin-bottom: 16px; }
.cnas-grid .cnas-field { margin-bottom: 0; }

.cnas-wrap .cnas-field label,
.cnas-wrap .cnas-label {
	display: block;
	margin-bottom: 6px;
	font-size: 12.5px;
	font-weight: 600;
	color: var(--cnas-muted);
}

.cnas-wrap .cnas-field label i,
.cnas-wrap .cnas-label i { color: var(--cnas-accent); font-style: normal; }

.cnas-wrap .cnas-field input[type="text"],
.cnas-wrap .cnas-field input[type="email"],
.cnas-wrap .cnas-field input[type="password"] {
	width: 100%;
	height: 46px;
	padding: 10px 14px;
	background: #fff;
	border: 1.5px solid var(--cnas-line);
	border-radius: 10px;
	font-size: 15px;
	font-family: inherit;
	color: var(--cnas-text);
}

.cnas-wrap .cnas-field input:focus {
	outline: 0;
	border-color: var(--cnas-accent);
	box-shadow: 0 0 0 3px rgba(226, 0, 26, .14);
}

.cnas-hint { display: block; margin-top: 6px; font-size: 12px; color: var(--cnas-muted); }

.cnas-choices { display: flex; flex-wrap: wrap; gap: 10px; }

.cnas-wrap .cnas-choice {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	margin: 0;
	padding: 12px 20px;
	background: #fff;
	border: 1.5px solid var(--cnas-line);
	border-radius: 999px;
	font-size: 14.5px;
	font-weight: 600;
	color: var(--cnas-text);
	cursor: pointer;
	transition: border-color .18s ease, box-shadow .18s ease;
}

.cnas-choice:hover { border-color: #c3c9d4; }

.cnas-wrap .cnas-choice input { margin: 0; accent-color: var(--cnas-accent); }

.cnas-choice:focus-within {
	border-color: var(--cnas-accent);
	box-shadow: 0 0 0 3px rgba(226, 0, 26, .14);
}

.cnas-wrap .cnas-check {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	margin: 0 0 4px;
	font-size: 13.5px;
	font-weight: 600;
	color: var(--cnas-text);
	cursor: pointer;
}

.cnas-wrap .cnas-check input { margin: 3px 0 0; accent-color: var(--cnas-accent); }

.cnas-wrap .cnas-legal { margin: 14px 0 0; font-size: 12px; color: var(--cnas-muted); }

/* Piège à robots : invisible, mais pas display:none — certains robots
   remplissent précisément ce que les navigateurs n'affichent pas. */
.cnas-hp {
	position: absolute !important;
	left: -9999px !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.cnas-wrap .cnas-error {
	margin: 0 0 16px;
	padding: 12px 15px;
	background: #fef2f2;
	border: 1.5px solid #fecaca;
	border-radius: 10px;
	color: #b91c1c;
	font-size: 13.5px;
	font-weight: 600;
}

.cnas-wrap .cnas-error p { margin: 0 0 .35em; }
.cnas-wrap .cnas-error p:last-child { margin-bottom: 0; }

/* ---------- Adaptatif ---------- */

@media (max-width: 1024px) {
	.cnas-head__cols { grid-template-columns: minmax(0, 1fr) 240px; gap: 22px; }
}

@media (max-width: 782px) {
	.cnas-head__cols { grid-template-columns: minmax(0, 1fr); gap: 20px; }
	.cnas-head__media { max-width: 380px; }
}

@media (max-width: 600px) {
	.cnas-card { padding: 22px 20px; }
	.cnas-grid { grid-template-columns: minmax(0, 1fr); }
	.cnas-wrap .cnas-btn { width: 100%; justify-content: center; }
	.cnas-choices { flex-direction: column; }
	.cnas-wrap .cnas-choice { width: 100%; }
	.cnas-tabs { flex-direction: column; }
	.cnas-wrap .cnas-tabs__btn { width: 100%; }
}