/* Shul Ledger member portal — "Pinkas" design: warm paper, ink, a thread of
   tekhelet, gold for fine rules only. Display face Frank Ruhl Libre (the
   siddur letterform, Hebrew-native); body face Assistant. Fonts are enqueued
   as the 'shul-ledger-fonts' style this stylesheet depends on. */

.shul-portal {
	--shul-paper: #faf9f6;
	--shul-paper-2: #f3f0e9;
	--shul-ink: #1f2a37;
	--shul-muted: #6c6a60;
	--shul-line: #e7e2d8;
	--shul-tekhelet: #274b75;
	--shul-tekhelet-2: #3a6baa;
	--shul-gold: #b08a3e;
	--shul-red: #a63d2f;
	--shul-green: #2f6b4f;
	--shul-radius: 10px;
	--shul-shadow: 0 1px 3px rgba(31, 42, 55, .06), 0 1px 2px rgba(31, 42, 55, .04);
	--shul-serif: 'Frank Ruhl Libre', 'Iowan Old Style', Georgia, 'Times New Roman', serif;
	--shul-sans: 'Assistant', -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
	max-width: 780px;
	margin: 0 auto;
	font-family: var(--shul-sans);
	font-size: 15px;
	line-height: 1.55;
	color: var(--shul-ink);
}

.shul-portal a { color: var(--shul-tekhelet-2); }

.shul-portal h3 {
	font-family: var(--shul-serif);
	font-size: 19px;
	font-weight: 700;
	letter-spacing: 0;
	margin: 34px 0 10px;
	color: var(--shul-ink);
}

/* Section subheads inside a tab: "Open (2)" / "Paid (48) ✓" — quiet small
   caps so the open items stay the loudest thing on the page. */
.shul-portal h4.shul-subhead {
	font-family: var(--shul-sans);
	font-size: 12px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .08em;
	color: var(--shul-muted);
	margin: 18px 0 6px;
}
.shul-portal .shul-allpaid {
	color: var(--shul-green);
	font-weight: 600;
	margin: 10px 0 6px;
}

/* Settled history (paid invoices / fulfilled pledges): one quiet line,
   expandable — the default view shows only what needs attention. */
.shul-portal details.shul-settled {
	margin: 10px 0 18px;
}
.shul-portal details.shul-settled > summary {
	cursor: pointer;
	font-family: var(--shul-sans);
	font-size: 12px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .08em;
	color: var(--shul-muted);
	padding: 4px 0;
	user-select: none;
}
.shul-portal details.shul-settled > summary:hover,
.shul-portal details.shul-settled[open] > summary {
	color: var(--shul-ink);
}

/* ---- Campaign / status chips (ShulSpace-style) ----
   Class names and default colors are load-bearing: Settings → Portal
   appearance emits !important overrides keyed to these exact classes. */
