/* =============================================================
   Money Ready Volunteer Portal  v1.5.0
   #mrvp-portal prefix for nuclear specificity vs Honeycom3
   Card classes: .mrvp-card__content, .mrvp-card__meta-row, .mrvp-meta-label, .mrvp-meta-value
   Grid: .mrvp-grid
   Panel: .mrvp-detail-panel + .is-active
   ============================================================= */

@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;600;700&display=swap');

:root {
	--mr-pinkey:     #8F0425;
	--mr-pinkey-10:  #F4E6E9;
	--mr-pinkey-20:  #E9CDD3;
	--mr-pinkey-5:   #F9F2F4;
	--mr-score:      #59396B;
	--mr-tenner:     #CC480A;
	--mr-fiver:      #1C466B;
	--mr-fiver-20:   #D2DAE1;
	--mr-silver:     #F2F2F2;
	--mr-vault:      #767676;
	--mr-fine-print: #0C0C0C;
	--mr-white:      #FFFFFF;
	--font-headline: 'Forma DJR Display', 'forma-djr-display', Arial, sans-serif;
	--font-body:     'Open Sans', Arial, sans-serif;
}

/* =============================================================
   RESET
   ============================================================= */
#mrvp-portal,
#mrvp-portal *,
#mrvp-portal *::before,
#mrvp-portal *::after {
	box-sizing: border-box !important;
	text-align: left !important;
}

#mrvp-portal {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 20px 40px;
	font-family: var(--font-body) !important;
	font-size: 15px !important;
	line-height: 1.5 !important;
	color: var(--mr-fine-print) !important;
}

/* =============================================================
   FILTER BAR
   ============================================================= */
#mrvp-portal .mrvp-filters {
	display: flex !important;
	flex-wrap: wrap !important;
	flex-direction: row !important;
	gap: 12px;
	align-items: flex-end !important;
	padding: 20px 24px 28px !important;
	background: var(--mr-pinkey-5);
	border: 1px solid var(--mr-pinkey-20);
	border-radius: 6px;
	margin-bottom: 16px;
}

#mrvp-portal .mrvp-filter-group {
	display: flex !important;
	flex-direction: column !important;
	gap: 4px;
	flex: 1 1 160px;
	position: relative !important;
}

#mrvp-portal .mrvp-filter-group label {
	font-size: 0.7rem !important;
	font-weight: 700 !important;
	text-transform: uppercase !important;
	letter-spacing: 0.06em !important;
	color: var(--mr-score) !important;
	display: block !important;
	margin: 0 !important;
	padding: 0 !important;
}

#mrvp-portal .mrvp-filter-group input,
#mrvp-portal .mrvp-filter-group select {
	padding: 9px 12px !important;
	border: 1px solid var(--mr-pinkey-20) !important;
	border-radius: 4px !important;
	font-size: 0.875rem !important;
	font-family: var(--font-body) !important;
	background: var(--mr-white) !important;
	color: var(--mr-fine-print) !important;
	width: 100% !important;
	margin: 0 !important;
	height: auto !important;
}

#mrvp-portal .mrvp-filter-group input:focus,
#mrvp-portal .mrvp-filter-group select:focus {
	outline: 2px solid var(--mr-pinkey) !important;
	outline-offset: 1px;
	border-color: var(--mr-pinkey) !important;
}

/* Active filter indicator */
#mrvp-portal .mrvp-filter-group.is-active input,
#mrvp-portal .mrvp-filter-group.is-active select {
	border-color: var(--mr-pinkey) !important;
	background: var(--mr-pinkey-10) !important;
}

#mrvp-portal .mrvp-filter-group.is-active label {
	color: var(--mr-pinkey) !important;
}

/* Filter actions: Search + Reset side by side */
#mrvp-portal .mrvp-filter-group--actions {
	flex-direction: row !important;
	flex: 0 0 auto !important;
	gap: 8px !important;
	align-items: flex-end !important;
}

/* Postcode status text — positioned absolutely so it doesn't affect input alignment */
#mrvp-portal .mrvp-postcode-status {
	font-size: 0.72rem !important;
	line-height: 1.3 !important;
	position: absolute !important;
	bottom: -16px !important;
	left: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	display: block !important;
	white-space: nowrap !important;
}

