/* DMCA takedown form — front-end styles. Enqueued only on the DMCA page
   template (see inc/enqueue/legal.php). Uses Tailwind palette variables
   (--bubblegum, --mint) so the form colours stay in sync with the active
   palette without re-declaring them. */

/* ─── Field validation state ──────────────────────────────── */

/* Highlights an input/textarea border in accent pink when JS marks the
   field invalid after a client-side validation pass. !important is needed
   to defeat Tailwind's utility classes set on the same element. */
.form-input--error {
	border-color: rgb(var(--bubblegum)) !important;
}

/* Per-field error message rendered immediately below the input. The fixed
   min-height prevents form layout shift as messages appear and disappear. */
.dmca-field-error {
	display: block;
	color: rgb(var(--bubblegum-soft));
	font-size: 0.7rem;
	font-family: var(--font-mono, ui-monospace, monospace);
	margin-top: 0.3rem;
	min-height: 1em;
}

/* ─── Decorative backdrop ─────────────────────────────────── */

/* Subtle pink-dot tiled pattern used behind the DMCA hero section. */
.dmca-radial-bg {
	background-image: radial-gradient(rgba(255, 45, 135, 0.18) 1px, transparent 1px);
	background-size: 18px 18px;
}

/* Oversized watermark glyph (e.g. "DMCA") behind the form headline. */
.dmca-watermark {
	font-size: clamp(80px, 16vw, 200px);
	color: rgb(var(--bubblegum));
}

/* ─── Post-submit success card ────────────────────────────── */

/* Mint-tinted circular checkmark icon shown when the submission succeeds. */
.dmca-success-icon {
	background: rgb(var(--mint) / 0.12);
	color: rgb(var(--mint));
}

/* Highlight colour used for the returned reference code on the success card. */
.dmca-success-ref {
	color: rgb(var(--bubblegum-soft));
}

/* ─── Top-of-form error banner ────────────────────────────── */

/* Pink-tinted banner shown above the form when submission fails. */
.dmca-global-error {
	border-color: rgb(var(--bubblegum) / 0.4);
	background: rgb(var(--bubblegum) / 0.08);
}

/* Pink-toned icon inside the global error banner. */
.dmca-global-error-icon {
	color: rgb(var(--bubblegum-soft));
}

/* ─── Field-specific sizing ───────────────────────────────── */

/* Taller textarea for the multi-URL "infringing URLs" field — one URL per line. */
.dmca-infringing-urls {
	min-height: 90px;
}