/* =========================================================
   VINESITE FORM PAGES
   Shared styling for:
   - Single Site entry/edit
   - Single Sample entry/edit
   - Bulk Site entry
   - Bulk Sample entry
========================================================= */


/* =========================================================
   DESIGN TOKENS
========================================================= */

:root {
	--vs-green: #2c4d34;
	--vs-green-hover: #3b6645;
	--vs-maroon: #7a2c37;
	--vs-maroon-hover: #ad3e4b;
	--vs-cream: #f7f4eb;
	--vs-white: #ffffff;
	--vs-text: #48535d;
	--vs-muted: #6f7f8f;
	--vs-border: #dedbd2;
	--vs-border-light: #e8e5de;
	--vs-disabled: #f2f1ed;
	--vs-font: Roboto, Arial, sans-serif;
}


/* =========================================================
   GLOBAL FONT NORMALIZATION
========================================================= */

.ssPage,
.wineSiteEditPage,
.bulkEntryPage,
.bulkSamplePage,
.ssPage *,
.wineSiteEditPage *,
.bulkEntryPage *,
.bulkSamplePage *,
.ssPage *::before,
.ssPage *::after,
.wineSiteEditPage *::before,
.wineSiteEditPage *::after,
.bulkEntryPage *::before,
.bulkEntryPage *::after,
.bulkSamplePage *::before,
.bulkSamplePage *::after {
	box-sizing: border-box;
}

/* Apply Roboto to text-bearing elements without overriding icon fonts. */
.ssPage,
.wineSiteEditPage,
.bulkEntryPage,
.bulkSamplePage,
.ssPage h1,
.ssPage h2,
.ssPage h3,
.ssPage h4,
.ssPage h5,
.ssPage h6,
.ssPage p,
.ssPage label,
.ssPage span:not(.fa):not(.fas):not(.far):not(.fal):not(.fab),
.ssPage input,
.ssPage select,
.ssPage textarea,
.ssPage button,
.ssPage option,
.ssPage summary,
.wineSiteEditPage h1,
.wineSiteEditPage h2,
.wineSiteEditPage h3,
.wineSiteEditPage h4,
.wineSiteEditPage h5,
.wineSiteEditPage h6,
.wineSiteEditPage p,
.wineSiteEditPage label,
.wineSiteEditPage span:not(.fa):not(.fas):not(.far):not(.fal):not(.fab),
.wineSiteEditPage input,
.wineSiteEditPage select,
.wineSiteEditPage textarea,
.wineSiteEditPage button,
.wineSiteEditPage option,
.wineSiteEditPage summary,
.bulkEntryPage h1,
.bulkEntryPage h2,
.bulkEntryPage h3,
.bulkEntryPage h4,
.bulkEntryPage h5,
.bulkEntryPage h6,
.bulkEntryPage p,
.bulkEntryPage label,
.bulkEntryPage span:not(.fa):not(.fas):not(.far):not(.fal):not(.fab),
.bulkEntryPage input,
.bulkEntryPage select,
.bulkEntryPage textarea,
.bulkEntryPage button,
.bulkEntryPage option,
.bulkEntryPage summary,
.bulkSamplePage h1,
.bulkSamplePage h2,
.bulkSamplePage h3,
.bulkSamplePage h4,
.bulkSamplePage h5,
.bulkSamplePage h6,
.bulkSamplePage p,
.bulkSamplePage label,
.bulkSamplePage span:not(.fa):not(.fas):not(.far):not(.fal):not(.fab),
.bulkSamplePage input,
.bulkSamplePage select,
.bulkSamplePage textarea,
.bulkSamplePage button,
.bulkSamplePage option,
.bulkSamplePage summary {
	font-family: var(--vs-font);
}

/* Preserve Font Awesome icon fonts. */
.ssPage .fa,
.ssPage .fas,
.ssPage .far,
.ssPage .fal,
.ssPage .fab,
.wineSiteEditPage .fa,
.wineSiteEditPage .fas,
.wineSiteEditPage .far,
.wineSiteEditPage .fal,
.wineSiteEditPage .fab,
.bulkEntryPage .fa,
.bulkEntryPage .fas,
.bulkEntryPage .far,
.bulkEntryPage .fal,
.bulkEntryPage .fab,
.bulkSamplePage .fa,
.bulkSamplePage .fas,
.bulkSamplePage .far,
.bulkSamplePage .fal,
.bulkSamplePage .fab {
	font-family: inherit;
}

/* Font Awesome 4 */
.ssPage .fa,
.wineSiteEditPage .fa,
.bulkEntryPage .fa,
.bulkSamplePage .fa {
	font-family: FontAwesome !important;
}

/* Font Awesome 5/6 */
.ssPage .fas,
.wineSiteEditPage .fas,
.bulkEntryPage .fas,
.bulkSamplePage .fas {
	font-family: "Font Awesome 6 Free", "Font Awesome 5 Free" !important;
	font-weight: 900;
}

.ssPage .far,
.wineSiteEditPage .far,
.bulkEntryPage .far,
.bulkSamplePage .far {
	font-family: "Font Awesome 6 Free", "Font Awesome 5 Free" !important;
	font-weight: 400;
}

.ssPage .fab,
.wineSiteEditPage .fab,
.bulkEntryPage .fab,
.bulkSamplePage .fab {
	font-family: "Font Awesome 6 Brands", "Font Awesome 5 Brands" !important;
}


/* =========================================================
   SINGLE-ENTRY PAGE SHELL
========================================================= */

.ssPage,
.wineSiteEditPage {
	min-height: 100%;
	padding: 48px 24px 64px;
	color: var(--vs-text);
	background: var(--vs-cream);
	font-size: 14px;
}

.ssCard,
.wineSiteEditCard {
	width: 100%;
	max-width: 1000px;
	margin: 0 auto;
	padding: 42px 48px 36px;
	background: var(--vs-white);
	border: 1px solid rgba(44, 77, 52, 0.14);
	border-radius: 18px;
	box-shadow:
		0 18px 45px rgba(17, 17, 17, 0.08),
		0 3px 10px rgba(17, 17, 17, 0.04);
}


/* =========================================================
   SINGLE-ENTRY PAGE HEADER
========================================================= */

.ssHeader,
.wineSiteEditHeader {
	max-width: 830px;
	margin: 0 auto 30px;
	text-align: center;
}

.ssEyebrow,
.wineSiteEditEyebrow {
	margin-bottom: 8px;
	color: var(--vs-maroon);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.ssHeader h1,
.wineSiteEditHeader h1 {
	margin: 0;
	color: var(--vs-green);
	font-size: 30px;
	font-weight: 700;
	line-height: 1.15;
}

.ssHeader > p,
.wineSiteEditHeader > p {
	max-width: 680px;
	margin: 12px auto 0;
	color: var(--vs-text);
	font-size: 13px;
	font-weight: 400;
	line-height: 1.65;
}

.ssNotice,
.wineSitePrivacyNotice {
	display: inline-flex;
	align-items: flex-start;
	gap: 10px;
	max-width: 700px;
	margin-top: 20px;
	padding: 12px 16px;
	color: var(--vs-green);
	background: rgba(44, 77, 52, 0.07);
	border: 1px solid rgba(44, 77, 52, 0.14);
	border-radius: 10px;
	font-size: 13px;
	line-height: 1.5;
	text-align: left;
}

.ssNotice i,
.wineSitePrivacyNotice i {
	flex: 0 0 auto;
	margin-top: 3px;
}


/* =========================================================
   SHARED SECTION HEADERS
========================================================= */

.ssSection,
.wineSiteFormSection {
	margin-bottom: 28px;
	padding: 30px;
	background: var(--vs-white);
	border: 1px solid #e4e1da;
	border-radius: 14px;
}

.ssSection:last-of-type,
.wineSiteFormSection:last-of-type {
	margin-bottom: 24px;
}

.ssSectionHeader,
.wineSiteSectionHeader {
	display: flex;
	align-items: center;
	gap: 14px;
	margin-bottom: 26px;
	padding-bottom: 18px;
	border-bottom: 1px solid var(--vs-border-light);
}

.ssSectionIcon,
.wineSiteSectionIcon {
	display: flex;
	flex: 0 0 42px;
	align-items: center;
	justify-content: center;
	width: 42px;
	height: 42px;
	color: var(--vs-white);
	background: var(--vs-green);
	border-radius: 50%;
	font-size: 17px;
	box-shadow: 0 5px 12px rgba(44, 77, 52, 0.2);
}

.ssSectionHeader h2,
.wineSiteSectionHeader h2 {
	margin: 0;
	color: var(--vs-green);
	font-family: var(--vs-font);
	font-size: 21px;
	font-weight: 700;
	line-height: 1.25;
}

.ssSectionHeader p,
.wineSiteSectionHeader p {
	margin: 4px 0 0;
	color: var(--vs-muted);
	font-family: var(--vs-font);
	font-size: 13px;
	font-weight: 400;
	line-height: 1.45;
}


/* =========================================================
   UNIVERSAL FIELD LABELS
========================================================= */

.ssLabel,
.wineSiteLabel,
.bulkSiteField > label,
.sampleFieldLabel {
	display: flex;
	align-items: baseline;
	flex-wrap: wrap;
	justify-content: flex-start;
	gap: 0px;
	min-height: 0;
	margin: 0 0 7px;
	color: var(--vs-green);
	font-family: var(--vs-font);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.01em;
	line-height: 1.3;
}

.sampleFieldName {
	display: inline;
	color: inherit;
	font: inherit;
}

.sampleFieldUnit,
.bulkSiteField > label small {
	display: inline;
	margin: 0;
	color: var(--vs-muted);
	font-family: var(--vs-font);
	font-size: 12px;
	font-weight: 500;
	line-height: inherit;
	white-space: nowrap;
}

.requiredMarker,
.bulkRequiredMark {
	margin-left: 1px;
	color: var(--vs-maroon);
	font-weight: 700;
}

.ssLabelHint,
.wineSiteLabelHint {
	margin-left: 5px;
	color: var(--vs-muted);
	font-size: 12px;
	font-weight: 400;
}

.ssHelpText,
.wineSiteHelpText,
.bulkCoordinateHelp {
	margin-top: 5px;
	color: var(--vs-muted);
	font-size: 12px;
	line-height: 1.4;
}


/* =========================================================
   INFO ICON BUTTON
========================================================= */

.sampleFieldLabel .icon-btn,
.wineSiteLabel .icon-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 20px;
	width: 20px;
	height: 20px;
	margin: 0 0 0 2px;
	padding: 0;
	color: var(--vs-muted);
	background: transparent;
	border: 0;
	border-radius: 50%;
	font-size: 13px;
	line-height: 1;
	cursor: pointer;
}

.sampleFieldLabel .icon-btn:hover,
.sampleFieldLabel .icon-btn:focus,
.wineSiteLabel .icon-btn:hover,
.wineSiteLabel .icon-btn:focus {
	color: var(--vs-green);
	background: rgba(44, 77, 52, 0.08);
	outline: none;
}


/* =========================================================
   INPUTS, SELECTS, AND TEXTAREAS
========================================================= */

.ssPage .form-control,
.ssPage .form-select,
.wineSiteEditPage .form-control,
.wineSiteEditPage .form-select,
.bulkEntryPage .form-control,
.bulkEntryPage .form-select,
.bulkSamplePage .form-control,
.bulkSamplePage .form-select {
	width: 100%;
	min-height: 45px;
	padding: 10px 13px;
	color: var(--vs-text);
	background: var(--vs-white);
	border: 1px solid #cccccc;
	border-radius: 8px;
	font-family: var(--vs-font);
	font-size: 14px;
	font-weight: 400;
	line-height: 1.4;
	box-shadow: none;
	transition:
		border-color 0.18s ease,
		box-shadow 0.18s ease,
		background-color 0.18s ease;
}

.ssPage .form-control::placeholder,
.wineSiteEditPage .form-control::placeholder,
.bulkEntryPage .form-control::placeholder,
.bulkSamplePage .form-control::placeholder {
	color: #9aa3ab;
	opacity: 1;
}

.ssPage .form-control:hover,
.ssPage .form-select:hover,
.wineSiteEditPage .form-control:hover,
.wineSiteEditPage .form-select:hover,
.bulkEntryPage .form-control:hover,
.bulkEntryPage .form-select:hover,
.bulkSamplePage .form-control:hover,
.bulkSamplePage .form-select:hover {
	border-color: #9da8a0;
}

.ssPage .form-control:focus,
.ssPage .form-select:focus,
.wineSiteEditPage .form-control:focus,
.wineSiteEditPage .form-select:focus,
.bulkEntryPage .form-control:focus,
.bulkEntryPage .form-select:focus,
.bulkSamplePage .form-control:focus,
.bulkSamplePage .form-select:focus {
	color: var(--vs-text);
	background: var(--vs-white);
	border-color: var(--vs-green-hover);
	box-shadow: 0 0 0 3px rgba(44, 77, 52, 0.12);
	outline: none;
}