#mrvp-portal .mrvp-postcode-status--loading { color: var(--mr-vault) !important; }
#mrvp-portal .mrvp-postcode-status--ok      { color: #2e7d32 !important; }
#mrvp-portal .mrvp-postcode-status--error    { color: var(--mr-tenner) !important; }
#mrvp-portal .mrvp-postcode-status--info     { color: var(--mr-vault) !important; font-style: italic !important; }

/* No results message */
#mrvp-portal .mrvp-no-results {
	padding: 40px 24px !important;
	text-align: center !important;
	background: var(--mr-silver) !important;
	border-radius: 6px !important;
	margin-top: 8px !important;
}

#mrvp-portal .mrvp-no-results p {
	color: var(--mr-vault) !important;
	margin: 0 0 16px !important;
	font-size: 0.95rem !important;
	text-align: center !important;
}

#mrvp-portal .mrvp-btn--sm {
	padding: 7px 16px !important;
	font-size: 0.8rem !important;
}

/* =============================================================
   RESULTS COUNT
   ============================================================= */
#mrvp-portal .mrvp-results-count {
	font-size: 0.85rem !important;
	color: var(--mr-vault) !important;
	margin: 0 0 16px !important;
	display: block !important;
}

/* =============================================================
   PAGINATION
   ============================================================= */
#mrvp-portal .mrvp-pagination {
	display: flex !important;
	flex-direction: row !important;
	justify-content: center !important;
	align-items: center !important;
	gap: 8px !important;
	margin: 32px 0 16px !important;
	padding: 0 !important;
	flex-wrap: wrap !important;
}

#mrvp-portal .mrvp-pagination__btn {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	min-width: 40px !important;
	height: 40px !important;
	padding: 0 10px !important;
	border-radius: 10px !important;
	border: 2px solid transparent !important;
	background: transparent !important;
	color: var(--mr-score) !important;
	font-family: var(--font-body) !important;
	font-size: 0.95rem !important;
	font-weight: 600 !important;
	line-height: 1 !important;
	cursor: pointer !important;
	transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease !important;
	margin: 0 !important;
}

#mrvp-portal .mrvp-pagination__btn:hover {
	background: rgba(143, 4, 37, 0.08) !important;
	border-color: var(--mr-pinkey) !important;
	color: var(--mr-pinkey) !important;
}

#mrvp-portal .mrvp-pagination__btn.is-active {
	background: var(--mr-pinkey) !important;
	color: var(--mr-white) !important;
	border-color: var(--mr-pinkey) !important;
}

#mrvp-portal .mrvp-pagination__btn.is-active:hover {
	background: var(--mr-pinkey) !important;
	color: var(--mr-white) !important;
}

#mrvp-portal .mrvp-pagination__btn[disabled],
#mrvp-portal .mrvp-pagination__btn:disabled {
	opacity: 0.3 !important;
	pointer-events: none !important;
	cursor: default !important;
}

#mrvp-portal .mrvp-pagination__nav {
	font-size: 1.4rem !important;
	line-height: 1 !important;
	padding: 0 !important;
}

/* =============================================================
   CARD GRID  (.mrvp-grid)
   ============================================================= */
#mrvp-portal .mrvp-grid {
	display: grid !important;
	grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)) !important;
	gap: 24px !important;
	padding: 0 !important;
	margin: 0 !important;
}

/* Main grid: force equal-width fixed-column layout (override theme flex) */
/* display:grid is set by the .mrvp-grid rule above; omitting it here keeps
   the ID-rule specificity from beating .mrvp-hidden when JS hides the grid. */
#mrvp-portal #mrvp-grid {
	grid-template-columns: repeat(3, 1fr) !important;
	gap: 24px !important;
	width: 100% !important;
	padding: 0 !important;
	margin: 0 !important;
}

/* =============================================================
   INDIVIDUAL CARD
   ============================================================= */
#mrvp-portal .mrvp-card {
	display: flex !important;
	flex-direction: column !important;
	align-items: stretch !important;
	width: 100% !important;
	min-width: 0 !important;
	box-sizing: border-box !important;
	background: var(--mr-white) !important;
	border: none !important;
	border-radius: 16px !important;
	overflow: hidden !important;
	box-shadow: 0 2px 8px rgba(0,0,0,0.06), 0 8px 24px rgba(0,0,0,0.08) !important;
	transition: box-shadow 0.25s ease, transform 0.25s ease !important;
}

