/**
 * post-form-contract.css
 *
 * Canonical posting-form presentation fixes (loaded after theme CSS).
 * QR compact presentation is excluded via :not(.qr-compact).
 */

form[name="post"]:not(.qr-compact) select[name="post_flag"]{
	box-sizing: border-box;
	width: auto;
	max-width: 100%;
	min-width: 12em;
	min-width: max(12em, -webkit-min-content);
	min-width: max(12em, min-content);
	field-sizing: content;
	line-height: normal;
	min-height: 2em;
	padding-block: 0.2em;
	padding-inline: 0.35em;
	overflow: visible;
}

/* --- Help affordance + floating details (posting form only) --- */

form[name="post"]:not(.qr-compact) .help-bubble{
	color: var(--theme-help-bubble-fg, var(--theme-help-bubble-color, var(--theme-content-fg)));
	background: var(--theme-help-bubble-bg);
	border: 1px solid var(--theme-help-bubble-border, var(--theme-reply-border));
	text-shadow: 0 0 1px rgba(0, 0, 0, 0.35);
}

form[name="post"]:not(.qr-compact) .help-details{
	background: var(--theme-help-details-bg, var(--theme-reply-bg));
	color: var(--theme-help-details-fg, var(--theme-content-fg));
	border: 1px solid var(--theme-help-details-border, var(--theme-reply-border, currentColor)) !important;
	box-shadow: var(--theme-floating-panel-shadow) !important;
	border-radius: 3px;
}

form[name="post"]:not(.qr-compact) .help-bubble:hover + .help-details,
form[name="post"]:not(.qr-compact) .help-details:hover{
	z-index: 25;
	overflow: auto;
	max-height: min(70vh, 32rem);
	-webkit-overflow-scrolling: touch;
}

form[name="post"]:not(.qr-compact) textarea ~ .help-details.markup-doc{
	width: max-content;
	min-width: min(18rem, calc(100vw - 2rem));
	max-width: min(26rem, calc(100vw - 2rem));
}

form[name="post"]:not(.qr-compact) .help-details:not(.markup-doc){
	width: min(22rem, calc(100vw - 2rem));
	max-width: min(22rem, calc(100vw - 2rem));
}

/* Markup help: vertical contract isolated from theme table/list rules */

form[name="post"]:not(.qr-compact) .help-details.markup-doc{
	box-sizing: border-box;
	columns: auto;
	column-width: auto;
	column-count: 1;
}

form[name="post"]:not(.qr-compact) .help-details.markup-doc dl{
	display: block;
	margin: 0 0 0.85em;
	padding: 0;
	break-inside: auto;
	-webkit-column-break-inside: auto;
}

form[name="post"]:not(.qr-compact) .help-details.markup-doc dl:last-child{
	margin-bottom: 0;
}

form[name="post"]:not(.qr-compact) .help-details.markup-doc dt{
	display: block;
	margin: 0 0 0.35em;
	padding: 0;
	font-size: 1.05em;
	font-weight: bold;
}

form[name="post"]:not(.qr-compact) .help-details.markup-doc dd{
	display: block;
	margin: 0 0 0.4em;
	padding: 0;
	list-style: none;
}

form[name="post"]:not(.qr-compact) .help-details.markup-doc dd:last-child{
	margin-bottom: 0;
}

form[name="post"]:not(.qr-compact) .help-details.markup-doc .dd-title{
	display: grid;
	grid-template-columns: minmax(0, auto) minmax(0, 1fr) minmax(0, auto);
	gap: 0.25em 0.75em;
	align-items: baseline;
}

form[name="post"]:not(.qr-compact) .help-details.markup-doc .dd-title code{
	display: inline-block;
	white-space: nowrap;
	font-family: monospace;
	font-size: 0.92em;
	word-break: normal;
	overflow-wrap: normal;
}

form[name="post"]:not(.qr-compact) .help-details.markup-doc .dd-title code + code{
	margin-left: 0;
}

form[name="post"]:not(.qr-compact) .help-details.markup-doc kbd.shortcut{
	float: none;
	display: inline-block;
	margin: 0;
	padding: 0;
	border: 0;
	background: transparent;
	font-family: inherit;
	font-size: 0.82em;
	line-height: inherit;
	opacity: 0.72;
	white-space: nowrap;
	text-align: right;
}

form[name="post"]:not(.qr-compact) .help-details.markup-doc .dd-example{
	display: block;
	margin: 0.15em 0 0;
	padding: 0 0 0 1ch;
	font-size: 0.9em;
	line-height: 1.35;
	white-space: normal;
	overflow-wrap: anywhere;
	word-break: break-word;
}

form[name="post"]:not(.qr-compact) .help-details.markup-doc p{
	margin: 0;
}

form[name="post"]:not(.qr-compact) .help-details table,
form[name="post"]:not(.qr-compact) .help-details thead,
form[name="post"]:not(.qr-compact) .help-details tbody,
form[name="post"]:not(.qr-compact) .help-details tr,
form[name="post"]:not(.qr-compact) .help-details th,
form[name="post"]:not(.qr-compact) .help-details td{
	display: block;
	width: auto;
	float: none;
	white-space: normal;
}