/* remotefilename=/web/css/FAQ.css
 *
 *	Copyright © 2025 by FKE Internet.  All rights reserved.
 *
 *	$Id: /web/css/FAQ.css,v $
 */
/**
*	CSS rulesets used by the FAQ system
*
*	Author:			Fred Koschara
*	Creation Date:	July eighteenth, 2025
*	Last Modified:	July 23, 2025 @ 2:03 pm
*
*	Revision History:
*	   Date		  by		Description
*	2025/07/23	wfredk	remove general .honeypot ruleset (not used for FAQ now)
*	2025/07/23	wfredk	remove most outline properties used for debugging
*	2025/07/23	wfredk	incorporate tested changes for responsive form layouts
*	2025/07/18	wfredk	original development
*/
/*								/* for debug * /
{	outline:1px solid red;
} */

form.faqForm
{	display:flex;
	flex-direction:column;
	gap:1em;
	margin:auto;
	max-width:1024px;
	width:100%;
}

.formRow
{	align-items:start;
	column-gap:0.5em;
	display:grid;
	grid-template-columns:12em 1fr;
	width:100%;
}
.formRow label
{	font-weight:bold;
	text-align:right;
	white-space:nowrap;
}
.formRow input[type="text"],
.formRow input[type="email"],
.formRow textarea
{	border:1px solid #999;
	border-radius:4px;
	font-size:1em;
	padding:0.5em;
	width:100%;
}

.formRow input.captcha5
{	font-size:14pt;
	text-align:center;
	width:96px;
}
.captchaRow
{	grid-template-columns:12em 1em 1fr;
}
.formRow .captchaNote
{	color:#e8e8cc;
	font-size:0.9em;
	grid-column:3;
	margin-right:1.25em;
	margin-top:0.25em;
}
.formRow img
{	grid-column:2;
	margin-left:-2px;
}

.formButtons
{	display:flex;
	flex-wrap:wrap;
	gap:1em;
	justify-content:center;
	margin-top:1.5em;
	width:100%;
}

.faqRightButton
{	background-color:#074723;
	color:gold;
	font-size:1em;
	font-weight:600;
	margin-left:7em;
	padding:0.5em 1.25em;
}

/* responsive stacking layout for small screens */
@media screen and (max-width:600px)
{	.formRow
	{	display:flex;
		flex-direction:column;
	}
	.formRow label,
	.requiredMarker
	{	text-align:left;
	}
	.formRow img
	{	margin-left:0;
	}
}

.faqQnA
{	margin-left:1.5em;
	text-indent:-1.5em
}

/* these should duplicate what's generally available, here for insurance */
.half
{	width:50%;
}
.margin1pct
{	margin:1%;
}
table.bareCenteredNoPad
{	border:0;
	margin:auto;
}

/* EOF: FAQ.css */
