/* ============================================================
   getVIRTUAL Wizard — consolidated stylesheet
   ============================================================ */

/* --- Base tier options / panels / modal --- */

.gv-tier-options {
	display: flex;
	flex-direction: column;
	gap: 10px;
	max-width: 480px;
	margin: 20px auto;
	text-align: left;
}
.gv-tier-option {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 14px 18px;
	border: 2px solid #ddd;
	border-radius: 8px;
	cursor: pointer;
}
.gv-bundled-panel,
.gv-group-b-panel {
	max-width: 480px;
	margin: 16px auto;
	text-align: left;
	padding: 14px 18px;
	background: rgba(240, 234, 224, 0.06);
	border: 1px solid rgba(169, 124, 80, 0.35);
	border-radius: 8px;
}
.gv-bundled-items-list {
	margin: 4px 0 0;
	padding-left: 20px;
	list-style: disc;
	color: #F0EAE0;
	font-family: 'IBM Plex Sans', sans-serif;
	font-size: 14px;
	line-height: 1.7;
}
.gv-tooltip {
	display: inline-block;
	margin-left: 4px;
	cursor: help;
	color: #2271b1;
	font-weight: bold;
}
.gv-modal {
	position: fixed;
	top: 0; left: 0; right: 0; bottom: 0;
	background: rgba(0,0,0,0.4);
	z-index: 9999;
	align-items: center;
	justify-content: center;
}
.gv-modal-inner {
	background: #fff;
	padding: 24px 28px;
	border-radius: 10px;
	max-width: 420px;
	text-align: center;
	box-shadow: 0 10px 40px rgba(0,0,0,0.2);
}

/* --- Checkboxes, submit button, field markers --- */

.gv-checkbox-option {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 12px 16px;
	border: 2px solid #ddd;
	border-radius: 8px;
	cursor: pointer;
}

/* --- Pills: Business Type, GST Yes/No, Licenses --- */

/* Fix: rows of pills were left-aligned only, so a short last row
   (e.g. a single "Other" pill) sat flush left while the row above it
   was wider -- reading as scattered/uneven. Centering each wrapped
   row makes the whole cluster look like one deliberate block. */
.gv-pill-group {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 10px;
	margin-top: 8px;
}
.gv-pill-group-compact {
	gap: 6px;
}

/* Fix: the step 2 ("Would you also need any of these licenses...")
   and step 3 ("Do you need CA services also?") question headings
   sat left-aligned above their now-centered pill rows, which read as
   off-balance. Center just these two headings -- scoped narrowly
   rather than the shared .gv-subtext class in general, since that
   class is reused for "Included with your selection:", which
   introduces a left-aligned bullet list and should stay left-aligned. */
#gv-licenses-panel > .gv-subtext,
.gv-ca-services-block > .gv-subtext {
	text-align: center;
}
.gv-pill-option {
	display: inline-flex;
	position: relative;
	margin: 0 8px 8px 0;
	cursor: pointer;
	vertical-align: middle;
}
.gv-pill-group-compact .gv-pill-option {
	margin: 0 6px 6px 0;
}
.gv-pill-option input {
	position: absolute;
	opacity: 0;
	width: 0;
	height: 0;
}
.gv-pill-text {
	display: inline-block;
	padding: 9px 18px;
	border: 2px solid rgba(240, 234, 224, 0.45);
	border-radius: 999px;
	font-family: 'IBM Plex Sans', sans-serif;
	font-size: 13.5px;
	font-weight: 700;
	color: #F0EAE0;
}
.gv-pill-group-compact .gv-pill-text {
	padding: 6px 14px;
	font-size: 12.5px;
}
.gv-pill-option.gv-pill-selected .gv-pill-text {
	background: #A97C50 !important;
	border: 2px solid #F0EAE0 !important;
	color: #211D19 !important;
}
/* Checkmark space is reserved on every pill, selected or not (only its
   visibility toggles) -- otherwise the pill's own width changes the
   moment it's checked, since the added character takes up room that
   wasn't there before. That width change is what was shifting every
   other pill after it in the wrapped row. font-weight is also now
   constant across both states for the same reason: bold text renders
   wider than regular text, so a weight change on selection was
   producing the identical shifting problem a second way. */
.gv-pill-text::before {
	content: '\2713  ';
	visibility: hidden;
}
/* Fix: the reserved checkmark space above only sits on the LEFT of
   the label, so the visible text was centered relative to a wider
   box than its own width and read as pushed off toward the right
   edge. Mirroring the same reserved (always-hidden) space on the
   right balances it so the label centers on its own, true to eye. */
