/*
 * The client account, a dashboard: a side menu (a row of tabs on phones) and the section beside it.
 * Builds on blvdc-booking.css (same tokens, buttons, fields, cards, the toast).
 */

.blvdc-account { width: 100%; }

/* ---------- Layout: side menu and section ---------- */

.blvdc-dashboard { display: grid; grid-template-columns: 270px minmax(0, 1fr); gap: 28px; align-items: start; }

.blvdc-side {
	position: sticky;
	top: calc(var(--header-h, 0px) + 16px);
	display: flex;
	flex-direction: column;
	gap: 18px;
	padding: 20px;
	border-radius: var(--blvdc-radius);
	background: var(--blvdc-card);
	box-shadow: var(--blvdc-shadow);
}
.blvdc-me { display: flex; align-items: center; gap: 12px; padding-bottom: 16px; border-bottom: 1px solid var(--blvdc-rule); }
.blvdc-me-initial {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 48px;
	height: 48px;
	border-radius: 50%;
	background: var(--blvdc-dark);
	color: var(--blvdc-on-dark-label);
	font-family: var(--blvdc-heading);
	font-size: 24px;
}
.blvdc-me-text { min-width: 0; }
.blvdc-me-name { margin: 0; font-family: var(--blvdc-heading); font-size: var(--blvdc-fs-h4); line-height: 1.2; }
.blvdc-me-email { margin: 2px 0 0; font-size: 14px; color: var(--blvdc-ink-soft); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.blvdc-nav { display: flex; flex-direction: column; gap: 2px; }
.blvdc-nav a {
	display: flex;
	align-items: center;
	gap: 12px;
	min-height: 44px;
	padding: 8px 12px;
	border-radius: var(--blvdc-radius-small);
	color: var(--blvdc-ink);
	font-size: var(--blvdc-fs-small);
	text-decoration: none;
	transition: background .15s ease;
}
.blvdc-nav a:hover { background: var(--blvdc-surface-soft); }
.blvdc-nav a.is-current { background: var(--blvdc-dark); color: var(--blvdc-on-dark); }
.blvdc-nav svg { width: 22px; height: 22px; flex-shrink: 0; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linejoin: round; stroke-linecap: round; }
.blvdc-nav-name { flex: 1; }

/* A count of things waiting: dark on bright gold, the same in the header. */
.blvdc-badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 22px;
	height: 22px;
	padding: 0 6px;
	border-radius: 999px;
	background: var(--gold-bright, #e8cb3d);
	color: var(--blvdc-dark);
	font-size: 12px;
	font-weight: 700;
}

.blvdc-side-actions { display: flex; flex-direction: column; align-items: stretch; gap: 12px; padding-top: 16px; border-top: 1px solid var(--blvdc-rule); }
.blvdc-side-actions .blvdc-link { align-self: center; }

.blvdc-account-panel {
	min-width: 0;
	min-height: 420px;
	padding: clamp(22px, 3vw, 36px);
	border-radius: var(--blvdc-radius);
	background: var(--blvdc-card);
	box-shadow: var(--blvdc-shadow);
}

.blvdc-section-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin: 0 0 20px; }
.blvdc-section-title { font-family: var(--blvdc-heading); font-size: var(--blvdc-fs-h3); font-weight: 400; line-height: 1.15; margin: 0 0 18px; }
.blvdc-section-head .blvdc-section-title { margin: 0; }
.blvdc-section-title ~ .blvdc-section-title { margin-top: 44px; }
.blvdc-account .blvdc-actions-start { justify-content: flex-start; margin-top: 32px; }


/* ---------- Overview ---------- */

.blvdc-home-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; margin: 0 0 28px; }
.blvdc-home-hello { font-family: var(--blvdc-heading); font-size: var(--blvdc-fs-h3); font-weight: 400; margin: 0; }
.blvdc-home-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.blvdc-home-block { margin: 0 0 30px; }
.blvdc-home-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.blvdc-home-grid .blvdc-home-block { margin: 0; }
.blvdc-tile { height: calc(100% - 28px); padding: 20px; border: 1px solid var(--blvdc-rule); border-radius: var(--blvdc-radius); }
.blvdc-tile-title { margin: 0 0 4px; font-family: var(--blvdc-heading); font-size: var(--blvdc-fs-h4); }
.blvdc-tile-meta { display: block; margin: 0 0 12px; font-size: var(--blvdc-fs-small); color: var(--blvdc-ink-soft); line-height: 1.45; }

