/*****************************************************************
 *  COMMUNITY-SUBMISSIONS ▸ public form stylesheet
 *  -------------------------------------------------------------
 *  • Theme-agnostic – inherits typography & colours
 *  • All look-and-feel driven by CSS custom properties
 *  • Mobile-first, fully responsive
 *
 *  QUICK OVERRIDE EXAMPLE
 *  .neon-form{
 *      --neon-font-family : "Roboto", Arial, sans-serif;
 *      --neon-font-size   : 17px;
 *      --neon-bg          : #ffffff;
 *      --neon-border      : #d0d0d0;
 *      --neon-radius      : 10px;
 *      --neon-accent      : #e23a3a;   (buttons + focus)
 *  }
 *****************************************************************/

/* ---------- defaults / custom properties --------------------- */
.neon-form{
	/* design tokens */
	--neon-font-family : inherit;
	--neon-font-size   : 16px;
	--neon-bg          : #fff;          /* card background                */
	--neon-border      : #e3e3e3;
	--neon-border-dark : #c9d1d9;
	--neon-shadow      : 0 2px 6px rgba(0,0,0,.06);
	--neon-radius      : 8px;
	--neon-gap         : 1.75rem;
	--neon-accent      : #0073aa;       /* WordPress blue – change freely */

	/* card container */
	max-width   : 40rem;               /* ≈ 640 px – keeps lines readable */
	width       : 90%;
	margin      : 3rem auto 5rem;
	padding     : 2.5rem 2rem;
	background  : var(--neon-bg);
	border      : 1px solid var(--neon-border);
	border-radius: var(--neon-radius);
	box-shadow  : var(--neon-shadow);

	/* typography */
	font-family : var(--neon-font-family);
	font-size   : var(--neon-font-size);
	line-height : 1.45;
}

/* ---------- vertical rhythm ---------------------------------- */
.neon-form > *{
	display    : block;
	width      : 100%;
	margin     : 0 0 var(--neon-gap);
	box-sizing : border-box;
}

/* ---------- text-type controls ------------------------------- */
.neon-form input[type="text"],
.neon-form input[type="email"],
.neon-form select,
.neon-form textarea{
	display        : block;
	width          : 100%;
	padding        : .75rem .9rem;
	border         : 1px solid var(--neon-border-dark);
	border-radius  : 4px;
	background     : #fff;
	font           : inherit;
	text-transform : none;                  /* neutralise theme caps  */
	transition     : border-color .15s ease, box-shadow .15s ease;
}

.neon-form textarea{
	min-height : 10rem;
	resize     : vertical;
}

/* focus (WCAG AA) */
.neon-form input:focus,
.neon-form select:focus,
.neon-form textarea:focus{
	outline      : 0;
	border-color : var(--neon-accent);
	box-shadow   : 0 0 0 3px color-mix(in srgb, var(--neon-accent) 25%, transparent);
}

/* ---------- file upload -------------------------------------- */
.neon-form input[type="file"]{
	display       : block;      /* makes “no file selected” wrap   */
	width         : 100%;
	border        : 0;
	padding       : 0;
	background    : transparent;
	font          : inherit;
	margin-bottom : .75rem;     /* gap above the submit button     */
}

.neon-form input[type="file"]::file-selector-button{
	width         : 100%;
	padding       : .6rem 0;
	border-radius : 4px;
	border        : 1px solid var(--neon-accent);
	background    : color-mix(in srgb, var(--neon-accent) 75%, #fff);
	color         : #fff;
	font-weight   : 600;
	cursor        : pointer;
	transition    : background .15s ease;
}

.neon-form input[type="file"]::file-selector-button:hover{
	background: color-mix(in srgb, var(--neon-accent) 65%, #000);
}

/* ---------- primary button ----------------------------------- */
.neon-form button[type="submit"]{
	display       : block;
	width         : 100%;
	padding       : .9rem 1rem;
	border        : 0;
	border-radius : 4px;
	background    : var(--neon-accent);
	color         : #fff;
	font          : inherit;
	font-weight   : 600;
	cursor        : pointer;
	transition    : background .15s ease, transform .05s ease;
}

.neon-form button[type="submit"]:hover{
	background: color-mix(in srgb, var(--neon-accent) 85%, #000);
}
.neon-form button[type="submit"]:active{ transform: translateY(1px); }
.neon-form button[type="submit"]:disabled{
	opacity : .55;
	cursor  : not-allowed;
}

/* ---------- mobile tweaks ------------------------------------ */
@media (max-width:480px){
	.neon-form{ padding:1.5rem 1rem; }
}

/* ---------- kill Gutenberg & TagDiv artefacts ---------------- */
.wp-block-shortcode::before,                         /* classic shortcode block   */
[class*="tdb-block-shortcode"]::before,              /* TagDiv / Newspaper block */
[class*="tdb-block-shortcode"] .tdb-block-inner::before{
	display:none !important;      /* ✂ goodbye grey box */
	content:none !important;
}

/* ---------- neutralise theme list indents -------------------- */
.neon-form::before,
.neon-form > *::before{
	display:none !important;
	content:none !important;
}
.neon-form,
.neon-form > *{ margin-left:0 !important; }
/* TagDiv/Newspaper: hide the empty <code> tag that draws the grey box */
.td-page-content code:empty{
	display:none !important;
}
