/*
 * Advertiser space — "Signature" skin (crisp corporate).
 *
 * An OPT-IN, additive skin, scoped entirely under `.eqdir-espace[data-theme="signature"]`,
 * so it is inert unless the wrapper carries that attribute (emitted only when the resolved
 * theme is "signature"). The Classic and Pro skins are never touched.
 *
 * Design intent: break visually from the warm, rounded, cream charter look. A cool neutral
 * canvas with white, elevated, lightly-bordered cards; underlined segmented tabs instead of
 * cream pills; uppercase tracked micro-labels and section titles; a sober teal accent;
 * squared-off geometry. Same markup, same structure — a different visual language only.
 * A local palette is defined on the wrapper (the shared --l974-* charter tokens are NOT
 * modified), so this skin reads the same under any active charter.
 *
 * @package EquaRent_Directory
 */

.eqdir-espace[data-theme="signature"] {
	--eqdir-sig-canvas: #eef1f6;
	--eqdir-sig-card: #ffffff;
	--eqdir-sig-ink: #1b2432;
	--eqdir-sig-muted: #64748b;
	--eqdir-sig-border: #dde3ec;
	--eqdir-sig-accent: #0e5a6b;
	--eqdir-sig-accent-weak: #e9f2f4;
	--eqdir-sig-radius: 10px;
	--eqdir-sig-radius-sm: 7px;
	--eqdir-sig-shadow: 0 1px 3px rgba(16, 24, 40, 0.08), 0 1px 2px rgba(16, 24, 40, 0.04);
	--eqdir-sig-gap: 0.85rem;
	/* Remap charter tokens LOCALLY (scoped to this wrapper only — the shared charter token
	 * files are never touched). CSS custom properties inherit through the DOM, so every
	 * front.css surface that reads these tokens inside the advertiser space adopts the
	 * Signature palette at once: all cream (--l974-surface-alt) card fills turn white,
	 * every hairline turns cool, and the CTA buttons turn teal — no per-selector whitelist
	 * to keep in sync. Purposely-tinted exceptions are re-tinted explicitly below. */
	--l974-surface-alt: var(--eqdir-sig-card);
	--l974-surface: var(--eqdir-sig-card);
	--l974-border: var(--eqdir-sig-border);
	--l974-cta: var(--eqdir-sig-accent);
	--l974-cta-hover: #0b4a58;
	gap: var(--eqdir-sig-gap);
	color: var(--eqdir-sig-ink);
	font-size: 0.94rem;
}

/* Keep purposely-tinted elements readable after the surface-alt → white remap, so they
 * still stand out against the now-white cards (otherwise they would vanish into them). */
.eqdir-espace[data-theme="signature"] .eqdir-acc__head {
	background: var(--eqdir-sig-canvas);
}

.eqdir-espace[data-theme="signature"] .eqdir-cal {
	--eqdir-cal-past: var(--eqdir-sig-canvas);
}

.eqdir-espace[data-theme="signature"] .eqdir-wizard__indicator li {
	background: var(--eqdir-sig-canvas);
}

/* This hidden-state pill uses a LITERAL cream hex in front.css, not the token, so the
 * remap cannot reach it — override it explicitly. */
.eqdir-espace[data-theme="signature"] .eqdir-fiches__visible.is-off {
	background: var(--eqdir-sig-accent-weak);
	color: var(--eqdir-sig-muted);
}

/* ---- Header ------------------------------------------------------------- */
.eqdir-espace[data-theme="signature"] .eqdir-espace__greeting {
	font-size: 1.2rem;
	font-weight: 700;
	letter-spacing: -0.01em;
	color: var(--eqdir-sig-ink);
	margin: 0;
}

/* ---- Tabs: underlined segmented bar (no cream pills) -------------------- */
.eqdir-espace[data-theme="signature"] .eqdir-espace__nav {
	background: var(--eqdir-sig-card);
	border: 1px solid var(--eqdir-sig-border);
	border-radius: var(--eqdir-sig-radius);
	box-shadow: var(--eqdir-sig-shadow);
	padding: 0.25rem 0.5rem 0;
}

.eqdir-espace[data-theme="signature"] .eqdir-espace__tabs {
	gap: 0.15rem;
	border-bottom: 1px solid var(--eqdir-sig-border);
}

.eqdir-espace[data-theme="signature"] .eqdir-espace__tab {
	background: transparent;
	border: 0;
	border-bottom: 2px solid transparent;
	border-radius: 0;
	color: var(--eqdir-sig-muted);
	font-size: 0.82rem;
	font-weight: 600;
	letter-spacing: 0.01em;
	min-height: 2.3rem;
	padding: 0.4rem 0.85rem;
}