#mrvp-portal .mrvp-card:hover {
	box-shadow: 0 4px 12px rgba(0,0,0,0.08), 0 12px 32px rgba(0,0,0,0.12) !important;
	transform: translateY(-2px) !important;
}

#mrvp-portal .mrvp-card--low-spaces { border-top: 3px solid var(--mr-tenner) !important; }
#mrvp-portal .mrvp-card--full { opacity: 0.5 !important; }

/* ----- Clickable image ------------------------------------- */
#mrvp-portal .mrvp-card__image {
	display: block !important;
	position: relative !important;
	width: 100% !important;
	height: 180px !important;
	overflow: hidden !important;
	background: var(--mr-pinkey-10) !important;
	cursor: pointer;
}

#mrvp-portal .mrvp-card__image img {
	display: block !important;
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
	margin: 0 !important;
	padding: 0 !important;
	border: none !important;
}

/* ----- Remote badge ---------------------------------------- */
#mrvp-portal .mrvp-badge {
	display: inline-block !important;
	position: absolute !important;
	top: 10px !important;
	right: 10px !important;
	padding: 3px 10px !important;
	border-radius: 12px !important;
	font-family: var(--font-body) !important;
	font-size: 0.7rem !important;
	font-weight: 700 !important;
	letter-spacing: 0.03em !important;
	line-height: 1.4 !important;
	text-transform: uppercase !important;
	z-index: 1 !important;
}

#mrvp-portal .mrvp-badge--remote {
	background: var(--mr-fiver) !important;
	color: var(--mr-white) !important;
}

/* ----- Card content wrapper -------------------------------- */
#mrvp-portal .mrvp-card__content {
	display: flex !important;
	flex-direction: column !important;
	align-items: stretch !important;
	flex: 1 1 auto !important;
	text-align: left !important;
}

/* ----- Card header (clickable) ----------------------------- */
#mrvp-portal .mrvp-card__header {
	display: block !important;
	padding: 16px 20px 0 !important;
	margin: 0 !important;
	text-align: left !important;
	align-items: flex-start !important;
	justify-content: flex-start !important;
	cursor: pointer;
}

#mrvp-portal .mrvp-card__header:hover .mrvp-card__role {
	text-decoration: underline !important;
}

#mrvp-portal .mrvp-card__role {
	font-family: var(--font-headline) !important;
	font-size: 1.15rem !important;
	font-weight: 700 !important;
	color: var(--mr-pinkey) !important;
	margin: 0 0 2px !important;
	margin-left: 0 !important;
	padding: 0 !important;
	line-height: 1.3 !important;
	display: block !important;
	text-align: left !important;
	align-self: flex-start !important;
}

#mrvp-portal .mrvp-card__org {
	font-size: 0.85rem !important;
	font-weight: 600 !important;
	color: var(--mr-score) !important;
	margin: 0 !important;
	margin-left: 0 !important;
	padding: 0 !important;
	line-height: 1.4 !important;
	display: block !important;
	text-align: left !important;
	align-self: flex-start !important;
}

/* =============================================================
   CARD META ROWS
   ============================================================= */
#mrvp-portal .mrvp-card__meta {
	display: block !important;
	padding: 14px 20px 6px !important;
	margin: 0 !important;
}

#mrvp-portal .mrvp-card__meta-row {
	display: flex !important;
	flex-direction: row !important;
	align-items: baseline !important;
	justify-content: flex-start !important;
	gap: 0 !important;
	padding: 5px 0 !important;
	margin: 0 !important;
	border-bottom: 1px solid rgba(89, 57, 107, 0.06) !important;
}

#mrvp-portal .mrvp-card__meta-row:last-child {
	border-bottom: none !important;
}

#mrvp-portal .mrvp-meta-label {
	display: inline-block !important;
	flex: 0 0 86px !important;
	width: 86px !important;
	min-width: 86px !important;
	max-width: 86px !important;
	font-size: 0.68rem !important;
	font-weight: 700 !important;
	text-transform: uppercase !important;
	letter-spacing: 0.06em !important;
	color: var(--mr-vault) !important;
	line-height: 1.6 !important;
	padding: 0 !important;
	margin: 0 !important;
}

#mrvp-portal .mrvp-meta-value {
	display: inline-block !important;
	flex: 1 1 0% !important;
	font-size: 0.85rem !important;
	color: var(--mr-fine-print) !important;
	line-height: 1.5 !important;
	padding: 0 !important;
	margin: 0 !important;
	word-break: break-word !important;
}