.shul-chip {
	display: inline-block;
	padding: 3px 11px;
	border-radius: 999px;
	font-size: 12px;
	font-weight: 600;
	line-height: 1.4;
	color: #fff;
	white-space: nowrap;
}
.shul-chip-c0 { background: #2f5d8f; }
.shul-chip-c1 { background: #0e7490; }
.shul-chip-c2 { background: #7c3aed; }
.shul-chip-c3 { background: #0f766e; }
.shul-chip-c4 { background: #b45309; }
.shul-chip-c5 { background: #be185d; }
.shul-chip-good { background: var(--shul-green); }
.shul-chip-warn { background: #b45309; }
.shul-chip-info { background: var(--shul-tekhelet-2); }
.shul-chip-navy { background: var(--shul-tekhelet); }

/* ---- Summary cards: entries in the ledger ---- */
.shul-portal-cards { display: flex; flex-wrap: wrap; gap: 14px; margin: 16px 0 24px; }
.shul-portal-card {
	flex: 1 1 210px;
	background: var(--shul-paper);
	border: 1px solid var(--shul-line);
	border-radius: var(--shul-radius);
	padding: 20px 20px 16px;
	display: flex;
	flex-direction: column;
	gap: 4px;
	box-shadow: var(--shul-shadow);
	position: relative;
	overflow: hidden;
}
/* The gold tick — a short rule at the head of each entry. */
.shul-portal-card::before {
	content: '';
	position: absolute;
	top: 0;
	left: 20px;
	width: 34px;
	height: 3px;
	background: var(--shul-gold);
}
.shul-portal-card .value {
	font-family: var(--shul-serif);
	font-size: 28px;
	font-weight: 700;
	letter-spacing: -.01em;
	font-variant-numeric: tabular-nums;
}
.shul-portal-card .value code {
	background: transparent;
	padding: 0;
	color: var(--shul-tekhelet);
	font-family: var(--shul-serif);
	font-size: inherit;
}
.shul-portal-card .label {
	color: var(--shul-muted);
	font-size: 11px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .09em;
}
.shul-portal .shul-owes { color: var(--shul-red); }
.shul-portal .shul-credit { color: var(--shul-green); }

/* ---- Tables ---- */
.shul-portal-table {
	width: 100%;
	border-collapse: separate;
	border-spacing: 0;
	margin: 8px 0 24px;
	border: 1px solid var(--shul-line);
	border-radius: var(--shul-radius);
	/* overflow must stay visible so the ⋯ row menu isn't clipped;
	   corners are rounded per-cell below instead. */
	overflow: visible;
	box-shadow: var(--shul-shadow);
	background: #fff;
}
.shul-portal-table thead th:first-child { border-top-left-radius: var(--shul-radius); }
.shul-portal-table thead th:last-child { border-top-right-radius: var(--shul-radius); }
.shul-portal-table tbody tr:last-child td:first-child { border-bottom-left-radius: var(--shul-radius); }
.shul-portal-table tbody tr:last-child td:last-child { border-bottom-right-radius: var(--shul-radius); }
.shul-portal-table th {
	background: var(--shul-paper-2);
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .08em;
	color: var(--shul-muted);
	padding: 12px 14px;
	text-align: left;
	border-bottom: 1px solid var(--shul-line);
}
.shul-portal-table td {
	padding: 13px 14px;
	border-bottom: 1px solid #f1eee6;
	text-align: left;
	vertical-align: middle;
}
.shul-portal-table tbody tr:last-child td { border-bottom: 0; }
.shul-portal-table tbody tr:hover td { background: #fbfaf7; }
.shul-portal-table .num { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
/* A date reads 2026-10-24 on one line — never broken at its hyphens. */
.shul-portal-table .shul-date { white-space: nowrap; font-variant-numeric: tabular-nums; }

/* ---- Notices ---- */
.shul-portal-notice {
	background: var(--shul-paper);
	border: 1px solid var(--shul-line);
	border-left: 3px solid var(--shul-tekhelet);
	border-radius: 8px;
	padding: 14px 16px;
	margin: 14px 0;
	box-shadow: var(--shul-shadow);
}

/* Post-payment thank-you flash at the top of the account page. */
.shul-pay-thanks {
	border-left-color: #2E7D32;
	background: #F2F8F2;
	font-weight: 600;
}

/* ---- Payment / registration forms ---- */
.shul-pay form, .shul-register form { display: flex; flex-direction: column; gap: 14px; }
/* The HTML hidden attribute LOSES to any display rule (.shul-fee-cover is
   flex — that's how the step-2 save-card checkbox leaked onto step 1, seen
   live 2026-07-09). One guard so hidden always wins, theme bleed included. */
.shul-portal [hidden] { display: none !important; }
/* Before Stripe mounts, the Payment Element div is empty — hide it so it
   doesn't burn a 14px flex-gap slot between the total box and the button. */
#shul-payment-element:empty { display: none; }
.shul-pay-field {
	display: flex;
	flex-direction: column;
	gap: 5px;
	font-size: 12px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .06em;
	color: var(--shul-muted);
}
.shul-pay-field select, .shul-pay-field input {
	font-family: var(--shul-sans);
	font-weight: 400;
	text-transform: none;
	letter-spacing: normal;
	padding: 10px 12px !important;
	border: 1px solid #d6d0c2;
	border-radius: 8px;
	font-size: 16px !important;
	color: var(--shul-ink) !important;
	background: #fff;
	transition: border-color .12s ease, box-shadow .12s ease;
	/* Themes set fixed heights/line-heights on form controls, clipping the
	   text — force content-driven sizing. */
	height: auto !important;
	min-height: 46px;
	line-height: 1.4 !important;
	box-sizing: border-box !important;
}
.shul-pay-field select:focus, .shul-pay-field input:focus {
	border-color: var(--shul-tekhelet-2);
	box-shadow: 0 0 0 3px rgba(58, 107, 170, .18);
	outline: none;
}
/* "Choose which invoices…" (v1.146.0): one quiet bordered list, a row per
   invoice — number over what it is for, amount on the right. A fieldset
   carries theme borders/padding — reset them. */
.shul-portal .shul-pay-picker {
	border: 1px solid #d6d0c2 !important;
	border-radius: 8px;
	background: #fff;
	padding: 0 12px !important;
	margin: 0 !important;
	min-width: 0;
}
.shul-pick-row {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 10px 0;
	border-top: 1px solid #efece3;
	font-size: 15px;
	color: var(--shul-ink);
	cursor: pointer;
	line-height: 1.35;
}
.shul-pick-row:first-of-type { border-top: 0; }
.shul-pick-row input { margin: 0; flex: 0 0 auto; width: 18px; height: 18px; }
.shul-pick-main { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.shul-pick-num { font-weight: 600; }
.shul-pick-for { font-size: 13px; color: var(--shul-muted); overflow-wrap: anywhere; }
.shul-pick-amt { font-variant-numeric: tabular-nums; white-space: nowrap; }
.shul-pick-empty { margin: 0 0 10px; font-size: 13px; color: var(--shul-red); }
/* ---- Saved-method rows (Recurring tab: one row per recurring donation) ---- */
.shul-saved-method {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 6px 0;
	border-bottom: 1px solid #efece3;
}
.shul-saved-method:last-of-type { border-bottom: 0; }
.shul-saved-label { flex: 1; font-weight: 600; }
.shul-saved-label small { color: var(--shul-muted); font-weight: 400; margin-left: 6px; }
.shul-saved-remove {
	background: none;
	border: none;
	color: var(--shul-muted);
	font-size: 13px;
	cursor: pointer;
	text-decoration: underline;
	padding: 4px;
}
.shul-saved-remove:hover { color: var(--shul-red); }

/* ---- Recurring giving ---- */
.shul-subscriptions {
	background: var(--shul-paper);
	border: 1px solid var(--shul-line);
	border-radius: var(--shul-radius);
	box-shadow: var(--shul-shadow);
	padding: 16px 18px;
	margin: 20px 0 0;
}
.shul-subscriptions h3 { margin: 0 0 10px; }
.shul-sub-form { display: flex; flex-direction: column; gap: 14px; margin-top: 12px; }
.shul-sub-form .shul-pay-button { align-self: flex-start; }

.shul-fee-cover {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	font-size: 14px;
	color: var(--shul-ink);
	cursor: pointer;
	line-height: 1.4;
}
.shul-fee-cover input { margin-top: 3px; }
/* "Pay this one only" / "Pay now and auto-pay the rest" (v1.125.0). A
   fieldset carries theme borders/padding — reset them. */
.shul-portal .shul-pay-plan {
	border: 0 !important;
	padding: 0 !important;
	margin: 0 !important;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 8px;
}
.shul-portal .shul-pay-plan legend {
	padding: 0 !important;
	margin: 0 0 5px !important;
	border: 0 !important;
	font-size: 12px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .06em;
	color: var(--shul-muted);
}
.shul-plan-option {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	padding: 10px 12px;
	border: 1px solid #d6d0c2;
	border-radius: 8px;
	background: #fff;
	font-size: 15px;
	font-weight: 400;
	text-transform: none;
	letter-spacing: normal;
	color: var(--shul-ink);
	line-height: 1.4;
	cursor: pointer;
}
.shul-plan-option input { margin: 3px 0 0 !important; flex: none; width: auto !important; height: auto !important; }
.shul-plan-option:has(input:checked) { border-color: var(--shul-tekhelet-2); background: #f0f3f8; }
.shul-plan-note { margin: 0; font-size: 13px; color: var(--shul-muted); line-height: 1.45; }

/* ---- "How would you like to pay?" tiles (v1.143.0): one tile per way to
   pay, then one total and one button for the chosen method. Tiles are
   radio labels; their look is forced (!important) because themes style
   <label> and radio inputs — the v1.13.1 hostile-theme lesson. ---- */
.shul-portal .shul-pay-heading { margin: 0 0 14px; }
.shul-portal .shul-methods {
	border: 0 !important;
	padding: 0 !important;
	margin: 0 !important;
	min-width: 0;
}
.shul-portal .shul-methods legend {
	padding: 0 !important;
	margin: 0 0 6px !important;
	border: 0 !important;
	font-size: 12px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .06em;
	color: var(--shul-muted);
}
.shul-method-tiles {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(128px, 1fr));
	gap: 8px;
}
.shul-portal label.shul-method {
	position: relative;
	display: flex !important;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 2px;
	min-height: 60px;
	margin: 0 !important;
	padding: 10px 8px !important;
	border: 1px solid #d6d0c2 !important;
	border-radius: 8px;
	background: #fff !important;
	box-sizing: border-box;
	cursor: pointer;
	text-align: center;
	font-family: var(--shul-sans);
	font-size: 15px;
	font-weight: 600;
	text-transform: none;
	letter-spacing: normal;
	line-height: 1.25;
	color: var(--shul-ink) !important;
	transition: border-color .12s ease, background .12s ease;
}
/* [hidden] must still win over the forced display above. */
.shul-portal label.shul-method[hidden] { display: none !important; }
.shul-portal label.shul-method:hover { border-color: var(--shul-tekhelet-2) !important; }
/* The radio stays in the page (keyboard + screen readers) but out of sight. */
.shul-portal label.shul-method input {
	position: absolute !important;
	opacity: 0 !important;
	width: 1px !important;
	height: 1px !important;
	margin: 0 !important;
	pointer-events: none;
}
.shul-method-name { display: block; }
.shul-method-sub { display: block; font-size: 12px; font-weight: 400; color: var(--shul-muted); }
.shul-portal label.shul-method.is-on,
.shul-portal label.shul-method:has(input:checked) {
	border: 2px solid var(--shul-tekhelet-2) !important;
	padding: 9px 7px !important;
	background: #f0f3f8 !important;
	color: var(--shul-tekhelet) !important;
}
/* :focus-within, not :has() — older Safari/Firefox must still show where the keyboard is. */
.shul-portal label.shul-method:focus-within { box-shadow: 0 0 0 3px rgba(58, 107, 170, .35); }
/* Card fields open: the method is fixed until "Go back". */
.shul-portal .shul-methods.is-locked label.shul-method:not(.is-on) { opacity: .45; cursor: default; }
.shul-method-panel { display: flex; flex-direction: column; gap: 12px; }
.shul-portal .shul-method-note { margin: 0; font-size: 13px; text-align: center; }
.shul-portal #shul-saved-remove { align-self: flex-start; }
.shul-pay .shul-zelle { margin-top: 4px; }
.shul-pay .shul-zelle ol { margin-top: 0; }
/* Inside the Zelle tile the report form is a sub-step, not a page section. */
.shul-pay .shul-zelle h3 { font-size: 16px; margin: 14px 0 6px; }
.shul-pay-total {
	color: var(--shul-tekhelet);
	font-size: 16px;
	font-weight: 700;
	margin: 0;
	min-height: 1.3em;
}
.shul-pay-total:not(:empty) {
	background: #f0f3f8;
	border-left: 3px solid var(--shul-tekhelet);
	border-radius: 8px;
	padding: 10px 14px;
}

.shul-pay-button {
	background: var(--shul-tekhelet);
	color: #fff;
	border: 0;
	border-radius: 8px;
	padding: 13px 20px;
	font-family: var(--shul-sans);
	font-size: 16px;
	font-weight: 600;
	cursor: pointer;
	box-shadow: 0 1px 3px rgba(39, 75, 117, .35);
	transition: background .12s ease, box-shadow .12s ease;
}
.shul-pay-button:hover { background: var(--shul-tekhelet-2); box-shadow: 0 3px 9px rgba(39, 75, 117, .3); }
.shul-pay-button:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(58, 107, 170, .35); }
.shul-pay-button:disabled { opacity: .6; cursor: default; }
/* Text-message opt-in: declining is a REAL choice, not fine print. Same size
   and hit area as "Yes", quiet colours so it does not compete — a carrier
   reviewer has to be able to see both answers at a glance (error 30923).
   Colours are set outright rather than inherited: this button sits on a public
   page under someone else's theme, and .shul-pay-button's own background would
   otherwise show through (the v1.61.2 lesson about a-styled buttons). */
.shul-portal .shul-sms-choice {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	align-items: center;
	margin-top: 4px;
}
.shul-portal .shul-sms-decline,
.shul-portal .shul-sms-decline:hover,
.shul-portal .shul-sms-decline:focus {
	background: #fff;
	color: var(--shul-tekhelet-2);
	border: 1px solid var(--shul-tekhelet-2);
	box-shadow: none;
}
.shul-portal .shul-sms-decline:hover { background: var(--shul-parchment, #f7f4ee); }
.shul-portal .shul-sms-skip { margin-top: 10px; font-size: 14px; }
/* EVERY pay-button rendered as an <a> (the account log-in prompt, and any
   future link styled as a button): a theme's link color/underline bleeds
   through and washes the label out on the tekhelet background — force
   white, no underline (v1.35.4 lesson, generalized in v1.61.2 after the
   log-in button shipped unreadable on the live theme). */
.shul-portal a.shul-pay-button,
.shul-portal a.shul-pay-button:hover,
.shul-portal a.shul-pay-button:focus,
.shul-portal a.shul-pay-button:visited {
	color: #fff !important;
	text-decoration: none !important;
	display: inline-block;
}
.shul-pay-error { color: var(--shul-red); min-height: 1.2em; }
.shul-portal button.shul-pay-back,
.shul-portal button.shul-pay-back:hover,
.shul-portal button.shul-pay-back:focus {
	background: transparent !important;
	border: none !important;
	box-shadow: none !important;
	min-height: 0 !important;
	height: auto !important;
	padding: 4px 0 !important;
	color: var(--shul-muted) !important;
	font-size: 13px !important;
	text-decoration: underline;
	cursor: pointer;
	text-align: left;
}
.shul-portal button.shul-pay-back:hover { color: var(--shul-tekhelet) !important; }

/* ---- Zelle panel ---- */
.shul-zelle ol { padding-left: 20px; }
.shul-zelle li { margin-bottom: 6px; }
.shul-zelle code, .shul-portal code {
	background: var(--shul-paper-2);
	padding: 2px 8px;
	border-radius: 6px;
	color: var(--shul-tekhelet);
	font-size: .95em;
}

/* ---- Account page tabs ([shul_account]) ---- */
/* The ledger heading: name in the serif, a double rule beneath —
   ink hairline over gold hairline, the ruled page of a pinkas. */
.shul-member-head {
	margin: 6px 0 18px;
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 16px;
	flex-wrap: wrap;
	position: relative;
	padding-bottom: 16px;
	border-bottom: 1px solid rgba(31, 42, 55, .45);
}
.shul-member-head::after {
	content: '';
	position: absolute;
	left: 0;
	right: 0;
	bottom: -4px;
	height: 1px;
	background: var(--shul-gold);
}
.shul-member-id { flex: 1 1 auto; min-width: 0; }
.shul-portal button.shul-details-btn,
.shul-portal button.shul-details-btn:hover,
.shul-portal button.shul-details-btn:focus,
.shul-portal summary.shul-details-btn,
.shul-portal summary.shul-details-btn:hover,
.shul-portal summary.shul-details-btn:focus {
	background: var(--shul-paper) !important;
	border: 1px solid var(--shul-line) !important;
	border-radius: 999px !important;
	box-shadow: var(--shul-shadow) !important;
	padding: 9px 18px !important;
	min-height: 0 !important;
	height: auto !important;
	font-family: var(--shul-sans) !important;
	font-size: 13px !important;
	font-weight: 600 !important;
	line-height: 1.4 !important;
	color: var(--shul-tekhelet) !important;
	cursor: pointer;
	white-space: nowrap;
	transition: border-color .12s ease, background .12s ease;
}
.shul-portal button.shul-details-btn:hover,
.shul-portal summary.shul-details-btn:hover { border-color: var(--shul-tekhelet-2) !important; }
/* "Turn on auto-pay" is a <summary>: styled as the button it is, never as grey text. */
.shul-portal summary.shul-details-btn { display: inline-block; list-style: none; }
.shul-portal summary.shul-details-btn::-webkit-details-marker { display: none; }
.shul-portal details[open] > summary.shul-details-btn { background: var(--shul-paper-2) !important; }
.shul-portal button.shul-details-btn.active,
.shul-portal button.shul-details-btn.active:hover,
.shul-portal button.shul-details-btn.active:focus {
	background: var(--shul-tekhelet) !important;
	border-color: var(--shul-tekhelet) !important;
	color: #fff !important;
}

/* Per-pledge auto-pay control (active pledges table) */
.shul-autopay { margin-top: 6px; }
.shul-autopay-badge {
	display: inline-block;
	font-size: 12px;
	font-weight: 600;
	color: var(--shul-tekhelet);
	margin-right: 6px;
}
.shul-autopay-hint small { color: var(--shul-muted, #6b7280); font-size: 12px; }
.shul-autopay-setup > summary { display: inline-block; list-style: none; margin: 0; }
.shul-autopay-setup > summary::-webkit-details-marker { display: none; }
.shul-autopay-form { margin-top: 8px; display: grid; gap: 8px; max-width: 340px; }
.shul-autopay-flag { color: var(--shul-tekhelet); }
.shul-member-name {
	font-family: var(--shul-serif);
	font-size: 30px;
	font-weight: 700;
	letter-spacing: -.01em;
	margin: 0 0 2px;
	color: var(--shul-ink);
}
.shul-member-hebrew {
	margin: 0 0 2px;
	font-family: var(--shul-serif);
	font-size: 19px;
	color: var(--shul-tekhelet);
	font-weight: 500;
}
.shul-tribe-badge {
	display: inline-block;
	background: var(--shul-paper-2);
	color: var(--shul-tekhelet);
	border-radius: 999px;
	padding: 1px 10px;
	font-family: var(--shul-sans);
	font-size: 12px;
	font-weight: 600;
	vertical-align: middle;
}
.shul-member-contact { margin: 4px 0 0; color: var(--shul-muted); font-size: 14px; }
.shul-tabs {
	display: flex;
	flex-wrap: wrap;
	gap: 2px;
	border-bottom: 2px solid var(--shul-line);
	margin: 22px 0 10px;
}
/* Hardened against theme button styling (Astra & co. paint <button> with
   solid backgrounds, min-heights, and white text — reset all of it). */
.shul-portal button.shul-tab,
.shul-portal button.shul-tab:hover,
.shul-portal button.shul-tab:focus,
.shul-portal button.shul-tab:active {
	background: transparent !important;
	border: none !important;
	border-bottom: 3px solid transparent !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	outline: none;
	min-height: 0 !important;
	height: auto !important;
	padding: 10px 14px !important;
	margin: 0 0 -2px !important;
	font-family: var(--shul-sans) !important;
	font-size: 12px !important;
	font-weight: 700 !important;
	line-height: 1.4 !important;
	text-transform: uppercase !important;
	letter-spacing: .06em !important;
	color: var(--shul-muted) !important;
	cursor: pointer;
	transition: color .12s ease, border-color .12s ease;
}
.shul-portal button.shul-tab { padding: 10px 11px !important; }
.shul-portal button.shul-tab:hover { color: var(--shul-tekhelet-2) !important; }
.shul-portal button.shul-tab.active,
.shul-portal button.shul-tab.active:hover,
.shul-portal button.shul-tab.active:focus {
	color: var(--shul-tekhelet) !important;
	border-bottom-color: var(--shul-tekhelet) !important;
}
/* Phone-only tab parts: the short label and the open-invoice badge. The
   label spans are hardened like the button itself — a theme's
   "button span" rule must not resize or recolour the tab text. */
.shul-portal button.shul-tab .shul-tab-long,
.shul-portal button.shul-tab .shul-tab-short {
	font: inherit !important;
	color: inherit !important;
	letter-spacing: inherit !important;
	text-transform: inherit !important;
	background: none !important;
	padding: 0 !important;
	margin: 0 !important;
}
.shul-portal .shul-tab-short,
.shul-portal .shul-tab-badge { display: none; }
.shul-portal .shul-sr-only {
	position: absolute !important;
	width: 1px; height: 1px;
	padding: 0; margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}
.shul-tab-panel { padding-top: 4px; }
.shul-empty { color: var(--shul-muted); font-size: 14px; }
.shul-available { color: var(--shul-green); }
.shul-paid-check { color: var(--shul-green); font-weight: 700; font-size: 16px; }

/* Row action menu (⋯) */
.shul-menu-cell { position: relative; width: 30px; }
.shul-row-menu { position: relative; display: inline-block; }
.shul-row-menu summary {
	list-style: none;
	cursor: pointer;
	color: var(--shul-muted);
	font-weight: 700;
	font-size: 16px;
	padding: 2px 8px;
	border-radius: 6px;
	user-select: none;
}
.shul-row-menu summary::-webkit-details-marker { display: none; }
.shul-row-menu summary:hover { background: var(--shul-paper-2); color: var(--shul-tekhelet); }
.shul-row-menu[open] summary { background: var(--shul-paper-2); }
.shul-row-menu-items {
	position: absolute;
	right: 0;
	top: 100%;
	z-index: 40;
	background: #fff;
	border: 1px solid var(--shul-line);
	border-radius: 8px;
	box-shadow: 0 6px 18px rgba(31, 42, 55, .12);
	min-width: 170px;
	padding: 6px 0;
	display: flex;
	flex-direction: column;
}
.shul-row-menu-items a,
.shul-portal .shul-row-menu-items button.shul-invoice-pay,
.shul-portal .shul-row-menu-items button.shul-invoice-zelle {
	background: none !important;
	border: none !important;
	box-shadow: none !important;
	min-height: 0 !important;
	text-align: left;
	padding: 8px 14px !important;
	font-family: var(--shul-sans) !important;
	font-size: 14px !important;
	color: var(--shul-ink) !important;
	text-decoration: none;
	cursor: pointer;
	line-height: 1.3 !important;
}
.shul-row-menu-items a:hover,
.shul-portal .shul-row-menu-items button.shul-invoice-pay:hover,
.shul-portal .shul-row-menu-items button.shul-invoice-zelle:hover { background: var(--shul-paper-2) !important; color: var(--shul-tekhelet) !important; }
.shul-menu-muted { padding: 8px 14px; font-size: 14px; color: #b8b2a3; cursor: default; }
.shul-mini-form {
	display: flex;
	flex-direction: column;
	gap: 14px;
	max-width: 440px;
	background: var(--shul-paper);
	border: 1px solid var(--shul-line);
	border-radius: var(--shul-radius);
	box-shadow: var(--shul-shadow);
	padding: 18px 20px;
	margin: 8px 0 16px;
}
.shul-details-rows {
	background: var(--shul-paper);
	border: 1px solid var(--shul-line);
	border-radius: var(--shul-radius);
	box-shadow: var(--shul-shadow);
	margin: 10px 0 14px;
	overflow: hidden;
}
.shul-details-row {
	display: flex;
	gap: 16px;
	padding: 11px 16px;
	border-bottom: 1px solid #efece3;
}
.shul-details-row:last-child { border-bottom: 0; }
.shul-details-label {
	flex: 0 0 190px;
	color: var(--shul-muted);
	font-size: 12px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .05em;
	padding-top: 2px;
}
.shul-details-value { font-size: 15px; }

/* ---- Member front page ([shul_member_home]) ---- */
.shul-home { max-width: 920px; }
/* The hero carries the same ledger heading motif as the account page. */
.shul-home-hero {
	text-align: center;
	margin: 10px 0 28px;
	position: relative;
	padding-bottom: 20px;
	border-bottom: 1px solid rgba(31, 42, 55, .45);
}
.shul-home-hero::after {
	content: '';
	position: absolute;
	left: 0;
	right: 0;
	bottom: -4px;
	height: 1px;
	background: var(--shul-gold);
}
.shul-home-hero h2 {
	font-family: var(--shul-serif);
	font-size: 32px;
	font-weight: 700;
	letter-spacing: -.01em;
	margin: 0 0 6px;
	color: var(--shul-ink);
}
.shul-home-hero p { color: var(--shul-muted); margin: 0 auto; max-width: 520px; }
.shul-home-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 20px;
	align-items: start;
}
.shul-home-panel {
	background: var(--shul-paper);
	border: 1px solid var(--shul-line);
	border-radius: var(--shul-radius);
	padding: 22px 24px;
	box-shadow: var(--shul-shadow);
}
.shul-home-panel h3 { margin-top: 0; }
.shul-home-panel form { display: flex; flex-direction: column; gap: 14px; }
.shul-home-panel .shul-portal { max-width: none; font-size: inherit; }
.shul-home-note { color: var(--shul-muted); font-size: 13px; margin: 4px 0 12px; }
.shul-login-extra {
	display: flex;
	justify-content: space-between;
	align-items: center;
	font-size: 13px;
}
.shul-login-extra a { color: var(--shul-tekhelet-2); }
.shul-remember {
	display: flex;
	align-items: center;
	gap: 6px;
	color: var(--shul-muted);
	cursor: pointer;
}
.shul-home-actions { display: flex; align-items: center; gap: 16px; margin-top: 16px; }
/* This button is an <a>, so a theme's link color/underline can bleed through
   and wash out the label on the tekhelet background — force white, no underline. */
.shul-home-actions .shul-pay-button,
.shul-home-actions .shul-pay-button:hover,
.shul-home-actions .shul-pay-button:focus {
	color: #fff !important;
	text-decoration: none !important;
	display: inline-block;
}
.shul-home-logout { color: var(--shul-muted); font-size: 13px; }

/* ---- Reduced motion ---- */
@media (prefers-reduced-motion: reduce) {
	.shul-portal *, .shul-portal *::before, .shul-portal *::after { transition: none !important; }
	.shul-seating-svg .shul-seat-ring { animation: none !important; }
}

/* ---- Guest pay (signed email link, no login): one centered card ---- */
.shul-guest-pay {
	max-width: 560px;
	margin: 28px auto;
	background: var(--shul-paper);
	border: 1px solid var(--shul-line);
	border-radius: var(--shul-radius);
	padding: 26px 28px 24px;
	box-shadow: var(--shul-shadow);
	position: relative;
	overflow: hidden;
}
/* The gold tick, same as the summary cards — this IS a ledger entry. */
.shul-guest-pay::before {
	content: '';
	position: absolute;
	top: 0;
	left: 28px;
	width: 34px;
	height: 3px;
	background: var(--shul-gold);
}
.shul-guest-pay h3 { margin-top: 0; font-size: 22px; }
.shul-guest-pay > p { margin: 6px 0; }
.shul-guest-pay form { margin-top: 18px; }

/* The guest "Zelle / already paid" panel (v1.143.0; was a collapsed
   <details> under the pay form). */
.shul-guest-report .shul-subhead { margin-top: 0; }
.shul-guest-report .shul-mini-form {
	display: flex;
	flex-direction: column;
	gap: 12px;
	margin-top: 12px;
}
.shul-guest-report .shul-pay-button { align-self: flex-start; }


/* ---- Tabs on phones and small tablets ---- */
@media (max-width: 782px) {
	/* Tabs become a grid of buttons (v1.124.0): every tab on screen at once,
	   up to 782px so a phone held sideways (641-780px, where the six-tab
	   row of ~650px wraps a lone tab onto a second line) gets it too;
	   no sideways scroll, each a 44px tap target. Selectors out-rank the
	   theme-hardened desktop rules above (same !important, more specific). */
	.shul-portal .shul-tabs {
		display: grid;
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 7px;
		border-bottom: 0;
		margin: 16px 0 12px;
	}
	.shul-portal .shul-tabs button.shul-tab,
	.shul-portal .shul-tabs button.shul-tab:hover,
	.shul-portal .shul-tabs button.shul-tab:focus,
	.shul-portal .shul-tabs button.shul-tab:active {
		display: flex !important;
		align-items: center;
		justify-content: center;
		gap: 5px;
		min-width: 0;
		min-height: 44px !important;
		padding: 4px !important;
		margin: 0 !important;
		background: #fff !important;
		border: 1.5px solid var(--shul-line) !important;
		border-radius: 10px !important;
		font-size: 13.5px !important;
		line-height: 1.15 !important;
		letter-spacing: 0 !important;
		text-transform: none !important;
		text-align: center;
		white-space: normal;
		color: var(--shul-ink) !important;
	}
	.shul-portal .shul-tabs button.shul-tab.active,
	.shul-portal .shul-tabs button.shul-tab.active:hover,
	.shul-portal .shul-tabs button.shul-tab.active:focus {
		background: var(--shul-tekhelet) !important;
		border-color: var(--shul-tekhelet) !important;
		color: #fff !important;
	}
	.shul-portal .shul-tabs button.shul-tab:focus-visible { box-shadow: 0 0 0 3px rgba(58, 107, 170, .35) !important; }
	.shul-portal .shul-tab-long { display: none; }
	.shul-portal .shul-tab-short { display: inline; }
	.shul-portal .shul-tabs button.shul-tab .shul-tab-badge {
		display: inline-block;
		min-width: 18px;
		padding: 1px 6px !important;
		margin: 0 !important;
		border-radius: 999px;
		background: var(--shul-red) !important;
		color: #fff !important;
		font-size: 11px !important;
		font-weight: 700 !important;
		line-height: 16px !important;
		text-align: center;
	}
	.shul-portal .shul-tabs button.shul-tab .shul-tab-badge span { font: inherit !important; color: inherit !important; }
	.shul-portal .shul-tabs button.shul-tab.active .shul-tab-badge { background: #fff !important; color: var(--shul-red) !important; }
}

/* ---- Mobile ---- */
@media (max-width: 640px) {
	.shul-portal { font-size: 14px; padding: 0 4px; }
	.shul-guest-pay { margin: 10px auto; padding: 18px 16px 16px; }
	.shul-guest-pay::before { left: 16px; }
	.shul-portal-cards { flex-direction: column; gap: 10px; }
	.shul-portal-card { flex: 1 1 auto; padding: 16px 16px 13px; }
	.shul-portal-card .value { font-size: 24px; }
	.shul-member-name { font-size: 25px; }

	/* Tables scroll sideways instead of breaking the layout. */
	.shul-portal-table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }
	.shul-portal-table th, .shul-portal-table td { white-space: nowrap; }
	/* …but free-text notes (e.g. a report's decline reason) are prose, not
	   money — wrap them in a narrow block so one long sentence doesn't
	   stretch the whole table into 900px of sideways scrolling. */
	.shul-portal-table td .shul-empty {
		white-space: normal;
		display: inline-block;
		max-width: 200px;
		vertical-align: top;
	}

	/* Inside a scroll container an absolute menu would clip — expand inline. */
	.shul-row-menu-items {
		position: static;
		box-shadow: none;
		border: none;
		min-width: 0;
		padding: 0;
	}

	.shul-pay-field select, .shul-pay-field input { width: 100%; box-sizing: border-box; font-size: 16px; /* prevents iOS zoom-on-focus */ }
	.shul-pay-button { width: 100%; padding: 14px; }
	.shul-register input { font-size: 16px; }

	.shul-home-grid { grid-template-columns: 1fr; }
	.shul-home-hero h2 { font-size: 26px; }
	.shul-home-actions { flex-direction: column; align-items: stretch; text-align: center; }

	.shul-details-row { flex-direction: column; gap: 2px; }
	.shul-details-label { flex: none; }
	/* The room map keeps a readable size and scrolls sideways; "Find my seat" brings the member's chair into view. */
	.shul-seating-chart svg { min-width: calc(640px * var(--shul-chart-share, 1)); }
	.shul-portal button.shul-find-seat { width: 100% !important; }
	.shul-portal button.shul-find-seat + button.shul-find-seat { margin-left: 0 !important; margin-top: 6px !important; }
}

/* Text-message opt-in: the carrier disclosures under the consent box. Quiet
   and small — they are a legal readout, not the point of the page — but never
   so faint that a campaign reviewer has to hunt for them. */
.shul-sms-disclosures {
	margin: 14px 0 18px;
	padding: 12px 14px;
	border: 1px solid var(--shul-line, #e7e2d8);
	border-radius: 8px;
	background: var(--shul-paper-2, #f3f0e9);
	font-size: 13px;
	line-height: 1.5;
}
.shul-sms-disclosures p { margin: 0 0 6px; }
.shul-sms-disclosures p:last-child { margin-bottom: 0; }
/* The portal's My Details form is a FLEX column with its own 14px gap, so the
   block's margins would add to it and double the spacing. Any further context
   that reuses this block needs the same check (the v1.95.0 lesson: a component
   dropped into a new container must answer for its own chrome and spacing). */
.shul-mini-form .shul-sms-disclosures { margin: 0; }

/* ---- Holiday Seating tab (v1.103.0): the room as an inline SVG, only the
   member's own seats named. The SVG carries its own colours; these rules only
   frame it, mark the member's chairs, and harden the one button. ---- */
.shul-seating-season { margin: 0 0 6px; font-family: var(--shul-serif); font-size: 19px; color: var(--shul-ink); }
.shul-seating-mine { margin: 0 0 12px; font-size: 14px; }
.shul-seating-mine p { margin: 0 0 4px; }
.shul-seating-area { margin: 14px 0 6px; font-family: var(--shul-serif); font-size: 16px; }
.shul-seating-chart {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	margin: 0 0 10px;
	border: 1px solid var(--shul-line);
	border-radius: 8px;
	background: var(--shul-paper-2, #f3f0e9);
	padding: 6px;
}
/* --shul-chart-share = this room's width as a share of the widest room, so every
   room draws at the same scale (a 6-seat section is not blown up to full width). */
.shul-seating-chart svg { display: block; width: calc(100% * var(--shul-chart-share, 1)); height: auto; }
.shul-seat-ring { stroke: #b08a3e; stroke-width: 2.5; fill: none; }
.shul-seat-mine.is-pulse .shul-seat-ring { animation: shul-seat-pulse 1.3s ease-in-out 2; }
@keyframes shul-seat-pulse {
	0%, 100% { stroke-width: 2.5; opacity: 1; }
	50% { stroke-width: 7; opacity: .55; }
}
.shul-seating-legend { margin: 0 0 8px; }
/* Hardened like .shul-tab: a theme paints <button> however it likes. */
.shul-portal button.shul-find-seat,
.shul-portal button.shul-find-seat:hover,
.shul-portal button.shul-find-seat:focus,
.shul-portal button.shul-find-seat:active {
	display: inline-block;
	background: var(--shul-tekhelet) !important;
	border: 1px solid var(--shul-tekhelet) !important;
	border-radius: 999px !important;
	box-shadow: none !important;
	min-height: 0 !important;
	height: auto !important;
	margin: 4px 0 0 !important;
	padding: 8px 16px !important;
	font-family: var(--shul-sans) !important;
	font-size: 13px !important;
	font-weight: 700 !important;
	line-height: 1.3 !important;
	letter-spacing: .02em !important;
	text-transform: none !important;
	color: #fff !important;
	cursor: pointer;
}
.shul-portal button.shul-find-seat:hover,
.shul-portal button.shul-find-seat:focus { background: var(--shul-tekhelet-2) !important; border-color: var(--shul-tekhelet-2) !important; }
/* One button per room when the member sits in several (v1.108.0): a little air between them. */
.shul-portal button.shul-find-seat + button.shul-find-seat { margin-left: 6px !important; }

/* ===================================================================
   Shabbat sponsorship calendar (v1.159.0) — [shul_sponsorships],
   [shul_sponsor_notice] and the portal's Sponsorships tab.
   Pinkas palette; every control hardened against theme bleed.
   =================================================================== */
.shul-portal.shul-sp, .shul-portal .shul-sp { color: var(--shul-ink); font-family: var(--shul-sans); }
/* The standalone calendar page may use the full content width (3–4 cards a row); inside the portal it keeps the portal's width. */
.shul-portal.shul-sp { max-width: 1160px; }
.shul-portal .shul-sp-h {
	font-family: var(--shul-serif); font-size: 21px; font-weight: 600; color: var(--shul-ink);
	margin: 30px 0 12px; padding: 0; border: 0; letter-spacing: 0;
}

/* --- "This Shabbat" head notice --- */
.shul-portal .shul-sp-notice {
	position: relative; overflow: hidden; margin: 0 0 24px; padding: 22px 26px 20px 30px;
	background: #fff; border: 1px solid var(--shul-line); border-radius: 14px; box-shadow: var(--shul-shadow);
}
.shul-portal .shul-sp-notice::before {
	content: ""; position: absolute; top: 0; bottom: 0; left: 0; width: 5px;
	background: linear-gradient(180deg, var(--shul-gold), #d9bb73);
}
.shul-portal .shul-sp-kicker {
	font-size: 11.5px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #8a6a2c;
}
.shul-portal .shul-sp-notice-title {
	font-family: var(--shul-serif); font-size: 28px; font-weight: 700; line-height: 1.2;
	color: var(--shul-ink); margin: 4px 0 2px; padding: 0; border: 0;
}
.shul-portal .shul-sp-notice-date { font-size: 14px; color: var(--shul-muted); }
.shul-portal .shul-sp-notice-lines {
	list-style: none !important; margin: 14px 0 0 !important; padding: 14px 0 0 !important;
	border-top: 1px dashed var(--shul-line);
}
.shul-portal .shul-sp-notice-lines li { margin: 6px 0 !important; padding: 0 !important; font-size: 15.5px; line-height: 1.55; list-style: none !important; }
.shul-portal .shul-sp-notice-type {
	display: inline-block; margin-right: 8px; padding: 2px 10px; border-radius: 999px; vertical-align: 1px;
	background: #eaf0f7; color: var(--shul-tekhelet); font-size: 11.5px; font-weight: 700;
	letter-spacing: .06em; text-transform: uppercase;
}
.shul-portal .shul-sp-notice-open { margin: 14px 0 0; font-size: 14.5px; color: var(--shul-muted); }
.shul-portal .shul-sp-notice-open a { color: var(--shul-green) !important; font-weight: 700; text-decoration: none !important; border-bottom: 1px solid rgba(47, 107, 79, .35); }
.shul-portal .shul-sp-notice-open a:hover { border-bottom-color: var(--shul-green); }

/* --- Legend + month groups --- */
.shul-portal .shul-sp-legend { display: flex; flex-wrap: wrap; gap: 6px 18px; margin: 4px 0 6px; font-size: 13px; color: var(--shul-muted); }
.shul-portal .shul-sp-key { display: inline-flex; align-items: center; gap: 7px; }
.shul-portal .shul-sp-key::before, .shul-portal .shul-sp-type::before {
	content: ""; display: inline-block; width: 9px; height: 9px; border-radius: 50%; flex: 0 0 9px;
}
.shul-portal .shul-sp-key.is-sponsored::before, .shul-portal .is-sponsored .shul-sp-type::before { background: var(--shul-green); }
.shul-portal .shul-sp-key.is-pending::before, .shul-portal .is-pending .shul-sp-type::before { background: #c27c0e; }
.shul-portal .shul-sp-key.is-available::before, .shul-portal .is-available .shul-sp-type::before { background: #fff; box-shadow: inset 0 0 0 2px var(--shul-tekhelet-2); }
.shul-portal .shul-sp-month-title {
	font-family: var(--shul-serif); font-size: 19px; font-weight: 600; color: var(--shul-ink);
	margin: 26px 0 12px; padding: 0 0 8px; border: 0; border-bottom: 1px solid var(--shul-line); position: relative;
}
.shul-portal .shul-sp-month-title::after { content: ""; position: absolute; left: 0; bottom: -1px; width: 44px; height: 2px; background: var(--shul-gold); }
.shul-portal .shul-sp-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 16px; }

/* --- One Shabbat card --- */
.shul-portal .shul-sp-week {
	display: flex; flex-direction: column; background: #fff; border: 1px solid var(--shul-line);
	border-radius: 14px; box-shadow: var(--shul-shadow); overflow: hidden; scroll-margin-top: 90px;
}
.shul-portal .shul-sp-week.is-this-week { border-color: #d9c08a; box-shadow: 0 0 0 3px rgba(176, 138, 62, .14), var(--shul-shadow); }
.shul-portal .shul-sp-week-head {
	display: flex; align-items: center; gap: 12px; padding: 14px 16px;
	background: linear-gradient(180deg, #fff, var(--shul-paper)); border-bottom: 1px solid var(--shul-line);
}
.shul-portal .shul-sp-day {
	display: flex; flex-direction: column; align-items: center; justify-content: center; flex: 0 0 52px;
	width: 52px; height: 56px; border-radius: 10px; background: var(--shul-tekhelet); color: #fff; line-height: 1;
}
.shul-portal .shul-sp-dnum { font-family: var(--shul-serif); font-size: 23px; font-weight: 700; }
.shul-portal .shul-sp-dmon { margin-top: 3px; font-size: 10.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; opacity: .85; }
.shul-portal .shul-sp-day.is-small { flex-basis: 50px; width: 50px; height: 50px; }
.shul-portal .shul-sp-day.is-small .shul-sp-dnum { font-size: 19px; }
.shul-portal .shul-sp-day.is-small .shul-sp-dmon { font-size: 9.5px; letter-spacing: .04em; }
.shul-portal .shul-sp-week-title { min-width: 0; }
.shul-portal .shul-sp-parsha { font-family: var(--shul-serif); font-size: 18px; font-weight: 600; color: var(--shul-ink); line-height: 1.25; }
.shul-portal .shul-sp-heb { font-size: 13px; color: var(--shul-muted); margin-top: 2px; }
.shul-portal .shul-sp-this {
	margin-left: auto; padding: 3px 10px; border-radius: 999px; white-space: nowrap;
	background: #f6efe0; color: #7a5b21; font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
}
.shul-portal .shul-sp-slots { list-style: none !important; margin: 0 !important; padding: 4px 0 !important; flex: 1 1 auto; }
.shul-portal .shul-sp-slot { list-style: none !important; margin: 0 !important; padding: 12px 16px !important; border-top: 1px solid #f1ede4; }
.shul-portal .shul-sp-slot:first-child { border-top: 0; }
.shul-portal .shul-sp-slot.is-mine { background: #fffbf2; }
.shul-portal .shul-sp-slot.is-focus { box-shadow: inset 3px 0 0 var(--shul-gold); background: #fffaf0; }
.shul-portal .shul-sp-slot-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.shul-portal .shul-sp-type {
	display: inline-flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 700;
	letter-spacing: .08em; text-transform: uppercase; color: var(--shul-muted);
}
.shul-portal .shul-sp-pill { padding: 2px 9px; border-radius: 999px; font-size: 11px; font-weight: 700; letter-spacing: .04em; }
.shul-portal .shul-sp-pill.is-mine { background: #f6efe0; color: #7a5b21; }
.shul-portal .shul-sp-names { margin-top: 5px; font-size: 16px; font-weight: 600; color: var(--shul-ink); line-height: 1.4; }
.shul-portal .shul-sp-occasion { margin-top: 2px; font-size: 14px; font-style: italic; color: var(--shul-muted); line-height: 1.45; }
.shul-portal .shul-sp-status { font-size: 14px; color: var(--shul-muted); }
.shul-portal .is-pending .shul-sp-status { display: block; margin-top: 5px; color: #9a5d06; }
.shul-portal .shul-sp-avail { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 6px; }
.shul-portal .is-available .shul-sp-status { color: var(--shul-green); font-weight: 600; }
.shul-portal .shul-sp-week-foot { padding: 10px 16px 13px; border-top: 1px dashed var(--shul-line); }
.shul-portal .shul-sp-week-foot a { font-size: 13.5px; font-weight: 600; color: var(--shul-tekhelet-2) !important; text-decoration: none !important; }
.shul-portal .shul-sp-week-foot a:hover { color: var(--shul-tekhelet) !important; text-decoration: underline !important; }
/* "Also this Shabbat:" — every other program as one compact line of chips (v1.166.0). */
.shul-portal .shul-sp-also { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; padding: 10px 16px 12px; border-top: 1px dashed var(--shul-line); }
.shul-portal .shul-sp-also-label { font-size: 11.5px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--shul-muted); margin-right: 1px; }
.shul-portal .shul-sp-chip { display: inline-block; max-width: 100%; padding: 2px 9px; border: 1px solid var(--shul-line); border-radius: 999px; font-size: 12.5px; line-height: 1.5; color: var(--shul-muted); background: #fff; overflow-wrap: anywhere; }
.shul-portal a.shul-sp-chip.is-available { color: var(--shul-tekhelet-2) !important; border-color: currentColor; font-weight: 600; text-decoration: none !important; }
.shul-portal a.shul-sp-chip.is-available:hover, .shul-portal a.shul-sp-chip.is-available:focus-visible { background: var(--shul-paper-2); color: var(--shul-tekhelet) !important; }
.shul-portal .shul-sp-chip.is-sponsored { background: var(--shul-paper-2); }
.shul-portal a.shul-sp-chip.is-joinable { color: var(--shul-ink, #1f2937) !important; text-decoration: none !important; }
.shul-portal a.shul-sp-chip.is-joinable:hover, .shul-portal a.shul-sp-chip.is-joinable:focus-visible { border-color: var(--shul-tekhelet-2); }
.shul-portal .shul-sp-chip-join { margin-left: 4px; font-weight: 700; color: var(--shul-tekhelet-2); }
.shul-portal .shul-sp-chip.is-pending { color: #9a5d06; border-color: #f0d9a8; background: #fdf7ea; }
.shul-portal .shul-sp-chip.is-mine { color: var(--shul-tekhelet); border-color: var(--shul-tekhelet); font-weight: 600; }
/* A program that does not run that week in the long reserve form ("Winter only"). */
.shul-portal .shul-sp-type-off { display: none; margin-left: auto; font-size: 12px; font-weight: 700; color: #9a5d06; white-space: nowrap; }
.shul-portal label.shul-sp-type-opt.is-off { background: var(--shul-paper-2); border-style: dashed; cursor: not-allowed; }
.shul-portal label.shul-sp-type-opt.is-off .shul-sp-type-name { color: var(--shul-muted); }
.shul-portal label.shul-sp-type-opt.is-off .shul-sp-type-price { display: none; }
.shul-portal label.shul-sp-type-opt.is-off .shul-sp-type-off { display: inline; }

/* --- Buttons (anchors, buttons and <summary>) --- */
.shul-portal .shul-sp-btn,
.shul-portal a.shul-sp-btn,
.shul-portal button.shul-sp-btn,
.shul-portal summary.shul-sp-btn {
	display: inline-flex !important; align-items: center; justify-content: center; gap: 6px;
	margin: 0; padding: 7px 16px !important; min-height: 0; width: auto;
	background: var(--shul-tekhelet) !important; color: #fff !important; border: 0 !important; border-radius: 999px !important;
	font: 600 14px/1.2 var(--shul-sans) !important; letter-spacing: 0 !important; text-transform: none !important;
	text-decoration: none !important; text-shadow: none !important; white-space: nowrap; cursor: pointer;
	box-shadow: 0 1px 2px rgba(31, 42, 55, .12) !important; transition: background .15s ease, box-shadow .15s ease;
}
.shul-portal .shul-sp-btn:hover, .shul-portal a.shul-sp-btn:hover, .shul-portal button.shul-sp-btn:hover, .shul-portal summary.shul-sp-btn:hover,
.shul-portal a.shul-sp-btn:visited { background: var(--shul-tekhelet-2) !important; color: #fff !important; }
.shul-portal .shul-sp-btn:focus-visible { outline: 2px solid var(--shul-gold) !important; outline-offset: 2px; }
.shul-portal .shul-sp-btn.is-ghost, .shul-portal a.shul-sp-btn.is-ghost, .shul-portal summary.shul-sp-btn.is-ghost {
	background: transparent !important; color: var(--shul-tekhelet) !important;
	box-shadow: inset 0 0 0 1.5px var(--shul-tekhelet-2) !important;
}
.shul-portal .shul-sp-btn.is-ghost:hover, .shul-portal a.shul-sp-btn.is-ghost:hover, .shul-portal summary.shul-sp-btn.is-ghost:hover { background: #eef3fa !important; color: var(--shul-tekhelet) !important; }
.shul-portal .shul-sp-btn.is-large, .shul-portal button.shul-sp-btn.is-large { padding: 12px 28px !important; font-size: 16px !important; }
.shul-portal summary.shul-sp-btn { list-style: none !important; }
.shul-portal summary.shul-sp-btn::-webkit-details-marker { display: none; }
.shul-portal summary.shul-sp-btn::marker { content: ""; }

/* --- Join as co-sponsor --- */
.shul-portal .shul-sp-join-wrap, .shul-portal .shul-sp-join { margin-top: 10px; }
.shul-portal .shul-sp-join[open] > summary { margin-bottom: 10px; }
.shul-portal .shul-sp-join-form {
	display: grid !important; gap: 10px; padding: 12px 14px; border-radius: 10px;
	background: var(--shul-paper); border: 1px solid var(--shul-line);
}
.shul-portal .shul-sp-est { margin: 0; font-size: 13.5px; color: var(--shul-muted); }

/* --- Reserve form --- */
.shul-portal .shul-sp-request {
	margin: 8px 0 28px; padding: 20px 22px 18px; background: #fff;
	border: 1px solid var(--shul-line); border-radius: 14px; box-shadow: var(--shul-shadow); scroll-margin-top: 90px;
}
.shul-portal .shul-sp-request > .shul-sp-h { margin-top: 0; }
.shul-portal .shul-sp-form { display: grid !important; gap: 16px; max-width: 680px; margin: 0; }
.shul-portal .shul-sp-field, .shul-portal .shul-sp-types legend {
	display: flex !important; flex-direction: column; gap: 6px; margin: 0; padding: 0;
	font-size: 13.5px; font-weight: 700; color: var(--shul-ink); float: none !important;
}
.shul-portal .shul-sp-field input[type="text"], .shul-portal .shul-sp-field select {
	box-sizing: border-box; width: 100% !important; max-width: none; height: 44px; margin: 0;
	padding: 0 12px !important; border: 1px solid #d8d1c3 !important; border-radius: 9px !important;
	background: #fff !important; color: var(--shul-ink) !important; font: 400 15px var(--shul-sans) !important; box-shadow: none !important;
}
.shul-portal .shul-sp-field input[type="text"]:focus, .shul-portal .shul-sp-field select:focus {
	outline: none; border-color: var(--shul-tekhelet-2) !important; box-shadow: 0 0 0 3px rgba(58, 107, 170, .18) !important;
}
.shul-portal .shul-sp-types { border: 0; margin: 0; padding: 0; min-width: 0; }
.shul-portal .shul-sp-types legend { margin-bottom: 8px; }
.shul-portal .shul-sp-types { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 10px; }
.shul-portal .shul-sp-types legend { grid-column: 1 / -1; }
.shul-portal label.shul-sp-type-opt {
	display: flex !important; align-items: center; gap: 10px; margin: 0; padding: 11px 13px;
	border: 1.5px solid var(--shul-line); border-radius: 10px; background: #fff; cursor: pointer;
	font-size: 15px; font-weight: 400; transition: border-color .15s ease, background .15s ease;
}
.shul-portal label.shul-sp-type-opt:hover { border-color: #c9d6e8; }
.shul-portal label.shul-sp-type-opt:has(input:checked) { border-color: var(--shul-tekhelet-2); background: #eef3fa; }
.shul-portal .shul-sp-type-name { font-weight: 600; color: var(--shul-ink); }
.shul-portal .shul-sp-type-price { margin-left: auto; font-size: 13.5px; color: var(--shul-muted); font-variant-numeric: tabular-nums; }
.shul-portal label.shul-sp-check { display: flex !important; align-items: center; gap: 10px; margin: 0; font-size: 14.5px; font-weight: 400; color: var(--shul-ink); cursor: pointer; }
.shul-portal .shul-sp-form input[type="checkbox"], .shul-portal .shul-sp-join-form input[type="checkbox"] {
	width: 18px !important; height: 18px !important; margin: 0 !important; flex: 0 0 18px; accent-color: var(--shul-tekhelet);
}
.shul-portal .shul-sp-form > .shul-sp-btn { justify-self: start; }
.shul-portal .shul-sp-fine { margin: 0; font-size: 13px; color: var(--shul-muted); }

/* --- My occasions --- */
.shul-portal .shul-sp-mine { list-style: none !important; margin: 0 0 12px !important; padding: 0 !important; }
.shul-portal .shul-sp-mine-row {
	display: flex; align-items: center; gap: 14px; margin: 0 0 10px !important; padding: 12px 14px !important; list-style: none !important;
	background: #fff; border: 1px solid var(--shul-line); border-radius: 12px; box-shadow: var(--shul-shadow);
}
.shul-portal .shul-sp-mine.is-past .shul-sp-mine-row { box-shadow: none; background: var(--shul-paper); }
.shul-portal .shul-sp-mine.is-past .shul-sp-day { background: #8c96a3; }
.shul-portal .shul-sp-mine-main { flex: 1 1 auto; min-width: 0; }
.shul-portal .shul-sp-mine-title { font-family: var(--shul-serif); font-size: 16.5px; font-weight: 600; color: var(--shul-ink); }
.shul-portal .shul-sp-mine-meta { margin-top: 2px; font-size: 13.5px; color: var(--shul-muted); }
.shul-portal .shul-sp-mine-side { display: flex; flex-direction: column; align-items: flex-end; gap: 5px; text-align: right; }
.shul-portal .shul-sp-mine-amt { font-size: 13.5px; font-weight: 600; color: var(--shul-ink); font-variant-numeric: tabular-nums; white-space: nowrap; }
.shul-portal .shul-sp-suggest {
	display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px;
	margin: 0 0 10px; padding: 12px 14px; border-radius: 12px; background: #f8f2e4; border: 1px solid #ecdcb8; font-size: 14.5px;
}
.shul-portal .shul-sp-suggest em { color: var(--shul-muted); }

.shul-portal .shul-sp-more-wrap { margin: 20px 0 0; text-align: center; }
.shul-portal button.shul-sp-more {
	display: inline-flex !important; align-items: center; padding: 10px 24px !important; margin: 0;
	background: #fff !important; color: var(--shul-tekhelet) !important; border: 1px solid var(--shul-line) !important;
	border-radius: 999px !important; font: 600 14.5px var(--shul-sans) !important; text-transform: none !important;
	letter-spacing: 0 !important; box-shadow: var(--shul-shadow) !important; cursor: pointer;
}
.shul-portal button.shul-sp-more:hover { border-color: var(--shul-tekhelet-2) !important; background: #f5f8fc !important; }
.shul-portal .shul-sp-flash { margin-bottom: 18px; }

@media (max-width: 640px) {
	.shul-portal .shul-sp-notice { padding: 18px 18px 16px 22px; }
	.shul-portal .shul-sp-notice-title { font-size: 24px; }
	.shul-portal .shul-sp-grid { grid-template-columns: 1fr; gap: 12px; }
	.shul-portal .shul-sp-request { padding: 16px 14px; }
	.shul-portal .shul-sp-types { grid-template-columns: 1fr; }
	.shul-portal .shul-sp-form > .shul-sp-btn { justify-self: stretch; }
	.shul-portal .shul-sp-mine-row { align-items: flex-start; }
	.shul-portal .shul-sp-avail .shul-sp-btn { padding: 8px 18px !important; }
}

/* --- "Find a Shabbat" bar (v1.159.1): jump instead of scrolling --- */
.shul-portal .shul-sp-find {
	margin: 0 0 16px; padding: 14px 16px 12px; background: #fff;
	border: 1px solid var(--shul-line); border-radius: 14px; box-shadow: var(--shul-shadow);
}
.shul-portal .shul-sp-find-row { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px 16px; }
.shul-portal label.shul-sp-find-field, .shul-portal div.shul-sp-find-field {
	display: flex !important; flex-direction: column; gap: 5px; margin: 0; flex: 1 1 200px;
	font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--shul-muted);
}
.shul-portal div.shul-sp-find-field > label { display: block !important; margin: 0 !important; padding: 0; font: inherit; letter-spacing: inherit; text-transform: inherit; color: inherit; }
/* Parsha box (v1.160.2): type to filter OR open the whole list. */
.shul-portal .shul-sp-combo { position: relative; letter-spacing: 0; text-transform: none; font-weight: 400; }
.shul-portal .shul-sp-find-field input.shul-sp-pq { padding-right: 42px !important; }
.shul-portal .shul-sp-pq::placeholder { color: #8a8378; opacity: 1; }
.shul-portal button.shul-sp-combo-btn {
	position: absolute; top: 1px; right: 1px; bottom: 1px; width: 40px; margin: 0; padding: 0 !important;
	display: flex; align-items: center; justify-content: center; border: 0 !important; border-radius: 0 9px 9px 0 !important;
	background: transparent !important; color: var(--shul-muted) !important; box-shadow: none !important; cursor: pointer; min-height: 0;
}
.shul-portal button.shul-sp-combo-btn:hover { color: var(--shul-tekhelet) !important; }
.shul-portal .shul-sp-combo.is-open button.shul-sp-combo-btn svg { transform: rotate(180deg); }
.shul-portal ul.shul-sp-plist {
	position: absolute; z-index: 30; left: 0; right: 0; top: calc(100% + 4px); max-height: 280px; overflow-y: auto; overscroll-behavior: contain;
	margin: 0 !important; padding: 4px !important; list-style: none !important; background: #fff;
	border: 1px solid #d8d1c3; border-radius: 10px; box-shadow: 0 10px 28px rgba(16, 38, 70, .16);
}
.shul-portal ul.shul-sp-plist[hidden] { display: none !important; }
.shul-portal li.shul-sp-popt {
	display: flex; align-items: baseline; justify-content: space-between; gap: 10px; margin: 0 !important; padding: 8px 10px;
	border-radius: 7px; cursor: pointer; font: 400 15px/1.3 var(--shul-sans); color: var(--shul-ink); list-style: none !important;
}
.shul-portal li.shul-sp-popt[hidden] { display: none !important; }
.shul-portal li.shul-sp-popt.is-active, .shul-portal li.shul-sp-popt:hover { background: #e9eff7; }
.shul-portal .shul-sp-popt-main { min-width: 0; }
.shul-portal .shul-sp-popt-name { font-weight: 600; }
.shul-portal .shul-sp-popt-heb { margin-left: 6px; font-size: 13px; color: var(--shul-gold, #9a7a35); white-space: nowrap; }
.shul-portal .shul-sp-popt-date { flex: 0 0 auto; font-size: 13px; color: var(--shul-muted); white-space: nowrap; }
.shul-portal li.shul-sp-popt.is-taken .shul-sp-popt-name { color: var(--shul-muted); font-weight: 500; }
.shul-portal li.shul-sp-plist-none { margin: 0 !important; padding: 10px; font: 400 14px/1.4 var(--shul-sans); color: var(--shul-muted); list-style: none !important; }
.shul-portal .shul-sp-find-field input, .shul-portal .shul-sp-find-field select {
	box-sizing: border-box; width: 100% !important; height: 42px; margin: 0; padding: 0 12px !important;
	border: 1px solid #d8d1c3 !important; border-radius: 9px !important; background: #fff !important;
	color: var(--shul-ink) !important; font: 400 15px var(--shul-sans) !important; letter-spacing: 0; text-transform: none; box-shadow: none !important;
}
.shul-portal .shul-sp-find-field input:focus, .shul-portal .shul-sp-find-field select:focus {
	outline: none; border-color: var(--shul-tekhelet-2) !important; box-shadow: 0 0 0 3px rgba(58, 107, 170, .18) !important;
}
.shul-portal label.shul-sp-open-toggle { flex: 0 1 auto; min-height: 42px; padding: 0 2px; }
.shul-portal .shul-sp-open-toggle input { width: 18px !important; height: 18px !important; margin: 0 !important; accent-color: var(--shul-green); }
.shul-portal .shul-sp-months {
	display: flex; gap: 6px; margin-top: 12px; padding-top: 12px; border-top: 1px dashed var(--shul-line);
	overflow-x: auto; scrollbar-width: thin; -webkit-overflow-scrolling: touch;
}
.shul-portal a.shul-sp-month-chip {
	flex: 0 0 auto; padding: 5px 12px; border-radius: 999px; background: var(--shul-paper-2);
	color: var(--shul-tekhelet) !important; font: 600 13px/1.3 var(--shul-sans); text-decoration: none !important; white-space: nowrap;
}
.shul-portal a.shul-sp-month-chip:hover, .shul-portal a.shul-sp-month-chip:focus-visible { background: #e3ebf5; outline: none; }
.shul-portal .shul-sp-week.is-target { border-color: var(--shul-gold); box-shadow: 0 0 0 4px rgba(176, 138, 62, .35), var(--shul-shadow); transition: box-shadow .3s ease; }
.shul-portal .shul-sp-cal.is-open-only .shul-sp-week:not([data-open]),
.shul-portal .shul-sp-cal.is-open-only .shul-sp-month.is-empty,
.shul-portal .shul-sp-cal.is-open-only .shul-sp-more-wrap { display: none !important; }
.shul-portal .shul-sp-none { margin: 12px 0; font-size: 14.5px; color: var(--shul-muted); }
@media (max-width: 640px) {
	.shul-portal .shul-sp-find { padding: 12px; }
	.shul-portal label.shul-sp-find-field, .shul-portal div.shul-sp-find-field { flex-basis: 100%; }
	.shul-portal ul.shul-sp-plist { max-height: 46vh; }
	.shul-portal .shul-sp-find-field input.shul-sp-pq { font-size: 16px !important; } /* no iOS zoom on focus */
}.shul-portal .shul-sp-type-taken { display: none; margin-left: auto; font-size: 12px; font-weight: 700; color: #9a5d06; white-space: nowrap; }
.shul-portal label.shul-sp-type-opt.is-taken { background: var(--shul-paper-2); border-style: dashed; cursor: not-allowed; }
.shul-portal label.shul-sp-type-opt.is-taken .shul-sp-type-name { color: var(--shul-muted); text-decoration: line-through; }
.shul-portal label.shul-sp-type-opt.is-taken .shul-sp-type-price { display: none; }
.shul-portal label.shul-sp-type-opt.is-taken .shul-sp-type-taken { display: inline; }
/* --- Reserve right on the card (v1.159.1) --- */
.shul-portal .shul-sp-lead { margin: -4px 0 14px; font-size: 14.5px; color: var(--shul-muted); }
.shul-portal details.shul-sp-reserve { margin: 0; }
.shul-portal details.shul-sp-reserve > summary { list-style: none !important; cursor: pointer; }
.shul-portal details.shul-sp-reserve > summary::-webkit-details-marker { display: none; }
.shul-portal details.shul-sp-reserve > summary::marker { content: ""; }
.shul-portal details.shul-sp-reserve[open] > summary .shul-sp-btn { background: var(--shul-paper-2) !important; color: var(--shul-tekhelet) !important; box-shadow: inset 0 0 0 1.5px var(--shul-tekhelet-2) !important; }
.shul-portal details.shul-sp-reserve[open] > summary .shul-sp-btn::after { content: " ✕"; font-size: 11px; }
.shul-portal .shul-sp-quick { margin-top: 10px; }
.shul-portal .shul-sp-quick .shul-sp-field input[type="text"] { height: 40px; }
.shul-portal .shul-sp-quick > .shul-sp-btn { justify-self: start; }

/* --- The full form, folded under the calendar --- */
.shul-portal details.shul-sp-request { padding: 0; margin-top: 26px; }
.shul-portal details.shul-sp-request > summary.shul-sp-request-sum {
	list-style: none !important; cursor: pointer; display: flex; flex-direction: column; gap: 2px; padding: 16px 20px;
	font-family: var(--shul-serif); font-size: 18px; font-weight: 600; color: var(--shul-tekhelet);
}
.shul-portal details.shul-sp-request > summary.shul-sp-request-sum::-webkit-details-marker { display: none; }
.shul-portal details.shul-sp-request > summary.shul-sp-request-sum::marker { content: ""; }
.shul-portal details.shul-sp-request > summary.shul-sp-request-sum::before { content: "+ "; }
.shul-portal details.shul-sp-request[open] > summary.shul-sp-request-sum::before { content: "– "; }
.shul-portal details.shul-sp-request > summary.shul-sp-request-sum span { font-family: var(--shul-sans); font-size: 13.5px; font-weight: 400; color: var(--shul-muted); }
.shul-portal details.shul-sp-request > .shul-sp-form { padding: 0 20px 18px; }
/* --- Dates to remember (v1.160.0) --- */
.shul-portal .shul-sp-field input[type="date"] {
	box-sizing: border-box; width: 100% !important; height: 44px; margin: 0; padding: 0 12px !important;
	border: 1px solid #d8d1c3 !important; border-radius: 9px !important; background: #fff !important;
	color: var(--shul-ink) !important; font: 400 15px var(--shul-sans) !important; box-shadow: none !important;
}
.shul-portal .shul-sp-dates { margin-top: 26px; }
.shul-portal .shul-sp-dates .shul-sp-mine-row form { margin: 0; }
.shul-portal .shul-sp-date-form {
	display: grid !important; grid-template-columns: 2fr 1fr; gap: 12px 14px; align-items: end; max-width: 680px;
	padding: 16px 18px; background: #fff; border: 1px solid var(--shul-line); border-radius: 14px; box-shadow: var(--shul-shadow);
}
.shul-portal .shul-sp-date-form .shul-sp-check { grid-column: 1 / -1; }
.shul-portal .shul-sp-date-form > .shul-sp-btn { justify-self: start; grid-column: 1 / -1; }
@media (max-width: 640px) { .shul-portal .shul-sp-date-form { grid-template-columns: 1fr; } }
/* Dates to remember, folded (v1.160.0 cross-check: declutter the tab) */
.shul-portal details.shul-sp-dates { margin-top: 14px; }
.shul-portal details.shul-sp-dates > .shul-sp-dates-body { padding: 0 20px 18px; }
.shul-portal .shul-sp-dates .shul-sp-date-form { border: 0; box-shadow: none; padding: 0; margin-top: 6px; }
/* Phones: thumb-sized targets, and My occasions stacks its status under the title (v1.160.0 cross-check). */
@media (max-width: 640px) {
	/* border-box: the padding counts INSIDE the 40px, or a link/summary button grows to 58px. */
	.shul-portal .shul-sp-btn, .shul-portal a.shul-sp-btn, .shul-portal button.shul-sp-btn, .shul-portal summary.shul-sp-btn { box-sizing: border-box !important; min-height: 40px !important; padding: 8px 18px !important; }
	.shul-portal a.shul-sp-month-chip { padding: 10px 14px; }
	.shul-portal details.shul-sp-reserve > summary { padding: 4px 0; }
	.shul-portal .shul-sp-mine-row { flex-wrap: wrap; }
	.shul-portal .shul-sp-mine-main { flex-basis: calc(100% - 64px); }
	.shul-portal .shul-sp-mine-side { flex-direction: row; align-items: center; justify-content: space-between; width: 100%; padding-left: 64px; box-sizing: border-box; }
	.shul-portal .shul-sp-week-foot a { display: inline-block; padding: 8px 0; }
	.shul-portal label.shul-sp-check { min-height: 36px; }
}
/* v1.172.0: the login card on pages a member must be logged in to see (My
   Account, the sponsorship calendar). It is the SAME panel as the members
   page's login box (paper, line, radius, shadow, serif heading, gold rule),
   so every login on the site reads as one design. */
.shul-login-card { max-width: 440px; margin: 24px auto 40px; padding: 26px 28px 22px; background: var(--shul-paper, #faf9f6); border: 1px solid var(--shul-line, #e7e2d8); border-radius: var(--shul-radius, 10px); box-shadow: var(--shul-shadow); }
.shul-login-card .shul-login-kicker { display: inline-block; margin: 0 0 10px; padding-bottom: 6px; border-bottom: 1px solid var(--shul-gold, #b08a3e); font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: var(--shul-gold, #b08a3e); font-weight: 700; }
.shul-login-card h3 { margin: 0 0 6px; font-family: var(--shul-serif); font-size: 26px; color: var(--shul-ink, #1f2a37); }
.shul-login-card .shul-login-intro { margin: 0 0 18px; color: var(--shul-muted, #6c6a60); font-size: 14px; line-height: 1.5; }
.shul-login-card form { display: flex; flex-direction: column; gap: 14px; }
.shul-login-card .shul-pay-button { width: 100%; justify-content: center; text-align: center; }
.shul-login-card .shul-login-new { margin: 18px 0 0; padding-top: 14px; border-top: 1px solid var(--shul-line, #e7e2d8); text-align: center; color: var(--shul-muted, #6c6a60); }
.shul-login-card .shul-login-new a { color: var(--shul-tekhelet-2, #274b75); font-weight: 600; }
@media (max-width: 520px) { .shul-login-card { margin: 12px 0 24px; padding: 20px 18px; } .shul-login-card h3 { font-size: 22px; } }

/* ---------------------------------------------------------------
 * Zmanim cards — [shul_today] and [shul_shabbat] (v1.176.0)
 * ------------------------------------------------------------- */
.shul-portal.shul-zm { max-width: 640px; margin: 0 0 24px; }
.shul-zm-card {
	background: #fff;
	border: 1px solid var(--shul-line);
	border-top: 3px solid var(--shul-gold);
	border-radius: 10px;
	padding: 22px 24px;
	box-shadow: 0 6px 20px rgba(31, 42, 55, 0.06);
}
.shul-portal .shul-zm-head h3 {
	margin: 0 !important;
	padding: 0 !important;
	font-family: var(--shul-serif) !important;
	font-size: 24px !important;
	font-weight: 500 !important;
	line-height: 1.2 !important;
	color: var(--shul-tekhelet) !important;
	border: 0 !important;
}
.shul-portal .shul-zm-date { margin: 4px 0 0 !important; font-size: 15px; color: var(--shul-muted); }
.shul-zm-cols { display: flex; flex-wrap: wrap; gap: 18px 32px; margin-top: 16px; }
.shul-zm-col { flex: 1 1 220px; min-width: 0; }
.shul-portal .shul-zm-col h4 {
	margin: 0 0 6px !important;
	font-family: var(--shul-sans) !important;
	font-size: 12px !important;
	font-weight: 700 !important;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: #7a560c !important;
}
.shul-portal .shul-zm-list { margin: 0 !important; padding: 0 !important; }
.shul-portal .shul-zm-row {
	display: flex;
	justify-content: space-between;
	gap: 12px;
	padding: 8px 0;
	border-top: 1px solid var(--shul-line);
}
.shul-portal .shul-zm-row dt { margin: 0 !important; font-weight: 400 !important; color: var(--shul-ink); }
.shul-portal .shul-zm-row dd { margin: 0 !important; font-weight: 700; white-space: nowrap; font-variant-numeric: tabular-nums; color: var(--shul-ink); }
.shul-zm-big { display: flex; flex-wrap: wrap; gap: 12px 36px; margin: 16px 0 10px; }
.shul-zm-bigitem { display: flex; flex-direction: column; gap: 2px; }
.shul-zm-biglabel { font-size: 12px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: #7a560c; }
.shul-zm-bigtime { font-family: var(--shul-serif); font-size: 30px; line-height: 1.15; color: var(--shul-tekhelet); font-variant-numeric: tabular-nums; }
.shul-portal .shul-zm-note { margin: 10px 0 0 !important; font-size: 14px; color: var(--shul-muted); }
@media (max-width: 640px) {
	.shul-zm-card { padding: 18px 16px; }
	.shul-zm-bigtime { font-size: 26px; }
}