.eqdir-espace[data-theme="signature"] .eqdir-espace__tab:hover {
	color: var(--eqdir-sig-ink);
}

.eqdir-espace[data-theme="signature"] .eqdir-espace__tab.is-active {
	color: var(--eqdir-sig-accent);
	border-bottom-color: var(--eqdir-sig-accent);
	background: transparent;
}

/* ---- Panel: cool canvas holding white cards ---------------------------- */
.eqdir-espace[data-theme="signature"] .eqdir-espace__panel {
	background: var(--eqdir-sig-canvas);
	border: 1px solid var(--eqdir-sig-border);
	border-radius: var(--eqdir-sig-radius);
	box-shadow: none;
	padding: 1rem;
}

/* Section headings: uppercase, tracked, with a hairline rule. */
.eqdir-espace[data-theme="signature"] .eqdir-espace__panel > section > h2,
.eqdir-espace[data-theme="signature"] .eqdir-espace__panel > div > h2,
.eqdir-espace[data-theme="signature"] .eqdir-panel__title {
	font-size: 0.82rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--eqdir-sig-muted);
	margin: 0 0 0.75rem;
	padding-bottom: 0.4rem;
	border-bottom: 1px solid var(--eqdir-sig-border);
}

/* ---- Cards (white, bordered, elevated) --------------------------------- */
.eqdir-espace[data-theme="signature"] .eqdir-panel,
.eqdir-espace[data-theme="signature"] .eqdir-fiches__item,
.eqdir-espace[data-theme="signature"] .eqdir-fiches__editor,
.eqdir-espace[data-theme="signature"] .eqdir-fiches__create-body,
.eqdir-espace[data-theme="signature"] .eqdir-abos__card,
.eqdir-espace[data-theme="signature"] .eqdir-adbuy__panel,
.eqdir-espace[data-theme="signature"] .eqdir-adbuy__card,
.eqdir-espace[data-theme="signature"] .eqdir-donnees__block,
.eqdir-espace[data-theme="signature"] .eqdir-acc__panel {
	background: var(--eqdir-sig-card);
	border: 1px solid var(--eqdir-sig-border);
	border-radius: var(--eqdir-sig-radius);
	box-shadow: var(--eqdir-sig-shadow);
	padding: 0.9rem 1rem;
	margin-bottom: 0.85rem;
}

/* Regrouped per-unit subscription cards: the type body's flex gap is the only spacing (no double gap). */
.eqdir-espace[data-theme="signature"] .eqdir-abos__cards .eqdir-abos__card {
	margin-bottom: 0;
}

/* ---- Dashboard KPI tiles: white, accent-barred ------------------------- */
.eqdir-espace[data-theme="signature"] .eqdir-dash__counts {
	grid-template-columns: repeat(auto-fill, minmax(7.5rem, 1fr));
	gap: 0.6rem;
	margin-bottom: 0.85rem;
}

/* Explicit-row dashboard tiles: theme-scoped so they beat the auto-fill rule above. EVERY row is a
   uniform 4-column grid so all tiles share the same quarter-row width and align into columns.
   Collapse to fewer columns on narrow screens. */
.eqdir-espace[data-theme="signature"] .eqdir-dash__counts--2,
.eqdir-espace[data-theme="signature"] .eqdir-dash__counts--3,
.eqdir-espace[data-theme="signature"] .eqdir-dash__counts--4 {
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

.eqdir-espace[data-theme="signature"] .eqdir-dash__subtitle {
	color: var(--eqdir-sig-muted, var(--l974-text-muted));
}

@media (max-width: 782px) {
	.eqdir-espace[data-theme="signature"] .eqdir-dash__counts--2,
	.eqdir-espace[data-theme="signature"] .eqdir-dash__counts--3,
	.eqdir-espace[data-theme="signature"] .eqdir-dash__counts--4 {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 520px) {
	.eqdir-espace[data-theme="signature"] .eqdir-dash__counts--2,
	.eqdir-espace[data-theme="signature"] .eqdir-dash__counts--3,
	.eqdir-espace[data-theme="signature"] .eqdir-dash__counts--4 {
		grid-template-columns: 1fr;
	}
}

.eqdir-espace[data-theme="signature"] .eqdir-dash__counts li {
	background: var(--eqdir-sig-card);
	border: 1px solid var(--eqdir-sig-border);
	border-left: 3px solid var(--eqdir-sig-accent);
	border-radius: var(--eqdir-sig-radius-sm);
	box-shadow: var(--eqdir-sig-shadow);
	padding: 0.6rem 0.75rem;
}

.eqdir-espace[data-theme="signature"] .eqdir-dash__count-num {
	font-size: 1.3rem;
	font-weight: 800;
	color: var(--eqdir-sig-ink);
	line-height: 1.1;
}

.eqdir-espace[data-theme="signature"] .eqdir-dash__count-label {
	font-size: 0.72rem;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--eqdir-sig-muted);
}

/* ---- Alerts ------------------------------------------------------------- */
.eqdir-espace[data-theme="signature"] .eqdir-dash__alerts {
	background: var(--eqdir-sig-accent-weak);
	border: 1px solid var(--eqdir-sig-border);
	border-left: 3px solid var(--eqdir-sig-accent);
	border-radius: var(--eqdir-sig-radius-sm);
	padding: 0.65rem 0.85rem;
	margin-bottom: 0.85rem;
	color: var(--eqdir-sig-ink);
}

/* ---- Listing rows list spacing ----------------------------------------- */
.eqdir-espace[data-theme="signature"] .eqdir-fiches__list {
	gap: 0.6rem;
	margin-bottom: 0.85rem;
}

/* ---- Forms: white inputs, uppercase micro-labels, 2-column ------------- */
.eqdir-espace[data-theme="signature"] .eqdir-field {
	margin-bottom: 0.6rem;
	gap: 0.25rem;
}

.eqdir-espace[data-theme="signature"] .eqdir-field > label,
.eqdir-espace[data-theme="signature"] .eqdir-field__label {
	font-size: 0.72rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--eqdir-sig-muted);
}