.gv-pill-text::after {
	content: '\2713  ';
	visibility: hidden;
}
.gv-pill-option.gv-pill-selected .gv-pill-text::before {
	visibility: visible;
}
.gv-pill-option input:focus-visible + .gv-pill-text {
	outline: 2px solid #A97C50;
	outline-offset: 2px;
}

.gv-submit-btn {
	all: unset;
	box-sizing: border-box !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	vertical-align: middle !important;
	width: auto !important;
	min-width: 200px !important;
	max-width: none !important;
	height: auto !important;
	min-height: 0 !important;
	margin-top: 20px !important;
	padding: 7px 28px !important;
	line-height: 1.3 !important;
	background: #2271b1 !important;
	color: #fff !important;
	border: none !important;
	border-radius: 999px !important;
	cursor: pointer !important;
	font-family: 'IBM Plex Sans', sans-serif !important;
	font-size: 13.5px !important;
	font-weight: 600 !important;
	letter-spacing: 0.03em !important;
	text-align: center !important;
	box-shadow: 0 4px 14px rgba(34, 113, 177, 0.35) !important;
	transition: background 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease !important;
}
.gv-submit-btn:hover:not(:disabled) {
	background: #1b5a8f !important;
	box-shadow: 0 6px 18px rgba(34, 113, 177, 0.45) !important;
	transform: translateY(-1px) !important;
}
.gv-submit-btn:active:not(:disabled) {
	transform: translateY(0) !important;
	box-shadow: 0 3px 10px rgba(34, 113, 177, 0.35) !important;
}
.gv-submit-btn:disabled {
	background: #ccc !important;
	cursor: not-allowed !important;
}
.gv-decorative-btn {
	cursor: default !important;
	user-select: none !important;
}
.gv-required { color: #d63638; }
.gv-optional-tag { font-size: 12px; color: #777; font-weight: normal; }

/* --- Homepage hero section --- */

.gv-hero {
	max-width: 640px;
	margin: 16px auto 20px !important;
	text-align: center;
}
.gv-hero-title {
	font-family: 'IBM Plex Serif', serif;
	font-weight: 700;
	font-size: 40px;
	color: var(--gv-primary, #00B7B3);
	margin: 0 0 14px;
	line-height: 1.2;
}
.gv-hero-subtext {
	font-family: 'IBM Plex Sans', sans-serif;
	font-size: 17px;
	color: var(--gv-ink, #16213D);
	margin: 0 0 28px;
}
.gv-hero-btn {
	font-size: 16px;
	padding: 14px 32px;
}
@media (max-width: 600px) {
	.gv-hero-title { font-size: 30px; }
}

/* --- Contrast fix: guarantee legible background regardless of the
   surrounding Elementor section's own background/padding --- */

#getvirtual-wizard.getvirtual-wizard {
	/* Transparent on purpose — the hero title lives in this same
	   wrapper, and it needs the page's own background to show through
	   behind it. The actual card background is set below, scoped to
	   just the progress bar + step content. */
	max-width: 1400px;
	margin: 0 auto;
	padding: 8px 20px 30px !important;
}
#getvirtual-wizard .gv-hero-title,
#getvirtual-wizard h2 {
	color: var(--gv-primary, #00B7B3) !important;
}
#getvirtual-wizard .gv-hero-subtext {
	color: #F0EAE0 !important;
}
#getvirtual-wizard .gv-tier-option,
#getvirtual-wizard .gv-radio-option,
#getvirtual-wizard .gv-checkbox-option {
	background: transparent !important;
	color: #F0EAE0 !important;
	border-color: rgba(240, 234, 224, 0.45) !important;
}
#getvirtual-wizard .gv-step .gv-subtext,
#getvirtual-wizard .gv-step label,
#getvirtual-wizard .gv-step p,
#gv-step-indicator,
#gv-progress-bar .gv-link-btn {
	color: #F0EAE0;
}
/* Self-contained light "notice" boxes (results messages, exact-match
   banner) already carry their own light background + dark text — the
   rule above would otherwise clobber just the text color and leave
   them illegible (light-on-light). */
#getvirtual-wizard .gv-step p.gv-results-message {
	color: var(--gv-ink, #16213D) !important;
}
#getvirtual-wizard .gv-step p.gv-exact-match-banner {
	color: var(--gv-check, #2F6F4E) !important;
}