#mrvp-portal .mrvp-spaces--low .mrvp-meta-value {
	color: var(--mr-tenner) !important;
	font-weight: 700 !important;
}

#mrvp-portal .mrvp-spaces--full .mrvp-meta-value {
	color: var(--mr-vault) !important;
	font-style: italic !important;
}

/* =============================================================
   CARD FOOTER
   ============================================================= */
#mrvp-portal .mrvp-card__footer {
	display: flex !important;
	flex-direction: row !important;
	align-items: center !important;
	justify-content: flex-start !important;
	gap: 10px !important;
	padding: 12px 20px 16px !important;
	margin-top: auto !important;
	margin-bottom: 0 !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
}

/* =============================================================
   BUTTONS
   ============================================================= */
#mrvp-portal .mrvp-btn {
	display: inline-block !important;
	padding: 9px 20px !important;
	border-radius: 4px !important;
	font-family: var(--font-body) !important;
	font-size: 0.85rem !important;
	font-weight: 700 !important;
	text-decoration: none !important;
	cursor: pointer !important;
	border: none !important;
	line-height: 1.4 !important;
	text-align: center !important;
	transition: all 0.15s ease !important;
	margin: 0 !important;
	white-space: nowrap !important;
}

#mrvp-portal .mrvp-btn--primary {
	background: var(--mr-pinkey) !important;
	color: var(--mr-white) !important;
}

#mrvp-portal .mrvp-btn--primary:hover {
	background: #6e031c !important;
	color: var(--mr-white) !important;
}

/* More details button - Score purple, white text, underline on hover */
#mrvp-portal .mrvp-btn--secondary {
	background: var(--mr-score) !important;
	color: var(--mr-white) !important;
}

#mrvp-portal .mrvp-btn--secondary:hover,
#mrvp-portal .mrvp-btn--secondary:focus {
	background: var(--mr-score) !important;
	color: var(--mr-white) !important;
	text-decoration: underline !important;
}

#mrvp-portal .mrvp-btn--disabled {
	background: var(--mr-silver) !important;
	color: var(--mr-vault) !important;
	cursor: default !important;
}

#mrvp-portal .mrvp-btn--lg {
	padding: 14px 24px !important;
	font-size: 1rem !important;
	display: block !important;
	width: 100% !important;
}

/* =============================================================
   DETAIL PANEL (slide-in from right)
   Uses .is-active class (matches working JS)
   ============================================================= */
.mrvp-detail-overlay {
	display: none;
	position: fixed;
	inset: 0;
	background: rgba(12, 12, 12, 0.45);
	z-index: 99998;
	cursor: pointer;
}

.mrvp-detail-overlay.is-active {
	display: block;
}

.mrvp-detail-panel {
	position: fixed;
	top: 0;
	right: 0;
	width: 460px;
	max-width: 92vw;
	height: 100vh;
	background: var(--mr-white);
	z-index: 99999;
	overflow-y: auto;
	box-shadow: -4px 0 30px rgba(0, 0, 0, 0.15);
	transform: translateX(100%);
	transition: transform 0.3s ease;
}

.mrvp-detail-panel.is-active {
	transform: translateX(0);
}

.mrvp-detail-panel__header {
	display: flex;
	justify-content: flex-end;
	padding: 12px 16px 0;
}

.mrvp-detail-panel__close {
	background: none !important;
	border: none !important;
	cursor: pointer !important;
	color: var(--mr-vault) !important;
	padding: 4px !important;
	line-height: 1 !important;
}

.mrvp-detail-panel__close:hover {
	color: var(--mr-pinkey) !important;
}

.mrvp-detail-panel__body {
	padding: 8px 28px 24px;
}

/* Date navigator (only shown when >1 shift at the same location).
   Bleeds edge-to-edge inside the panel body (negates body's 28px h-padding). */
#mrvp-portal .mrvp-detail-panel__nav {
	display: flex !important;
	flex-direction: row !important;
	justify-content: space-between !important;
	align-items: center !important;
	gap: 12px !important;
	margin: 0 -28px 16px !important;
	padding: 12px 20px !important;
	background: var(--mr-score) !important;
	color: var(--mr-white) !important;
	text-align: center !important;
}