.eqdir-espace[data-theme="signature"] .eqdir-field input,
.eqdir-espace[data-theme="signature"] .eqdir-field select,
.eqdir-espace[data-theme="signature"] .eqdir-field textarea {
	background: var(--eqdir-sig-card);
	border: 1px solid var(--eqdir-sig-border);
	border-radius: var(--eqdir-sig-radius-sm);
	min-height: 2.2rem;
	padding: 0.45rem 0.65rem;
	font-size: 0.9rem;
	color: var(--eqdir-sig-ink);
}

.eqdir-espace[data-theme="signature"] .eqdir-field input:focus,
.eqdir-espace[data-theme="signature"] .eqdir-field select:focus,
.eqdir-espace[data-theme="signature"] .eqdir-field textarea:focus {
	outline: none;
	border-color: var(--eqdir-sig-accent);
	box-shadow: 0 0 0 3px var(--eqdir-sig-accent-weak);
}

@media (min-width: 720px) {
	.eqdir-espace[data-theme="signature"] .eqdir-compte__form fieldset {
		display: grid;
		grid-template-columns: 1fr 1fr;
		column-gap: 1rem;
		align-items: start;
	}
	.eqdir-espace[data-theme="signature"] .eqdir-compte__form fieldset > * {
		grid-column: 1 / -1;
	}
	.eqdir-espace[data-theme="signature"] .eqdir-compte__form fieldset > .eqdir-field {
		grid-column: auto;
	}
	.eqdir-espace[data-theme="signature"] .eqdir-compte__form fieldset > .eqdir-field--wide,
	.eqdir-espace[data-theme="signature"] .eqdir-compte__form fieldset > .eqdir-field--full {
		grid-column: 1 / -1;
	}
}

/* ---- Buttons: squared, accent-driven ----------------------------------- */
.eqdir-espace[data-theme="signature"] .eqdir-btn {
	min-height: 2.2rem;
	padding: 0.5rem 1.1rem;
	border-radius: var(--eqdir-sig-radius-sm);
	font-size: 0.88rem;
	font-weight: 600;
	background: var(--eqdir-sig-accent);
	border: 1px solid var(--eqdir-sig-accent);
	color: #fff;
}

.eqdir-espace[data-theme="signature"] .eqdir-btn:hover {
	filter: brightness(1.08);
}

.eqdir-espace[data-theme="signature"] .eqdir-btn--ghost {
	background: var(--eqdir-sig-card);
	border: 1px solid var(--eqdir-sig-border);
	color: var(--eqdir-sig-ink);
}

.eqdir-espace[data-theme="signature"] .eqdir-btn--ghost:hover {
	filter: none;
	border-color: var(--eqdir-sig-accent);
	color: var(--eqdir-sig-accent);
}

.eqdir-espace[data-theme="signature"] .eqdir-btn--danger {
	background: #b4232a;
	border-color: #b4232a;
	color: #fff;
}

/* ---- Tables (invoices, statistics) ------------------------------------- */
.eqdir-espace[data-theme="signature"] table {
	background: var(--eqdir-sig-card);
	border: 1px solid var(--eqdir-sig-border);
	border-radius: var(--eqdir-sig-radius-sm);
	overflow: hidden;
}