.ssPage .form-control:disabled,
.ssPage .form-select:disabled,
.wineSiteEditPage .form-control:disabled,
.wineSiteEditPage .form-select:disabled,
.bulkEntryPage .form-control:disabled,
.bulkEntryPage .form-select:disabled,
.bulkSamplePage .form-control:disabled,
.bulkSamplePage .form-select:disabled {
	color: var(--vs-muted);
	background: var(--vs-disabled);
	border-color: #d8d5ce;
	cursor: not-allowed;
	opacity: 0.85;
}

.ssPage textarea.form-control,
.wineSiteEditPage textarea.form-control,
.bulkEntryPage textarea.form-control,
.bulkSamplePage textarea.form-control {
	min-height: 110px;
	resize: vertical;
}

.sampleNotesField {
	min-height: 96px;
	text-align: left;
}

.ssPage input[type="number"],
.wineSiteEditPage input[type="number"],
.bulkEntryPage input[type="number"],
.bulkSamplePage input[type="number"] {
	appearance: textfield;
}

.ssPage input[type="number"]::-webkit-inner-spin-button,
.ssPage input[type="number"]::-webkit-outer-spin-button,
.wineSiteEditPage input[type="number"]::-webkit-inner-spin-button,
.wineSiteEditPage input[type="number"]::-webkit-outer-spin-button,
.bulkEntryPage input[type="number"]::-webkit-inner-spin-button,
.bulkEntryPage input[type="number"]::-webkit-outer-spin-button,
.bulkSamplePage input[type="number"]::-webkit-inner-spin-button,
.bulkSamplePage input[type="number"]::-webkit-outer-spin-button {
	margin: 0;
}


/* =========================================================
   VALIDATION
========================================================= */

.ssPage .form-control.ng-invalid.ng-touched,
.ssPage .form-select.ng-invalid.ng-touched,
.wineSiteEditPage .form-control.ng-invalid.ng-touched,
.wineSiteEditPage .form-select.ng-invalid.ng-touched,
.bulkEntryPage .form-control.ng-invalid.ng-touched,
.bulkEntryPage .form-select.ng-invalid.ng-touched,
.bulkSamplePage .form-control.ng-invalid.ng-touched,
.bulkSamplePage .form-select.ng-invalid.ng-touched {
	border-color: rgba(122, 44, 55, 0.7);
}

.ssPage .form-control.ng-invalid.ng-touched:focus,
.ssPage .form-select.ng-invalid.ng-touched:focus,
.wineSiteEditPage .form-control.ng-invalid.ng-touched:focus,
.wineSiteEditPage .form-select.ng-invalid.ng-touched:focus,
.bulkEntryPage .form-control.ng-invalid.ng-touched:focus,
.bulkEntryPage .form-select.ng-invalid.ng-touched:focus,
.bulkSamplePage .form-control.ng-invalid.ng-touched:focus,
.bulkSamplePage .form-select.ng-invalid.ng-touched:focus {
	border-color: var(--vs-maroon);
	box-shadow: 0 0 0 3px rgba(122, 44, 55, 0.12);
}

.ssFieldError,
.wineSiteFieldError,
.fieldValidationMessage {
	display: block;
	margin-top: 6px;
	color: var(--vs-maroon);
	font-size: 12px;
	font-weight: 500;
	line-height: 1.4;
}

.ssValidation,
.wineSiteValidationSummary,
.validationErrors {
	display: flex;
	align-items: flex-start;
	gap: 13px;
	margin: 4px 26px 24px;
	padding: 15px 17px;
	color: var(--vs-maroon);
	background: rgba(122, 44, 55, 0.07) !important;
	border: 1px solid rgba(122, 44, 55, 0.22);
	border-left: 4px solid var(--vs-maroon);
	border-radius: 9px;
	font-size: 13px;
	line-height: 1.5;
}

.ssValidationIcon,
.wineSiteValidationIcon {
	flex: 0 0 auto;
	margin-top: 2px;
	font-size: 17px;
}

.ssValidation strong,
.wineSiteValidationSummary strong {
	display: block;
	margin-bottom: 4px;
	font-weight: 700;
}

.ssValidation ul,
.wineSiteValidationSummary ul,
.validationErrors ul {
	margin: 0;
	padding-left: 19px;
}


/* =========================================================
   SINGLE-ENTRY LOCATION AND MEASUREMENTS
========================================================= */

.ssLocationBox,
.wineSiteLocationBox {
	padding: 18px;
	background: #fbfaf7;
	border: 1px solid #e2ded5;
	border-radius: 10px;
}

.ssLocationFooter,
.wineSiteLocationFooter {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	margin-top: 14px;
	padding-top: 14px;
	border-top: 1px solid #e2ded5;
}

.ssCoordinates,
.wineSiteCoordinates {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 18px;
	color: var(--vs-muted);
	font-size: 12px;
	line-height: 1.4;
}

.ssCoordinates strong,
.wineSiteCoordinates strong {
	color: var(--vs-green);
}

.ssSpacingGroup,
.wineSiteSpacingGroup,
.bulkSpacingGroup {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
	align-items: center;
	gap: 10px;
}

.ssSpacingDivider,
.wineSiteSpacingDivider,
.bulkSpacingSymbol {
	color: var(--vs-muted);
	font-size: 16px;
	font-weight: 700;
	text-align: center;
}

.ssMeasurement,
.wineSiteMeasurement {
	display: flex;
	align-items: stretch;
	min-width: 0;
}

.ssMeasurement .form-control,
.wineSiteMeasurement .form-control {
	min-width: 0;
	border-radius: 8px 0 0 8px;
}

.ssMeasurement > span,
.wineSiteMeasurement > span,
.input-group-text {
	display: flex;
	align-items: center;
	justify-content: center;
	min-width: 46px;
	padding: 0 11px;
	color: var(--vs-green);
	background: rgba(44, 77, 52, 0.07);
	border-color: #cccccc;
	font-size: 12px;
	font-weight: 700;
	white-space: nowrap;
}


/* =========================================================
   SHARED BULK PAGE SHELL
========================================================= */

.bulkEntryPage,
.bulkSamplePage {
	min-height: 100%;
	padding: 32px 24px 56px;
	color: var(--vs-text);
	background: var(--vs-cream);
	font-size: 14px;
}

.bulkSampleCard {
	width: 100%;
	max-width: 1500px;
	margin: 0 auto;
	overflow: hidden;
	background: var(--vs-white);
	border: 1px solid var(--vs-border);
	border-radius: 18px;
	box-shadow: 0 14px 34px rgba(17, 17, 17, 0.08);
}


/* =========================================================
   SHARED BULK PAGE HEADER
========================================================= */

.bulkSampleHeader {
	padding: 30px 36px 26px;
	color: var(--vs-text);
	background: var(--vs-white);
	border-bottom: 1px solid #e4e1da;
}

.bulkSampleHeaderText {
	max-width: 980px;
}

.bulkSampleHeader h1 {
	margin: 0;
	color: #3f443f;
	font-family: var(--vs-font);
	font-size: clamp(28px, 3vw, 34px);
	font-weight: 700;
	line-height: 1.15;
}

.bulkSampleHeader p {
	max-width: 900px;
	margin: 10px 0 0;
	color: var(--vs-muted);
	font-family: var(--vs-font);
	font-size: 14px;
	font-weight: 400;
	line-height: 1.6;
}


/* =========================================================
   SHARED BULK CARD LIST
========================================================= */

.bulkSiteList {
	display: grid;
	gap: 22px;
	padding: 26px;
}

.bulkSiteEntry,
.bulkSampleEntry {
	overflow: hidden;
	background: #ffffff;
	border: 1px solid #dcd8cf;
	border-radius: 14px;
	box-shadow: 0 5px 16px rgba(17, 17, 17, 0.04);
}

.bulkSiteEntryHeader,
.bulkSampleEntryHeader {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	min-height: 58px;
	padding: 14px 18px;
	background: #f4efe4;
	border-bottom: 1px solid #e4e1da;
}

.bulkSiteEntryTitle {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 9px;
	min-width: 0;
}

.bulkSiteNumber {
	color: var(--vs-green);
	font-size: 15px;
	font-weight: 700;
	line-height: 1.25;
}

.bulkSiteNamePreview {
	overflow: hidden;
	color: var(--vs-muted);
	font-size: 13px;
	font-weight: 500;
	line-height: 1.3;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.bulkSiteEntryActions {
	display: flex;
	align-items: center;
	gap: 8px;
}

.bulkRemoveButton {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	padding: 0;
	color: var(--vs-maroon);
	background: var(--vs-white);
	border: 1px solid rgba(122, 44, 55, 0.28);
	border-radius: 8px;
	font-size: 14px;
	transition:
		color 0.18s ease,
		background-color 0.18s ease,
		border-color 0.18s ease,
		transform 0.18s ease;
}

.bulkRemoveButton:hover,
.bulkRemoveButton:focus {
	color: var(--vs-white);
	background: var(--vs-maroon);
	border-color: var(--vs-maroon);
	transform: translateY(-1px);
}

.bulkRemoveButton:disabled {
	color: #a98f93;
	background: #f4f1f1;
	border-color: #ddd4d6;
	cursor: not-allowed;
	opacity: 0.65;
	transform: none;
}

.bulkSiteEntryBody,
.bulkSampleEntryBody {
	display: grid;
	gap: 20px;
	padding: 24px;
}


/* =========================================================
   SHARED BULK CARD SECTIONS
========================================================= */

.bulkSiteSection,
.bulkSampleSection {
	margin: 0;
	padding: 24px;
	background: var(--vs-white);
	border: 1px solid #e4e1da;
	border-radius: 12px;
}

.bulkSiteSection .wineSiteSectionHeader,
.bulkSampleSection .wineSiteSectionHeader {
	margin-bottom: 20px;
	padding-bottom: 15px;
}

.bulkSiteSectionFull {
	grid-column: 1 / -1;
}


/* =========================================================
   SHARED BULK FIELD LAYOUT
========================================================= */

.bulkSiteFieldGrid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 18px 20px;
}

.bulkSiteField {
	display: flex;
	min-width: 0;
	flex-direction: column;
	justify-content: flex-start;
}

.bulkSiteFieldWide {
	grid-column: span 2;
}

.bulkSiteField > .form-control,
.bulkSiteField > .form-select,
.bulkSiteField > .input-group {
	margin-top: 0;
}


/* =========================================================
   BULK SAMPLE ANALYSIS
========================================================= */

.bulkAnalysisTabs {
	margin: 18px 0 22px !important;
}

.sampleAnalysisTab,
.bulkSampleAnalysisTab {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 40px;
	padding: 8px 18px !important;
	color: var(--vs-green);
	background: var(--vs-white);
	border: 1px solid rgba(44, 77, 52, 0.32);
	border-radius: 8px;
	font-size: 13px;
	font-weight: 700;
	box-shadow: none;
}

.sampleAnalysisTab:hover,
.sampleAnalysisTab:focus,
.bulkSampleAnalysisTab:hover,
.bulkSampleAnalysisTab:focus,
.sampleAnalysisTab.active,
.bulkSampleAnalysisTab.active {
	color: var(--vs-white);
	background: var(--vs-green);
	border-color: var(--vs-green);
}

.bulkAnalysisSection .row,
.bulkVintageSection .row {
	row-gap: 16px;
}

.sampleAnalysisNotice {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 14px 16px;
	color: var(--vs-muted);
	background: #fbfaf7;
	border: 1px solid #e4e1da;
	border-radius: 9px;
}

.sampleAnalysisNotice p {
	margin: 0;
}


/* =========================================================
   COLLAPSIBLE VINTAGE SECTION
========================================================= */

.bulkVintageDetails {
	overflow: hidden;
	background: var(--vs-white);
	border: 1px solid #e4e1da;
	border-radius: 12px;
}

.bulkVintageSummary {
	display: block;
	padding: 24px;
	cursor: pointer;
	list-style: none;
}

.bulkVintageSummary::-webkit-details-marker {
	display: none;
}

.bulkVintageSummary .wineSiteSectionHeader {
	margin: 0;
	padding: 0;
	border: 0;
}

.bulkVintageSummaryText {
	min-width: 0;
	flex: 1 1 auto;
}

.bulkVintageSummaryChevron {
	display: flex;
	align-items: center;
	justify-content: center;
	margin-left: auto;
	color: var(--vs-muted);
	transition: transform 0.18s ease;
}

.bulkVintageDetails[open] .bulkVintageSummaryChevron {
	transform: rotate(180deg);
}

.bulkVintageDetails .bulkVintageSection {
	border: 0;
	border-top: 1px solid #e4e1da;
	border-radius: 0;
}


/* =========================================================
   BULK ADD / EMPTY AREAS
========================================================= */

.bulkBottomAddArea {
	display: flex;
	justify-content: center;
	padding: 4px 0 8px;
}

