:root {
	--pssb-primary:       #0B7AE1;
	--pssb-primary-dark:  #0960B5;
	--pssb-primary-light: #EBF4FF;
	--pssb-primary-ring:  rgba(11,122,225,0.18);
	--pssb-accent:        #0B7AE1;
	--pssb-text:          #1a1a1a;
	--pssb-text-mid:      #4a4a4a;
	--pssb-text-muted:    #767676;
	--pssb-border:        #d1dde8;
	--pssb-border-hover:  #90b4d4;
	--pssb-surface:       #ffffff;
	--pssb-surface-alt:   #f5f8fc;
	--pssb-radius-sm:     6px;
	--pssb-radius:        12px;
	--pssb-radius-lg:     18px;
	--pssb-shadow-sm:     0 1px 3px rgba(0,0,0,0.07);
	--pssb-shadow:        0 4px 16px rgba(0,0,0,0.09);
	--pssb-shadow-lg:     0 8px 32px rgba(0,0,0,0.12);
	--pssb-transition:    0.18s ease;
}

/* ── Wrapper ────────────────────────────────────────────────────── */

.pssb-sponsor-flow {
	max-width: 720px;
	margin: 0 auto;
	font-family: inherit;
	color: var(--pssb-text);
}

/* ── Progress indicator ─────────────────────────────────────────── */

.pssb-flow-progress {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 4px 0;
	margin-bottom: 36px;
	padding: 0;
	overflow: visible;
}

.pssb-flow-step-label {
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 0.82em;
	color: var(--pssb-text-muted);
	font-weight: 500;
	white-space: nowrap;
	padding: 4px 0;
	transition: color var(--pssb-transition);
	position: relative;
}

.pssb-flow-step-label::before {
	content: "";
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 22px;
	height: 22px;
	min-width: 22px;
	border-radius: 50%;
	font-size: 0.78em;
	font-weight: 700;
	background: #d8e6f5;
	color: var(--pssb-text-muted);
	transition: background var(--pssb-transition), color var(--pssb-transition);
	border: 2px solid transparent;
}

.pssb-flow-step-label + .pssb-flow-step-label::after {
	content: "";
	display: block;
	width: 18px;
	height: 2px;
	background: var(--pssb-border);
	border-radius: 2px;
	order: -1;
	flex-shrink: 0;
	margin-right: 0;
}

.pssb-flow-step-label--active {
	color: var(--pssb-primary);
	font-weight: 700;
}

.pssb-flow-step-label--active::before {
	background: var(--pssb-primary);
	color: #fff;
	border-color: var(--pssb-primary);
}

.pssb-flow-step-label--done {
	color: var(--pssb-primary-dark);
}

.pssb-flow-step-label--done::before {
	content: "✓";
	background: var(--pssb-primary-light);
	color: var(--pssb-primary);
	border-color: var(--pssb-primary);
}

.pssb-flow-step-label--done + .pssb-flow-step-label::after,
.pssb-flow-step-label--active + .pssb-flow-step-label::after {
	background: var(--pssb-primary);
	opacity: 0.35;
}

.pssb-flow-step-sep {
	display: none;
}

/* ── Step panel ─────────────────────────────────────────────────── */

.pssb-step {
	background: var(--pssb-surface);
	border: 1px solid var(--pssb-border);
	border-radius: var(--pssb-radius-lg);
	padding: 40px 44px;
	box-shadow: var(--pssb-shadow);
	animation: pssb-fade-in 0.22s ease;
}

@keyframes pssb-fade-in {
	from { opacity: 0; transform: translateY(8px); }
	to   { opacity: 1; transform: translateY(0); }
}

.pssb-step__title {
	font-size: 1.55em;
	font-weight: 700;
	margin: 0 0 8px;
	line-height: 1.25;
	color: var(--pssb-text);
	letter-spacing: -0.01em;
}

.pssb-step__desc {
	color: var(--pssb-text-mid);
	font-size: 1em;
	line-height: 1.6;
	margin: 0 0 32px;
}

/* ── Error banner ───────────────────────────────────────────────── */

.pssb-flow-error {
	background: #fff5f5;
	border: 1px solid #fca5a5;
	border-radius: var(--pssb-radius-sm);
	color: #991b1b;
	padding: 14px 18px;
	margin-bottom: 24px;
	font-size: 0.95em;
	line-height: 1.5;
}

/* ── Quantity step ──────────────────────────────────────────────── */

.pssb-qty-options {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 12px;
	margin-bottom: 28px;
}

/* Lock down quantity buttons — override anything the theme injects */
.pssb-sponsor-flow .pssb-qty-option,
.pssb-sponsor-flow .pssb-qty-option:link,
.pssb-sponsor-flow .pssb-qty-option:visited {
	display: flex !important;
	flex-direction: column !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 6px !important;
	border: 2px solid var(--pssb-border) !important;
	border-radius: var(--pssb-radius) !important;
	padding: 20px 16px !important;
	cursor: pointer !important;
	background: var(--pssb-surface) !important;
	font-family: inherit !important;
	font-size: 1em !important;
	text-align: center !important;
	transition: border-color var(--pssb-transition), background var(--pssb-transition), box-shadow var(--pssb-transition), transform var(--pssb-transition) !important;
	position: relative !important;
	box-shadow: none !important;
	color: var(--pssb-text) !important;
	text-decoration: none !important;
	line-height: 1.3 !important;
	width: auto !important;
	height: auto !important;
}

.pssb-sponsor-flow .pssb-qty-option:hover {
	border-color: var(--pssb-primary) !important;
	background: var(--pssb-primary-light) !important;
	box-shadow: var(--pssb-shadow-sm) !important;
	transform: translateY(-1px) !important;
}

.pssb-sponsor-flow .pssb-qty-option--selected,
.pssb-sponsor-flow .pssb-qty-option[aria-pressed="true"] {
	border-color: var(--pssb-primary) !important;
	background: var(--pssb-primary-light) !important;
	box-shadow: 0 0 0 3px var(--pssb-primary-ring), var(--pssb-shadow-sm) !important;
}

.pssb-qty-option--selected::after,
.pssb-qty-option[aria-pressed="true"]::after {
	content: "✓";
	position: absolute;
	top: 8px;
	right: 10px;
	font-size: 0.75em;
	font-weight: 700;
	color: var(--pssb-primary);
}

.pssb-qty-option__boxes {
	font-weight: 700;
	font-size: 1.05em;
	color: var(--pssb-text);
}

.pssb-qty-option__price {
	color: var(--pssb-text-muted);
	font-size: 0.88em;
	font-weight: 500;
}