.eqdir-espace[data-theme="signature"] table th {
	background: var(--eqdir-sig-accent-weak);
	color: var(--eqdir-sig-ink);
	text-transform: uppercase;
	letter-spacing: 0.03em;
	font-size: 0.74rem;
	padding: 0.45rem 0.7rem;
}

.eqdir-espace[data-theme="signature"] table td {
	padding: 0.45rem 0.7rem;
	font-size: 0.88rem;
	border-top: 1px solid var(--eqdir-sig-border);
}

/* ---- Notices ------------------------------------------------------------ */
.eqdir-espace[data-theme="signature"] .eqdir-notice {
	background: var(--eqdir-sig-card);
	border: 1px solid var(--eqdir-sig-border);
	border-left: 3px solid var(--eqdir-sig-accent);
	border-radius: var(--eqdir-sig-radius-sm);
	padding: 0.6rem 0.85rem;
}

/* ---- Payment boxes: white elevated cards (not cream), consistent across the
 *      card tab, the pack pay box and the ad checkout. ---------------------- */
.eqdir-espace[data-theme="signature"] .eqdir-card-tab .eqdir-payment,
.eqdir-espace[data-theme="signature"] .eqdir-abos__paybox,
.eqdir-espace[data-theme="signature"] .eqdir-adbuy__checkout {
	background: var(--eqdir-sig-card);
	border: 1px solid var(--eqdir-sig-border);
	border-radius: var(--eqdir-sig-radius);
	box-shadow: var(--eqdir-sig-shadow);
}

/* ---- Per-advertiser theme picker width --------------------------------- */
.eqdir-espace[data-theme="signature"] .eqdir-field--theme select {
	max-width: 22rem;
}

/* ---- Body-level modals (appended to <body>, OUTSIDE the wrapper) --------
 * initConfirmModal (espace.js) → .eqdir-confirm; the front.js modal factory →
 * .eqdir-modal-overlay / .eqdir-modal (fiche preview, ad preview, booking detail,
 * Connect-listing edit); the pack-limit native <dialog> → .eqdir-dialog. None descend
 * from .eqdir-espace[data-theme="signature"], so the wrapper token remap never reaches
 * them and they inherit the global charter cream/orange. This stylesheet is enqueued ONLY
 * on a signature-espace page, so the modal roots can carry the remap themselves; scoping to
 * the modal-root containers leaves the page header/footer untouched. (.eqdir-docs__dialog is
 * intentionally NOT listed: it is rendered inside the wrapper, so it is already themed.) */
/* The FUNCTIONAL modals (confirm + pack-limit dialog) always take the Signature palette.
 * NB: the two PREVIEW modals (listing preview #eqdir-fiche-content, ad preview .eqdir-adprev)
 * are deliberately EXCLUDED below — a preview must show the REAL public appearance (the active
 * charter), not the Signature skin, or it would misrepresent how visitors see the listing.
 * These --eqdir-sig-* literals mirror the wrapper block above (lines ~20-25): the modal roots
 * are outside the wrapper and cannot inherit them — keep the two sets in sync if the palette
 * is retuned. */
.eqdir-confirm,
.eqdir-dialog,
.eqdir-modal-overlay:not(:has(#eqdir-fiche-content)):not(:has(.eqdir-adprev)) {
	--eqdir-sig-card: #ffffff;
	--eqdir-sig-ink: #1b2432;
	--eqdir-sig-muted: #64748b;
	--eqdir-sig-border: #dde3ec;
	--eqdir-sig-accent: #0e5a6b;
	--eqdir-sig-accent-weak: #e9f2f4;

	--l974-surface: var(--eqdir-sig-card);
	--l974-surface-alt: var(--eqdir-sig-card);
	--l974-border: var(--eqdir-sig-border);
	--l974-ink: var(--eqdir-sig-ink);
	--l974-text: var(--eqdir-sig-ink);
	--l974-text-muted: var(--eqdir-sig-muted);
	--l974-cta: var(--eqdir-sig-accent);
	--l974-cta-hover: #0b4a58;
	--l974-on-cta: #ffffff;
	/* Match the skin's squared geometry (otherwise the modal box/buttons keep the charter pills). */
	--l974-radius-lg: 10px;
	--l974-radius-md: 10px;
	--l974-radius-sm: 7px;
	--l974-radius-pill: 7px;
}

/* The destructive confirm button reads --l974-accent (the warm charter red), intentionally
 * not remapped above; match the wrapper's danger tone. */
.eqdir-confirm .eqdir-btn--danger,
.eqdir-dialog .eqdir-btn--danger,
.eqdir-modal-overlay:not(:has(#eqdir-fiche-content)):not(:has(.eqdir-adprev)) .eqdir-btn--danger {
	background: #b4232a;
	border-color: #b4232a;
	color: #fff;
}