#mrvp-portal .mrvp-detail-panel__nav-center {
	display: flex !important;
	flex-direction: column !important;
	align-items: center !important;
	justify-content: center !important;
	flex: 1 1 auto !important;
	gap: 2px !important;
	min-width: 0 !important;
}

#mrvp-portal .mrvp-detail-panel__nav-label {
	font-size: 0.95rem !important;
	font-weight: 700 !important;
	letter-spacing: 0.02em !important;
	color: var(--mr-white) !important;
	line-height: 1.2 !important;
}

#mrvp-portal .mrvp-detail-panel__nav-date {
	font-size: 0.8rem !important;
	font-weight: 400 !important;
	color: var(--mr-white) !important;
	opacity: 0.8 !important;
	line-height: 1.3 !important;
	letter-spacing: 0.01em !important;
}

#mrvp-portal .mrvp-detail-panel__nav-btn {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	flex: 0 0 auto !important;
	width: 32px !important;
	height: 32px !important;
	padding: 0 !important;
	margin: 0 !important;
	background: rgba(255, 255, 255, 0.2) !important;
	border: none !important;
	border-radius: 50% !important;
	color: var(--mr-white) !important;
	font-size: 1.1rem !important;
	font-weight: 700 !important;
	line-height: 1 !important;
	cursor: pointer !important;
	transition: background 0.15s ease !important;
}

#mrvp-portal .mrvp-detail-panel__nav-btn:hover {
	background: rgba(255, 255, 255, 0.35) !important;
	color: var(--mr-white) !important;
}

#mrvp-portal .mrvp-detail-panel__nav-btn[disabled],
#mrvp-portal .mrvp-detail-panel__nav-btn:disabled {
	opacity: 0.3 !important;
	pointer-events: none !important;
	cursor: default !important;
}

.mrvp-detail-panel__role {
	font-family: var(--font-headline) !important;
	font-size: 1.5rem !important;
	font-weight: 700 !important;
	color: var(--mr-pinkey) !important;
	margin: 0 0 4px !important;
	line-height: 1.25 !important;
	text-align: left !important;
}

.mrvp-detail-panel__org {
	font-size: 0.95rem !important;
	font-weight: 600 !important;
	color: var(--mr-score) !important;
	margin: 0 0 20px !important;
	text-align: left !important;
}

.mrvp-detail-panel__meta {
	margin: 0 0 24px;
	padding: 16px 0;
	border-top: 1px solid var(--mr-pinkey-10);
	border-bottom: 1px solid var(--mr-pinkey-10);
}

.mrvp-detail-meta-item {
	display: flex !important;
	flex-direction: row !important;
	align-items: baseline !important;
	padding: 5px 0 !important;
}

.mrvp-detail-meta-label {
	flex: 0 0 120px !important;
	font-size: 0.72rem !important;
	font-weight: 700 !important;
	text-transform: uppercase !important;
	letter-spacing: 0.06em !important;
	color: var(--mr-vault) !important;
	text-align: left !important;
}

.mrvp-detail-meta-value {
	flex: 1 1 0% !important;
	font-size: 0.9rem !important;
	color: var(--mr-fine-print) !important;
	text-align: left !important;
}

.mrvp-detail-panel__description {
	font-size: 0.9rem;
	line-height: 1.7;
	color: var(--mr-fine-print);
	margin: 0 0 24px;
}

.mrvp-detail-panel__description p {
	margin: 0 0 12px !important;
	text-align: left !important;
}

.mrvp-detail-panel__description p:empty {
	display: none !important;
}

.mrvp-detail-panel__footer {
	padding: 0 28px 32px;
}

.mrvp-detail-panel__footer:empty {
	display: none;
}

body.mrvp-panel-open {
	overflow: hidden !important;
}

/* =============================================================
   EMPTY / MAP
   ============================================================= */
#mrvp-portal .mrvp-empty {
	padding: 40px 24px !important;
	text-align: center !important;
	color: var(--mr-vault) !important;
	background: var(--mr-silver) !important;
	border-radius: 6px !important;
}

/* Utility: hide elements via class toggle (JS uses this for view switching) */
#mrvp-portal .mrvp-hidden { display: none !important; }

#mrvp-portal .mrvp-map { display: none !important; }

/* =============================================================
   VIEW TOGGLE
   ============================================================= */