.bulkSiteEmptyState {
	padding: 42px 24px;
	color: var(--vs-muted);
	text-align: center;
	background: #fbfaf7;
	border: 1px dashed #cbc7bd;
	border-radius: 12px;
}

.bulkSiteEmptyState > i {
	margin-bottom: 12px;
	color: var(--vs-green);
	font-size: 28px;
}

.bulkSiteEmptyState h2 {
	margin: 0 0 7px;
	color: var(--vs-green);
	font-size: 19px;
	font-weight: 700;
}

.bulkSiteEmptyState p {
	margin: 0 0 18px;
}


/* =========================================================
   BUTTONS AND FORM ACTIONS
========================================================= */

.ssActions,
.wineSiteFormActions {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	gap: 12px;
	padding: 8px 26px 28px;
}

.ssSaveButton,
.ssCancelButton,
.wineSiteSaveButton,
.wineSiteCancelButton,
.bulkAddButton,
.bulkRowMapButton {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 42px;
	padding: 9px 18px;
	border-radius: 8px;
	font-family: var(--vs-font);
	font-size: 14px;
	font-weight: 700;
	line-height: 1.2;
	text-decoration: none;
	transition:
		background-color 0.18s ease,
		border-color 0.18s ease,
		color 0.18s ease,
		transform 0.18s ease,
		box-shadow 0.18s ease;
}

.ssSaveButton,
.wineSiteSaveButton,
.bulkAddButton {
	color: var(--vs-white);
	background: var(--vs-maroon);
	border: 1px solid var(--vs-maroon);
}

.ssSaveButton:hover,
.ssSaveButton:focus,
.wineSiteSaveButton:hover,
.wineSiteSaveButton:focus,
.bulkAddButton:hover,
.bulkAddButton:focus {
	color: var(--vs-white);
	background: var(--vs-maroon-hover);
	border-color: var(--vs-maroon-hover);
	box-shadow: 0 7px 16px rgba(122, 44, 55, 0.22);
	transform: translateY(-1px);
}

.ssCancelButton,
.wineSiteCancelButton,
.bulkRowMapButton {
	color: var(--vs-green);
	background: var(--vs-white);
	border: 1px solid var(--vs-green);
}

.ssCancelButton:hover,
.ssCancelButton:focus,
.wineSiteCancelButton:hover,
.wineSiteCancelButton:focus,
.bulkRowMapButton:hover,
.bulkRowMapButton:focus {
	color: var(--vs-white);
	background: var(--vs-green-hover);
	border-color: var(--vs-green-hover);
	box-shadow: 0 7px 16px rgba(44, 77, 52, 0.18);
	transform: translateY(-1px);
}

.ssSaveButton:disabled,
.wineSiteSaveButton:disabled,
.bulkAddButton:disabled {
	color: rgba(255, 255, 255, 0.82);
	background: #a98f93;
	border-color: #a98f93;
	box-shadow: none;
	cursor: not-allowed;
	opacity: 0.7;
	transform: none;
}


/* =========================================================
   CHECKBOXES AND RADIO BUTTONS
========================================================= */

.form-check {
	display: flex;
	align-items: flex-start;
	gap: 8px;
}

.form-check-input {
	width: 17px;
	height: 17px;
	margin-top: 2px;
	border-color: #9da8a0;
	box-shadow: none;
}

.form-check-input:checked {
	background: var(--vs-green);
	border-color: var(--vs-green);
}

.form-check-input:focus {
	border-color: var(--vs-green-hover);
	box-shadow: 0 0 0 3px rgba(44, 77, 52, 0.12);
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 1199.98px) {
	.bulkSiteFieldGrid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 991.98px) {
	.ssPage,
	.wineSiteEditPage {
		padding: 32px 18px 48px;
	}

	.ssCard,
	.wineSiteEditCard {
		padding: 34px 30px 30px;
	}

	.ssSection,
	.wineSiteFormSection {
		padding: 25px;
	}
}