.blvdc-todo { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.blvdc-todo-row { display: flex; align-items: center; gap: 14px; padding: 14px 16px; border-radius: var(--blvdc-radius); background: var(--blvdc-surface-soft); }
.blvdc-todo-icon { display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; width: 42px; height: 42px; border-radius: 50%; background: var(--gold-bright, #e8cb3d); color: var(--blvdc-dark); }
.blvdc-todo-icon svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linejoin: round; stroke-linecap: round; }
.blvdc-todo-text { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; }
.blvdc-todo-title { font-weight: 600; }
.blvdc-todo-meta { font-size: var(--blvdc-fs-small); color: var(--blvdc-ink-soft); }

.blvdc-people-mini { list-style: none; margin: 0 0 12px; padding: 0; display: grid; gap: 12px; }
.blvdc-people-mini li { display: flex; align-items: center; gap: 12px; }
.blvdc-people-mini .blvdc-avatar { width: 44px; height: 44px; font-size: 18px; }
.blvdc-people-mini-text { display: flex; flex-direction: column; flex: 1; min-width: 0; }
.blvdc-people-mini-name { font-weight: 600; font-size: var(--blvdc-fs-small); }
.blvdc-people-mini .blvdc-tile-meta { margin: 0; font-size: 14px; }


/* ---------- Appointments ---------- */

.blvdc-viewbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin: 0 0 20px; }
.blvdc-viewbar-right { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
/*
 * Switches (Upcoming / Past, List / By provider): square buttons side by side, every button in a
 * group exactly as wide as the widest and 46px tall, like the sort menu beside them. Choosing one
 * only changes its colors, never its size. No frame behind them.
 */
.blvdc-segment { display: inline-grid; grid-auto-flow: column; grid-auto-columns: 1fr; gap: 0; padding: 0; background: none; }
.blvdc-segment button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	box-sizing: border-box;
	height: 46px;
	min-width: 132px;
	margin: 0;
	padding: 0 18px;
	border: 1px solid var(--blvdc-ink);
	border-radius: 0;
	background: var(--blvdc-card);
	color: var(--blvdc-ink);
	font-family: var(--blvdc-ui);
	font-size: var(--blvdc-fs-button);
	font-weight: 400;
	line-height: 1;
	letter-spacing: .06em;
	text-transform: uppercase;
	white-space: nowrap;
	cursor: pointer;
}
.blvdc-segment button + button { border-left: 0; }
.blvdc-segment button:hover { background: var(--blvdc-surface-soft); }
.blvdc-segment button[aria-pressed='true'] { background: var(--blvdc-dark); color: var(--blvdc-on-dark); }
.blvdc-segment-count { font-family: var(--blvdc-text); font-size: 13px; letter-spacing: 0; }
.blvdc-account .blvdc-sort select { box-sizing: border-box; height: 46px; min-width: 170px; padding: 0 36px 0 16px; border: 1px solid var(--blvdc-ink); border-radius: 0; background-color: var(--blvdc-card); background-position: calc(100% - 20px) 50%, calc(100% - 15px) 50%; font-size: var(--blvdc-fs-small); }
.blvdc-account .blvdc-sort select:focus { border: 1px solid var(--blvdc-ink); padding: 0 36px 0 16px; }

.blvdc-appointments { display: grid; gap: 14px; }
.blvdc-appointment { display: grid; grid-template-columns: 78px minmax(0, 1fr); gap: 20px; padding: 20px; border: 1px solid var(--blvdc-rule); border-radius: var(--blvdc-radius); background: var(--blvdc-card); }
.blvdc-appointment.is-next { border-color: var(--blvdc-accent); box-shadow: inset 0 0 0 1px var(--blvdc-accent); }
.blvdc-appt-date { display: flex; flex-direction: column; align-items: center; justify-content: center; align-self: start; padding: 8px 0 10px; border-radius: var(--blvdc-radius-small); background: var(--blvdc-dark); color: var(--blvdc-on-dark); text-align: center; }
.blvdc-appointment.is-past .blvdc-appt-date,
.blvdc-appointment.is-cancelled .blvdc-appt-date { background: var(--blvdc-surface-soft); color: var(--blvdc-ink); }
.blvdc-appt-month,
.blvdc-appt-weekday { font-family: var(--blvdc-ui); font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.blvdc-appt-month { color: var(--blvdc-on-dark-label); }
.blvdc-appointment.is-past .blvdc-appt-month,
.blvdc-appointment.is-cancelled .blvdc-appt-month { color: var(--blvdc-link); }
/* Lining figures: the heading font's old-style "9" sits low and leaves a gap above it. */
.blvdc-appt-day { font-family: var(--blvdc-heading); font-size: 34px; line-height: 1; margin: 2px 0 4px; font-variant-numeric: lining-nums; font-feature-settings: 'lnum' 1; }
.blvdc-appt-body { min-width: 0; }
.blvdc-appointment.is-cancelled .blvdc-appointment-when { text-decoration: line-through; }
.blvdc-appointment-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 8px 16px; }
.blvdc-appointment-when { font-family: var(--blvdc-heading); font-size: var(--blvdc-fs-h4); font-weight: 400; margin: 0; }
.blvdc-tag { font-family: var(--blvdc-ui); font-size: var(--blvdc-fs-label); font-weight: 700; letter-spacing: var(--blvdc-tracking); text-transform: uppercase; padding: 4px 10px; border-radius: 999px; background: var(--blvdc-dark); color: var(--blvdc-on-dark); }
.blvdc-appointment-where { margin: 6px 0 12px; font-size: var(--blvdc-fs-small); line-height: 1.5; color: var(--blvdc-ink-soft); }
.blvdc-appt-services { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.blvdc-appt-service { display: flex; align-items: center; gap: 12px; }
.blvdc-appt-service .blvdc-avatar { width: 40px; height: 40px; font-size: 16px; }
.blvdc-appt-service-text { display: flex; flex-direction: column; }
.blvdc-appt-service-name { font-weight: 600; }
.blvdc-appointment-note { margin: 14px 0 0; font-size: var(--blvdc-fs-body); line-height: 1.5; }
.blvdc-note-attention { padding: 10px 14px; border-radius: var(--blvdc-radius-small); background: var(--blvdc-surface-soft); }
.blvdc-appointment-actions { justify-content: flex-start; margin-top: 16px; gap: 8px; }
.blvdc-appointment-actions:not(:has(> :not([hidden]))) { display: none; }
.blvdc-appointment-panel { margin-top: 20px; padding-top: 20px; border-top: 1px solid var(--blvdc-rule); }
.blvdc-appointment-panel h4 { margin-bottom: 14px; }
.blvdc-appointment-panel .blvdc-actions { justify-content: flex-start; margin-top: 18px; }
.blvdc-confirm-box { margin-top: 20px; padding: 16px 18px; border-radius: var(--blvdc-radius-small); background: var(--blvdc-surface-soft); }
.blvdc-confirm-box p { margin: 0; font-size: var(--blvdc-fs-body); line-height: 1.5; }

.blvdc-appt-group { margin: 0 0 26px; }
.blvdc-appt-group-head { display: flex; align-items: center; gap: 14px; margin: 0 0 12px; }
.blvdc-appt-group-head > div { flex: 1; min-width: 0; }
.blvdc-appt-group-name { font-family: var(--blvdc-heading); font-size: var(--blvdc-fs-h4); font-weight: 400; margin: 0; }
.blvdc-appt-group-meta { margin: 2px 0 0; font-size: var(--blvdc-fs-small); color: var(--blvdc-ink-soft); }
.blvdc-avatar-large { width: 64px; height: 64px; font-size: 26px; }


/* ---------- Memberships, packages, cards ---------- */

.blvdc-card-list { list-style: none; margin: 0 0 16px; padding: 0; display: grid; gap: 10px; }
.blvdc-card-row { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px 16px; padding: 16px 18px; border: 1px solid var(--blvdc-rule); border-radius: var(--blvdc-radius); background: var(--blvdc-card); font-size: var(--blvdc-fs-body); }
.blvdc-card-row.is-expired .blvdc-card-label { text-decoration: line-through; }
.blvdc-card-meta { font-size: var(--blvdc-fs-small); color: var(--blvdc-ink-soft); }
.blvdc-card-row.blvdc-package { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 16px; align-items: center; }
.blvdc-package .blvdc-card-label { grid-column: 1; }
.blvdc-package .blvdc-card-meta { grid-column: 1; }
.blvdc-package .blvdc-btn { grid-column: 2; grid-row: 1 / span 2; min-height: 46px; padding: 0 18px; }
.blvdc-card-row.blvdc-card-saved { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 16px; align-items: center; }
.blvdc-card-saved .blvdc-card-label, .blvdc-card-saved .blvdc-card-meta { grid-column: 1; }
.blvdc-card-saved .blvdc-btn { grid-column: 2; grid-row: 1 / span 2; min-height: 46px; padding: 0 18px; }
.blvdc-account form[data-form="add-card"] { margin-top: 32px; padding-top: 28px; border-top: 1px solid var(--blvdc-rule); }


/* ---------- Rating a visit: five large stars ---------- */

.blvdc-stars { border: 0; margin: 0 0 18px; padding: 0; display: flex; gap: 6px; }
.blvdc-star { position: relative; cursor: pointer; font-size: 34px; line-height: 1; color: var(--blvdc-rule); }
.blvdc-star input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.blvdc-star:has(input:focus-visible) { outline: 2px solid var(--blvdc-accent); outline-offset: 2px; }
/* Light up the chosen star and every star before it; hovering previews the same way. */
.blvdc-stars:has(input:checked) .blvdc-star { color: var(--blvdc-accent); }
.blvdc-stars .blvdc-star:has(input:checked) ~ .blvdc-star { color: var(--blvdc-rule); }
.blvdc-stars:hover .blvdc-star { color: var(--blvdc-accent); }
.blvdc-stars .blvdc-star:hover ~ .blvdc-star { color: var(--blvdc-rule); }
.blvdc-stars:has(.is-invalid) .blvdc-star { color: var(--blvdc-error); }
.blvdc-rate .blvdc-field { max-width: 560px; }


/* ---------- Forms ---------- */

.blvdc-form-fill .blvdc-back { margin-bottom: 18px; }
.blvdc-form-fill .blvdc-lead { margin: -6px 0 24px; }
.blvdc-form-fields { display: grid; gap: 26px; max-width: 680px; }
.blvdc-form-heading { font-family: var(--blvdc-heading); font-size: var(--blvdc-fs-h4); font-weight: 400; margin: 12px 0 0; }
.blvdc-form-text p { margin: 0 0 10px; font-size: var(--blvdc-fs-body); line-height: 1.55; }
.blvdc-form-rule { border: 0; border-top: 1px solid var(--blvdc-rule); margin: 4px 0; width: 100%; }
.blvdc-form-fields .blvdc-question-control { display: grid; gap: 8px; }
.blvdc-form-fields textarea,
.blvdc-form-fields select[multiple] { width: 100%; }
.blvdc-form-other { margin-top: 4px; }
.blvdc-form-note { margin: 0; font-size: var(--blvdc-fs-body); line-height: 1.5; }
.blvdc-signature { font-family: var(--blvdc-heading); font-size: var(--blvdc-fs-h4); }
.blvdc-photo-pick { justify-self: start; cursor: pointer; }
.blvdc-photo-pick:has(input:focus-visible) { outline: 2px solid var(--blvdc-accent); outline-offset: 2px; }
.blvdc-photo-name:empty { display: none; }
.blvdc-question[data-type='photo'] .blvdc-link { justify-self: start; }


/* ---------- Providers ---------- */

.blvdc-providers { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 16px; }
.blvdc-provider { display: flex; flex-direction: column; gap: 10px; padding: 22px; border: 1px solid var(--blvdc-rule); border-radius: var(--blvdc-radius); background: var(--blvdc-card); text-align: center; align-items: center; }
.blvdc-provider-head { display: flex; flex-direction: column; align-items: center; gap: 6px; }
.blvdc-provider-head .blvdc-avatar { width: 96px; height: 96px; font-size: 34px; margin-bottom: 6px; }
.blvdc-provider-name { font-family: var(--blvdc-heading); font-size: var(--blvdc-fs-h4); font-weight: 400; margin: 0; }
.blvdc-provider-role { margin: 0; font-size: var(--blvdc-fs-small); color: var(--blvdc-ink-soft); }
.blvdc-provider-role:empty { display: none; }
.blvdc-provider-meta { margin: 0 0 auto; font-size: var(--blvdc-fs-small); line-height: 1.5; }
.blvdc-provider-meta:empty { display: none; }
.blvdc-provider .blvdc-btn { margin-top: 6px; align-self: center; } /* the card is centered; its button too (not stretched) */
.blvdc-fav {
	display: inline-flex; align-items: center; gap: 6px; flex-shrink: 0;
	padding: 6px 0; border: 0; background: none; cursor: pointer;
	font-family: var(--blvdc-ui); font-size: var(--blvdc-fs-label); font-weight: 700; letter-spacing: var(--blvdc-tracking); text-transform: uppercase; color: var(--blvdc-ink);
}
.blvdc-fav-icon { width: 18px; height: 18px; background: currentColor; -webkit-mask: var(--blvdc-heart) center / contain no-repeat; mask: var(--blvdc-heart) center / contain no-repeat; }
.blvdc-fav { --blvdc-heart: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Cpath d='M12 21s-7.5-4.6-9.6-9.2C.9 8.4 3 4.5 6.7 4.5c2.2 0 3.6 1.2 4.4 2.4h1.8c.8-1.2 2.2-2.4 4.4-2.4 3.7 0 5.8 3.9 4.3 7.3C19.5 16.4 12 21 12 21z'/%3E%3C/svg%3E"); }
.blvdc-fav[aria-pressed='true'] { --blvdc-heart: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M12 21s-7.5-4.6-9.6-9.2C.9 8.4 3 4.5 6.7 4.5c2.2 0 3.6 1.2 4.4 2.4h1.8c.8-1.2 2.2-2.4 4.4-2.4 3.7 0 5.8 3.9 4.3 7.3C19.5 16.4 12 21 12 21z'/%3E%3C/svg%3E"); }
.blvdc-fav[aria-pressed='true'] .blvdc-fav-icon { background: var(--blvdc-accent); }
.blvdc-provider.is-favorite { border-color: var(--blvdc-accent); box-shadow: inset 0 0 0 1px var(--blvdc-accent); }


/* ---------- Refer a friend ---------- */

.blvdc-ref-code { margin: 18px 0 0; font-size: var(--blvdc-fs-h4); font-family: var(--blvdc-heading); }
.blvdc-ref-code .blvdc-label { display: block; margin-bottom: 6px; font-family: var(--blvdc-ui); }
.blvdc-ref-link { margin: 14px 0 0; font-size: var(--blvdc-fs-body); word-break: break-all; }
.blvdc-account .blvdc-ref-code + .blvdc-actions-start { margin-top: 20px; }
.blvdc-ref-title { margin: 44px 0 14px; }


/* ---------- Narrower screens ---------- */

@media (max-width: 1000px) {
	.blvdc-dashboard { grid-template-columns: minmax(0, 1fr); gap: 16px; }

	/* The side menu becomes a row of tabs that scrolls sideways, kept in view under the header. */
	.blvdc-side { position: sticky; top: var(--header-h, 0px); z-index: 5; gap: 0; padding: 8px; margin: 0 -16px; border-radius: 0; }
	.blvdc-me,
	.blvdc-side-actions { display: none; }
	.blvdc-nav { flex-direction: row; gap: 6px; overflow-x: auto; scrollbar-width: none; padding: 2px 8px; }
	.blvdc-nav::-webkit-scrollbar { display: none; }
	.blvdc-nav a { flex-shrink: 0; gap: 8px; min-height: 42px; padding: 6px 14px; border: 1px solid var(--blvdc-rule); border-radius: 999px; white-space: nowrap; }
	.blvdc-nav svg { width: 18px; height: 18px; }
}

@media (max-width: 700px) {
	.blvdc-account-panel { padding: 20px 16px; margin: 0 -4px; }
	.blvdc-home-grid { grid-template-columns: minmax(0, 1fr); }
	.blvdc-home-actions { width: 100%; }
	.blvdc-home-actions .blvdc-btn { flex: 1 1 100%; }
	.blvdc-viewbar,
	.blvdc-viewbar-right { width: 100%; }
	.blvdc-viewbar .blvdc-segment { display: grid; width: 100%; }
	.blvdc-viewbar .blvdc-segment button { min-width: 0; }
	.blvdc-viewbar .blvdc-sort { width: 100%; }
	.blvdc-appointment { grid-template-columns: 60px minmax(0, 1fr); gap: 14px; padding: 16px; }
	.blvdc-appt-day { font-size: 28px; }
	.blvdc-appointment-actions .blvdc-btn { flex: 1 1 100%; white-space: nowrap; }
	.blvdc-todo-row { flex-wrap: wrap; }
	.blvdc-todo-row .blvdc-btn { width: 100%; }
	.blvdc-provider { padding: 18px 16px; }
	.blvdc-star { font-size: 38px; }
}

/* Signed out: the sign-in on a card of its own, in the middle of the page. */
.blvdc-account-signin { max-width: 620px; margin-left: auto; margin-right: auto; padding: clamp(22px, 3vw, 36px); border-radius: var(--blvdc-radius); background: var(--blvdc-card); box-shadow: var(--blvdc-shadow); }
@media (max-width: 700px) { .blvdc-account-signin { padding: 20px 16px; margin: 0 -4px; } }

/* Membership: one wide card, its name on one line, its buttons side by side. */
.blvdc-appointment.blvdc-membership { display: block; padding: 22px 24px; }
.blvdc-membership .blvdc-appointment-head { align-items: center; }
.blvdc-membership .blvdc-appointment-actions { flex-wrap: wrap; }
.blvdc-membership .blvdc-appointment-actions .blvdc-btn { flex: 0 0 auto; }

/* Sentences in the account run the width of their section. */
.blvdc-account .blvdc-lead { max-width: none; }

/* Payment cards: "Add a card" is a section of its own. */
.blvdc-account form[data-form="add-card"] { margin-top: 44px; padding-top: 36px; }
.blvdc-account form[data-form="add-card"] .blvdc-section-title { margin-bottom: 22px; }

/* Gift cards sent: a small card in its design colors, then to whom and when. */
.blvdc-gifts { display: grid; gap: 12px; }
.blvdc-gift-row { display: flex; align-items: center; gap: 18px; padding: 16px 18px; border: 1px solid var(--blvdc-rule); border-radius: var(--blvdc-radius); background: var(--blvdc-card); }
.blvdc-gift-mini { display: flex; align-items: flex-end; flex-shrink: 0; width: 112px; height: 70px; padding: 8px 10px; border-radius: 8px; background: var(--blvdc-accent-fill) center / cover no-repeat; color: var(--blvdc-on-accent); box-shadow: 0 4px 12px rgba(61, 49, 40, .15); }
.blvdc-gift-mini-amount { font-family: var(--blvdc-heading); font-size: 22px; line-height: 1; }
.blvdc-gift-row-text { flex: 1; min-width: 0; }
.blvdc-gift-row-title { margin: 0 0 4px; font-family: var(--blvdc-heading); font-size: var(--blvdc-fs-h4); font-weight: 400; }
.blvdc-gift-row-meta { margin: 0; font-size: var(--blvdc-fs-small); color: var(--blvdc-ink-soft); line-height: 1.5; }
@media (max-width: 700px) {
	.blvdc-gift-row { flex-wrap: wrap; }
	.blvdc-gift-mini { width: 96px; height: 60px; }
}

/* Signed out: the page is just the sign-in, so its title, the practice note and the card sit in the middle. */
.blvdc-page:has(.blvdc-account-signin:not([hidden])) .blvdc-page-title { text-align: center; }
.blvdc-account:has(.blvdc-account-signin:not([hidden])) .blvdc-practice { display: table; margin-left: auto; margin-right: auto; }
@media (max-width: 1000px) { .blvdc-nav a { border-radius: 0; } }

/* Square, like the rest of the site's buttons. */
.blvdc-segment,
.blvdc-segment button,
.blvdc-account .blvdc-sort select,
.blvdc-tag { border-radius: 0; }