/* --- Results grouping headings (In City / Other options in State) --- */

.gv-results-group-heading {
	font-family: 'IBM Plex Serif', serif;
	font-size: 20px;
	font-weight: 600;
	color: #F0EAE0;
	margin: 30px 0 14px;
}
.gv-results-group-heading:first-of-type {
	margin-top: 10px;
}
.gv-elsewhere-sort-row {
	margin-top: -6px;
}

#gv-results-cards {
	transition: opacity 0.15s ease;
}
#gv-results-cards.gv-sort-transitioning {
	opacity: 0.2;
}

.gv-sort-row {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 8px;
	margin: 4px 0 20px;
}
.gv-sort-row label {
	font-family: 'IBM Plex Sans', sans-serif;
	font-size: 13px;
	color: #F0EAE0;
}
.gv-sublocality-label {
	margin-left: 14px;
}
.gv-sort-row select {
	font-family: 'IBM Plex Sans', sans-serif;
	font-size: 13px;
	color: #211D19;
	background: #F0EAE0;
	border: 1px solid rgba(169, 124, 80, 0.4);
	border-radius: 4px;
	padding: 5px 8px;
	cursor: pointer;
}
.gv-exact-match-tag {
	display: inline-block;
	background: var(--gv-check, #2F6F4E);
	color: #fff;
	font-size: 10px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	padding: 2px 8px;
	border-radius: 999px;
	vertical-align: middle;
}

/* --- Explore All Spaces (browse panel) --- */

#gv-browse-toggle-wrap {
	text-align: center;
	margin: 10px 0 20px;
}
.gv-link-btn {
	background: none;
	border: none;
	color: var(--gv-slate, #5B6472);
	font-family: 'IBM Plex Sans', sans-serif;
	font-size: 14px;
	text-decoration: underline;
	cursor: pointer;
	padding: 6px;
}
.gv-link-btn:hover {
	color: var(--gv-ink, #16213D);
}
#gv-progress-bar .gv-link-btn {
	color: #F0EAE0;
}
#gv-progress-bar .gv-link-btn:hover {
	color: #A97C50;
}
#gv-browse-panel {
	max-width: 900px;
	margin: 0 auto 30px;
	padding: 20px;
	background: #f7f9fb;
	border-radius: 8px;
}
.gv-offerings-list {
	font-size: 13.5px;
}
.gv-offering-row {
	margin: 0 0 6px;
	color: var(--gv-ink, #16213D);
}
.gv-offering-row strong {
	font-family: 'IBM Plex Mono', monospace;
}

/* --- Progress bar (step indicator + Start Over) and nav row (Previous/Continue) --- */

#gv-progress-bar {
	display: none;
	justify-content: space-between;
	align-items: center;
	max-width: 640px;
	margin: 0 auto;
	background: #3F3D39;
	border: 1px solid rgba(169, 124, 80, 0.4);
	border-bottom: 1px dashed rgba(169, 124, 80, 0.3);
	border-radius: 10px 10px 0 0;
	padding: 10px 20px;
}
/* On every other (form-like) step, this stays boxed at the same
   640px as the step content below it, so the two align. Results is
   the one step wide enough that this same box would otherwise look
   like a separate, mismatched element sitting above it -- matching
   the wider results width here instead of leaving it at 640px. */
#getvirtual-wizard.gv-showing-results #gv-progress-bar {
	max-width: none;
	width: 100%;
}
#getvirtual-wizard .gv-step {
	max-width: 640px;
	margin: 0 auto;
	background: #3F3D39;
	border: 1px solid rgba(169, 124, 80, 0.4);
	border-top: none;
	border-radius: 0 0 10px 10px;
	padding: 24px 20px 30px;
	box-shadow: 0 8px 30px rgba(0, 0, 0, 0.35);
}
/* The Recommended Offices step is a grid of listing cards, not a
   narrow form -- it needs the full width the wrapper above now
   provides, rather than staying boxed to the same 640px every other
   (form-like) step uses. Without this, the wide empty margins on
   either side were exactly this same 640px constraint at work. */
#getvirtual-wizard .gv-step#gv-step-results {
	max-width: none;
	width: 100%;
}
#gv-step-indicator {
	font-family: 'IBM Plex Sans', sans-serif;
	font-size: 13px;
	color: #B8AFA0;
}
#gv-start-over-btn {
	font-size: 13px;
	padding: 4px;
}
.gv-step1-nav-row {
	display: flex;
	justify-content: space-between;
	align-items: center;
	max-width: 640px;
	margin: 20px auto 0;
}