.pssb-qty-option--selected .pssb-qty-option__price,
.pssb-qty-option[aria-pressed="true"] .pssb-qty-option__price {
	color: var(--pssb-primary-dark);
}

.pssb-qty-total {
	display: flex;
	align-items: baseline;
	gap: 10px;
	padding: 16px 20px;
	background: var(--pssb-primary-light);
	border: 1px solid #b3d4f7;
	border-radius: var(--pssb-radius-sm);
	margin-bottom: 32px;
	font-size: 1em;
	color: var(--pssb-text-mid);
}

#pssb-qty-total-amount {
	font-size: 1.6em;
	font-weight: 700;
	color: var(--pssb-primary);
	letter-spacing: -0.02em;
}

/* ── School fieldset ────────────────────────────────────────────── */

.pssb-school-fieldset {
	border: 1px solid var(--pssb-border);
	border-radius: var(--pssb-radius);
	padding: 24px 28px;
	margin-bottom: 16px;
	background: var(--pssb-surface-alt);
	transition: border-color var(--pssb-transition);
}

.pssb-school-fieldset:focus-within {
	border-color: var(--pssb-border-hover);
}

.pssb-school-fieldset__legend {
	font-weight: 700;
	font-size: 0.9em;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--pssb-text-muted);
	padding: 0 8px;
}

/* ── Autocomplete ───────────────────────────────────────────────── */

.pssb-autocomplete-wrap {
	position: relative;
}

.pssb-autocomplete-dropdown {
	position: absolute;
	top: calc(100% + 2px);
	left: 0;
	right: 0;
	background: var(--pssb-surface);
	border: 1px solid var(--pssb-border-hover);
	border-radius: var(--pssb-radius-sm);
	max-height: 300px;
	overflow-y: auto;
	z-index: 300;
	box-shadow: var(--pssb-shadow-lg);
}

.pssb-autocomplete-item {
	padding: 11px 16px;
	cursor: pointer;
	border-bottom: 1px solid var(--pssb-border);
	line-height: 1.4;
	transition: background var(--pssb-transition);
}

.pssb-autocomplete-item:last-child {
	border-bottom: none;
}

.pssb-autocomplete-item:hover,
.pssb-autocomplete-item:focus {
	background: var(--pssb-primary-light);
	outline: none;
}

.pssb-autocomplete-item__sub {
	display: block;
	font-size: 0.82em;
	color: var(--pssb-text-muted);
	margin-top: 3px;
}

.pssb-autocomplete-empty {
	padding: 14px 16px;
	color: var(--pssb-text-muted);
	font-size: 0.9em;
}

.pssb-autocomplete-empty a {
	color: var(--pssb-primary);
	text-decoration: underline;
}

.pssb-autocomplete-searching {
	padding: 12px 16px;
	color: var(--pssb-text-muted);
	font-size: 0.9em;
	font-style: italic;
}

/* ── Selected school card ───────────────────────────────────────── */

.pssb-school-selected {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 12px;
	background: var(--pssb-primary-light);
	border: 1.5px solid #90b4d4;
	border-radius: var(--pssb-radius-sm);
	padding: 14px 18px;
	margin-bottom: 12px;
}

.pssb-school-selected__info {
	font-size: 0.95em;
	line-height: 1.55;
	flex: 1;
	color: var(--pssb-text);
}

.pssb-school-selected__grades {
	font-size: 0.85em;
	color: var(--pssb-primary-dark);
}

.pssb-school-clear-btn {
	background: none;
	border: 1px solid #90b4d4;
	border-radius: 20px;
	padding: 4px 12px;
	color: var(--pssb-primary-dark);
	font-size: 0.82em;
	font-weight: 600;
	cursor: pointer;
	font-family: inherit;
	white-space: nowrap;
	transition: background var(--pssb-transition), border-color var(--pssb-transition);
}

.pssb-school-clear-btn:hover {
	background: #fff;
	border-color: var(--pssb-primary);
}

/* ── Manual entry ───────────────────────────────────────────────── */

.pssb-school-manual {
	margin-top: 14px;
	margin-bottom: 16px;
}

.pssb-school-manual__summary {
	cursor: pointer;
	color: var(--pssb-primary);
	font-size: 0.88em;
	font-weight: 600;
	user-select: none;
	list-style: none;
}

.pssb-school-manual__summary::-webkit-details-marker { display: none; }

.pssb-school-manual__summary::before {
	content: "+ ";
}

details[open] .pssb-school-manual__summary::before {
	content: "− ";
}

.pssb-school-manual__summary:hover {
	color: var(--pssb-primary-dark);
}

.pssb-school-manual__fields {
	margin-top: 18px;
	padding: 20px;
	background: var(--pssb-surface);
	border: 1px solid var(--pssb-border);
	border-radius: var(--pssb-radius-sm);
}

.pssb-school-note {
	margin-top: 16px;
}

/* ── Form fields ────────────────────────────────────────────────── */

.pssb-field {
	margin-bottom: 18px;
}

.pssb-field:last-child {
	margin-bottom: 0;
}

.pssb-sponsor-flow .pssb-field label,
.pssb-nominate-form .pssb-field label {
	display: block !important;
	font-weight: 600 !important;
	font-size: 0.9em !important;
	color: var(--pssb-text-mid) !important;
	margin-bottom: 6px !important;
	letter-spacing: 0.01em !important;
	background: none !important;
	padding: 0 !important;
}

.pssb-sponsor-flow .pssb-field input[type="text"],
.pssb-sponsor-flow .pssb-field input[type="email"],
.pssb-sponsor-flow .pssb-field input[type="number"],
.pssb-sponsor-flow .pssb-field input[type="url"],
.pssb-sponsor-flow .pssb-field select,
.pssb-sponsor-flow .pssb-field textarea,
.pssb-sponsor-flow .pssb-school-search-input,
.pssb-nominate-form .pssb-field input[type="text"],
.pssb-nominate-form .pssb-field input[type="email"],
.pssb-nominate-form .pssb-field input[type="url"],
.pssb-nominate-form .pssb-field select,
.pssb-nominate-form .pssb-field textarea {
	width: 100% !important;
	padding: 11px 14px !important;
	border: 1.5px solid var(--pssb-border) !important;
	border-radius: var(--pssb-radius-sm) !important;
	font-size: 1em !important;
	font-family: inherit !important;
	color: var(--pssb-text) !important;
	background: var(--pssb-surface) !important;
	box-sizing: border-box !important;
	transition: border-color var(--pssb-transition), box-shadow var(--pssb-transition) !important;
	appearance: none !important;
	-webkit-appearance: none !important;
	outline: none !important;
	box-shadow: none !important;
	margin: 0 !important;
}

