.auth-page { background: radial-gradient(circle at 20% 20%, rgb(var(--rose-rgb) / 12%), transparent 28rem), radial-gradient(circle at 85% 70%, rgb(var(--mauve-rgb) / 16%), transparent 30rem), var(--canvas); }
.auth-shell { width: min(100% - 2rem, 68rem); min-height: 100vh; display: grid; align-items: center; gap: 2rem; margin: auto; padding: 2rem 0; }
.auth-brand { display: flex; align-items: center; gap: 1rem; }.auth-brand strong, .auth-brand > div > span { display: block; }.auth-brand strong { font-size: 1.1rem; }.auth-brand > div > span { color: var(--ink-soft); font-size: .85rem; }
.auth-card { width: 100%; max-width: 29rem; justify-self: center; padding: clamp(1.3rem, 6vw, 2.5rem); background: rgb(var(--surface-rgb) / 92%); border: 1px solid var(--line); border-radius: var(--radius-xl); box-shadow: var(--shadow-md); backdrop-filter: blur(18px); }
.auth-links { display: grid; gap: 1rem; margin-top: 1.25rem; text-align: center; font-size: .85rem; }
.onboarding-shell { width: min(100% - 2rem, 70rem); display: grid; gap: 2rem; align-items: start; margin: auto; padding: 2rem 0; }.onboarding-intro { padding-top: 2rem; }.onboarding-intro .brand-mark { margin-bottom: 2rem; }.onboarding-intro p { max-width: 30rem; color: var(--ink-soft); }.onboarding-form { display: grid; gap: 1.5rem; }.onboarding-step { display: grid; gap: 1rem; min-width: 0; padding: 0 0 1.5rem; border: 0; border-bottom: 1px solid var(--line); }.onboarding-step legend { display: flex; gap: .65rem; align-items: center; margin-bottom: 1rem; color: var(--ink); font-size: 1.05rem; font-weight: 750; }.onboarding-step legend span { display: grid; width: 1.8rem; height: 1.8rem; place-items: center; border-radius: 50%; background: var(--blush-100); color: var(--plum-800); font-size: .82rem; }
.today-hero { display: flex; align-items: end; justify-content: space-between; gap: 1rem; margin-bottom: var(--space-5); }
.stat-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .7rem; }
.stat-card { position: relative; min-width: 0; overflow: hidden; padding: .95rem; background: linear-gradient(145deg, var(--surface-raised), var(--surface)); border: 1px solid var(--line); border-radius: var(--radius-md); box-shadow: var(--shadow-sm); }.stat-card::after { content: ""; position: absolute; inset: auto 0 0; height: 2px; background: var(--accent-gradient); opacity: .7; }.stat-card span { display: block; color: var(--ink-soft); font-size: .72rem; font-weight: 700; }.stat-card strong { display: block; overflow: hidden; margin-top: .25rem; font-size: clamp(1.15rem, 5vw, 1.7rem); text-overflow: ellipsis; }.stat-card.success { background: linear-gradient(145deg, #e8f3eb, #f3f9f4); border-color: #cce2d2; }.stat-card.warning { background: linear-gradient(145deg, #fff3dc, #fff8eb); border-color: #efdbb6; }
.content-grid { display: grid; gap: 1.5rem; }.content-grid aside { display: grid; align-content: start; gap: 1rem; }
.timeline-list, .agenda { display: grid; gap: .7rem; }
.appointment-card { position: relative; min-height: 100px; display: grid; grid-template-columns: 4rem 1fr; gap: 1rem; align-items: start; padding: 1rem; background: linear-gradient(145deg, var(--surface-raised), var(--surface)); border: 1px solid var(--line); border-left: 3px solid var(--accent-mauve); border-radius: var(--radius-md); box-shadow: var(--shadow-sm); transition: transform .15s ease, border-color .15s ease; }.appointment-card:hover { transform: translateY(-2px); border-color: var(--line-strong); }.appointment-time strong, .appointment-time span { display: block; }.appointment-time strong { color: var(--accent-text); }.appointment-time span { color: var(--ink-soft); font-size: .76rem; }.appointment-main p { margin-bottom: .5rem; color: var(--ink-soft); font-size: .85rem; }.card-link { position: absolute; inset: 0; border-radius: inherit; }
.client-alert { width: fit-content; padding: .28rem .48rem; border-radius: .4rem; background: var(--amber-100); color: var(--amber-700); font-size: .7rem; font-weight: 750; }
.side-card { padding: 1.1rem; }.side-card h2 { margin: 0 .2rem .8rem; }.side-card .list-row { padding: .85rem .2rem; }.side-card .empty-inline { padding: 1.25rem .2rem; }
.reminder-card { display: flex; gap: .75rem; padding: 1rem; }.reminder-card p { margin: .2rem 0 0; color: var(--ink-soft); font-size: .8rem; }.accent-dot { width: .7rem; height: .7rem; flex: 0 0 auto; margin-top: .35rem; background: #d49730; border-radius: 50%; box-shadow: 0 0 0 5px var(--amber-100); }
.commission-card { scroll-margin-top: 5rem; }.commission-card .detail-list { margin-top: .35rem; }.team-performance { margin-top: 1.5rem; }.team-performance-row { display: grid; gap: .6rem; padding: 1rem; border-bottom: 1px solid var(--line); }.team-performance-row:last-child { border-bottom: 0; }.team-performance-row small { display: block; margin-top: .2rem; color: var(--ink-soft); }.team-performance-money { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6rem; }.team-performance-money span { color: var(--ink-soft); font-size: .75rem; }.team-performance-money strong { display: block; margin-top: .15rem; color: var(--ink); font-size: 1rem; }.roster-grid { display: grid; gap: .75rem; }.roster-day { min-width: 0; overflow: hidden; }.roster-day.is-today { border-color: var(--focus); box-shadow: 0 0 0 2px rgb(var(--rose-rgb) / 10%); }.roster-day > header { display: flex; align-items: center; justify-content: space-between; gap: .75rem; padding: .8rem 1rem; background: var(--surface-inset); border-bottom: 1px solid var(--line); }.roster-day > header span, .roster-day > header strong { display: block; }.roster-day > header span { color: var(--ink-soft); font-size: .68rem; font-weight: 750; text-transform: uppercase; }.roster-day > header small { color: var(--ink-soft); white-space: nowrap; }.roster-events { display: grid; }.roster-event { display: grid; grid-template-columns: 3.2rem minmax(0, 1fr); column-gap: .55rem; padding: .7rem 1rem; color: var(--ink); border-bottom: 1px solid var(--line); text-decoration: none; }.roster-event:last-child { border-bottom: 0; }.roster-event > span { grid-row: 1 / span 2; color: var(--accent-text); font-weight: 800; }.roster-event > strong, .roster-event > small { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.roster-event > small { color: var(--ink-soft); font-size: .72rem; }.roster-block { background: var(--amber-100); }.roster-empty { padding: .8rem 1rem; color: var(--ink-soft); font-size: .8rem; }
.search-form { position: relative; margin-bottom: .85rem; }.search-form input { padding-left: 1rem !important; min-height: 50px !important; border-radius: var(--radius-md) !important; box-shadow: var(--shadow-sm); }
.client-hero { margin-bottom: 1.25rem; }.client-title { display: flex; align-items: center; gap: 1rem; margin-bottom: 1.2rem; }.client-title h1 { margin-bottom: .25rem; }.client-title p { margin: 0; color: var(--ink-soft); }
.treatment-history { border-top: 1px solid var(--line); padding: .9rem .2rem; }.treatment-history:first-of-type { border-top: 0; }.treatment-history small { display: block; }.photo-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6rem; margin-top: .75rem; }.photo-grid figure { margin: 0; }.photo-grid img { width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: var(--radius-sm); display: block; }.photo-grid figcaption { display: flex; justify-content: space-between; align-items: center; gap: .35rem; font-size: .75rem; margin-top: .3rem; }.photo-grid form { margin: 0; }.link-danger { border: 0; background: transparent; color: var(--danger); padding: .2rem; cursor: pointer; }
.client-safety { display: block; padding: 1rem 1.1rem; margin-bottom: 1rem; background: var(--amber-100); color: var(--amber-700); border: 1px solid #ddc79f; border-radius: var(--radius-md); text-decoration: none; }.client-safety p { margin: .4rem 0 0; font-size: .84rem; }.compact-safety { display: flex; justify-content: space-between; gap: 1rem; }
.detail-list { margin: 0; }.detail-list div { display: flex; justify-content: space-between; gap: 1rem; padding: .65rem .3rem; border-bottom: 1px solid var(--line); }.detail-list div:last-child { border: 0; }.detail-list dt { color: var(--ink-soft); }.detail-list dd { margin: 0; font-weight: 700; }
.care-profile-grid { display: grid; gap: .7rem; margin-bottom: 1rem; }.care-profile-card { min-height: 76px; display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem; color: var(--ink); text-decoration: none; background: var(--surface); border: 1px solid var(--line); border-left: 4px solid var(--plum-600); border-radius: var(--radius-md); box-shadow: var(--shadow-sm); }.care-profile-card span:first-child { min-width: 0; }.care-profile-card strong, .care-profile-card small { display: block; }.care-profile-card small { margin-top: .2rem; color: var(--ink-soft); }.full-card-disclosure { margin: 1rem 0; padding: 1rem; }.full-card-disclosure summary { cursor: pointer; color: var(--accent-text); font-weight: 800; }.full-card-disclosure[open] summary { margin-bottom: .75rem; }.full-card-disclosure dd { max-width: 60%; overflow-wrap: anywhere; text-align: right; }
.date-strip { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: .15rem; margin-bottom: 1rem; }.date-strip a { min-width: 0; min-height: 60px; display: grid; place-items: center; align-content: center; padding: .35rem .15rem; color: var(--ink-soft); border-radius: .75rem; text-decoration: none; }.date-strip a[aria-current="date"] { background: var(--plum-950); color: white; box-shadow: var(--shadow-sm); }.date-strip span { font-size: .62rem; text-transform: uppercase; }.date-strip strong { font-size: 1.05rem; }
.workflow-card { display: grid; gap: 0; margin-bottom: 1rem; padding: .5rem 1rem; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-lg); }.workflow-step { display: grid; grid-template-columns: 2.4rem 1fr; gap: .8rem; padding: 1rem 0; border-bottom: 1px solid var(--line); }.workflow-step:last-child { border: 0; }.workflow-step > span { width: 2rem; height: 2rem; display: grid; place-items: center; background: var(--blush-100); color: var(--accent-text); border-radius: 50%; font-weight: 800; }.workflow-step strong, .workflow-step a, .workflow-step small { display: block; }.workflow-step a, .workflow-step small { margin-top: .18rem; font-size: .82rem; }.workflow-step small { color: var(--ink-soft); }
.public-shell { width: min(100% - 2rem, 42rem); margin: auto; padding: clamp(1.25rem, 5vw, 2rem) 0; }.public-heading { display: flex; align-items: flex-start; gap: 1rem; margin-bottom: 1.5rem; }.public-heading > div { min-width: 0; }.public-heading h1 { overflow-wrap: anywhere; margin-bottom: .2rem; }.public-heading p { margin: 0; color: var(--ink-soft); }.privacy-note { max-width: 40rem; margin: 1rem auto 0; color: var(--ink-soft); font-size: .78rem; text-align: center; }
.success-panel, .error-panel { width: min(100% - 2rem, 36rem); display: grid; justify-items: center; margin: 10vh auto; padding: 3rem 1.5rem; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-xl); box-shadow: var(--shadow-md); text-align: center; }.success-mark { width: 4rem; height: 4rem; display: grid; place-items: center; margin-bottom: 1rem; background: var(--sage-100); color: var(--sage-700); border-radius: 50%; font-size: 2rem; }.error-panel > span { color: var(--plum-600); font-size: 3rem; font-weight: 850; }
.queue-row { display: grid; gap: .75rem; padding: 1rem; border-bottom: 1px solid var(--line); }.queue-row:last-child { border: 0; }.queue-row p { max-width: 48rem; margin: .35rem 0 0; color: var(--ink-soft); font-size: .84rem; }.queue-actions { display: flex; flex-wrap: wrap; gap: .5rem; }.queue-actions form { margin: 0; }
.opportunity-grid, .plan-grid { display: grid; gap: .75rem; }.opportunity-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }.plan-grid { grid-template-columns: 1fr; }.opportunity-card, .plan-card { min-width: 0; padding: 1.1rem; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-lg); box-shadow: var(--shadow-sm); }.opportunity-card > span { color: var(--accent-text); font-size: 2rem; font-weight: 850; }.opportunity-card h3 { margin-top: .25rem; overflow-wrap: anywhere; }.opportunity-card p { margin: 0; color: var(--ink-soft); font-size: .76rem; }.plan-card > strong { display: block; color: var(--accent-text); font-size: 1.8rem; }.plan-card > strong small { font-size: .8rem; }.plan-card form { display: grid; gap: .6rem; margin-top: 1rem; }
.receipt { width: min(100%, 44rem); margin: auto; padding: clamp(1rem, 5vw, 2.5rem); background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-lg); box-shadow: var(--shadow-sm); }.receipt header { display: flex; gap: 1rem; align-items: center; padding-bottom: 1.5rem; border-bottom: 2px solid var(--ink); }.receipt header h1 { margin-bottom: .1rem; font-size: 1.5rem; }.receipt header p { margin: 0; color: var(--ink-soft); }.receipt-meta { display: flex; justify-content: space-between; gap: 1rem; padding: 1rem 0; color: var(--ink-soft); font-size: .8rem; }.receipt-lines { padding: 1rem 0; border-block: 1px solid var(--line); }.receipt-lines div, .receipt-totals div { display: flex; justify-content: space-between; gap: 1rem; padding: .4rem 0; }.receipt-totals { width: min(100%, 22rem); margin: 1rem 0 1rem auto; }.receipt-totals dd { margin: 0; }.receipt-total { margin-top: .5rem; padding-top: .8rem !important; border-top: 2px solid var(--ink); font-size: 1.2rem; font-weight: 800; }.receipt-note { padding: 1rem; background: var(--canvas); border-radius: var(--radius-sm); }.receipt footer { margin-top: 2rem; text-align: center; }
.logout-form { margin-top: 1rem; }.info-block { padding: 1rem; margin-bottom: 1rem; background: var(--blush-100); border-radius: var(--radius-sm); }.status-actions { padding: 0 1rem 1rem; }
.filter-row, .report-filter { display: flex; flex-wrap: wrap; align-items: end; gap: .75rem; margin: 1rem 0; }
.tool-card { padding: 1rem; }.tool-card p { overflow-wrap: anywhere; }
.switching-progress { display: grid; gap: .8rem; margin-bottom: 1rem; padding: 1.2rem; }.switching-progress p { margin: .25rem 0 0; color: var(--ink-soft); font-size: .82rem; }.switching-progress-bar { height: .65rem; overflow: hidden; background: var(--surface-inset); border: 1px solid var(--line); border-radius: 999px; }.switching-progress-bar span { width: calc(var(--progress) * 25%); height: 100%; display: block; background: var(--accent-gradient); border-radius: inherit; }.switching-benefits { display: grid; gap: .75rem; }.switching-benefits article { padding: 1.1rem; border-left: 3px solid var(--accent-mauve); }.switching-benefits p, .switching-boundary p { margin: .35rem 0 0; color: var(--ink-soft); font-size: .84rem; }.switching-boundary { padding: 1.2rem; }.switching-boundary .action-row { margin-top: 1rem; }.switching-workflow { margin-bottom: 0; }
.switching-scorecard { padding: 1.2rem; }.switching-scorecard p { margin: .35rem 0 0; color: var(--ink-soft); font-size: .84rem; }.switching-scorecard ol { display: grid; gap: .55rem; margin: 1rem 0 0; padding-left: 1.4rem; }.switching-scorecard li { padding-left: .25rem; }
.waitlist-row { display: grid; gap: .75rem; padding: 1rem; border-bottom: 1px solid var(--line); }.waitlist-row:last-child { border-bottom: 0; }.waitlist-row small { display: block; margin-top: .2rem; color: var(--ink-soft); }.waitlist-row p { margin: .5rem 0 0; color: var(--ink-soft); font-size: .84rem; }
.waitlist-match-card { margin-bottom: 1rem; padding: 0 1rem; }.waitlist-match-card .section-heading { margin-top: 1rem; }
.notification-row { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: .75rem; padding: 1rem; border-bottom: 1px solid var(--line); }.notification-row:last-child { border-bottom: 0; }.notification-row p { margin: .2rem 0; color: var(--ink-soft); font-size: .84rem; }.notification-row small { color: var(--ink-soft); }.notification-dot { width: .55rem; height: .55rem; border-radius: 50%; background: var(--line); }.notification-row.unread .notification-dot { background: var(--accent-rose); box-shadow: 0 0 0 4px rgb(var(--rose-rgb) / 12%); }
.filter-row label { font-weight: 750; }.filter-row select { width: min(100%, 18rem); }
.report-filter { padding: 1rem; }.report-filter .field { flex: 1 1 12rem; margin: 0; }
.report-secondary { margin-top: .7rem; }.inline-disclosure { flex: 0 0 auto; }.inline-disclosure summary { cursor: pointer; color: var(--ink-soft); font-size: .8rem; }.inline-disclosure form { position: absolute; z-index: 5; right: 1rem; display: flex; gap: .5rem; width: min(90vw, 28rem); padding: .75rem; background: var(--surface-raised); border: 1px solid var(--line); border-radius: var(--radius-md); box-shadow: var(--shadow-md); }.inline-disclosure input { min-width: 0; }
.cancellation-card { display: grid; gap: .75rem; margin-bottom: 1rem; padding: 1rem; border-color: #efc3ca; }.cancellation-card h2, .cancellation-card p { margin: 0; }.fee-actions { display: grid; gap: .55rem; }.fee-actions label { font-size: .82rem; font-weight: 750; }
.note-row { padding: 1rem; border-bottom: 1px solid var(--line); }.note-row:last-child { border-bottom: 0; }.note-row p { margin: .35rem 0; white-space: pre-wrap; }.note-row small { color: var(--ink-soft); }.note-row.important { border-left: 3px solid #d49730; background: rgb(212 151 48 / 5%); }
.copy-card { display: grid; gap: .75rem; padding: 1rem; }.planner-grid, .marketing-tools { display: grid; gap: .75rem; }.planner-card { padding: 1rem; }.planner-card p { margin: 0; color: var(--ink-soft); }

/* Treatment-safety Client Card */
.safety-summary { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: .85rem; margin-bottom: 1rem; padding: 1rem; color: var(--ink); border: 1px solid var(--line); border-radius: var(--radius-lg); text-decoration: none; box-shadow: var(--shadow-sm); }
.safety-summary > span:nth-child(2) { min-width: 0; }.safety-summary strong, .safety-summary small { display: block; }.safety-summary small { margin-top: .2rem; color: var(--ink-soft); }.safety-summary-icon { width: 2.4rem; height: 2.4rem; display: grid; place-items: center; border-radius: .75rem; font-weight: 900; }.safety-clear { background: linear-gradient(145deg, #e8f3eb, #f3f9f4); border-color: #cce2d2; }.safety-clear .safety-summary-icon { background: #d3e8da; color: var(--sage-700); }.safety-adapt, .safety-defer, .safety-refer, .safety-missing { background: linear-gradient(145deg, var(--amber-100), #fff8eb); border-color: #ddc79f; }.safety-adapt .safety-summary-icon, .safety-defer .safety-summary-icon, .safety-refer .safety-summary-icon, .safety-missing .safety-summary-icon { background: #efdbb6; color: var(--amber-700); }
.privacy-callout { margin-bottom: 1rem; padding: 1rem; background: var(--blush-100); color: var(--accent-text); border: 1px solid var(--line-strong); border-radius: var(--radius-md); }.privacy-callout p { margin: .25rem 0 0; }
.safety-form { width: min(100%, 54rem); }.safety-section { margin-bottom: 1rem; padding: clamp(1rem, 3vw, 1.4rem); }.safety-section legend { padding: 0 .35rem; color: var(--ink); font-size: 1.15rem; font-weight: 800; }.safety-section-title { display: inline-flex; align-items: center; gap: .55rem; margin-block: 0 .35rem; }.safety-section-icon { width: 1.8rem; height: 1.8rem; display: inline-grid; flex: 0 0 1.8rem; place-items: center; color: var(--accent-text); background: var(--blush-100); border: 1px solid var(--line); border-radius: .6rem; }.safety-section-icon svg { width: 1rem; height: 1rem; fill: none; stroke: currentColor; stroke-width: 1.65; stroke-linecap: round; stroke-linejoin: round; }.safety-section .field:last-child { margin-bottom: 0; }.acknowledgement-row { padding: .8rem; background: var(--surface-raised); border: 1px solid var(--line); border-radius: var(--radius-sm); }.sticky-form-actions { position: sticky; z-index: 8; bottom: calc(var(--nav-height) + .6rem); padding: .75rem; background: rgb(var(--canvas-rgb) / 94%); border: 1px solid var(--line); border-radius: var(--radius-md); box-shadow: var(--shadow-md); backdrop-filter: blur(14px); }
.signed-summary, .safety-card-hero { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; padding: 1.2rem; }.signed-summary h2, .safety-card-hero h2 { margin: .45rem 0 .3rem; }.signed-summary p, .safety-card-hero p { margin-bottom: 0; }.safety-card-hero > div { min-width: min(100%, 20rem); }.positive-text { color: var(--sage-700); }.flag-list { display: flex; flex-wrap: wrap; align-content: start; gap: .4rem; margin-top: .5rem; }.flag-list span { padding: .3rem .55rem; background: #efdbb6; color: var(--amber-700); border-radius: 999px; font-size: .75rem; font-weight: 750; }.answer-list { margin: 0; }.answer-list > div { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(7rem, .6fr); gap: 1rem; padding: .75rem .25rem; border-bottom: 1px solid var(--line); }.answer-list > div:last-child { border: 0; }.answer-list dt { color: var(--ink-soft); }.answer-list dd { margin: 0; overflow-wrap: anywhere; text-align: right; font-weight: 750; }.answer-list .answer-flag { margin-inline: -.5rem; padding-inline: .75rem; background: var(--amber-100); border-radius: .55rem; }.answer-list .answer-flag dt, .answer-list .answer-flag dd { color: var(--amber-700); }.acknowledgement-card { padding: 1.2rem; }

/* Full-day calendar grid */
.calendar-heading { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; }.calendar-heading h1 { margin-bottom: .25rem; }.calendar-heading p { margin: 0; }
.calendar-controls { display: grid; grid-template-columns: auto auto minmax(10rem, 1fr) auto; align-items: end; gap: .8rem; margin-bottom: .8rem; padding: .8rem; }.segmented-control { display: inline-grid; grid-auto-flow: column; grid-auto-columns: 1fr; padding: .22rem; background: var(--surface-inset); border: 1px solid var(--line-strong); border-radius: .75rem; }.segmented-control a { min-height: 38px; display: grid; place-items: center; padding: .4rem .75rem; color: var(--ink-soft); border-radius: .55rem; text-decoration: none; font-size: .82rem; font-weight: 750; }.segmented-control a[aria-current="page"] { background: var(--blush-200); color: var(--ink); box-shadow: inset 0 0 0 1px var(--line-strong); }.segmented-control.compact a { padding-inline: .55rem; }.calendar-navigation { display: flex; align-items: center; gap: .35rem; }.icon-button { width: 42px; height: 42px; display: grid; place-items: center; color: var(--ink); background: var(--surface-raised); border: 1px solid var(--line-strong); border-radius: .7rem; text-decoration: none; font-size: 1.4rem; }.calendar-filter { display: grid; grid-template-columns: auto minmax(8rem, 1fr); align-items: center; justify-content: end; gap: .45rem; margin: 0; }.calendar-filter label, .slot-control > span { color: var(--ink-soft); font-size: .76rem; font-weight: 750; }.calendar-filter select { min-height: 42px; margin: 0; }.slot-control { display: flex; align-items: center; gap: .45rem; }.calendar-legend { display: flex; flex-wrap: wrap; gap: 1rem; margin: 0 0 .65rem .25rem; color: var(--ink-soft); font-size: .76rem; }.calendar-legend span { display: inline-flex; align-items: center; gap: .35rem; }.calendar-legend i { width: .75rem; height: .75rem; border-radius: .2rem; }.legend-open { border: 1px solid var(--line-strong); background: var(--surface-inset); }.legend-booking { background: #d3a9c2; }.legend-block { background: #f1dfb7; }
.calendar-scroll { max-height: min(72vh, 58rem); overflow: auto; border: 1px solid var(--line-strong); border-radius: var(--radius-lg); background: var(--surface-inset); box-shadow: var(--shadow-sm); overscroll-behavior: contain; }.calendar-week .calendar-grid { min-width: 70rem; }.calendar-grid { min-width: 100%; width: max-content; }.calendar-grid-header { position: sticky; z-index: 12; top: 0; display: grid; grid-template-columns: 4.5rem repeat(var(--calendar-columns), minmax(10rem, 1fr)); min-width: 100%; background: rgb(var(--surface-rgb) / 98%); border-bottom: 1px solid var(--line-strong); box-shadow: 0 4px 12px rgb(100 64 87 / 6%); }.time-corner, .calendar-day-heading { min-height: 72px; display: grid; place-items: center; align-content: center; padding: .45rem; border-right: 1px solid var(--line-strong); }.time-corner { position: sticky; z-index: 14; left: 0; color: var(--ink-soft); background: var(--surface); font-size: .7rem; }.calendar-day-heading span, .calendar-day-heading small { color: var(--ink-soft); }.calendar-day-heading span { font-size: .7rem; text-transform: uppercase; }.calendar-day-heading strong { font-size: 1.15rem; }.calendar-day-heading small { font-size: .68rem; }.calendar-day-heading.closed { background: var(--canvas); }
.calendar-grid-body { position: relative; display: grid; grid-template-columns: 4.5rem repeat(var(--calendar-columns), minmax(10rem, 1fr)); grid-template-rows: repeat(var(--calendar-rows), var(--slot-height)); min-width: 100%; }.time-label { position: sticky; z-index: 9; left: 0; display: flex; justify-content: center; align-items: flex-start; padding-top: .2rem; color: var(--ink-soft); background: var(--surface); border-right: 1px solid var(--line-strong); border-bottom: 1px solid var(--line); font-size: .7rem; }.time-slot { z-index: 1; display: block; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); text-decoration: none; }.time-slot.open { position: relative; background: var(--surface-inset); }.time-slot.open::after { content: "+"; position: absolute; inset: .25rem; display: grid; place-items: center; color: transparent; border: 1px dashed transparent; border-radius: .4rem; font-weight: 800; transition: color .12s, border-color .12s, background .12s; }.time-slot.open:hover::after, .time-slot.open:focus-visible::after { color: var(--accent-text); background: rgb(var(--rose-rgb) / 10%); border-color: var(--focus); }.time-slot.closed { background: repeating-linear-gradient(-45deg, var(--canvas), var(--canvas) 8px, var(--surface-inset) 8px, var(--surface-inset) 16px); }.calendar-event { z-index: 5; min-width: 0; overflow: hidden; margin: 2px 4px; padding: .45rem .55rem; color: var(--ink); border: 1px solid transparent; border-radius: .55rem; text-decoration: none; box-shadow: 0 4px 10px rgb(100 64 87 / 8%); }.calendar-event strong, .calendar-event span, .calendar-event small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.calendar-event strong { font-size: .8rem; }.calendar-event span, .calendar-event small { font-size: .68rem; }.calendar-event small { color: var(--ink-soft); }.appointment-event { background: linear-gradient(145deg, #f1dcea, #e5ddf3); border-color: #b990ab; }.block-event { background: repeating-linear-gradient(-45deg, #f9edcf, #f9edcf 8px, #f1dfb7 8px, #f1dfb7 16px); border-color: #b99760; }.appointment-event.status-completed { background: #dcefe2; border-color: #8bb49b; }.appointment-event.status-cancelled { opacity: .55; }

@media (max-width: 760px) { .calendar-controls { grid-template-columns: 1fr 1fr; align-items: center; }.calendar-filter { grid-column: 1 / -1; }.slot-control { grid-column: 1 / -1; justify-content: space-between; }.calendar-day .calendar-grid-header, .calendar-day .calendar-grid-body { grid-template-columns: 3.75rem minmax(calc(100vw - 5.8rem), 1fr); }.calendar-day .time-corner, .calendar-day .time-label { width: 3.75rem; }.calendar-scroll { max-height: 66vh; border-radius: var(--radius-md); }.answer-list > div { grid-template-columns: 1fr; gap: .25rem; }.answer-list dd { text-align: left; }.detail-list div { align-items: flex-start; }.full-card-disclosure dd { max-width: 100%; text-align: left; }.safety-summary { grid-template-columns: auto minmax(0, 1fr); }.safety-summary > span:last-child { display: none; }.sticky-form-actions { bottom: calc(var(--nav-height) + .35rem); }.sticky-form-actions .button { flex: 1 1 10rem; } }
@media (max-width: 420px) { .calendar-controls { grid-template-columns: 1fr; }.calendar-navigation, .calendar-filter, .slot-control { grid-column: 1; }.calendar-navigation { justify-content: space-between; }.calendar-filter { grid-template-columns: 1fr; }.slot-control { align-items: stretch; flex-direction: column; }.segmented-control, .slot-control .segmented-control { width: 100%; }.calendar-heading { align-items: flex-start; }.calendar-heading > .button { width: 100%; }.client-title { align-items: flex-start; }.client-title .avatar-large { width: 3.5rem; height: 3.5rem; }.detail-list div { display: grid; gap: .2rem; } }
@media (min-width: 700px) { .auth-shell { grid-template-columns: 1fr 1fr; }.onboarding-shell { grid-template-columns: .8fr 1.2fr; padding-top: 4rem; }.stat-grid { grid-template-columns: repeat(4, 1fr); }.stat-card { padding: 1.2rem; }.content-grid { grid-template-columns: minmax(0, 1.65fr) minmax(16rem, .75fr); }.team-performance-row { grid-template-columns: minmax(0, 1fr) minmax(18rem, .7fr); align-items: center; }.roster-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }.queue-row { grid-template-columns: 1fr auto; align-items: center; }.opportunity-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }.plan-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }.switching-benefits { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