#mrvp-portal .mrvp-view-toggle {
	display: flex !important;
	gap: 0 !important;
	margin: 16px 0 8px !important;
	background: var(--mr-silver) !important;
	border-radius: 6px !important;
	padding: 3px !important;
	width: fit-content !important;
	position: relative !important;
	z-index: 2 !important;
	pointer-events: auto !important;
}

#mrvp-portal .mrvp-toggle-btn {
	display: inline-flex !important;
	align-items: center !important;
	gap: 6px !important;
	padding: 8px 18px !important;
	border: none !important;
	border-radius: 4px !important;
	background: transparent !important;
	color: var(--mr-vault) !important;
	font-family: var(--font-body) !important;
	font-size: 14px !important;
	font-weight: 600 !important;
	cursor: pointer !important;
	transition: background 0.15s ease, color 0.15s ease !important;
	line-height: 1.2 !important;
}

#mrvp-portal .mrvp-toggle-btn:hover {
	color: var(--mr-fine-print) !important;
}

#mrvp-portal .mrvp-toggle-btn.is-active {
	background: var(--mr-white) !important;
	color: var(--mr-pinkey) !important;
	box-shadow: 0 1px 3px rgba(0,0,0,0.1) !important;
}

#mrvp-portal .mrvp-toggle-btn svg {
	flex-shrink: 0 !important;
	width: 18px !important;
	height: 18px !important;
}

/* =============================================================
   MAP
   ============================================================= */
#mrvp-portal .mrvp-map.is-active {
	display: block !important;
}

#mrvp-portal #mrvp-leaflet-map {
	width: 100% !important;
	height: 500px !important;
	border-radius: 8px !important;
	border: 1px solid var(--mr-fiver-20) !important;
	z-index: 1 !important;
}

/* Leaflet popup overrides */
#mrvp-portal .leaflet-popup-content-wrapper {
	border-radius: 8px !important;
	font-family: var(--font-body) !important;
	box-shadow: 0 3px 14px rgba(0,0,0,0.15) !important;
}

#mrvp-portal .leaflet-popup-content {
	margin: 12px 16px !important;
	font-size: 13px !important;
	line-height: 1.5 !important;
	color: var(--mr-fine-print) !important;
	min-width: 200px !important;
}

#mrvp-portal .mrvp-popup__role {
	font-family: var(--font-headline) !important;
	font-size: 15px !important;
	font-weight: 700 !important;
	color: var(--mr-pinkey) !important;
	margin: 0 0 4px !important;
	line-height: 1.3 !important;
}

#mrvp-portal .mrvp-popup__org {
	color: var(--mr-score) !important;
	font-weight: 600 !important;
	margin: 0 0 8px !important;
	font-size: 13px !important;
}

#mrvp-portal .mrvp-popup__meta {
	margin: 0 0 10px !important;
	padding: 0 !important;
	list-style: none !important;
	font-size: 12px !important;
	color: var(--mr-vault) !important;
}

#mrvp-portal .mrvp-popup__meta li {
	margin: 0 0 3px !important;
	padding: 0 !important;
}

#mrvp-portal .mrvp-popup__actions {
	display: flex !important;
	gap: 8px !important;
	flex-wrap: wrap !important;
}

#mrvp-portal .mrvp-popup__btn {
	display: inline-block !important;
	padding: 5px 12px !important;
	border-radius: 4px !important;
	font-size: 12px !important;
	font-weight: 600 !important;
	font-family: var(--font-body) !important;
	text-decoration: none !important;
	cursor: pointer !important;
	border: none !important;
	line-height: 1.4 !important;
}

#mrvp-portal .mrvp-popup__btn--signup {
	background: var(--mr-pinkey) !important;
	color: var(--mr-white) !important;
}

#mrvp-portal .mrvp-popup__btn--details {
	background: var(--mr-fiver) !important;
	color: var(--mr-white) !important;
}

/* Multi-shift popup (one marker, multiple shifts at the same lat/lng) */
#mrvp-portal .mrvp-popup__location {
	margin: 0 0 10px !important;
	padding: 0 0 8px !important;
	border-bottom: 1px solid var(--mr-pinkey-20) !important;
}

#mrvp-portal .mrvp-popup__location-name {
	font-family: var(--font-headline) !important;
	font-size: 15px !important;
	font-weight: 700 !important;
	color: var(--mr-pinkey) !important;
	line-height: 1.3 !important;
	margin: 0 !important;
}

