/**
 * SDB One Foundation — Patient Forms element.
 *
 * The .form-card itself is an Automatic.css Card (classes "card card--light"
 * on the element, added in bricks/element-patient-forms.php) — background,
 * border, radius, padding, heading colour, button colours, and the icon box
 * all come from ACSS's --card-*/--light-card-*/--icon-* tokens, targeted via
 * its [class*="__icon"] / heading-tag / [class*="btn--"] matching.
 *
 * Every wrapper div here also carries Bricks' own "brxe-block"/"brxe-container"
 * class (to match the reference markup), and Bricks' base CSS forces
 * flex-direction: column, align-items: flex-start and width: 100% on those —
 * see .brxe-block in frontend-layer.min.css. That rule is only 1 class of
 * specificity and (on this site) loads *after* Automatic.css's core file, so
 * it silently wins any tie — including over a --card-flex-direction override.
 * So every row-oriented element below sets flex-direction and width
 * explicitly rather than relying on flex's normal initial values.
 */

.sdb-pf-root {
	/*
	 * Bricks Containers are flex by default and don't always use
	 * align-items: stretch, which would otherwise shrink this element to
	 * fit-content width and center it instead of filling the container.
	 * !important because it's sat directly inside arbitrary Bricks Container/
	 * Section markup we don't control, and needs to win regardless of
	 * whatever flex-direction/align-items that parent ends up set to.
	 */
	display: block !important;
	width: 100% !important;
	max-width: 100% !important;
	flex: 1 1 100% !important;
	align-self: stretch !important;
	box-sizing: border-box;
}

.sdb-pf-root > .brxe-container {
	/* Fills whatever container the element is dropped into — Bricks' own
	   .brxe-container base sets a fixed 1100px width otherwise. */
	width: 100%;
}

.sdb-pf-root > .brxe-container + .brxe-container {
	margin-top: var( --space-xxl, 56px );
}

.sdb-pf-root .form-cards {
	display: flex;
	flex-direction: column;
	width: 100%;
	gap: var( --space-s, 14px );
	margin-top: var( --space-m, 24px );
}

.sdb-pf-root .form-card {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	width: 100%;
	--card-icon-size: 24px;
	--card-heading-size: var( --text-m, 1.05rem );
	--card-padding: var( --space-s, 14px );
}

.sdb-pf-root .form-card__main {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: var( --space-m, 18px );
	flex: 1 1 auto;
	width: auto;
	min-width: 0;
}

.sdb-pf-root .form-card__icon-wrapper {
	display: flex;
	flex: 0 0 auto;
	width: auto;
}

.sdb-pf-root .form-card__content {
	display: flex;
	flex-direction: column;
	gap: 6px;
	flex: 1 1 auto;
	width: auto;
	min-width: 0;
}

.sdb-pf-root .form-card__heading {
	margin: 0;
	font-weight: 700;
	line-height: 1.3;
}

.sdb-pf-root .form-card__info {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	width: auto;
}

.sdb-pf-root .form-card__badge {
	display: inline-block;
	padding: 4px 10px;
	border-radius: 0;
	background: var( --warning-light, #fef3c7 );
	color: var( --warning-dark, #92400e );
	font-size: 11px;
	font-weight: 700;
	line-height: 1;
	text-transform: uppercase;
	letter-spacing: .04em;
	white-space: nowrap;
}

.sdb-pf-root .form-card__badge.if-applicable {
	background: var( --neutral-light, #f1f5f9 );
	color: var( --neutral-dark, #64748b );
}

.sdb-pf-root .form-card__file-info {
	font-size: var( --text-s, 13px );
	color: var( --card-text-color, var( --text-dark-muted, #6b7280 ) );
	white-space: nowrap;
}

.sdb-pf-root .form-card__side {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 10px;
	flex: 0 0 auto;
	width: auto;
}

.sdb-pf-root .form-card__cta {
	white-space: nowrap;
}

@media ( max-width: 640px ) {
	.sdb-pf-root .form-card {
		flex-direction: column;
		align-items: stretch;
	}

	.sdb-pf-root .form-card__main {
		width: 100%;
	}

	.sdb-pf-root .form-card__side {
		flex-direction: column;
		align-items: stretch;
		width: 100%;
	}

	.sdb-pf-root .form-card__info {
		row-gap: 6px;
	}
}