
.csfr-err
{
	padding: var(--padding-main);	
}
.csfr-err h1
{
	color: red;
}

.formConfirmation
{
	padding: var(--padding-main);		
}

form.form
{
	margin: var(--margin-details-gap) 0px;
	padding: var(--padding-main);
	display: grid;
	grid-gap: var(--grid-gap-standard);
	grid-template-columns: 1fr;		
	align-items: baseline;
}
form.form label
{
	text-wrap: balance;
	line-height: 1.5;
}
@media (min-width:1440px)
{
	form.form
	{
		grid-template-columns: 1fr 3fr;
	}
}
form.form h1,
form.form h2,
form.form p,
form.form nav,
form.form h2 + div
{
	grid-column: 1 / -1;
}

form.form input,
form.form textarea,
form.form select
{
	border-radius: var(--radius-tiny);
	padding: 11px 20px;    
    border-radius: var(--radius-small);
    background: var(--colour-base);
    border: 1px solid var(--colour-stroke);	
}

form.form h2
{
	grid-column: 1 / -1;
    color: var(--colour-main-text);
    font-size: var(--font-size-subject);
    font-weight: var(--font-weight-bold);	
}

form.form h2 ~ h2
{
	padding-top: 8px;
}

form.form nav
{	
	justify-self: end;
	display: flex;
    grid-gap: 16px;	
}

form.form fieldset
{
	display: flex;
	position: relative;
}

form.form fieldset input[type="radio"]
{	
    width: 1px;
    height: 1px;
    border: 0px;    
    outline: 0px;	
	padding: 0px;
    appearance: none;
    position: absolute;
	background: transparent;
	z-index: -1;	
	top: 100%;
	left: 50%;
}

form.form fieldset label:first-child
{
	border-top-left-radius: var(--radius-button);	
	border-bottom-left-radius: var(--radius-button);	
}

form.form fieldset label:last-child
{
	border-top-right-radius: var(--radius-button);	
	border-bottom-right-radius: var(--radius-button);	
}

form.form fieldset label
{	
	padding: 8px 20px;    
    border-radius: 0px;
    background: var(--colour-base);
	border-left: 1px dotted var(--colour-stroke);
    border-top: 1px solid var(--colour-stroke);
	border-bottom: 1px solid var(--colour-stroke);
}

form.form fieldset label:has(:checked)
{
	z-index: 1;
	background: var(--colour-main);
	color: var(--colour-text-over-main);
	animation: .2s click;
}

form.form table
{
	border-style: hidden; 
	box-shadow: 0 0 0 1px var(--colour-stroke);
	border-radius: var(--radius-small);
	width: 100%;		
	overflow: hidden;
	grid-column: 1 / -1;
}
form.form table tr
{
	height: 38px;
}
form.form table thead
{
	border-bottom: 1px solid var(--colour-stroke);
}
form.form table thead th
{
	padding: calc(.5 * var(--grid-gap-standard-vertical)) var(--grid-gap-standard-horizontal);
	font-weight: var(--font-weight-semi-bold);
	color: var(--colour-main-text);
}
form.form table tbody tr td
{
	color: var(--colour-secondary-text);
	padding: calc(.5 * var(--grid-gap-standard-vertical)) var(--grid-gap-standard-horizontal);
}
form.form table tbody tr td strong
{
	font-weight: normal;
	color: var(--colour-main-text);
}
form.form table tbody tr:nth-child(odd)
{
	background: var(--colour-base);
}