#mrvp-portal .mrvp-popup__location-address {
	font-size: 12px !important;
	color: var(--mr-vault) !important;
	margin: 2px 0 0 !important;
	line-height: 1.4 !important;
}

#mrvp-portal .mrvp-popup__location-count {
	font-size: 11px !important;
	font-weight: 600 !important;
	text-transform: uppercase !important;
	letter-spacing: 0.06em !important;
	color: var(--mr-score) !important;
	margin: 4px 0 0 !important;
}

#mrvp-portal .mrvp-popup__shifts {
	list-style: none !important;
	margin: 0 !important;
	padding: 0 !important;
	max-height: 280px !important;
	overflow-y: auto !important;
}

#mrvp-portal .mrvp-popup__shift {
	margin: 0 !important;
	padding: 8px 0 !important;
	border-bottom: 1px solid rgba(89, 57, 107, 0.08) !important;
}

#mrvp-portal .mrvp-popup__shift:last-child {
	border-bottom: none !important;
	padding-bottom: 0 !important;
}

#mrvp-portal .mrvp-popup__shift:first-child {
	padding-top: 0 !important;
}

#mrvp-portal .mrvp-popup__shift-role {
	font-weight: 700 !important;
	color: var(--mr-score) !important;
	font-size: 12px !important;
	margin: 0 0 2px !important;
}

#mrvp-portal .mrvp-popup__shift-meta {
	display: flex !important;
	flex-wrap: wrap !important;
	gap: 4px 10px !important;
	font-size: 12px !important;
	color: var(--mr-vault) !important;
	margin: 0 0 6px !important;
}

#mrvp-portal .mrvp-popup__shift-actions {
	display: flex !important;
	gap: 6px !important;
	flex-wrap: wrap !important;
}

/* =============================================================
   SECTION HEADERS (Near you / Online split)
   ============================================================= */
#mrvp-portal .mrvp-section-header {
	margin: 28px 0 12px !important;
	padding: 0 0 8px !important;
	border-bottom: 2px solid var(--mr-pinkey-20) !important;
}

#mrvp-portal .mrvp-section-header__title {
	font-family: var(--font-headline) !important;
	font-size: 1.15rem !important;
	font-weight: 700 !important;
	color: var(--mr-pinkey) !important;
	margin: 0 !important;
	padding: 0 !important;
	line-height: 1.3 !important;
	display: block !important;
}

/* No nearby results message */
#mrvp-portal .mrvp-no-nearby {
	padding: 24px !important;
	text-align: center !important;
	background: var(--mr-silver) !important;
	border-radius: 6px !important;
	margin: 12px 0 0 !important;
}

#mrvp-portal .mrvp-no-nearby p {
	color: var(--mr-vault) !important;
	margin: 0 !important;
	font-size: 0.95rem !important;
	text-align: center !important;
}

#mrvp-portal .mrvp-online-section .mrvp-section-header {
	margin-top: 36px !important;
}

#mrvp-portal .mrvp-online-section .mrvp-section-header__title {
	color: var(--mr-score) !important;
}

/* =============================================================
   RESPONSIVE
   ============================================================= */
@media (max-width: 899px) {
	#mrvp-portal #mrvp-grid { grid-template-columns: repeat(2, 1fr) !important; gap: 16px !important; }
}

@media (max-width: 599px) {
	#mrvp-portal #mrvp-grid { grid-template-columns: 1fr !important; }
}

@media (max-width: 768px) {
	#mrvp-portal .mrvp-filter-group { flex: 1 1 calc(50% - 6px) !important; }
	#mrvp-portal .mrvp-grid { grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)) !important; gap: 16px !important; }
	#mrvp-portal #mrvp-leaflet-map { height: 400px !important; }
}

@media (max-width: 480px) {
	#mrvp-portal { padding: 0 12px 30px !important; }
	#mrvp-portal .mrvp-filter-group { flex: 1 1 100% !important; }
	#mrvp-portal .mrvp-grid { grid-template-columns: 1fr !important; }
	#mrvp-portal .mrvp-card__footer { flex-direction: column !important; align-items: stretch !important; }
	#mrvp-portal .mrvp-btn { text-align: center !important; }
	.mrvp-detail-panel { width: 100vw !important; max-width: 100vw !important; }
	#mrvp-portal #mrvp-leaflet-map { height: 350px !important; }
	#mrvp-portal .mrvp-toggle-btn { padding: 7px 14px !important; font-size: 13px !important; }
}