/* --- Centering: browse panel fields and Step 2 fields/boxes --- */

#gv-browse-panel {
	text-align: center;
}
#gv-browse-panel .gv-field {
	max-width: 320px;
	margin: 0 auto 14px;
	text-align: left;
}

.gv-field {
	max-width: 480px;
	margin: 16px auto;
	text-align: left;
}
.gv-radio-group {
	max-width: 480px;
	margin: 8px auto 0;
}

/* --- Highlighted browse/recommendation toggle — this is a genuine
   feature/USP, styled to stand out rather than read as a plain link --- */

.gv-browse-toggle-highlight {
	display: inline-block;
	background: rgba(169, 124, 80, 0.10);
	color: var(--gv-ink, #16213D);
	border: 2px solid var(--gv-seal, #A97C50);
	border-radius: 999px;
	padding: 10px 22px;
	font-family: 'IBM Plex Sans', sans-serif;
	font-size: 14px;
	font-weight: 600;
	text-decoration: none;
	cursor: pointer;
	transition: background 0.15s ease, transform 0.1s ease;
}
.gv-browse-toggle-highlight:hover {
	background: rgba(169, 124, 80, 0.20);
	transform: translateY(-1px);
}

/* --- Exact match celebration banner --- */

.gv-exact-match-banner {
	font-size: 17px;
	color: var(--gv-check, #2F6F4E);
	background: #E8F3EC;
	border: 1px solid #BFE0CC;
	border-radius: 6px;
	padding: 12px 16px;
	margin-bottom: 16px;
}
.gv-exact-match-banner em strong {
	font-style: italic;
	font-weight: 700;
}

/* --- Testimonials display + private feedback form --- */

.gv-testimonials-section {
	max-width: 900px;
	margin: 40px auto;
	padding: 0 20px;
	text-align: center;
}
.gv-testimonials-heading {
	font-family: 'IBM Plex Serif', serif;
	font-size: 28px;
	color: var(--gv-primary, #00B7B3);
	margin-bottom: 24px;
}
.gv-testimonials-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: 20px;
}
.gv-testimonial-card {
	background: #fff;
	border: 1px solid var(--gv-line, #DAD2C0);
	border-radius: 8px;
	padding: 20px;
	text-align: left;
}
.gv-testimonial-photo {
	width: 48px;
	height: 48px;
	border-radius: 50%;
	object-fit: cover;
	margin-bottom: 10px;
}
.gv-testimonial-quote {
	font-style: italic;
	color: var(--gv-ink, #16213D);
	font-size: 14px;
	margin-bottom: 10px;
}
.gv-testimonial-name {
	font-weight: 600;
	color: var(--gv-ink, #16213D);
	margin: 0;
	font-size: 14px;
}
.gv-testimonial-role {
	color: var(--gv-slate, #5B6472);
	font-size: 12px;
	margin: 2px 0 0;
}

.gv-feedback-form-wrap {
	max-width: 480px;
	margin: 40px auto;
	padding: 0 20px;
}

/* --- Center the tier-question heading --- */

#gv-tier-question-card h2 {
	text-align: center;
}

/* --- Center Step 2's heading and intro text --- */

#gv-step-2 h2 {
	text-align: center;
}
#gv-step-2 > p {
	text-align: center;
	max-width: 480px;
	margin: 0 auto 20px;
}

/* --- Center Step 2's field labels, selects, and the business type radios --- */

.gv-field,
.gv-radio-group {
	text-align: center !important;
}
.gv-radio-group label {
	display: inline-flex;
}

/* --- Top Cities wizard launcher --- */

.gv-top-cities-section {
	max-width: 900px;
	margin: 40px auto;
	padding: 0 20px;
	text-align: center;
}
.gv-top-cities-heading {
	font-family: 'IBM Plex Serif', serif;
	font-size: 28px;
	color: var(--gv-primary, #00B7B3);
	margin-bottom: 20px;
}
.gv-top-cities-grid {
	display: grid;
	grid-template-columns: repeat(7, 1fr);
	gap: 14px;
}
.gv-city-tile {
	background: #fff;
	border: 2px solid var(--gv-line, #DAD2C0);
	border-radius: 8px;
	padding: 0 0 14px;
	font-family: 'IBM Plex Sans', sans-serif;
	font-size: 14px;
	font-weight: 600;
	color: var(--gv-ink, #16213D);
	cursor: pointer;
	transition: border-color 0.15s ease, transform 0.1s ease;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	align-items: center;
}
.gv-city-tile:hover {
	border-color: var(--gv-seal, #A97C50);
	transform: translateY(-2px);
}
.gv-city-tile-image {
	width: 100%;
	height: 90px;
	object-fit: cover;
	margin-bottom: 10px;
	background: #f2efe8;
}
.gv-city-tile-label {
	padding: 0 10px;
}
.gv-city-tile-label-no-image {
	padding-top: 100px;
}
@media (max-width: 900px) {
	.gv-top-cities-grid {
		grid-template-columns: repeat(4, 1fr);
	}
}
@media (max-width: 500px) {
	.gv-top-cities-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

/* --- More tile (Popular Locations) --- */

.gv-city-tile-more {
	text-decoration: none;
}
.gv-city-tile-more .gv-city-tile-label {
	color: var(--gv-seal, #A97C50);
}

/* --- Location archive pages (State -> City -> Spaces) and hub --- */

.gv-location-archive,
.gv-all-locations-section {
	max-width: 900px;
	margin: 40px auto;
	padding: 0 20px;
}
.gv-location-header {
	text-align: center;
	margin-bottom: 20px;
}
.gv-location-title {
	font-family: 'IBM Plex Serif', serif;
	font-size: 34px;
	color: var(--gv-primary, #00B7B3);
}
.gv-location-intro {
	text-align: center;
	color: var(--gv-slate, #5B6472);
	margin-bottom: 24px;
}
.gv-location-city-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 14px;
}
@media (max-width: 700px) {
	.gv-location-city-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}
.gv-location-city-tile {
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 100%;
	box-sizing: border-box;
	text-align: center;
	background: #fff;
	border: 2px solid var(--gv-line, #DAD2C0);
	border-radius: 8px;
	padding: 16px;
	font-family: 'IBM Plex Sans', sans-serif;
	font-weight: 600;
	color: var(--gv-ink, #16213D);
	text-decoration: none;
	transition: border-color 0.15s ease, transform 0.1s ease;
}
.gv-location-city-tile:hover {
	border-color: var(--gv-seal, #A97C50);
	transform: translateY(-2px);
}

.gv-location-city-tile-image {
	width: 100%;
	height: 90px;
	object-fit: cover;
	border-radius: 4px;
	margin-bottom: 10px;
}
.gv-term-description {
	max-width: 700px;
	margin: 0 auto 30px;
	text-align: center;
	color: var(--gv-slate, #5B6472);
	font-size: 14.5px;
	line-height: 1.6;
}

/* --- Previous / Start Over nav row (archive + detail pages) --- */

.gv-location-nav-row {
	display: flex;
	justify-content: space-between;
	max-width: 900px;
	margin: 0 auto 20px;
	padding: 0 20px;
}

/* --- Bulk Enquiry modal --- */

.gv-bulk-enquiry-inner {
	position: relative;
	max-width: 640px;
	width: 92%;
	max-height: 85vh;
	overflow-y: auto;
	text-align: left;
	padding: 32px 36px;
	border-radius: 10px;
	box-shadow: 0 12px 40px rgba(22, 33, 61, 0.18);
}
.gv-bulk-enquiry-close-btn {
	position: absolute;
	top: 14px;
	right: 16px;
	background: none;
	border: none;
	font-size: 26px;
	line-height: 1;
	color: var(--gv-slate, #5B6472);
	cursor: pointer;
	padding: 4px 8px;
}
.gv-bulk-enquiry-close-btn:hover {
	color: var(--gv-ink, #16213D);
}
.gv-bulk-enquiry-inner h2 {
	font-family: 'IBM Plex Serif', serif;
	font-size: 26px;
	color: var(--gv-primary, #00B7B3);
	margin: 0 0 10px;
	white-space: nowrap;
}
.gv-bulk-enquiry-inner > p {
	font-family: 'IBM Plex Sans', sans-serif;
	color: var(--gv-slate, #5B6472);
	font-size: 14px;
	line-height: 1.6;
	margin: 0 0 22px;
}

/* Scoped override: the generic .gv-field rule centers content for the
   wizard's Step 2 — here we want clean, left-aligned, stacked labels
   above full-width inputs instead. */
.gv-bulk-enquiry-inner .gv-field {
	text-align: left !important;
	margin: 0 0 18px;
	max-width: none;
}
.gv-bulk-enquiry-inner .gv-field > label:first-child {
	display: block;
	font-family: 'IBM Plex Sans', sans-serif;
	font-weight: 600;
	font-size: 13px;
	color: var(--gv-ink, #16213D);
	margin-bottom: 8px;
}
.gv-bulk-enquiry-inner .gv-field input[type="text"],
.gv-bulk-enquiry-inner .gv-field input[type="email"],
.gv-bulk-enquiry-inner .gv-field input[type="tel"],
.gv-bulk-enquiry-inner .gv-field textarea {
	width: 100%;
	padding: 10px 12px;
	border: 1px solid var(--gv-line, #DAD2C0);
	border-radius: 6px;
	font-family: 'IBM Plex Sans', sans-serif;
	font-size: 14px;
	box-sizing: border-box;
}
.gv-bulk-enquiry-inner .gv-field .gv-radio-option {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-right: 20px;
	font-size: 14px;
	border: none;
	padding: 0;
}

.gv-bulk-enquiry-table-wrap {
	max-height: 280px;
	overflow-y: auto;
	border: 1px solid var(--gv-line, #DAD2C0);
	border-radius: 8px;
}
.gv-bulk-enquiry-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 13.5px;
}
.gv-bulk-enquiry-table thead th {
	position: sticky;
	top: 0;
	background: #f7f9fb;
	text-align: left;
	padding: 10px 14px;
	border-bottom: 1px solid var(--gv-line, #DAD2C0);
	font-family: 'IBM Plex Sans', sans-serif;
	font-weight: 600;
}
.gv-bulk-enquiry-table td {
	padding: 10px 14px;
	border-bottom: 1px solid var(--gv-line, #DAD2C0);
	vertical-align: middle;
}
.gv-bulk-enquiry-table .gv-checkbox-option {
	border: none;
	padding: 0;
	display: flex;
	align-items: center;
	gap: 8px;
}
.gv-be-state-name {
	font-weight: 600;
	white-space: nowrap;
}
.gv-be-city-select {
	width: 100%;
	padding: 8px 10px;
	font-size: 13.5px;
	font-family: 'IBM Plex Sans', sans-serif;
	border: 1px solid var(--gv-line, #DAD2C0);
	border-radius: 6px;
}



/* --- Fix: reserve the same vertical space whether or not a location
   tile has an image, so labels align identically across a row --- */

.gv-location-tile-label-no-image {
	padding-top: 100px;
	display: block;
}
.gv-location-city-grid {
	align-items: stretch;
}
.gv-location-city-tile {
	height: 100%;
}

/* --- Compare Spaces: checkbox, floating bar, comparison modal --- */

.gv-compare-checkbox-label {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	font-size: 12px;
	color: var(--gv-slate, #5B6472) !important;
	cursor: pointer;
	margin-top: 4px;
}

#gv-compare-bar {
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	z-index: 9998;
	background: var(--gv-ink, #16213D);
	color: #fff;
	padding: 14px 24px;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 20px;
	box-shadow: 0 -4px 16px rgba(0,0,0,0.15);
}
#gv-compare-count {
	font-family: 'IBM Plex Sans', sans-serif;
	font-size: 14px;
}
#gv-compare-bar .gv-link-btn {
	color: #fff;
}
#gv-compare-bar .gv-submit-btn {
	margin-top: 0;
}

.gv-compare-modal-inner {
	background: #fff;
	max-width: 900px;
	width: 92%;
	max-height: 85vh;
	overflow: auto;
	padding: 32px 36px;
	position: relative;
	text-align: left;
	border-radius: 10px;
	box-shadow: 0 12px 40px rgba(22, 33, 61, 0.18);
}
.gv-compare-modal-inner h2 {
	font-family: 'IBM Plex Serif', serif;
	font-size: 26px;
	color: var(--gv-primary, #00B7B3);
	margin: 0 0 20px;
}
.gv-compare-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 13.5px;
	color: var(--gv-ink, #16213D);
}
.gv-compare-table th,
.gv-compare-table td {
	padding: 10px 14px;
	border-bottom: 1px solid var(--gv-line, #DAD2C0);
	text-align: left;
	vertical-align: top;
	color: var(--gv-ink, #16213D);
}
.gv-compare-table thead th {
	font-family: 'IBM Plex Serif', serif;
	font-size: 15px;
	color: var(--gv-ink, #16213D);
	background: #f7f9fb;
}
.gv-compare-row-label {
	font-weight: 600;
	white-space: nowrap;
	background: #f7f9fb;
}
.gv-compare-section-row td {
	font-family: 'IBM Plex Serif', serif;
	font-size: 13px;
	font-weight: 600;
	color: var(--gv-slate, #5B6472);
	background: #f0f2f5;
	padding-top: 12px;
	padding-bottom: 6px;
}
.gv-compare-table .gv-support-yes {
	color: var(--gv-check, #2F6F4E);
	font-weight: 500;
}
.gv-compare-table .gv-support-no {
	color: #B32D2E;
	font-weight: 500;
}
.gv-compare-winner-dialog {
	background: #eef8f3;
	border: 1px solid var(--gv-check, #2F6F4E);
	border-radius: 8px;
	padding: 12px 16px;
	margin-bottom: 14px;
	font-size: 13.5px;
	color: var(--gv-ink, #16213D);
}
.gv-compare-winner-card {
	background: #fff;
	border: 2px solid var(--gv-check, #2F6F4E);
	border-radius: 8px;
	padding: 12px 16px;
	margin-bottom: 16px;
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 13.5px;
}
.gv-compare-winner-card p { margin: 0; }
.gv-compare-winner-badge {
	background: var(--gv-check, #2F6F4E);
	color: #fff;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	padding: 4px 10px;
	border-radius: 999px;
	flex-shrink: 0;
}
.gv-compare-winner-badge-inline {
	display: block;
	background: var(--gv-check, #2F6F4E);
	color: #fff;
	font-size: 10px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	padding: 2px 8px;
	border-radius: 999px;
	margin-top: 4px;
	width: fit-content;
}
.gv-compare-table .gv-compare-winner-col {
	background: #eef8f3;
}
.gv-compare-table th.gv-compare-winner-col {
	background: #dcf0e6;
}

/* --- Reserve space at the bottom of the page while the compare bar
   is visible, so it doesn't mask the last row of cards --- */

body.gv-compare-bar-active {
	padding-bottom: 76px;
}

/* --- Card locality: styled as a clear badge, not plain text — this
   matters especially for "elsewhere in [State]" fallback results,
   where each card may be in a different city and that needs to be
   obvious at a glance, not something the visitor has to hunt for --- */

/* .gv-card-locality moved to listing-cards.css — that file owns the
   card component's styling, keeping all card-related CSS in one place */

/* Disabled at site owner's request: the old wizard.js prototype behind this card is fully turned off (see js/wizard.js), so this shell would otherwise sit on the page empty and non-functional. Remove this rule if the feature is ever restored. */
#gv-tier-question-card { display: none !important; }

/* ===================================================================
   Tile redesign for the pill groups (Business Type / CA Yes-No /
   Licenses -- see the "Pills:" comment above). Site owner reviewed a
   set of style mockups and picked a two-column tile layout with a
   checkbox/radio-style indicator instead of the plain pill + inline
   checkmark. These rules override the pill rules above rather than
   editing them, so that original block's comments/history stay put.
   ================================================================ */

/* Grid instead of flex-wrap so each step can set its own column
   count. Licenses: grid-auto-flow:column with 4 rows fills column 1
   top-to-bottom first (4 items), then spills into column 2 (the
   remaining 3) -- exactly the 4-then-3 split asked for. CA Yes/No:
   two tiles side by side. Business Type: 3 even columns (same count
   it already wrapped to, just gridded instead of flexed). */
#gv-licenses-panel .gv-pill-group {
	display: grid;
	grid-template-columns: 1fr 1fr;
	grid-template-rows: repeat(4, auto);
	grid-auto-flow: column;
	gap: 10px 14px;
}
.gv-ca-services-block .gv-pill-group {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 10px 14px;
}
#gv-step-2 .gv-pill-group {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 10px;
}

/* Tile: the border/background that used to live on .gv-pill-text
   moves up to .gv-pill-option, so the whole row -- label text and
   indicator both -- reads as one selectable card. */
.gv-pill-group .gv-pill-option {
	display: flex !important;
	align-items: center;
	margin: 0 !important;
	padding: 13px 14px;
	border: 1.6px solid rgba(240, 234, 224, 0.45);
	border-radius: 10px;
	background: transparent;
	transition: border-color 0.15s ease, background 0.15s ease;
}
.gv-pill-group-compact .gv-pill-option {
	padding: 11px 14px;
}
.gv-pill-group .gv-pill-text {
	padding: 0;
	border: none;
	border-radius: 0;
	background: none !important;
	color: #F0EAE0 !important;
	font-size: 13px;
}
.gv-pill-group-compact .gv-pill-text {
	font-size: 12.5px;
}

/* Drop the old inline-checkmark trick -- the indicator box below
   replaces it. */
.gv-pill-group .gv-pill-text::before,
.gv-pill-group .gv-pill-text::after {
	content: none;
}

/* Indicator box, right-aligned via margin-left:auto on a flex row.
   Square for the multi-select licenses list, circle for the
   single-select CA Yes/No and Business Type lists, so the shape
   itself signals how many can be picked. */
.gv-pill-group .gv-pill-option::after {
	content: '';
	flex: none;
	width: 18px;
	height: 18px;
	margin-left: auto;
	padding-left: 12px;
	border: 1.6px solid rgba(240, 234, 224, 0.45);
	box-sizing: border-box;
	background: transparent;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 11px;
	font-weight: 900;
	color: #211D19;
	line-height: 1;
}
#gv-licenses-panel .gv-pill-option::after {
	border-radius: 4px;
}
.gv-ca-services-block .gv-pill-option::after,
#gv-step-2 .gv-pill-option::after {
	border-radius: 50%;
}

.gv-pill-group .gv-pill-option.gv-pill-selected {
	border-color: #A97C50;
	background: rgba(169, 124, 80, 0.15);
}
.gv-pill-group .gv-pill-option.gv-pill-selected::after {
	background: #A97C50;
	border-color: #A97C50;
}
#gv-licenses-panel .gv-pill-option.gv-pill-selected::after {
	content: '\2713';
}

/* Fix: the raw markup for these pill groups has a <br> between each
   label (harmless under the old flex-wrap layout, where a zero-size
   inline element just disappears into the flow). Under CSS grid,
   every child becomes a real grid item, so those <br> tags were each
   claiming their own cell and pushing the pills into extra columns.
   Removing them from grid participation restores the intended
   column count. */
#gv-licenses-panel .gv-pill-group > br,
.gv-ca-services-block .gv-pill-group > br,
#gv-step-2 .gv-pill-group > br {
	display: none;
}

/* Fix: clicking a tile (a native click, not a drag) was sometimes
   also selecting the label's text, which showed as a stray white
   selection-highlight box behind the words -- most visible on
   "...Registration" pills. The tile border/tint plus the checkbox
   or radio dot already communicate selection, so the text itself
   doesn't need to be selectable at all. */
.gv-pill-group .gv-pill-option {
	-webkit-user-select: none;
	user-select: none;
}

/* Fix: the pre-existing ".gv-pill-option.gv-pill-selected .gv-pill-text"
   rule above (3 classes, !important) is more specific than the tile
   rules in this block (2 classes), so on selection it was still
   winning and painting its own tan-filled, cream-bordered pill
   around just the text -- a second "box" nested inside the new tile
   border. That's the stray white-edged rectangle around the label
   (most visible on the longer "...Registration" pills). Selection is
   already shown by the tile border/tint and the checkbox or radio
   dot, so this neutralizes the old text-level styling entirely
   rather than layering another one on top. */
.gv-pill-group .gv-pill-option.gv-pill-selected .gv-pill-text {
	background: none !important;
	border: none !important;
	color: #F0EAE0 !important;
}

/* Reorder: "Other" now sits where "Import Export Certificate" used
   to be (end of column 1), and Import Export Certificate moves to
   the end of column 2. Done with grid order rather than touching the
   PHP markup order, so the submitted field values/logic are
   untouched -- only the visual position changes. Grid auto-placement
   sorts items by this "order" value before laying them into the
   column-major flow set up above, so every item needs one to stay
   predictable. */
#gv-licenses-panel .gv-pill-option:has(input[value="__gst__"]) { order: 1; }
#gv-licenses-panel .gv-pill-option:has(input[value="fssai"]) { order: 2; }
#gv-licenses-panel .gv-pill-option:has(input[value="drug_licence"]) { order: 3; }
#gv-licenses-panel .gv-pill-option:has(input[value="other"]) { order: 4; }
#gv-licenses-panel .gv-pill-option:has(input[value="rera"]) { order: 5; }
#gv-licenses-panel .gv-pill-option:has(input[value="shop_act"]) { order: 6; }
#gv-licenses-panel .gv-pill-option:has(input[value="iec"]) { order: 7; }