@media (max-width: 767.98px) {
	.ssPage,
	.wineSiteEditPage,
	.bulkEntryPage,
	.bulkSamplePage {
		padding: 18px 12px 36px;
	}

	.ssCard,
	.wineSiteEditCard {
		padding: 28px 18px 24px;
		border-radius: 14px;
	}

	.bulkSampleHeader {
		padding: 24px 20px 21px;
	}

	.bulkSiteList {
		padding: 18px;
	}

	.bulkSiteEntryHeader,
	.bulkSampleEntryHeader {
		padding: 12px 14px;
	}

	.bulkSiteEntryBody,
	.bulkSampleEntryBody {
		padding: 17px;
	}

	.bulkSiteSection,
	.bulkSampleSection,
	.bulkVintageSummary {
		padding: 18px 16px;
	}

	.bulkSiteFieldGrid {
		grid-template-columns: 1fr;
	}

	.bulkSiteFieldWide {
		grid-column: auto;
	}

	.ssSectionHeader,
	.wineSiteSectionHeader {
		align-items: flex-start;
	}

	.ssSectionIcon,
	.wineSiteSectionIcon {
		flex-basis: 38px;
		width: 38px;
		height: 38px;
		font-size: 15px;
	}

	.ssSectionHeader h2,
	.wineSiteSectionHeader h2 {
		font-size: 19px;
	}

	.ssLocationFooter,
	.wineSiteLocationFooter,
	.ssActions,
	.wineSiteFormActions {
		align-items: stretch;
		flex-direction: column;
	}

	.ssSaveButton,
	.ssCancelButton,
	.wineSiteSaveButton,
	.wineSiteCancelButton,
	.bulkAddButton,
	.bulkRowMapButton {
		width: 100%;
	}

	.ssSpacingGroup,
	.wineSiteSpacingGroup,
	.bulkSpacingGroup {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 420px) {
	.ssPage,
	.wineSiteEditPage,
	.bulkEntryPage,
	.bulkSamplePage {
		padding-right: 8px;
		padding-left: 8px;
	}

	.ssCard,
	.wineSiteEditCard,
	.bulkSiteList {
		padding-right: 14px;
		padding-left: 14px;
	}

	.bulkSiteEntryTitle {
		align-items: flex-start;
		flex-direction: column;
		gap: 3px;
	}

	.bulkSiteNamePreview {
		max-width: 220px;
	}
}


/* =========================================================
   FINAL FONT OVERRIDES
   Prevent global heading styles from switching to a serif font.
========================================================= */

.bulkEntryPage .wineSiteSectionHeader h2,
.bulkSamplePage .wineSiteSectionHeader h2,
.bulkEntryPage .bulkVintageSummary h2,
.bulkSamplePage .bulkVintageSummary h2,
.bulkEntryPage .bulkSiteEmptyState h2,
.bulkSamplePage .bulkSiteEmptyState h2,
.bulkEntryPage .bulkSampleHeader h1,
.bulkSamplePage .bulkSampleHeader h1 {
	font-family: Roboto, Arial, sans-serif !important;
	font-style: normal !important;
	font-variant: normal !important;
	text-transform: none;
}

/* Preserve Font Awesome inside section icons and action buttons. */
.bulkEntryPage .wineSiteSectionIcon i,
.bulkSamplePage .wineSiteSectionIcon i,
.bulkEntryPage button i,
.bulkSamplePage button i {
	font-style: normal;
}

/* =========================================================
   BULK SAMPLE GRID CORRECTIONS
========================================================= */

/* Keep Sample Information compact: two equal columns. */
.bulkSamplePage .bulkSampleTwoColumnGrid {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

/* Analysis fields remain compact instead of stretching full width. */
.bulkSamplePage .bulkSampleAnalysisGrid {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

/* Vintage uses two equal columns so every row is visually balanced. */
.bulkSamplePage .bulkSampleVintageGrid {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

/* The details element is already the section, so remove old nested styling. */
.bulkSamplePage details.bulkSiteSection.bulkVintageDetails {
	padding: 0;
	background: #ffffff;
	border: 1px solid #e4e1da;
	border-radius: 12px;
}

.bulkSamplePage details.bulkSiteSection.bulkVintageDetails > .bulkVintageSummary {
	padding: 24px;
}

.bulkSamplePage details.bulkSiteSection.bulkVintageDetails > .bulkVintageContent {
	padding: 0 24px 24px;
	border-top: 1px solid #e8e5de;
}

.bulkSamplePage .bulkVintageContent > .bulkSampleVintageGrid {
	padding-top: 22px;
}

.bulkSamplePage .bulkSampleNotesField {
	margin-top: 20px;
}

.bulkSamplePage .bulkSampleGridSpacer {
	visibility: hidden;
	pointer-events: none;
}

@media (max-width: 767.98px) {
	.bulkSamplePage .bulkSampleTwoColumnGrid,
	.bulkSamplePage .bulkSampleAnalysisGrid,
	.bulkSamplePage .bulkSampleVintageGrid {
		grid-template-columns: 1fr;
	}

	.bulkSamplePage details.bulkSiteSection.bulkVintageDetails > .bulkVintageSummary {
		padding: 18px 16px;
	}

	.bulkSamplePage details.bulkSiteSection.bulkVintageDetails > .bulkVintageContent {
		padding: 0 16px 18px;
	}

	.bulkSamplePage .bulkSampleGridSpacer {
		display: none;
	}
}

.sampleEditPage .sampleRadioFieldset .sampleRadioGroup {
	display: flex !important;
	flex-direction: column !important;
	align-items: flex-start !important;
	gap: .45rem !important;

	width: 100%;
	margin: 0;
	padding: 2px 0 0;
}

.sampleEditPage .sampleRadioFieldset .sampleRadioOption {
	display: flex !important;
	align-items: center !important;
	gap: .55rem;

	margin: 0;
	padding: 0;

	font-family: var(--vs-font);
	font-size: 0.92rem;
	font-weight: 400;
	line-height: 1.25;

	cursor: pointer;
}

.sampleEditPage .sampleRadioFieldset .sampleRadioText {
	font-family: var(--vs-font);
	font-size: 0.8rem;
	font-weight: 400;
	line-height: 1.25;
	color: var(--vs-text);
}

.sampleEditPage .sampleRadioFieldset input[type="radio"] {
	width: 17px;
	height: 17px;
	margin: 0;

	accent-color: var(--vs-maroon);

	flex-shrink: 0;
}

.wineSiteOtherLabel {
	color: #7a2c37;
	font-weight: 700;
}

/* =========================================================
   SAMPLE DATE PICKER
========================================================= */

.sampleDateGroup {
	display: flex !important;
	flex-wrap: nowrap !important;
	align-items: stretch;
	width: 100%;

	overflow: hidden;
	border: 1px solid #cccccc;
	border-radius: 8px;
	background: #fff;
}

.sampleDateGroup:focus-within {
	border-color: var(--vs-green-hover);
	box-shadow: 0 0 0 3px rgba(44, 77, 52, 0.12);
}

.sampleDateGroup .form-control {
	flex: 1 1 auto;
	min-width: 0;

	border: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
}

.sampleDateGroup .form-control:focus {
	border: none !important;
	box-shadow: none !important;
}

.sampleDateGroup .sampleCalendarButton {
	flex: 0 0 46px;
	width: 46px;

	display: flex;
	align-items: center;
	justify-content: center;

	border: 0 !important;
	border-left: 1px solid #cccccc !important;
	border-radius: 0 !important;

	background: #fff;
}

.sampleDateGroup .sampleCalendarButton:hover {
	background: #f8f8f8;
	color: var(--vs-green);
}

.sampleDateGroup .sampleCalendarButton i {
	font-size: 15px;
}

/* =========================================================
   SAMPLE EDIT FREEZE-FRAME / STICKY SECTION LAYOUT
   Requires these HTML classes:
   - form: sampleStickyForm
   - Sample Name and Site section: sampleIdentitySticky
   - wrapper around all remaining sections/actions:
     sampleSectionScroll
========================================================= */

/*
   Use nearly the full available browser height.
   The page itself does not scroll on desktop; only the content
   beneath Sample Name and Site scrolls.
*/
.sampleEditPage {
	height: calc(100vh - 72px);
	min-height: 720px;
	padding: 20px 24px;
	overflow: hidden;
}

.sampleEditPage > .container-fluid {
	height: 100%;
	min-height: 0;
}

.sampleEditPage .sampleEditCard {
	display: flex;
	width: 100%;
	max-width: 1100px;
	height: 100%;
	min-height: 0;
	flex-direction: column;
	padding: 22px 30px 20px;
	overflow: hidden;
}

/* Keep the page title compact so more form content is visible. */
.sampleEditPage .wineSiteEditHeader {
	flex: 0 0 auto;
	margin-bottom: 16px;
}

.sampleEditPage .wineSiteEditHeader h1 {
	font-size: 27px;
}

.sampleEditPage .wineSiteEditHeader > p {
	margin-top: 7px;
	line-height: 1.45;
}

/* Form becomes the height-managed flex container. */
.sampleEditPage .sampleStickyForm {
	display: flex;
	flex: 1 1 auto;
	min-height: 0;
	flex-direction: column;
	overflow: hidden;
}

/*
   The complete Sample Name and Site section stays visible.
   It never scrolls underneath another section.
*/
.sampleEditPage .sampleIdentitySticky {
	position: relative;
	z-index: 40;
	flex: 0 0 auto;
	margin-bottom: 14px;
	padding: 18px 22px;
	background: #ffffff;
	border-color: #dcd8cf;
	box-shadow: 0 8px 18px rgba(17, 17, 17, 0.07);
}

.sampleEditPage .sampleIdentitySticky .wineSiteSectionHeader {
	margin-bottom: 14px;
	padding-bottom: 12px;
}

.sampleEditPage .sampleIdentitySticky .wineSiteSectionIcon {
	flex-basis: 36px;
	width: 36px;
	height: 36px;
	font-size: 15px;
}

.sampleEditPage .sampleIdentitySticky .wineSiteSectionHeader h2 {
	font-size: 19px;
}

/*
   Only Analysis Results, Vintage Information, validation,
   and the form buttons scroll.
*/
.sampleEditPage .sampleSectionScroll {
	position: relative;
	flex: 1 1 auto;
	min-height: 0;
	padding: 0 8px 26px 0;
	overflow-x: hidden;
	overflow-y: auto;
	scrollbar-gutter: stable;
	overscroll-behavior: contain;
	scroll-padding-top: 80px;
}

/*
   Section containers must allow sticky children to escape.
*/
.sampleEditPage .sampleSectionScroll > .wineSiteFormSection {
	position: relative;
	overflow: visible;
}

/*
   Analysis Results remains visible at the top of the lower
   scrolling area. This header is placed directly inside
   .sampleSectionScroll, above .sampleAnalysisSection.
*/
.sampleEditPage .sampleAnalysisStickyHeader {
	position: sticky;
	top: 0;
	z-index: 35;
	min-height: 65px;
	margin: 0;
	padding: 14px 22px;
	background: #ffffff;
	border: 1px solid #e4e1da;
	border-bottom: 1px solid var(--vs-border-light);
	border-radius: 12px 12px 0 0;
	box-shadow: none;
}

.sampleEditPage
.sampleAnalysisStickyHeader
.wineSiteSectionIcon {
	flex-basis: 36px;
	width: 36px;
	height: 36px;
	font-size: 15px;
}

.sampleEditPage .sampleAnalysisStickyHeader h2 {
	font-size: 19px;
}

/* Compact lower sections so more analysis fields fit on screen. */
.sampleEditPage .sampleSectionScroll > .wineSiteFormSection {
	margin-bottom: 18px;
	padding: 22px;
}

/*
   Vintage Information scrolls normally until it reaches the
   Analysis Results header, then remains directly beneath it.
*/
.sampleEditPage
.sampleVintageSection
> .wineSiteSectionHeader {
	position: sticky;
	top: 65px;
	z-index: 34;
	min-height: 61px;
	margin: -22px -22px 18px;
	padding: 12px 22px;
	background: #ffffff;
	border-bottom: 1px solid var(--vs-border-light);
	border-radius: 12px 12px 0 0;
	box-shadow: 0 5px 10px rgba(17, 17, 17, 0.055);
}

.sampleEditPage
.sampleVintageSection
> .wineSiteSectionHeader
.wineSiteSectionIcon {
	flex-basis: 36px;
	width: 36px;
	height: 36px;
	font-size: 15px;
}

.sampleEditPage
.sampleVintageSection
> .wineSiteSectionHeader h2 {
	font-size: 19px;
}

/* =========================================================
   ANALYSIS SECTION
========================================================= */

/*
   Keep the Juice / Soil / Tissue buttons visible beneath the
   sticky Analysis Results header while analysis values scroll.
*/
.sampleEditPage
.sampleAnalysisSection
> .d-flex.justify-content-center.align-items-center.flex-wrap {
	position: sticky;
	top: 65px;
	z-index: 29;
	margin: -2px -8px 16px !important;
	padding: 10px 8px 12px;
	background: #ffffff;
	
}

/* Slightly smaller tabs so the complete tab row stays visible. */
.sampleEditPage .sampleAnalysisTab {
	min-height: 36px;
	padding: 7px 16px !important;
	font-size: 12.5px;
}

/* Tighten analysis field spacing without affecting Vintage fields. */
.sampleEditPage .sampleAnalysisSection > .row {
	--bs-gutter-x: 1rem;
	--bs-gutter-y: 0.8rem;
}

.sampleEditPage .sampleAnalysisSection .wineSiteLabel {
	margin-bottom: 5px;
	font-size: 12.5px;
}

.sampleEditPage .sampleAnalysisSection .form-control {
	min-height: 40px;
	padding-top: 8px;
	padding-bottom: 8px;
}

/*
   Give the analysis section enough minimum visual space that the
   active panel does not immediately feel clipped. The scroll area
   itself still respects the browser height.
*/
.sampleEditPage .sampleAnalysisSection {
	min-height: 0;
	margin-top: 0;
	padding-top: 18px;
	padding-bottom: 10px;
	border-top: 0;
	border-radius: 0 0 12px 12px;
}

/* Prevent the action buttons from being cut off at the bottom. */
.sampleEditPage .wineSiteFormActions {
	margin-top: 4px;
	padding: 8px 26px 10px;
}

.sampleEditPage .sampleAnalysisSection > .row:last-child {
	margin-bottom: 0 !important;
	padding-bottom: 0 !important;
}

.sampleEditPage .sampleAnalysisSection > .row:last-child > div:last-child {
	margin-bottom: 0;
}

/* =========================================================
   LARGE / TALL DESKTOPS
========================================================= */

@media (min-height: 900px) and (min-width: 992px) {
	.sampleEditPage {
		height: calc(100vh - 58px);
		min-height: 0;
		padding-top: 14px;
		padding-bottom: 14px;
	}

	.sampleEditPage .sampleEditCard {
		padding-top: 18px;
	}

	.sampleEditPage .sampleAnalysisSection {
		min-height: 0px;
		padding-bottom: 10px;
	}
}

/* =========================================================
   TABLET AND MOBILE
   Keep the same freeze-frame and sticky behavior
========================================================= */

@media (max-width: 991.98px) {
	.sampleEditPage {
		height: calc(100dvh - 58px);
		min-height: 0;
		padding: 12px;
		overflow: hidden;
	}

	.sampleEditPage > .container-fluid {
		height: 100%;
		min-height: 0;
	}

	.sampleEditPage .sampleEditCard {
		display: flex;
		width: 100%;
		height: 100%;
		min-height: 0;
		flex-direction: column;
		padding: 16px;
		overflow: hidden;
		border-radius: 14px;
	}

	.sampleEditPage .wineSiteEditHeader {
		flex: 0 0 auto;
		margin-bottom: 12px;
	}

	.sampleEditPage .wineSiteEditHeader h1 {
		font-size: 24px;
	}

	.sampleEditPage .wineSiteEditHeader > p {
		margin-top: 5px;
		font-size: 12px;
		line-height: 1.4;
	}

	.sampleEditPage .sampleStickyForm {
		display: flex;
		flex: 1 1 auto;
		min-height: 0;
		flex-direction: column;
		overflow: hidden;
	}

	/* Keep the complete Sample Name and Site section visible */
	.sampleEditPage .sampleIdentitySticky {
		position: relative;
		z-index: 40;
		flex: 0 0 auto;
		margin-bottom: 10px;
		padding: 14px;
		background: #ffffff;
		box-shadow: 0 6px 14px rgba(17, 17, 17, 0.06);
	}

	.sampleEditPage .sampleIdentitySticky .wineSiteSectionHeader {
		margin-bottom: 12px;
		padding-bottom: 10px;
	}

	.sampleEditPage .sampleIdentitySticky .wineSiteSectionIcon {
		flex-basis: 34px;
		width: 34px;
		height: 34px;
		font-size: 14px;
	}

	.sampleEditPage .sampleIdentitySticky .wineSiteSectionHeader h2 {
		font-size: 17px;
	}

	/* Only the lower sections scroll */
	.sampleEditPage .sampleSectionScroll {
		position: relative;
		flex: 1 1 auto;
		min-height: 0;
		padding: 0 4px 18px 0;
		overflow-x: hidden;
		overflow-y: auto;
		scrollbar-gutter: stable;
		overscroll-behavior: contain;
		scroll-padding-top: 85px;
		-webkit-overflow-scrolling: touch;
	}

	.sampleEditPage .sampleSectionScroll > .wineSiteFormSection {
		position: relative;
		margin-bottom: 14px;
		padding: 16px;
		overflow: visible;
	}

	/* Keep Analysis Results fixed at the top of the lower scroll area */
	.sampleEditPage .sampleAnalysisStickyHeader {
		min-height: 59px;
		margin-bottom: 0;
		padding: 12px 16px;
		border-radius: 12px 12px 0 0;
	}

	.sampleEditPage
	.sampleAnalysisStickyHeader
	.wineSiteSectionIcon {
		flex-basis: 34px;
		width: 34px;
		height: 34px;
		font-size: 14px;
	}

	.sampleEditPage .sampleAnalysisStickyHeader h2 {
		font-size: 17px;
	}

	/* Vintage Information stacks beneath Analysis Results */
	.sampleEditPage
	.sampleVintageSection
	> .wineSiteSectionHeader {
		top: 59px;
		min-height: 57px;
		margin: -16px -16px 14px;
		padding: 11px 16px;
	}

	.sampleEditPage
	.sampleVintageSection
	> .wineSiteSectionHeader
	.wineSiteSectionIcon {
		flex-basis: 34px;
		width: 34px;
		height: 34px;
		font-size: 14px;
	}

	.sampleEditPage
	.sampleVintageSection
	> .wineSiteSectionHeader h2 {
		font-size: 17px;
	}

	/* Keep Juice / Soil / Tissue tabs sticky too */
	.sampleEditPage
	.sampleAnalysisSection
	> .d-flex.justify-content-center.align-items-center.flex-wrap {
		position: sticky;
		top: 59px;
		z-index: 29;
		margin: -2px -4px 12px !important;
		padding: 8px 4px;
		background: #ffffff;
		border: 0;
		box-shadow: none;
	}

	.sampleEditPage .sampleAnalysisTab {
		min-height: 34px;
		padding: 6px 12px !important;
		font-size: 12px;
	}

	.sampleEditPage .sampleAnalysisSection {
		min-height: 0;
		margin-top: 0;
		padding-top: 10px;/* =========================================================
   VINESITE FORM PAGES
   Shared styling for:
   - Single Site entry/edit
   - Single Sample entry/edit
   - Bulk Site entry
   - Bulk Sample entry
========================================================= */


/* =========================================================
   DESIGN TOKENS
========================================================= */

:root {
	--vs-green: #2c4d34;
	--vs-green-hover: #3b6645;
	--vs-maroon: #7a2c37;
	--vs-maroon-hover: #ad3e4b;
	--vs-cream: #f7f4eb;
	--vs-white: #ffffff;
	--vs-text: #48535d;
	--vs-muted: #6f7f8f;
	--vs-border: #dedbd2;
	--vs-border-light: #e8e5de;
	--vs-disabled: #f2f1ed;
	--vs-font: Roboto, Arial, sans-serif;
}


/* =========================================================
   GLOBAL FONT NORMALIZATION
========================================================= */

.ssPage,
.wineSiteEditPage,
.bulkEntryPage,
.bulkSamplePage,
.ssPage *,
.wineSiteEditPage *,
.bulkEntryPage *,
.bulkSamplePage *,
.ssPage *::before,
.ssPage *::after,
.wineSiteEditPage *::before,
.wineSiteEditPage *::after,
.bulkEntryPage *::before,
.bulkEntryPage *::after,
.bulkSamplePage *::before,
.bulkSamplePage *::after {
	box-sizing: border-box;
}

/* Apply Roboto to text-bearing elements without overriding icon fonts. */
.ssPage,
.wineSiteEditPage,
.bulkEntryPage,
.bulkSamplePage,
.ssPage h1,
.ssPage h2,
.ssPage h3,
.ssPage h4,
.ssPage h5,
.ssPage h6,
.ssPage p,
.ssPage label,
.ssPage span:not(.fa):not(.fas):not(.far):not(.fal):not(.fab),
.ssPage input,
.ssPage select,
.ssPage textarea,
.ssPage button,
.ssPage option,
.ssPage summary,
.wineSiteEditPage h1,
.wineSiteEditPage h2,
.wineSiteEditPage h3,
.wineSiteEditPage h4,
.wineSiteEditPage h5,
.wineSiteEditPage h6,
.wineSiteEditPage p,
.wineSiteEditPage label,
.wineSiteEditPage span:not(.fa):not(.fas):not(.far):not(.fal):not(.fab),
.wineSiteEditPage input,
.wineSiteEditPage select,
.wineSiteEditPage textarea,
.wineSiteEditPage button,
.wineSiteEditPage option,
.wineSiteEditPage summary,
.bulkEntryPage h1,
.bulkEntryPage h2,
.bulkEntryPage h3,
.bulkEntryPage h4,
.bulkEntryPage h5,
.bulkEntryPage h6,
.bulkEntryPage p,
.bulkEntryPage label,
.bulkEntryPage span:not(.fa):not(.fas):not(.far):not(.fal):not(.fab),
.bulkEntryPage input,
.bulkEntryPage select,
.bulkEntryPage textarea,
.bulkEntryPage button,
.bulkEntryPage option,
.bulkEntryPage summary,
.bulkSamplePage h1,
.bulkSamplePage h2,
.bulkSamplePage h3,
.bulkSamplePage h4,
.bulkSamplePage h5,
.bulkSamplePage h6,
.bulkSamplePage p,
.bulkSamplePage label,
.bulkSamplePage span:not(.fa):not(.fas):not(.far):not(.fal):not(.fab),
.bulkSamplePage input,
.bulkSamplePage select,
.bulkSamplePage textarea,
.bulkSamplePage button,
.bulkSamplePage option,
.bulkSamplePage summary {
	font-family: var(--vs-font);
}

/* Preserve Font Awesome icon fonts. */
.ssPage .fa,
.ssPage .fas,
.ssPage .far,
.ssPage .fal,
.ssPage .fab,
.wineSiteEditPage .fa,
.wineSiteEditPage .fas,
.wineSiteEditPage .far,
.wineSiteEditPage .fal,
.wineSiteEditPage .fab,
.bulkEntryPage .fa,
.bulkEntryPage .fas,
.bulkEntryPage .far,
.bulkEntryPage .fal,
.bulkEntryPage .fab,
.bulkSamplePage .fa,
.bulkSamplePage .fas,
.bulkSamplePage .far,
.bulkSamplePage .fal,
.bulkSamplePage .fab {
	font-family: inherit;
}

/* Font Awesome 4 */
.ssPage .fa,
.wineSiteEditPage .fa,
.bulkEntryPage .fa,
.bulkSamplePage .fa {
	font-family: FontAwesome !important;
}

/* Font Awesome 5/6 */
.ssPage .fas,
.wineSiteEditPage .fas,
.bulkEntryPage .fas,
.bulkSamplePage .fas {
	font-family: "Font Awesome 6 Free", "Font Awesome 5 Free" !important;
	font-weight: 900;
}

.ssPage .far,
.wineSiteEditPage .far,
.bulkEntryPage .far,
.bulkSamplePage .far {
	font-family: "Font Awesome 6 Free", "Font Awesome 5 Free" !important;
	font-weight: 400;
}

.ssPage .fab,
.wineSiteEditPage .fab,
.bulkEntryPage .fab,
.bulkSamplePage .fab {
	font-family: "Font Awesome 6 Brands", "Font Awesome 5 Brands" !important;
}


/* =========================================================
   SINGLE-ENTRY PAGE SHELL
========================================================= */

.ssPage,
.wineSiteEditPage {
	min-height: 100%;
	padding: 48px 24px 64px;
	color: var(--vs-text);
	background: var(--vs-cream);
	font-size: 14px;
}

.ssCard,
.wineSiteEditCard {
	width: 100%;
	max-width: 1000px;
	margin: 0 auto;
	padding: 42px 48px 36px;
	background: var(--vs-white);
	border: 1px solid rgba(44, 77, 52, 0.14);
	border-radius: 18px;
	box-shadow:
		0 18px 45px rgba(17, 17, 17, 0.08),
		0 3px 10px rgba(17, 17, 17, 0.04);
}


/* =========================================================
   SINGLE-ENTRY PAGE HEADER
========================================================= */

.ssHeader,
.wineSiteEditHeader {
	max-width: 830px;
	margin: 0 auto 30px;
	text-align: center;
}

.ssEyebrow,
.wineSiteEditEyebrow {
	margin-bottom: 8px;
	color: var(--vs-maroon);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.ssHeader h1,
.wineSiteEditHeader h1 {
	margin: 0;
	color: var(--vs-green);
	font-size: 30px;
	font-weight: 700;
	line-height: 1.15;
}

.ssHeader > p,
.wineSiteEditHeader > p {
	max-width: 680px;
	margin: 12px auto 0;
	color: var(--vs-text);
	font-size: 13px;
	font-weight: 400;
	line-height: 1.65;
}

.ssNotice,
.wineSitePrivacyNotice {
	display: inline-flex;
	align-items: flex-start;
	gap: 10px;
	max-width: 700px;
	margin-top: 20px;
	padding: 12px 16px;
	color: var(--vs-green);
	background: rgba(44, 77, 52, 0.07);
	border: 1px solid rgba(44, 77, 52, 0.14);
	border-radius: 10px;
	font-size: 13px;
	line-height: 1.5;
	text-align: left;
}

.ssNotice i,
.wineSitePrivacyNotice i {
	flex: 0 0 auto;
	margin-top: 3px;
}


/* =========================================================
   SHARED SECTION HEADERS
========================================================= */

.ssSection,
.wineSiteFormSection {
	margin-bottom: 28px;
	padding: 30px;
	background: var(--vs-white);
	border: 1px solid #e4e1da;
	border-radius: 14px;
}

.ssSection:last-of-type,
.wineSiteFormSection:last-of-type {
	margin-bottom: 24px;
}

.ssSectionHeader,
.wineSiteSectionHeader {
	display: flex;
	align-items: center;
	gap: 14px;
	margin-bottom: 26px;
	padding-bottom: 18px;
	border-bottom: 1px solid var(--vs-border-light);
}

.ssSectionIcon,
.wineSiteSectionIcon {
	display: flex;
	flex: 0 0 42px;
	align-items: center;
	justify-content: center;
	width: 42px;
	height: 42px;
	color: var(--vs-white);
	background: var(--vs-green);
	border-radius: 50%;
	font-size: 17px;
	box-shadow: 0 5px 12px rgba(44, 77, 52, 0.2);
}

.ssSectionHeader h2,
.wineSiteSectionHeader h2 {
	margin: 0;
	color: var(--vs-green);
	font-family: var(--vs-font);
	font-size: 21px;
	font-weight: 700;
	line-height: 1.25;
}

.ssSectionHeader p,
.wineSiteSectionHeader p {
	margin: 4px 0 0;
	color: var(--vs-muted);
	font-family: var(--vs-font);
	font-size: 13px;
	font-weight: 400;
	line-height: 1.45;
}


/* =========================================================
   UNIVERSAL FIELD LABELS
========================================================= */

.ssLabel,
.wineSiteLabel,
.bulkSiteField > label,
.sampleFieldLabel {
	display: flex;
	align-items: baseline;
	flex-wrap: wrap;
	justify-content: flex-start;
	gap: 0px;
	min-height: 0;
	margin: 0 0 7px;
	color: var(--vs-green);
	font-family: var(--vs-font);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.01em;
	line-height: 1.3;
}

.sampleFieldName {
	display: inline;
	color: inherit;
	font: inherit;
}

.sampleFieldUnit,
.bulkSiteField > label small {
	display: inline;
	margin: 0;
	color: var(--vs-muted);
	font-family: var(--vs-font);
	font-size: 12px;
	font-weight: 500;
	line-height: inherit;
	white-space: nowrap;
}

.requiredMarker,
.bulkRequiredMark {
	margin-left: 1px;
	color: var(--vs-maroon);
	font-weight: 700;
}

.ssLabelHint,
.wineSiteLabelHint {
	margin-left: 5px;
	color: var(--vs-muted);
	font-size: 12px;
	font-weight: 400;
}

.ssHelpText,
.wineSiteHelpText,
.bulkCoordinateHelp {
	margin-top: 5px;
	color: var(--vs-muted);
	font-size: 12px;
	line-height: 1.4;
}


/* =========================================================
   INFO ICON BUTTON
========================================================= */

.sampleFieldLabel .icon-btn,
.wineSiteLabel .icon-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 20px;
	width: 20px;
	height: 20px;
	margin: 0 0 0 2px;
	padding: 0;
	color: var(--vs-muted);
	background: transparent;
	border: 0;
	border-radius: 50%;
	font-size: 13px;
	line-height: 1;
	cursor: pointer;
}

.sampleFieldLabel .icon-btn:hover,
.sampleFieldLabel .icon-btn:focus,
.wineSiteLabel .icon-btn:hover,
.wineSiteLabel .icon-btn:focus {
	color: var(--vs-green);
	background: rgba(44, 77, 52, 0.08);
	outline: none;
}


/* =========================================================
   INPUTS, SELECTS, AND TEXTAREAS
========================================================= */

.ssPage .form-control,
.ssPage .form-select,
.wineSiteEditPage .form-control,
.wineSiteEditPage .form-select,
.bulkEntryPage .form-control,
.bulkEntryPage .form-select,
.bulkSamplePage .form-control,
.bulkSamplePage .form-select {
	width: 100%;
	min-height: 45px;
	padding: 10px 13px;
	color: var(--vs-text);
	background: var(--vs-white);
	border: 1px solid #cccccc;
	border-radius: 8px;
	font-family: var(--vs-font);
	font-size: 14px;
	font-weight: 400;
	line-height: 1.4;
	box-shadow: none;
	transition:
		border-color 0.18s ease,
		box-shadow 0.18s ease,
		background-color 0.18s ease;
}

.ssPage .form-control::placeholder,
.wineSiteEditPage .form-control::placeholder,
.bulkEntryPage .form-control::placeholder,
.bulkSamplePage .form-control::placeholder {
	color: #9aa3ab;
	opacity: 1;
}

.ssPage .form-control:hover,
.ssPage .form-select:hover,
.wineSiteEditPage .form-control:hover,
.wineSiteEditPage .form-select:hover,
.bulkEntryPage .form-control:hover,
.bulkEntryPage .form-select:hover,
.bulkSamplePage .form-control:hover,
.bulkSamplePage .form-select:hover {
	border-color: #9da8a0;
}

.ssPage .form-control:focus,
.ssPage .form-select:focus,
.wineSiteEditPage .form-control:focus,
.wineSiteEditPage .form-select:focus,
.bulkEntryPage .form-control:focus,
.bulkEntryPage .form-select:focus,
.bulkSamplePage .form-control:focus,
.bulkSamplePage .form-select:focus {
	color: var(--vs-text);
	background: var(--vs-white);
	border-color: var(--vs-green-hover);
	box-shadow: 0 0 0 3px rgba(44, 77, 52, 0.12);
	outline: none;
}

.ssPage .form-control:disabled,
.ssPage .form-select:disabled,
.wineSiteEditPage .form-control:disabled,
.wineSiteEditPage .form-select:disabled,
.bulkEntryPage .form-control:disabled,
.bulkEntryPage .form-select:disabled,
.bulkSamplePage .form-control:disabled,
.bulkSamplePage .form-select:disabled {
	color: var(--vs-muted);
	background: var(--vs-disabled);
	border-color: #d8d5ce;
	cursor: not-allowed;
	opacity: 0.85;
}

.ssPage textarea.form-control,
.wineSiteEditPage textarea.form-control,
.bulkEntryPage textarea.form-control,
.bulkSamplePage textarea.form-control {
	min-height: 110px;
	resize: vertical;
}

.sampleNotesField {
	min-height: 96px;
	text-align: left;
}

.ssPage input[type="number"],
.wineSiteEditPage input[type="number"],
.bulkEntryPage input[type="number"],
.bulkSamplePage input[type="number"] {
	appearance: textfield;
}

.ssPage input[type="number"]::-webkit-inner-spin-button,
.ssPage input[type="number"]::-webkit-outer-spin-button,
.wineSiteEditPage input[type="number"]::-webkit-inner-spin-button,
.wineSiteEditPage input[type="number"]::-webkit-outer-spin-button,
.bulkEntryPage input[type="number"]::-webkit-inner-spin-button,
.bulkEntryPage input[type="number"]::-webkit-outer-spin-button,
.bulkSamplePage input[type="number"]::-webkit-inner-spin-button,
.bulkSamplePage input[type="number"]::-webkit-outer-spin-button {
	margin: 0;
}


/* =========================================================
   VALIDATION
========================================================= */

.ssPage .form-control.ng-invalid.ng-touched,
.ssPage .form-select.ng-invalid.ng-touched,
.wineSiteEditPage .form-control.ng-invalid.ng-touched,
.wineSiteEditPage .form-select.ng-invalid.ng-touched,
.bulkEntryPage .form-control.ng-invalid.ng-touched,
.bulkEntryPage .form-select.ng-invalid.ng-touched,
.bulkSamplePage .form-control.ng-invalid.ng-touched,
.bulkSamplePage .form-select.ng-invalid.ng-touched {
	border-color: rgba(122, 44, 55, 0.7);
}

.ssPage .form-control.ng-invalid.ng-touched:focus,
.ssPage .form-select.ng-invalid.ng-touched:focus,
.wineSiteEditPage .form-control.ng-invalid.ng-touched:focus,
.wineSiteEditPage .form-select.ng-invalid.ng-touched:focus,
.bulkEntryPage .form-control.ng-invalid.ng-touched:focus,
.bulkEntryPage .form-select.ng-invalid.ng-touched:focus,
.bulkSamplePage .form-control.ng-invalid.ng-touched:focus,
.bulkSamplePage .form-select.ng-invalid.ng-touched:focus {
	border-color: var(--vs-maroon);
	box-shadow: 0 0 0 3px rgba(122, 44, 55, 0.12);
}

.ssFieldError,
.wineSiteFieldError,
.fieldValidationMessage {
	display: block;
	margin-top: 6px;
	color: var(--vs-maroon);
	font-size: 12px;
	font-weight: 500;
	line-height: 1.4;
}

.ssValidation,
.wineSiteValidationSummary,
.validationErrors {
	display: flex;
	align-items: flex-start;
	gap: 13px;
	margin: 4px 26px 24px;
	padding: 15px 17px;
	color: var(--vs-maroon);
	background: rgba(122, 44, 55, 0.07) !important;
	border: 1px solid rgba(122, 44, 55, 0.22);
	border-left: 4px solid var(--vs-maroon);
	border-radius: 9px;
	font-size: 13px;
	line-height: 1.5;
}

.ssValidationIcon,
.wineSiteValidationIcon {
	flex: 0 0 auto;
	margin-top: 2px;
	font-size: 17px;
}

.ssValidation strong,
.wineSiteValidationSummary strong {
	display: block;
	margin-bottom: 4px;
	font-weight: 700;
}

.ssValidation ul,
.wineSiteValidationSummary ul,
.validationErrors ul {
	margin: 0;
	padding-left: 19px;
}


/* =========================================================
   SINGLE-ENTRY LOCATION AND MEASUREMENTS
========================================================= */

.ssLocationBox,
.wineSiteLocationBox {
	padding: 18px;
	background: #fbfaf7;
	border: 1px solid #e2ded5;
	border-radius: 10px;
}

.ssLocationFooter,
.wineSiteLocationFooter {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	margin-top: 14px;
	padding-top: 14px;
	border-top: 1px solid #e2ded5;
}

.ssCoordinates,
.wineSiteCoordinates {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 18px;
	color: var(--vs-muted);
	font-size: 12px;
	line-height: 1.4;
}

.ssCoordinates strong,
.wineSiteCoordinates strong {
	color: var(--vs-green);
}

.ssSpacingGroup,
.wineSiteSpacingGroup,
.bulkSpacingGroup {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
	align-items: center;
	gap: 10px;
}

.ssSpacingDivider,
.wineSiteSpacingDivider,
.bulkSpacingSymbol {
	color: var(--vs-muted);
	font-size: 16px;
	font-weight: 700;
	text-align: center;
}

.ssMeasurement,
.wineSiteMeasurement {
	display: flex;
	align-items: stretch;
	min-width: 0;
}

.ssMeasurement .form-control,
.wineSiteMeasurement .form-control {
	min-width: 0;
	border-radius: 8px 0 0 8px;
}

.ssMeasurement > span,
.wineSiteMeasurement > span,
.input-group-text {
	display: flex;
	align-items: center;
	justify-content: center;
	min-width: 46px;
	padding: 0 11px;
	color: var(--vs-green);
	background: rgba(44, 77, 52, 0.07);
	border-color: #cccccc;
	font-size: 12px;
	font-weight: 700;
	white-space: nowrap;
}


/* =========================================================
   SHARED BULK PAGE SHELL
========================================================= */

.bulkEntryPage,
.bulkSamplePage {
	min-height: 100%;
	padding: 32px 24px 56px;
	color: var(--vs-text);
	background: var(--vs-cream);
	font-size: 14px;
}

.bulkSampleCard {
	width: 100%;
	max-width: 1500px;
	margin: 0 auto;
	overflow: hidden;
	background: var(--vs-white);
	border: 1px solid var(--vs-border);
	border-radius: 18px;
	box-shadow: 0 14px 34px rgba(17, 17, 17, 0.08);
}


/* =========================================================
   SHARED BULK PAGE HEADER
========================================================= */

.bulkSampleHeader {
	padding: 30px 36px 26px;
	color: var(--vs-text);
	background: var(--vs-white);
	border-bottom: 1px solid #e4e1da;
}

.bulkSampleHeaderText {
	max-width: 980px;
}

.bulkSampleHeader h1 {
	margin: 0;
	color: #3f443f;
	font-family: var(--vs-font);
	font-size: clamp(28px, 3vw, 34px);
	font-weight: 700;
	line-height: 1.15;
}

.bulkSampleHeader p {
	max-width: 900px;
	margin: 10px 0 0;
	color: var(--vs-muted);
	font-family: var(--vs-font);
	font-size: 14px;
	font-weight: 400;
	line-height: 1.6;
}


/* =========================================================
   SHARED BULK CARD LIST
========================================================= */

.bulkSiteList {
	display: grid;
	gap: 22px;
	padding: 26px;
}

.bulkSiteEntry,
.bulkSampleEntry {
	overflow: hidden;
	background: #ffffff;
	border: 1px solid #dcd8cf;
	border-radius: 14px;
	box-shadow: 0 5px 16px rgba(17, 17, 17, 0.04);
}

.bulkSiteEntryHeader,
.bulkSampleEntryHeader {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	min-height: 58px;
	padding: 14px 18px;
	background: #f4efe4;
	border-bottom: 1px solid #e4e1da;
}

.bulkSiteEntryTitle {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 9px;
	min-width: 0;
}

.bulkSiteNumber {
	color: var(--vs-green);
	font-size: 15px;
	font-weight: 700;
	line-height: 1.25;
}

.bulkSiteNamePreview {
	overflow: hidden;
	color: var(--vs-muted);
	font-size: 13px;
	font-weight: 500;
	line-height: 1.3;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.bulkSiteEntryActions {
	display: flex;
	align-items: center;
	gap: 8px;
}

.bulkRemoveButton {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	padding: 0;
	color: var(--vs-maroon);
	background: var(--vs-white);
	border: 1px solid rgba(122, 44, 55, 0.28);
	border-radius: 8px;
	font-size: 14px;
	transition:
		color 0.18s ease,
		background-color 0.18s ease,
		border-color 0.18s ease,
		transform 0.18s ease;
}

.bulkRemoveButton:hover,
.bulkRemoveButton:focus {
	color: var(--vs-white);
	background: var(--vs-maroon);
	border-color: var(--vs-maroon);
	transform: translateY(-1px);
}

.bulkRemoveButton:disabled {
	color: #a98f93;
	background: #f4f1f1;
	border-color: #ddd4d6;
	cursor: not-allowed;
	opacity: 0.65;
	transform: none;
}

.bulkSiteEntryBody,
.bulkSampleEntryBody {
	display: grid;
	gap: 20px;
	padding: 24px;
}


/* =========================================================
   SHARED BULK CARD SECTIONS
========================================================= */

.bulkSiteSection,
.bulkSampleSection {
	margin: 0;
	padding: 24px;
	background: var(--vs-white);
	border: 1px solid #e4e1da;
	border-radius: 12px;
}

.bulkSiteSection .wineSiteSectionHeader,
.bulkSampleSection .wineSiteSectionHeader {
	margin-bottom: 20px;
	padding-bottom: 15px;
}

.bulkSiteSectionFull {
	grid-column: 1 / -1;
}


/* =========================================================
   SHARED BULK FIELD LAYOUT
========================================================= */

.bulkSiteFieldGrid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 18px 20px;
}

.bulkSiteField {
	display: flex;
	min-width: 0;
	flex-direction: column;
	justify-content: flex-start;
}

.bulkSiteFieldWide {
	grid-column: span 2;
}

.bulkSiteField > .form-control,
.bulkSiteField > .form-select,
.bulkSiteField > .input-group {
	margin-top: 0;
}


/* =========================================================
   BULK SAMPLE ANALYSIS
========================================================= */

.bulkAnalysisTabs {
	margin: 18px 0 22px !important;
}

.sampleAnalysisTab,
.bulkSampleAnalysisTab {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 40px;
	padding: 8px 18px !important;
	color: var(--vs-green);
	background: var(--vs-white);
	border: 1px solid rgba(44, 77, 52, 0.32);
	border-radius: 8px;
	font-size: 13px;
	font-weight: 700;
	box-shadow: none;
}

.sampleAnalysisTab:hover,
.sampleAnalysisTab:focus,
.bulkSampleAnalysisTab:hover,
.bulkSampleAnalysisTab:focus,
.sampleAnalysisTab.active,
.bulkSampleAnalysisTab.active {
	color: var(--vs-white);
	background: var(--vs-green);
	border-color: var(--vs-green);
}

.bulkAnalysisSection .row,
.bulkVintageSection .row {
	row-gap: 16px;
}

.sampleAnalysisNotice {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 14px 16px;
	color: var(--vs-muted);
	background: #fbfaf7;
	border: 1px solid #e4e1da;
	border-radius: 9px;
}

.sampleAnalysisNotice p {
	margin: 0;
}


/* =========================================================
   COLLAPSIBLE VINTAGE SECTION
========================================================= */

.bulkVintageDetails {
	overflow: hidden;
	background: var(--vs-white);
	border: 1px solid #e4e1da;
	border-radius: 12px;
}

.bulkVintageSummary {
	display: block;
	padding: 24px;
	cursor: pointer;
	list-style: none;
}

.bulkVintageSummary::-webkit-details-marker {
	display: none;
}

.bulkVintageSummary .wineSiteSectionHeader {
	margin: 0;
	padding: 0;
	border: 0;
}

.bulkVintageSummaryText {
	min-width: 0;
	flex: 1 1 auto;
}

.bulkVintageSummaryChevron {
	display: flex;
	align-items: center;
	justify-content: center;
	margin-left: auto;
	color: var(--vs-muted);
	transition: transform 0.18s ease;
}

.bulkVintageDetails[open] .bulkVintageSummaryChevron {
	transform: rotate(180deg);
}

.bulkVintageDetails .bulkVintageSection {
	border: 0;
	border-top: 1px solid #e4e1da;
	border-radius: 0;
}


/* =========================================================
   BULK ADD / EMPTY AREAS
========================================================= */

.bulkBottomAddArea {
	display: flex;
	justify-content: center;
	padding: 4px 0 8px;
}

.bulkSiteEmptyState {
	padding: 42px 24px;
	color: var(--vs-muted);
	text-align: center;
	background: #fbfaf7;
	border: 1px dashed #cbc7bd;
	border-radius: 12px;
}

.bulkSiteEmptyState > i {
	margin-bottom: 12px;
	color: var(--vs-green);
	font-size: 28px;
}

.bulkSiteEmptyState h2 {
	margin: 0 0 7px;
	color: var(--vs-green);
	font-size: 19px;
	font-weight: 700;
}

.bulkSiteEmptyState p {
	margin: 0 0 18px;
}


/* =========================================================
   BUTTONS AND FORM ACTIONS
========================================================= */

.ssActions,
.wineSiteFormActions {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	gap: 12px;
	padding: 8px 26px 28px;
}

.ssSaveButton,
.ssCancelButton,
.wineSiteSaveButton,
.wineSiteCancelButton,
.bulkAddButton,
.bulkRowMapButton {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 42px;
	padding: 9px 18px;
	border-radius: 8px;
	font-family: var(--vs-font);
	font-size: 14px;
	font-weight: 700;
	line-height: 1.2;
	text-decoration: none;
	transition:
		background-color 0.18s ease,
		border-color 0.18s ease,
		color 0.18s ease,
		transform 0.18s ease,
		box-shadow 0.18s ease;
}

.ssSaveButton,
.wineSiteSaveButton,
.bulkAddButton {
	color: var(--vs-white);
	background: var(--vs-maroon);
	border: 1px solid var(--vs-maroon);
}

.ssSaveButton:hover,
.ssSaveButton:focus,
.wineSiteSaveButton:hover,
.wineSiteSaveButton:focus,
.bulkAddButton:hover,
.bulkAddButton:focus {
	color: var(--vs-white);
	background: var(--vs-maroon-hover);
	border-color: var(--vs-maroon-hover);
	box-shadow: 0 7px 16px rgba(122, 44, 55, 0.22);
	transform: translateY(-1px);
}

.ssCancelButton,
.wineSiteCancelButton,
.bulkRowMapButton {
	color: var(--vs-green);
	background: var(--vs-white);
	border: 1px solid var(--vs-green);
}

.ssCancelButton:hover,
.ssCancelButton:focus,
.wineSiteCancelButton:hover,
.wineSiteCancelButton:focus,
.bulkRowMapButton:hover,
.bulkRowMapButton:focus {
	color: var(--vs-white);
	background: var(--vs-green-hover);
	border-color: var(--vs-green-hover);
	box-shadow: 0 7px 16px rgba(44, 77, 52, 0.18);
	transform: translateY(-1px);
}

.ssSaveButton:disabled,
.wineSiteSaveButton:disabled,
.bulkAddButton:disabled {
	color: rgba(255, 255, 255, 0.82);
	background: #a98f93;
	border-color: #a98f93;
	box-shadow: none;
	cursor: not-allowed;
	opacity: 0.7;
	transform: none;
}


/* =========================================================
   CHECKBOXES AND RADIO BUTTONS
========================================================= */

.form-check {
	display: flex;
	align-items: flex-start;
	gap: 8px;
}

.form-check-input {
	width: 17px;
	height: 17px;
	margin-top: 2px;
	border-color: #9da8a0;
	box-shadow: none;
}

.form-check-input:checked {
	background: var(--vs-green);
	border-color: var(--vs-green);
}

.form-check-input:focus {
	border-color: var(--vs-green-hover);
	box-shadow: 0 0 0 3px rgba(44, 77, 52, 0.12);
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 1199.98px) {
	.bulkSiteFieldGrid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 991.98px) {
	.ssPage,
	.wineSiteEditPage {
		padding: 32px 18px 48px;
	}

	.ssCard,
	.wineSiteEditCard {
		padding: 34px 30px 30px;
	}

	.ssSection,
	.wineSiteFormSection {
		padding: 25px;
	}
}

@media (max-width: 767.98px) {
	.ssPage,
	.wineSiteEditPage,
	.bulkEntryPage,
	.bulkSamplePage {
		padding: 18px 12px 36px;
	}

	.ssCard,
	.wineSiteEditCard {
		padding: 28px 18px 24px;
		border-radius: 14px;
	}

	.bulkSampleHeader {
		padding: 24px 20px 21px;
	}

	.bulkSiteList {
		padding: 18px;
	}

	.bulkSiteEntryHeader,
	.bulkSampleEntryHeader {
		padding: 12px 14px;
	}

	.bulkSiteEntryBody,
	.bulkSampleEntryBody {
		padding: 17px;
	}

	.bulkSiteSection,
	.bulkSampleSection,
	.bulkVintageSummary {
		padding: 18px 16px;
	}

	.bulkSiteFieldGrid {
		grid-template-columns: 1fr;
	}

	.bulkSiteFieldWide {
		grid-column: auto;
	}

	.ssSectionHeader,
	.wineSiteSectionHeader {
		align-items: flex-start;
	}

	.ssSectionIcon,
	.wineSiteSectionIcon {
		flex-basis: 38px;
		width: 38px;
		height: 38px;
		font-size: 15px;
	}

	.ssSectionHeader h2,
	.wineSiteSectionHeader h2 {
		font-size: 19px;
	}

	.ssLocationFooter,
	.wineSiteLocationFooter,
	.ssActions,
	.wineSiteFormActions {
		align-items: stretch;
		flex-direction: column;
	}

	.ssSaveButton,
	.ssCancelButton,
	.wineSiteSaveButton,
	.wineSiteCancelButton,
	.bulkAddButton,
	.bulkRowMapButton {
		width: 100%;
	}

	.ssSpacingGroup,
	.wineSiteSpacingGroup,
	.bulkSpacingGroup {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 420px) {
	.ssPage,
	.wineSiteEditPage,
	.bulkEntryPage,
	.bulkSamplePage {
		padding-right: 8px;
		padding-left: 8px;
	}

	.ssCard,
	.wineSiteEditCard,
	.bulkSiteList {
		padding-right: 14px;
		padding-left: 14px;
	}

	.bulkSiteEntryTitle {
		align-items: flex-start;
		flex-direction: column;
		gap: 3px;
	}

	.bulkSiteNamePreview {
		max-width: 220px;
	}
}


/* =========================================================
   FINAL FONT OVERRIDES
   Prevent global heading styles from switching to a serif font.
========================================================= */

.bulkEntryPage .wineSiteSectionHeader h2,
.bulkSamplePage .wineSiteSectionHeader h2,
.bulkEntryPage .bulkVintageSummary h2,
.bulkSamplePage .bulkVintageSummary h2,
.bulkEntryPage .bulkSiteEmptyState h2,
.bulkSamplePage .bulkSiteEmptyState h2,
.bulkEntryPage .bulkSampleHeader h1,
.bulkSamplePage .bulkSampleHeader h1 {
	font-family: Roboto, Arial, sans-serif !important;
	font-style: normal !important;
	font-variant: normal !important;
	text-transform: none;
}

/* Preserve Font Awesome inside section icons and action buttons. */
.bulkEntryPage .wineSiteSectionIcon i,
.bulkSamplePage .wineSiteSectionIcon i,
.bulkEntryPage button i,
.bulkSamplePage button i {
	font-style: normal;
}

/* =========================================================
   BULK SAMPLE GRID CORRECTIONS
========================================================= */

/* Keep Sample Information compact: two equal columns. */
.bulkSamplePage .bulkSampleTwoColumnGrid {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

/* Analysis fields remain compact instead of stretching full width. */
.bulkSamplePage .bulkSampleAnalysisGrid {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

/* Vintage uses two equal columns so every row is visually balanced. */
.bulkSamplePage .bulkSampleVintageGrid {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

/* The details element is already the section, so remove old nested styling. */
.bulkSamplePage details.bulkSiteSection.bulkVintageDetails {
	padding: 0;
	background: #ffffff;
	border: 1px solid #e4e1da;
	border-radius: 12px;
}

.bulkSamplePage details.bulkSiteSection.bulkVintageDetails > .bulkVintageSummary {
	padding: 24px;
}

.bulkSamplePage details.bulkSiteSection.bulkVintageDetails > .bulkVintageContent {
	padding: 0 24px 24px;
	border-top: 1px solid #e8e5de;
}

.bulkSamplePage .bulkVintageContent > .bulkSampleVintageGrid {
	padding-top: 22px;
}

.bulkSamplePage .bulkSampleNotesField {
	margin-top: 20px;
}

.bulkSamplePage .bulkSampleGridSpacer {
	visibility: hidden;
	pointer-events: none;
}

@media (max-width: 767.98px) {
	.bulkSamplePage .bulkSampleTwoColumnGrid,
	.bulkSamplePage .bulkSampleAnalysisGrid,
	.bulkSamplePage .bulkSampleVintageGrid {
		grid-template-columns: 1fr;
	}

	.bulkSamplePage details.bulkSiteSection.bulkVintageDetails > .bulkVintageSummary {
		padding: 18px 16px;
	}

	.bulkSamplePage details.bulkSiteSection.bulkVintageDetails > .bulkVintageContent {
		padding: 0 16px 18px;
	}

	.bulkSamplePage .bulkSampleGridSpacer {
		display: none;
	}
}

.sampleEditPage .sampleRadioFieldset .sampleRadioGroup {
	display: flex !important;
	flex-direction: column !important;
	align-items: flex-start !important;
	gap: .45rem !important;

	width: 100%;
	margin: 0;
	padding: 2px 0 0;
}

.sampleEditPage .sampleRadioFieldset .sampleRadioOption {
	display: flex !important;
	align-items: center !important;
	gap: .55rem;

	margin: 0;
	padding: 0;

	font-family: var(--vs-font);
	font-size: 0.92rem;
	font-weight: 400;
	line-height: 1.25;

	cursor: pointer;
}

.sampleEditPage .sampleRadioFieldset .sampleRadioText {
	font-family: var(--vs-font);
	font-size: 0.8rem;
	font-weight: 400;
	line-height: 1.25;
	color: var(--vs-text);
}

.sampleEditPage .sampleRadioFieldset input[type="radio"] {
	width: 17px;
	height: 17px;
	margin: 0;

	accent-color: var(--vs-maroon);

	flex-shrink: 0;
}

.wineSiteOtherLabel {
	color: #7a2c37;
	font-weight: 700;
}

/* =========================================================
   SAMPLE DATE PICKER
========================================================= */

.sampleDateGroup {
	display: flex !important;
	flex-wrap: nowrap !important;
	align-items: stretch;
	width: 100%;

	overflow: hidden;
	border: 1px solid #cccccc;
	border-radius: 8px;
	background: #fff;
}

.sampleDateGroup:focus-within {
	border-color: var(--vs-green-hover);
	box-shadow: 0 0 0 3px rgba(44, 77, 52, 0.12);
}

.sampleDateGroup .form-control {
	flex: 1 1 auto;
	min-width: 0;

	border: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
}

.sampleDateGroup .form-control:focus {
	border: none !important;
	box-shadow: none !important;
}

.sampleDateGroup .sampleCalendarButton {
	flex: 0 0 46px;
	width: 46px;

	display: flex;
	align-items: center;
	justify-content: center;

	border: 0 !important;
	border-left: 1px solid #cccccc !important;
	border-radius: 0 !important;

	background: #fff;
}

.sampleDateGroup .sampleCalendarButton:hover {
	background: #f8f8f8;
	color: var(--vs-green);
}

.sampleDateGroup .sampleCalendarButton i {
	font-size: 15px;
}

/* =========================================================
   SAMPLE EDIT FREEZE-FRAME / STICKY SECTION LAYOUT
   Requires these HTML classes:
   - form: sampleStickyForm
   - Sample Name and Site section: sampleIdentitySticky
   - wrapper around all remaining sections/actions:
     sampleSectionScroll
========================================================= */

/*
   Use nearly the full available browser height.
   The page itself does not scroll on desktop; only the content
   beneath Sample Name and Site scrolls.
*/
.sampleEditPage {
	height: calc(100vh - 72px);
	min-height: 720px;
	padding: 20px 24px;
	overflow: hidden;
}

.sampleEditPage > .container-fluid {
	height: 100%;
	min-height: 0;
}

.sampleEditPage .sampleEditCard {
	display: flex;
	width: 100%;
	max-width: 1100px;
	height: 100%;
	min-height: 0;
	flex-direction: column;
	padding: 22px 30px 20px;
	overflow: hidden;
}

/* Keep the page title compact so more form content is visible. */
.sampleEditPage .wineSiteEditHeader {
	flex: 0 0 auto;
	margin-bottom: 16px;
}

.sampleEditPage .wineSiteEditHeader h1 {
	font-size: 27px;
}

.sampleEditPage .wineSiteEditHeader > p {
	margin-top: 7px;
	line-height: 1.45;
}

/* Form becomes the height-managed flex container. */
.sampleEditPage .sampleStickyForm {
	display: flex;
	flex: 1 1 auto;
	min-height: 0;
	flex-direction: column;
	overflow: hidden;
}

/*
   The complete Sample Name and Site section stays visible.
   It never scrolls underneath another section.
*/
.sampleEditPage .sampleIdentitySticky {
	position: relative;
	z-index: 40;
	flex: 0 0 auto;
	margin-bottom: 14px;
	padding: 18px 22px;
	background: #ffffff;
	border-color: #dcd8cf;
	box-shadow: 0 8px 18px rgba(17, 17, 17, 0.07);
}

.sampleEditPage .sampleIdentitySticky .wineSiteSectionHeader {
	margin-bottom: 14px;
	padding-bottom: 12px;
}

.sampleEditPage .sampleIdentitySticky .wineSiteSectionIcon {
	flex-basis: 36px;
	width: 36px;
	height: 36px;
	font-size: 15px;
}

.sampleEditPage .sampleIdentitySticky .wineSiteSectionHeader h2 {
	font-size: 19px;
}

/*
   Only Analysis Results, Vintage Information, validation,
   and the form buttons scroll.
*/
.sampleEditPage .sampleSectionScroll {
	position: relative;
	flex: 1 1 auto;
	min-height: 0;
	padding: 0 8px 26px 0;
	overflow-x: hidden;
	overflow-y: auto;
	scrollbar-gutter: stable;
	overscroll-behavior: contain;
	scroll-padding-top: 80px;
}

/*
   Section containers must allow sticky children to escape.
*/
.sampleEditPage .sampleSectionScroll > .wineSiteFormSection {
	position: relative;
	overflow: visible;
}

/*
   Analysis Results remains visible at the top of the lower
   scrolling area. This header is placed directly inside
   .sampleSectionScroll, above .sampleAnalysisSection.
*/
.sampleEditPage .sampleAnalysisStickyHeader {
	position: sticky;
	top: 0;
	z-index: 35;
	min-height: 65px;
	margin: 0;
	padding: 14px 22px;
	background: #ffffff;
	border: 1px solid #e4e1da;
	border-bottom: 1px solid var(--vs-border-light);
	border-radius: 12px 12px 0 0;
	box-shadow: none;
}

.sampleEditPage
.sampleAnalysisStickyHeader
.wineSiteSectionIcon {
	flex-basis: 36px;
	width: 36px;
	height: 36px;
	font-size: 15px;
}

.sampleEditPage .sampleAnalysisStickyHeader h2 {
	font-size: 19px;
}

/* Compact lower sections so more analysis fields fit on screen. */
.sampleEditPage .sampleSectionScroll > .wineSiteFormSection {
	margin-bottom: 18px;
	padding: 22px;
}

/*
   Vintage Information scrolls normally until it reaches the
   Analysis Results header, then remains directly beneath it.
*/
.sampleEditPage
.sampleVintageSection
> .wineSiteSectionHeader {
	position: sticky;
	top: 65px;
	z-index: 34;
	min-height: 61px;
	margin: -22px -22px 18px;
	padding: 12px 22px;
	background: #ffffff;
	border-bottom: 1px solid var(--vs-border-light);
	border-radius: 12px 12px 0 0;
	box-shadow: 0 5px 10px rgba(17, 17, 17, 0.055);
}

.sampleEditPage
.sampleVintageSection
> .wineSiteSectionHeader
.wineSiteSectionIcon {
	flex-basis: 36px;
	width: 36px;
	height: 36px;
	font-size: 15px;
}

.sampleEditPage
.sampleVintageSection
> .wineSiteSectionHeader h2 {
	font-size: 19px;
}

/* =========================================================
   ANALYSIS SECTION
========================================================= */

/*
   Keep the Juice / Soil / Tissue buttons visible beneath the
   sticky Analysis Results header while analysis values scroll.
*/
.sampleEditPage
.sampleAnalysisSection
> .d-flex.justify-content-center.align-items-center.flex-wrap {
	position: sticky;
	top: 65px;
	z-index: 29;
	margin: -2px -8px 16px !important;
	padding: 10px 8px 12px;
	background: #ffffff;
	
}

/* Slightly smaller tabs so the complete tab row stays visible. */
.sampleEditPage .sampleAnalysisTab {
	min-height: 36px;
	padding: 7px 16px !important;
	font-size: 12.5px;
}

/* Tighten analysis field spacing without affecting Vintage fields. */
.sampleEditPage .sampleAnalysisSection > .row {
	--bs-gutter-x: 1rem;
	--bs-gutter-y: 0.8rem;
}

.sampleEditPage .sampleAnalysisSection .wineSiteLabel {
	margin-bottom: 5px;
	font-size: 12.5px;
}

.sampleEditPage .sampleAnalysisSection .form-control {
	min-height: 40px;
	padding-top: 8px;
	padding-bottom: 8px;
}

/*
   Give the analysis section enough minimum visual space that the
   active panel does not immediately feel clipped. The scroll area
   itself still respects the browser height.
*/
.sampleEditPage .sampleAnalysisSection {
	min-height: 0;
	margin-top: 0;
	padding-top: 18px;
	padding-bottom: 10px;
	border-top: 0;
	border-radius: 0 0 12px 12px;
}

/* Prevent the action buttons from being cut off at the bottom. */
.sampleEditPage .wineSiteFormActions {
	margin-top: 4px;
	padding: 8px 26px 10px;
}

.sampleEditPage .sampleAnalysisSection > .row:last-child {
	margin-bottom: 0 !important;
	padding-bottom: 0 !important;
}

.sampleEditPage .sampleAnalysisSection > .row:last-child > div:last-child {
	margin-bottom: 0;
}

/* =========================================================
   LARGE / TALL DESKTOPS
========================================================= */

@media (min-height: 900px) and (min-width: 992px) {
	.sampleEditPage {
		height: calc(100vh - 58px);
		min-height: 0;
		padding-top: 14px;
		padding-bottom: 14px;
	}

	.sampleEditPage .sampleEditCard {
		padding-top: 18px;
	}

	.sampleEditPage .sampleAnalysisSection {
		min-height: 0px;
		padding-bottom: 10px;
	}
}

/* =========================================================
   TABLET AND MOBILE
   Keep the same freeze-frame and sticky behavior
========================================================= */

@media (max-width: 991.98px) {
	.sampleEditPage {
		height: calc(100dvh - 58px);
		min-height: 0;
		padding: 12px;
		overflow: hidden;
	}

	.sampleEditPage > .container-fluid {
		height: 100%;
		min-height: 0;
	}

	.sampleEditPage .sampleEditCard {
		display: flex;
		width: 100%;
		height: 100%;
		min-height: 0;
		flex-direction: column;
		padding: 16px;
		overflow: hidden;
		border-radius: 14px;
	}

	.sampleEditPage .wineSiteEditHeader {
		flex: 0 0 auto;
		margin-bottom: 12px;
	}

	.sampleEditPage .wineSiteEditHeader h1 {
		font-size: 24px;
	}

	.sampleEditPage .wineSiteEditHeader > p {
		margin-top: 5px;
		font-size: 12px;
		line-height: 1.4;
	}

	.sampleEditPage .sampleStickyForm {
		display: flex;
		flex: 1 1 auto;
		min-height: 0;
		flex-direction: column;
		overflow: hidden;
	}

	/* Keep the complete Sample Name and Site section visible */
	.sampleEditPage .sampleIdentitySticky {
		position: relative;
		z-index: 40;
		flex: 0 0 auto;
		margin-bottom: 10px;
		padding: 14px;
		background: #ffffff;
		box-shadow: 0 6px 14px rgba(17, 17, 17, 0.06);
	}

	.sampleEditPage .sampleIdentitySticky .wineSiteSectionHeader {
		margin-bottom: 12px;
		padding-bottom: 10px;
	}

	.sampleEditPage .sampleIdentitySticky .wineSiteSectionIcon {
		flex-basis: 34px;
		width: 34px;
		height: 34px;
		font-size: 14px;
	}

	.sampleEditPage .sampleIdentitySticky .wineSiteSectionHeader h2 {
		font-size: 17px;
	}

	/* Only the lower sections scroll */
	.sampleEditPage .sampleSectionScroll {
		position: relative;
		flex: 1 1 auto;
		min-height: 0;
		padding: 0 4px 18px 0;
		overflow-x: hidden;
		overflow-y: auto;
		scrollbar-gutter: stable;
		overscroll-behavior: contain;
		scroll-padding-top: 85px;
		-webkit-overflow-scrolling: touch;
	}

	.sampleEditPage .sampleSectionScroll > .wineSiteFormSection {
		position: relative;
		margin-bottom: 14px;
		padding: 16px;
		overflow: visible;
	}

	/* Keep Analysis Results fixed at the top of the lower scroll area */
	.sampleEditPage .sampleAnalysisStickyHeader {
		min-height: 59px;
		margin-bottom: 0;
		padding: 12px 16px;
		border-radius: 12px 12px 0 0;
	}

	.sampleEditPage
	.sampleAnalysisStickyHeader
	.wineSiteSectionIcon {
		flex-basis: 34px;
		width: 34px;
		height: 34px;
		font-size: 14px;
	}

	.sampleEditPage .sampleAnalysisStickyHeader h2 {
		font-size: 17px;
	}

	/* Vintage Information stacks beneath Analysis Results */
	.sampleEditPage
	.sampleVintageSection
	> .wineSiteSectionHeader {
		top: 59px;
		min-height: 57px;
		margin: -16px -16px 14px;
		padding: 11px 16px;
	}

	.sampleEditPage
	.sampleVintageSection
	> .wineSiteSectionHeader
	.wineSiteSectionIcon {
		flex-basis: 34px;
		width: 34px;
		height: 34px;
		font-size: 14px;
	}

	.sampleEditPage
	.sampleVintageSection
	> .wineSiteSectionHeader h2 {
		font-size: 17px;
	}

	/* Keep Juice / Soil / Tissue tabs sticky too */
	.sampleEditPage
	.sampleAnalysisSection
	> .d-flex.justify-content-center.align-items-center.flex-wrap {
		position: sticky;
		top: 59px;
		z-index: 29;
		margin: -2px -4px 12px !important;
		padding: 8px 4px;
		background: #ffffff;
		border: 0;
		box-shadow: none;
	}

	.sampleEditPage .sampleAnalysisTab {
		min-height: 34px;
		padding: 6px 12px !important;
		font-size: 12px;
	}

	.sampleEditPage .sampleAnalysisSection {
		min-height: 0;
		margin-top: 0;
		padding-top: 10px;
		padding-bottom: 8px;
		border-top: 0;
		border-radius: 0 0 12px 12px;
	}

	.sampleEditPage .sampleAnalysisSection > .row:last-child {
		margin-bottom: 0 !important;
		padding-bottom: 0 !important;
	}
}

/* =========================================================
   PRO-ONLY SOIL / TISSUE ANALYSIS
========================================================= */

.samplePremiumAnalysisWrapper {
	position: relative;
}

.samplePremiumAnalysisLocked > .row {
	opacity: 0.48;
	filter: grayscale(0.7);

	pointer-events: none;
	user-select: none;
}

.samplePremiumAnalysisLocked .form-control {
	color: var(--vs-muted);
	background: var(--vs-disabled);
	border-color: #d8d5ce;
}

.samplePremiumAnalysisLocked .wineSiteLabel {
	color: #8a908b;
}

.samplePremiumAnalysisOverlay {
	position: absolute;
	inset: 0;
	z-index: 8;

	display: flex;
	align-items: flex-start;
	justify-content: flex-end;

	width: 100%;
	height: 100%;
	padding: 0.35rem;

	background: transparent;
	border: 0;
	border-radius: 10px;

	cursor: pointer;
}

/* =========================================================
   PRO-ONLY SOIL / TISSUE ANALYSIS
========================================================= */

.samplePremiumAnalysisWrapper {
	position: relative;
}

.samplePremiumAnalysisLocked > .row {
	opacity: 0.48;
	filter: grayscale(0.7);

	pointer-events: none;
	user-select: none;
}

.samplePremiumAnalysisLocked .form-control {
	color: var(--vs-muted);
	background: var(--vs-disabled);
	border-color: #d8d5ce;
}

.samplePremiumAnalysisLocked .wineSiteLabel {
	color: #8a908b;
}


/* CLICKABLE LAYER OVER THE LOCKED ANALYSIS */

.samplePremiumAnalysisOverlay {
	position: absolute;
	inset: 0;
	z-index: 8;

	display: block;

	width: 100%;
	height: 100%;
	padding: 0;

	background: transparent;
	border: 0;
	border-radius: 10px;

	cursor: pointer;
}

/* =========================================================
   PREMIUM ANALYSIS POPOVER
========================================================= */

.samplePremiumPopover.popover {
	min-width: 230px;
	max-width: 280px;

	background: #fffdf9;

	border: 1px solid rgba(122, 44, 55, 0.12);
	border-radius: 14px;

	box-shadow:
		0 14px 34px rgba(40, 28, 31, 0.16),
		0 3px 10px rgba(40, 28, 31, 0.08);

	overflow: hidden;
}

.samplePremiumPopover .popover-header {
	margin: 0;
	padding: 0.8rem 1rem 0.45rem;

	color: #7a2c37;
	background: transparent;

	border: none;

	font-size: 0.9rem;
	font-weight: 600;
	line-height: 1.2;
}

.samplePremiumPopover .popover-header::before {
	margin-right: 0.4rem;

	color: #a47c2b;

	font-family: "Font Awesome 6 Free", "Font Awesome 5 Free";
	font-weight: 900;
	content: "\f521";
}

.samplePremiumPopover .popover-body {
	padding: 0.35rem 1rem 0.95rem;

	color: #59605a;
	background: transparent;

	font-size: 0.8rem;
	line-height: 1.45;
}

.samplePremiumPopover .popover-arrow::before {
	border-right-color: rgba(122, 44, 55, 0.12);
}

.samplePremiumPopover .popover-arrow::after {
	border-right-color: #fffdf9;
}

.samplePremiumPopover.bs-popover-start .popover-arrow::after,
.samplePremiumPopover.bs-popover-auto[data-popper-placement^="left"] .popover-arrow::after {
	border-left-color: #fffdf9;
	border-right-color: transparent;
}

.samplePremiumPopover.bs-popover-bottom .popover-arrow::after,
.samplePremiumPopover.bs-popover-auto[data-popper-placement^="bottom"] .popover-arrow::after {
	border-bottom-color: #fffdf9;
	border-right-color: transparent;
}

.samplePremiumPopover.bs-popover-top .popover-arrow::after,
.samplePremiumPopover.bs-popover-auto[data-popper-placement^="top"] .popover-arrow::after {
	border-top-color: #fffdf9;
	border-right-color: transparent;
}

		padding-bottom: 8px;
		border-top: 0;
		border-radius: 0 0 12px 12px;
	}

	.sampleEditPage .sampleAnalysisSection > .row:last-child {
		margin-bottom: 0 !important;
		padding-bottom: 0 !important;
	}
}

.samplePremiumAnalysisWrapper {
	position: relative;
}

.samplePremiumPopover.popover {
	max-width: 300px;
	z-index: 1080;
}
.sampleAnalysisProIcon {
	margin-right: 0.4rem;
	color: #a47c2b;
	font-size: 0.78rem;
	vertical-align: 0.02em;
}