.pssb-sponsor-flow .pssb-field select,
.pssb-nominate-form .pssb-field select {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23767676' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") !important;
	background-repeat: no-repeat !important;
	background-position: right 12px center !important;
	padding-right: 36px !important;
}

.pssb-sponsor-flow .pssb-field input:focus,
.pssb-sponsor-flow .pssb-field select:focus,
.pssb-sponsor-flow .pssb-field textarea:focus,
.pssb-sponsor-flow .pssb-school-search-input:focus,
.pssb-nominate-form .pssb-field input:focus,
.pssb-nominate-form .pssb-field select:focus,
.pssb-nominate-form .pssb-field textarea:focus {
	border-color: var(--pssb-primary) !important;
	box-shadow: 0 0 0 3px var(--pssb-primary-ring) !important;
	outline: none !important;
}

.pssb-field-row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 16px;
}

.pssb-field-row--three {
	grid-template-columns: 2fr 1fr 1fr;
}

.pssb-optional {
	color: var(--pssb-text-muted);
	font-weight: 400;
	font-size: 0.85em;
}

/* ── Radio / checkbox ───────────────────────────────────────────── */

.pssb-radio-group {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.pssb-radio-label {
	display: flex;
	align-items: center;
	gap: 10px;
	cursor: pointer;
	font-size: 0.95em;
	padding: 10px 14px;
	border: 1.5px solid var(--pssb-border);
	border-radius: var(--pssb-radius-sm);
	transition: border-color var(--pssb-transition), background var(--pssb-transition);
}

.pssb-radio-label:hover {
	border-color: var(--pssb-border-hover);
	background: var(--pssb-surface-alt);
}

.pssb-radio-label input[type="radio"] {
	accent-color: var(--pssb-primary);
	width: 16px;
	height: 16px;
	flex-shrink: 0;
}

.pssb-checkbox-label {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	cursor: pointer;
	font-size: 0.95em;
	margin-bottom: 10px;
	line-height: 1.5;
}

.pssb-checkbox-label input[type="checkbox"] {
	accent-color: var(--pssb-primary);
	width: 16px;
	height: 16px;
	margin-top: 2px;
	flex-shrink: 0;
}

.pssb-divider {
	border: none;
	border-top: 1px solid var(--pssb-border);
	margin: 28px 0;
}

/* ── Navigation + action buttons — fully locked down ────────────── */

.pssb-step-nav {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-top: 36px;
	padding-top: 28px;
	border-top: 1px solid var(--pssb-border);
	flex-wrap: wrap;
}

.pssb-sponsor-flow .pssb-btn,
.pssb-nominate-wrap .pssb-btn,
.pssb-nominated-wrap .pssb-btn,
.pssb-ngrid-wrap .pssb-btn,
.pssb-order-status-wrap .pssb-btn,
.pssb-school-widget .pssb-btn,
.pssb-modal .pssb-btn {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 6px !important;
	padding: 13px 28px !important;
	border-radius: 999px !important;
	border: none !important;
	font-size: 0.97em !important;
	font-family: inherit !important;
	font-weight: 700 !important;
	cursor: pointer !important;
	letter-spacing: 0.01em !important;
	transition: background var(--pssb-transition), box-shadow var(--pssb-transition), transform var(--pssb-transition), opacity var(--pssb-transition) !important;
	text-decoration: none !important;
	line-height: 1.2 !important;
	box-sizing: border-box !important;
	vertical-align: middle !important;
}

.pssb-sponsor-flow .pssb-btn--primary,
.pssb-nominate-wrap .pssb-btn--primary,
.pssb-nominated-wrap .pssb-btn--primary,
.pssb-ngrid-wrap .pssb-btn--primary,
.pssb-order-status-wrap .pssb-btn--primary,
.pssb-school-widget .pssb-btn--primary,
.pssb-modal .pssb-btn--primary {
	background: var(--pssb-primary) !important;
	color: #fff !important;
	box-shadow: 0 2px 8px rgba(11,122,225,0.25) !important;
}

.pssb-sponsor-flow .pssb-btn--primary:hover,
.pssb-nominate-wrap .pssb-btn--primary:hover,
.pssb-nominated-wrap .pssb-btn--primary:hover,
.pssb-ngrid-wrap .pssb-btn--primary:hover,
.pssb-order-status-wrap .pssb-btn--primary:hover,
.pssb-school-widget .pssb-btn--primary:hover,
.pssb-modal .pssb-btn--primary:hover {
	background: var(--pssb-primary-dark) !important;
	box-shadow: 0 4px 14px rgba(11,122,225,0.35) !important;
	transform: translateY(-1px) !important;
	color: #fff !important;
	text-decoration: none !important;
}

.pssb-sponsor-flow .pssb-btn--secondary,
.pssb-nominate-wrap .pssb-btn--secondary {
	background: transparent !important;
	color: var(--pssb-text-mid) !important;
	border: 1.5px solid var(--pssb-border) !important;
	box-shadow: none !important;
}

.pssb-sponsor-flow .pssb-btn--secondary:hover,
.pssb-nominate-wrap .pssb-btn--secondary:hover {
	border-color: var(--pssb-border-hover) !important;
	background: var(--pssb-surface-alt) !important;
	transform: none !important;
}

.pssb-sponsor-flow .pssb-btn:disabled,
.pssb-sponsor-flow .pssb-btn[disabled],
.pssb-nominate-wrap .pssb-btn:disabled {
	opacity: 0.5 !important;
	cursor: not-allowed !important;
	transform: none !important;
	box-shadow: none !important;
}

/* ── Review step ────────────────────────────────────────────────── */

.pssb-review-block {
	background: var(--pssb-surface-alt);
	border: 1px solid var(--pssb-border);
	border-radius: var(--pssb-radius-sm);
	padding: 18px 22px;
	margin-bottom: 14px;
}

.pssb-review-block h3 {
	margin: 0 0 12px;
	font-size: 0.82em;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.07em;
	color: var(--pssb-text-muted);
}

.pssb-review-school {
	margin-bottom: 6px;
	font-size: 0.95em;
	line-height: 1.5;
}

.pssb-review-notice {
	background: #fffbeb;
	border: 1px solid #fde68a;
	border-radius: var(--pssb-radius-sm);
	padding: 16px 20px;
	margin-bottom: 8px;
	font-size: 0.92em;
	line-height: 1.55;
}

.pssb-review-notice p {
	margin: 0 0 12px;
	color: var(--pssb-text-mid);
}

.pssb-submit-status {
	margin-top: 14px;
	color: var(--pssb-text-muted);
	font-size: 0.92em;
	text-align: center;
}

/* ── Payment step ───────────────────────────────────────────────── */

.pssb-square-order-summary {
	background: var(--pssb-surface-alt);
	border: 1px solid var(--pssb-border);
	border-radius: var(--pssb-radius-sm);
	padding: 18px 22px;
	margin-bottom: 24px;
	font-size: 0.95em;
	line-height: 1.6;
}

.pssb-order-schools {
	margin: 6px 0 10px 16px;
	padding: 0;
	color: var(--pssb-text-mid);
	font-size: 0.93em;
}

.pssb-order-total {
	margin: 12px 0 0;
	font-size: 1.05em;
	color: var(--pssb-primary);
}

.pssb-square-checkout-wrap {
	margin-top: 8px;
}

.pssb-square-card-container {
	border: 1.5px solid var(--pssb-border);
	border-radius: var(--pssb-radius-sm);
	padding: 4px;
	background: var(--pssb-surface);
	min-height: 44px;
	transition: border-color var(--pssb-transition), box-shadow var(--pssb-transition);
}

.pssb-square-card-container:focus-within {
	border-color: var(--pssb-primary);
	box-shadow: 0 0 0 3px var(--pssb-primary-ring);
}

.pssb-square-error {
	background: #fff5f5;
	border: 1px solid #fca5a5;
	border-radius: var(--pssb-radius-sm);
	color: #991b1b;
	padding: 12px 16px;
	margin-top: 12px;
	font-size: 0.92em;
	line-height: 1.5;
}

.pssb-square-loading {
	color: var(--pssb-text-muted);
	font-size: 0.92em;
	font-style: italic;
	padding: 12px 0;
}

.pssb-payment-success {
	background: var(--pssb-primary-light);
	border: 1px solid #90b4d4;
	border-radius: var(--pssb-radius-sm);
	padding: 20px 24px;
	text-align: center;
	color: var(--pssb-primary-dark);
	font-weight: 600;
}

/* ── Misc ───────────────────────────────────────────────────────── */

.pssb-error {
	color: #991b1b;
}

.pssb-notice {
	color: var(--pssb-text-muted);
	font-style: italic;
}

/* ── School Search Widget (hero / landing) ──────────────────────── */

.pssb-school-widget {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 12px;
	width: 100%;
}

.pssb-widget-search-wrap {
	position: relative;
	flex: 1;
	min-width: 0;
}

.pssb-widget-search-input {
	width: 100%;
	padding: 15px 20px;
	font-size: 1.05em;
	border: 2px solid rgba(255,255,255,0.3);
	border-radius: 999px;
	box-sizing: border-box;
	outline: none;
	transition: border-color var(--pssb-transition), box-shadow var(--pssb-transition);
	background: rgba(255,255,255,0.95);
	color: var(--pssb-text);
}

.pssb-widget-search-input:focus {
	border-color: var(--pssb-primary);
	box-shadow: 0 0 0 3px var(--pssb-primary-ring);
	background: #fff;
}

.pssb-widget-selected {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 12px 18px;
	background: rgba(255,255,255,0.95);
	border: 2px solid var(--pssb-primary);
	border-radius: 999px;
	flex: 1;
	min-width: 0;
}

.pssb-widget-selected-name {
	flex: 1;
	font-weight: 600;
	color: var(--pssb-text);
	font-size: 0.95em;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	min-width: 0;
}

.pssb-widget-clear,
.pssb-nom-school-clear {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 28px !important;
	height: 28px !important;
	min-width: 28px !important;
	flex-shrink: 0 !important;
	border-radius: 50% !important;
	background: #208AEC !important;
	border: none !important;
	color: #fff !important;
	font-size: 1em !important;
	font-weight: 700 !important;
	line-height: 1 !important;
	padding: 0 !important;
	cursor: pointer !important;
	font-family: inherit !important;
	transition: background var(--pssb-transition), transform var(--pssb-transition) !important;
}

.pssb-widget-clear:hover,
.pssb-nom-school-clear:hover {
	background: #0960B5 !important;
	transform: scale(1.1) !important;
	color: #fff !important;
}

.pssb-widget-btn {
	flex-shrink: 0;
	white-space: nowrap;
}

/* ── Responsive ─────────────────────────────────────────────────── */

@media ( max-width: 680px ) {
	.pssb-step {
		padding: 28px 20px;
	}

	.pssb-step__title {
		font-size: 1.3em;
	}

	.pssb-flow-step-label {
		font-size: 0;
	}

	.pssb-flow-step-label::before {
		font-size: 0.85em;
	}

	.pssb-flow-step-sep {
		width: 12px;
	}

	.pssb-field-row,
	.pssb-field-row--three {
		grid-template-columns: 1fr;
	}

	.pssb-qty-options {
		grid-template-columns: repeat(3, 1fr);
	}
}

@media ( max-width: 420px ) {
	.pssb-qty-options {
		grid-template-columns: repeat(2, 1fr);
	}

	.pssb-sponsor-flow .pssb-btn {
		width: 100% !important;
		justify-content: center !important;
	}

	.pssb-step-nav {
		flex-direction: column-reverse;
	}
}

/* ── Sponsor Wall ────────────────────────────────────────────────── */

.pssb-wall {
	font-family: inherit;
	color: var(--pssb-text);
}

.pssb-wall__title {
	font-size: 1.6em;
	font-weight: 700;
	margin: 0 0 6px;
	letter-spacing: -0.01em;
}

.pssb-wall__count {
	font-size: 0.95em;
	color: var(--pssb-text-muted);
	margin: 0 0 28px;
}

.pssb-wall__count strong {
	color: var(--pssb-primary);
	font-size: 1.1em;
}

/* ── Filters ────────────────────────────────────────────────────── */

.pssb-wall-filters {
	display: flex;
	align-items: center;
	gap: 10px;
	flex-wrap: wrap;
	margin-bottom: 32px;
	padding: 18px 22px;
	background: var(--pssb-surface-alt);
	border: 1px solid var(--pssb-border);
	border-radius: var(--pssb-radius);
}

.pssb-wall-filters__field {
	display: flex;
	align-items: center;
}

.pssb-wall-filters__field--search {
	position: relative;
	flex: 1;
	min-width: 220px;
}

.pssb-wall-filters__search-icon {
	position: absolute;
	left: 12px;
	top: 50%;
	transform: translateY(-50%);
	color: var(--pssb-text-muted);
	pointer-events: none;
	display: flex;
}

.pssb-wall-filters__input {
	width: 100%;
	padding: 10px 14px 10px 36px;
	border: 1.5px solid var(--pssb-border);
	border-radius: var(--pssb-radius-sm);
	font-size: 0.95em;
	font-family: inherit;
	color: var(--pssb-text);
	background: var(--pssb-surface);
	box-sizing: border-box;
	transition: border-color var(--pssb-transition), box-shadow var(--pssb-transition);
}

.pssb-wall-filters__input:focus {
	outline: none;
	border-color: var(--pssb-primary);
	box-shadow: 0 0 0 3px var(--pssb-primary-ring);
}

.pssb-wall-filters__select {
	padding: 10px 36px 10px 14px;
	border: 1.5px solid var(--pssb-border);
	border-radius: var(--pssb-radius-sm);
	font-size: 0.95em;
	font-family: inherit;
	color: var(--pssb-text);
	background: var(--pssb-surface) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23767676' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat right 12px center;
	appearance: none;
	cursor: pointer;
	transition: border-color var(--pssb-transition);
}

.pssb-wall-filters__select:focus {
	outline: none;
	border-color: var(--pssb-primary);
	box-shadow: 0 0 0 3px var(--pssb-primary-ring);
}

.pssb-wall-filters__btn {
	padding: 10px 22px;
	white-space: nowrap;
}

.pssb-wall-filters__clear {
	font-size: 0.88em;
	color: var(--pssb-text-muted);
	text-decoration: underline;
	white-space: nowrap;
	transition: color var(--pssb-transition);
}

.pssb-wall-filters__clear:hover {
	color: var(--pssb-primary);
}

/* ── Grid ───────────────────────────────────────────────────────── */

.pssb-wall-grid {
	display: grid;
	gap: 20px;
}

.pssb-wall-grid--cols-2 {
	grid-template-columns: repeat(2, 1fr);
}

.pssb-wall-grid--cols-3 {
	grid-template-columns: repeat(3, 1fr);
}

.pssb-wall-grid--cols-4 {
	grid-template-columns: repeat(4, 1fr);
}

/* ── Card ───────────────────────────────────────────────────────── */

.pssb-wall-card {
	display: flex;
	flex-direction: column;
	gap: 0;
	background: var(--pssb-surface);
	border: 1px solid var(--pssb-border);
	border-radius: var(--pssb-radius);
	overflow: hidden;
	box-shadow: var(--pssb-shadow-sm);
	transition: box-shadow var(--pssb-transition), transform var(--pssb-transition);
}

.pssb-wall-card:hover {
	box-shadow: var(--pssb-shadow);
	transform: translateY(-2px);
}

.pssb-wall-card__top {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 14px 18px 12px;
	background: var(--pssb-surface-alt);
	border-bottom: 1px solid var(--pssb-border);
	gap: 8px;
}

.pssb-wall-card__boxes {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 0.82em;
	font-weight: 700;
	color: var(--pssb-primary-dark);
	background: var(--pssb-primary-light);
	border: 1px solid #90b4d4;
	border-radius: 999px;
	padding: 4px 10px;
}

/* ── Status pills ───────────────────────────────────────────────── */

.pssb-wall-status {
	display: inline-block;
	font-size: 0.75em;
	font-weight: 700;
	letter-spacing: 0.04em;
	padding: 3px 10px;
	border-radius: 999px;
	white-space: nowrap;
}

.pssb-wall-status--sponsored {
	background: #ecfdf5;
	color: #065f46;
	border: 1px solid #6ee7b7;
}

.pssb-wall-status--approved {
	background: var(--pssb-primary-light);
	color: var(--pssb-primary-dark);
	border: 1px solid #90b4d4;
}

.pssb-wall-status--preparing {
	background: #eff6ff;
	color: #1e3a8a;
	border: 1px solid #93c5fd;
}

.pssb-wall-status--shipped {
	background: #fffbeb;
	color: #92400e;
	border: 1px solid #fcd34d;
}

.pssb-wall-status--delivered {
	background: #f5f3ff;
	color: #4c1d95;
	border: 1px solid #c4b5fd;
}

/* ── Card school section ────────────────────────────────────────── */

.pssb-wall-card__school {
	padding: 18px 18px 14px;
	border-bottom: 1px solid var(--pssb-border);
	flex: 1;
}

.pssb-wall-card__name {
	font-size: 1.05em;
	font-weight: 700;
	margin: 0 0 6px;
	line-height: 1.3;
	color: var(--pssb-text);
}

.pssb-wall-card__meta {
	display: flex;
	align-items: center;
	gap: 6px;
	flex-wrap: wrap;
	margin: 0;
	font-size: 0.83em;
	color: var(--pssb-text-muted);
	line-height: 1.4;
}

.pssb-wall-card__type {
	font-weight: 500;
}

.pssb-wall-card__sep {
	opacity: 0.4;
}

.pssb-wall-card__location {
	display: inline-flex;
	align-items: center;
	gap: 3px;
}

/* ── Card sponsor section ───────────────────────────────────────── */

.pssb-wall-card__sponsor {
	padding: 14px 18px;
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.pssb-wall-card__donor {
	display: flex;
	align-items: flex-start;
	gap: 7px;
	margin: 0;
	font-size: 0.88em;
	line-height: 1.4;
	color: var(--pssb-text-mid);
}

.pssb-wall-card__donor svg {
	color: var(--pssb-primary);
	flex-shrink: 0;
	margin-top: 1px;
}

.pssb-wall-card__donor--anon {
	color: var(--pssb-text-muted);
	font-style: italic;
}

.pssb-wall-card__donor--anon svg {
	color: var(--pssb-text-muted);
}

.pssb-wall-card__dedication {
	display: flex;
	align-items: flex-start;
	gap: 7px;
	margin: 0;
	font-size: 0.84em;
	color: var(--pssb-text-muted);
	font-style: italic;
	line-height: 1.4;
}

.pssb-wall-card__dedication svg {
	color: #d97706;
	flex-shrink: 0;
	margin-top: 1px;
}

/* ── Card footer ────────────────────────────────────────────────── */

.pssb-wall-card__footer {
	padding: 10px 18px;
	border-top: 1px solid var(--pssb-border);
	background: var(--pssb-surface-alt);
}

.pssb-wall-card__date {
	font-size: 0.78em;
	color: var(--pssb-text-muted);
	font-weight: 500;
}

/* ── Empty state ────────────────────────────────────────────────── */

.pssb-wall-empty {
	padding: 48px 24px;
	text-align: center;
	color: var(--pssb-text-muted);
	border: 1px dashed var(--pssb-border);
	border-radius: var(--pssb-radius);
}

.pssb-wall-empty p {
	margin: 0 0 16px;
	font-size: 1em;
}

.pssb-wall-empty .pssb-btn {
	display: inline-flex;
}

/* ── Pagination ─────────────────────────────────────────────────── */

.pssb-wall-pagination {
	margin-top: 36px;
}

.pssb-wall-pagination .page-numbers {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 6px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.pssb-wall-pagination .page-numbers li {
	margin: 0;
	padding: 0;
}

.pssb-wall-pagination a.page-numbers,
.pssb-wall-pagination span.page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 38px;
	height: 38px;
	padding: 0 12px;
	border-radius: var(--pssb-radius-sm);
	font-size: 0.92em;
	font-weight: 600;
	text-decoration: none;
	border: 1.5px solid var(--pssb-border);
	color: var(--pssb-text-mid);
	transition: border-color var(--pssb-transition), background var(--pssb-transition), color var(--pssb-transition);
}

.pssb-wall-pagination a.page-numbers:hover {
	border-color: var(--pssb-primary);
	color: var(--pssb-primary);
	background: var(--pssb-primary-light);
}

.pssb-wall-pagination span.current {
	background: var(--pssb-primary);
	border-color: var(--pssb-primary);
	color: #fff;
}

.pssb-wall-pagination .prev.page-numbers,
.pssb-wall-pagination .next.page-numbers {
	padding: 0 16px;
}

/* ── Wall responsive ────────────────────────────────────────────── */

@media ( max-width: 900px ) {
	.pssb-wall-grid--cols-4 {
		grid-template-columns: repeat(2, 1fr);
	}

	.pssb-wall-grid--cols-3 {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media ( max-width: 580px ) {
	.pssb-wall-grid--cols-2,
	.pssb-wall-grid--cols-3,
	.pssb-wall-grid--cols-4 {
		grid-template-columns: 1fr;
	}

	.pssb-wall-filters {
		flex-direction: column;
		align-items: stretch;
	}

	.pssb-wall-filters__field--search {
		min-width: 0;
	}

	.pssb-wall-filters__btn {
		width: 100%;
	}
}

/* ── Contact info / Step 3 ──────────────────────────────────────── */

.pssb-step-section {
	background: var(--pssb-primary-light);
	border: 1px solid #b3d4f7;
	border-radius: 8px;
	padding: 20px 22px;
	margin-bottom: 24px;
}

.pssb-required {
	color: #c53030;
	font-weight: 700;
	margin-left: 2px;
}

.pssb-field__hint {
	font-size: 0.8rem;
	color: var(--pssb-text-muted);
	margin: 4px 0 0;
	line-height: 1.4;
}

.pssb-step__subsection-title {
	font-size: 1rem;
	font-weight: 700;
	color: #374151;
	margin: 0 0 4px;
}

/* ── Nominate form ──────────────────────────────────────────────── */

.pssb-nominate-wrap {
	max-width: 680px;
	margin: 0 auto;
	font-family: inherit;
}

.pssb-nominate-success {
	background: var(--pssb-primary-light);
	border: 1px solid #90b4d4;
	border-radius: var(--pssb-radius);
	padding: 36px 32px;
	text-align: center;
}

.pssb-nominate-success__icon {
	font-size: 2.5rem;
	color: var(--pssb-primary);
	margin-bottom: 12px;
}

.pssb-nominate-success__title {
	font-size: 1.4rem;
	font-weight: 700;
	margin: 0 0 10px;
	color: var(--pssb-text);
}

.pssb-nominate-success__msg {
	color: var(--pssb-text-mid);
	margin: 0;
	line-height: 1.6;
}

.pssb-nominate-error {
	background: #fff5f5;
	border: 1px solid #fca5a5;
	border-radius: var(--pssb-radius-sm);
	color: #991b1b;
	padding: 12px 16px;
	margin-bottom: 20px;
	font-size: 0.95em;
}

.pssb-nominate-section {
	background: var(--pssb-surface);
	border: 1px solid var(--pssb-border);
	border-radius: var(--pssb-radius);
	padding: 24px 28px;
	margin-bottom: 20px;
}

.pssb-nominate-section__title {
	font-size: 1rem;
	font-weight: 700;
	color: var(--pssb-primary-dark);
	margin: 0 0 18px;
	padding-bottom: 10px;
	border-bottom: 1px solid var(--pssb-border);
}

.pssb-nominate-section--collapsible {
	padding: 0;
}

.pssb-nominate-section--collapsible details {
	padding: 0;
}

.pssb-nominate-section--collapsible details > summary {
	padding: 20px 28px;
	cursor: pointer;
	list-style: none;
	border-bottom: 1px solid transparent;
	transition: border-color var(--pssb-transition);
}

.pssb-nominate-section--collapsible details[open] > summary {
	border-bottom-color: var(--pssb-border);
}

.pssb-nominate-section--collapsible details > summary::-webkit-details-marker {
	display: none;
}

.pssb-nominate-details-body {
	padding: 20px 28px;
}

.pssb-nominate-submit {
	display: flex;
	align-items: center;
	gap: 14px;
	margin-top: 8px;
}

.pssb-nominate-spinner {
	width: 20px;
	height: 20px;
	border: 2px solid #d1dde8;
	border-top-color: var(--pssb-primary);
	border-radius: 50%;
	animation: pssb-spin 0.7s linear infinite;
	display: inline-block;
}

@keyframes pssb-spin {
	to { transform: rotate(360deg); }
}

/* ── Order status shortcode ─────────────────────────────────────── */

.pssb-order-status-wrap {
	max-width: 680px;
	margin: 0 auto;
	font-family: inherit;
}

.pssb-order-status-notice {
	padding: 20px 24px;
	border-radius: var(--pssb-radius);
	margin-bottom: 16px;
}

.pssb-order-status-notice--info {
	background: var(--pssb-primary-light);
	border: 1px solid #90b4d4;
	color: var(--pssb-primary-dark);
}

.pssb-order-status-notice--error {
	background: #fff5f5;
	border: 1px solid #fca5a5;
	color: #991b1b;
}

.pssb-order-status-card {
	background: var(--pssb-surface);
	border: 1px solid var(--pssb-border);
	border-radius: var(--pssb-radius-lg);
	overflow: hidden;
	box-shadow: var(--pssb-shadow);
}

.pssb-order-status-card__header {
	background: var(--pssb-primary);
	padding: 24px 28px;
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 12px;
}

.pssb-order-status-card__title {
	color: #fff;
	font-size: 1.25rem;
	font-weight: 700;
	margin: 0 0 4px;
}

.pssb-order-status-card__meta {
	flex: 1;
}

.pssb-order-status-card__date {
	font-size: 0.85em;
	color: rgba(255,255,255,0.8);
	margin: 0;
}

.pssb-status {
	display: inline-block;
	font-size: 0.8em;
	font-weight: 700;
	letter-spacing: 0.04em;
	padding: 5px 14px;
	border-radius: 999px;
	white-space: nowrap;
	background: rgba(255,255,255,0.2);
	color: #fff;
}

.pssb-status--active    { background: #dcfce7; color: #166534; }
.pssb-status--completed { background: var(--pssb-primary-light); color: var(--pssb-primary-dark); }
.pssb-status--warning   { background: #fef9c3; color: #713f12; }
.pssb-status--muted     { background: #f3f4f6; color: #6b7280; }

.pssb-order-status-card__body {
	padding: 28px;
}

.pssb-order-status-card__amount {
	font-size: 1.4rem;
	font-weight: 700;
	color: var(--pssb-primary);
	margin: 0 0 24px;
}

.pssb-order-status-schools h3 {
	font-size: 0.8rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--pssb-text-muted);
	margin: 0 0 14px;
}

.pssb-order-status-recipient {
	border: 1px solid var(--pssb-border);
	border-radius: var(--pssb-radius-sm);
	padding: 14px 18px;
	margin-bottom: 12px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 12px;
}

.pssb-order-status-recipient__name {
	font-weight: 600;
	margin: 0 0 3px;
}

.pssb-order-status-recipient__loc {
	font-size: 0.85em;
	color: var(--pssb-text-muted);
	margin: 0;
}

/* ── Nominate form: school selected / manual ──────────────── */

.pssb-nom-school-selected {
	display: flex !important;
	align-items: center !important;
	gap: 10px !important;
	background: var(--pssb-primary-light) !important;
	border: 1px solid var(--pssb-primary) !important;
	border-radius: var(--pssb-radius-sm) !important;
	padding: 10px 14px !important;
	margin-top: 8px !important;
	font-size: 0.95em !important;
}

.pssb-nom-school-selected__name {
	flex: 1 !important;
	font-weight: 600 !important;
	color: var(--pssb-primary-dark) !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
	white-space: nowrap !important;
	min-width: 0 !important;
}

.pssb-nom-manual-toggle {
	margin-top: 10px;
}

.pssb-link-btn {
	background: none !important;
	border: none !important;
	padding: 0 !important;
	color: var(--pssb-primary) !important;
	font-size: 0.88em !important;
	cursor: pointer !important;
	text-decoration: underline !important;
	font-family: inherit !important;
}

.pssb-link-btn:hover {
	color: var(--pssb-primary-dark) !important;
}

.pssb-nom-manual-note {
	font-size: 0.88em;
	color: var(--pssb-text-muted);
	margin: 0 0 16px;
}

.pssb-nom-manual-fields {
	border: 1px dashed var(--pssb-border);
	border-radius: var(--pssb-radius-sm);
	padding: 18px;
	margin-top: 10px;
	background: var(--pssb-surface-alt);
}

/* ── Impact Stats ───────────────────────────────────────────────── */

.pssb-impact-stats {
	display: flex;
	align-items: stretch;
	background: #EBF3FF;
	border-radius: 14px;
	padding: 28px 32px;
	width: 100%;
	box-sizing: border-box;
	gap: 0;
}

.pssb-impact-stats__item {
	display: flex;
	align-items: center;
	gap: 16px;
	flex: 1;
	min-width: 0;
}

.pssb-impact-stats__icon-wrap {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 52px;
	height: 52px;
	min-width: 52px;
	border-radius: 50%;
	background: #D6E8FF;
	color: #2563EB;
	flex-shrink: 0;
}

.pssb-impact-stats__icon-wrap svg {
	width: 24px;
	height: 24px;
}

.pssb-impact-stats__content {
	display: flex;
	flex-direction: column;
	gap: 4px;
	min-width: 0;
}

.pssb-impact-stats__value {
	font-size: 1.75em;
	font-weight: 700;
	line-height: 1;
	color: #1e3a6e;
	letter-spacing: -0.02em;
}

.pssb-impact-stats__label {
	font-size: 0.85em;
	color: #6b7280;
	line-height: 1.3;
	font-weight: 400;
	white-space: nowrap;
}

.pssb-impact-stats__divider {
	width: 1px;
	background: #C5D9F0;
	margin: 4px 28px;
	flex-shrink: 0;
	align-self: stretch;
}

@media ( max-width: 780px ) {
	.pssb-impact-stats {
		flex-wrap: wrap;
		gap: 24px;
		padding: 24px;
	}

	.pssb-impact-stats__item {
		flex: 1 1 calc(50% - 12px);
		min-width: 140px;
	}

	.pssb-impact-stats__divider {
		display: none;
	}
}

@media ( max-width: 420px ) {
	.pssb-impact-stats__item {
		flex: 1 1 100%;
	}
}

/* ── Nomination Modal ───────────────────────────────────────────── */

.pssb-modal-overlay {
	display: none;
	position: fixed;
	inset: 0;
	background: rgba(0,0,0,0.55);
	z-index: 99999;
	align-items: center;
	justify-content: center;
	padding: 20px;
	box-sizing: border-box;
}

.pssb-modal-overlay--open {
	display: flex;
}

.pssb-modal {
	position: relative;
	background: var(--pssb-surface);
	border-radius: var(--pssb-radius-lg);
	box-shadow: var(--pssb-shadow-lg);
	width: 100%;
	max-width: 640px;
	max-height: 90vh;
	overflow-y: auto;
	animation: pssb-modal-in 0.22s ease;
}

@keyframes pssb-modal-in {
	from { opacity: 0; transform: translateY(12px) scale(0.98); }
	to   { opacity: 1; transform: translateY(0) scale(1); }
}

.pssb-modal__header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 24px 28px 0;
	gap: 12px;
}

.pssb-modal__title {
	font-size: 1.25em;
	font-weight: 700;
	color: var(--pssb-text);
	margin: 0;
}

.pssb-modal__close {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	min-width: 32px;
	border-radius: 50%;
	background: var(--pssb-surface-alt);
	border: 1px solid var(--pssb-border);
	color: var(--pssb-text-muted);
	font-size: 1.1em;
	font-weight: 700;
	cursor: pointer;
	line-height: 1;
	padding: 0;
	transition: background var(--pssb-transition), color var(--pssb-transition);
	flex-shrink: 0;
}

.pssb-modal__close:hover {
	background: #fee2e2;
	color: #991b1b;
	border-color: #fca5a5;
}

.pssb-modal__body {
	padding: 24px 28px 32px;
}

@media ( max-width: 600px ) {
	.pssb-modal {
		max-height: 95vh;
		border-radius: var(--pssb-radius);
	}

	.pssb-modal__header,
	.pssb-modal__body {
		padding-left: 20px;
		padding-right: 20px;
	}
}

/* ── Nomination Success Page ────────────────────────────────────── */

.pssb-nom-success-wrap {
	max-width: 560px;
	margin: 0 auto;
	text-align: center;
	padding: 40px 24px;
}

.pssb-nom-success-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 64px;
	height: 64px;
	border-radius: 50%;
	background: #d1fae5;
	color: #065f46;
	font-size: 1.8em;
	margin-bottom: 20px;
}

.pssb-nom-success-title {
	font-size: 1.6em;
	font-weight: 700;
	color: var(--pssb-text);
	margin: 0 0 12px;
}

.pssb-nom-success-msg {
	color: var(--pssb-text-mid);
	font-size: 1em;
	line-height: 1.65;
	margin: 0 0 20px;
}

.pssb-nom-success-school {
	display: inline-block;
	background: var(--pssb-primary-light);
	border: 1px solid #b3d4f7;
	border-radius: var(--pssb-radius-sm);
	padding: 10px 20px;
	font-weight: 600;
	color: var(--pssb-primary-dark);
	font-size: 0.95em;
}

/* ── School Map Widget ──────────────────────────────────────────── */

.pssb-school-map-widget {
	display: flex;
	align-items: flex-start;
	gap: 28px;
	width: 100%;
	box-sizing: border-box;
}

.pssb-school-map-widget__map {
	flex: 1;
	min-width: 0;
}

.pssb-school-map-widget__map .pssb-impact-map-wrap {
	width: 100%;
}

.pssb-school-map-widget__legend {
	display: flex;
	flex-direction: column;
	gap: 12px;
	padding-top: 8px;
	flex-shrink: 0;
}

.pssb-map-legend-item {
	display: flex;
	align-items: center;
	gap: 10px;
	white-space: nowrap;
}

.pssb-map-legend-dot {
	display: inline-block;
	width: 14px;
	height: 14px;
	border-radius: 50%;
	flex-shrink: 0;
}

.pssb-map-legend-label {
	font-size: 0.9em;
	font-weight: 500;
	color: var(--pssb-text);
}

@media ( max-width: 680px ) {
	.pssb-school-map-widget {
		flex-direction: column;
	}

	.pssb-school-map-widget__legend {
		flex-direction: row;
		flex-wrap: wrap;
		gap: 10px 20px;
		padding-top: 0;
	}
}

/* ── State Map Widget (Leaflet) ─────────────────────────────────── */

.pssb-state-map-wrap {
	display: flex;
	align-items: flex-start;
	gap: 28px;
	width: 100%;
	box-sizing: border-box;
}

.pssb-state-map-svg-wrap {
	flex: 1;
	min-width: 0;
}

.pssb-state-map-svg {
	display: block;
	width: 100%;
	height: auto;
}

.pssb-state-map-legend {
	display: flex;
	flex-direction: column;
	gap: 12px;
	padding-top: 8px;
	flex-shrink: 0;
}

@media ( max-width: 680px ) {
	.pssb-state-map-wrap {
		flex-direction: column;
	}

	.pssb-state-map-legend {
		flex-direction: row;
		flex-wrap: wrap;
		gap: 10px 20px;
		padding-top: 0;
	}
}

/* ── Nominations Grid ───────────────────────────────────────────── */

.pssb-ngrid-wrap {
	width: 100%;
	box-sizing: border-box;
}

.pssb-ngrid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 20px;
}

.pssb-ngrid-card {
	background: #fff;
	border: 1px solid #e5e7eb;
	border-radius: 14px;
	padding: 28px 20px 24px;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 10px;
	box-shadow: 0 1px 4px rgba(0,0,0,0.05);
	transition: box-shadow 0.2s, transform 0.2s;
}

.pssb-ngrid-card:hover {
	box-shadow: 0 4px 16px rgba(0,0,0,0.09);
	transform: translateY(-2px);
}

.pssb-ngrid-card__icon {
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 4px;
}

.pssb-ngrid-card__name {
	font-size: 1.05em;
	font-weight: 700;
	color: #111827;
	margin: 0;
	line-height: 1.3;
}

.pssb-ngrid-card__location {
	font-size: 0.875em;
	color: #6b7280;
	margin: 0;
}

.pssb-ngrid-card__badge {
	display: inline-block;
	background: #fef9c3;
	color: #854d0e;
	border-radius: 999px;
	font-size: 0.8em;
	font-weight: 500;
	padding: 5px 14px;
	margin-top: 4px;
}

.pssb-ngrid-empty {
	text-align: center;
	padding: 48px 24px;
	color: #6b7280;
	background: #f9fafb;
	border-radius: 12px;
}

.pssb-ngrid-pagination {
	display: flex;
	gap: 8px;
	justify-content: center;
	flex-wrap: wrap;
	margin-top: 32px;
}

@media ( max-width: 720px ) {
	.pssb-ngrid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media ( max-width: 480px ) {
	.pssb-ngrid {
		grid-template-columns: 1fr;
	}
}

/* ── Shipping opt-in ────────────────────────────────────────────── */

.pssb-shipping-opt {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	margin: 18px 0 4px;
	padding: 14px 18px;
	background: #f0f7ff;
	border: 1px solid #bfdbfe;
	border-radius: 10px;
	cursor: pointer;
	font-size: 0.925em;
	color: #1e3a5f;
	line-height: 1.45;
}

.pssb-shipping-opt input[type="checkbox"] {
	margin-top: 2px;
	flex-shrink: 0;
	width: 16px;
	height: 16px;
	accent-color: #208AEC;
	cursor: pointer;
}

.pssb-shipping-opt__text strong {
	color: #0B7AE1;
}

.pssb-order-shipping {
	font-size: 0.9em;
	color: #1d4ed8;
	margin: 2px 0 6px;
}

.pssb-order-total {
	margin-top: 8px;
	font-size: 1.05em;
}