.appt-page { --appt-radius:14px; min-width:0; }
.appt-page-header { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:16px; }
.appt-page-title { margin:0; font-size:1.25rem; }
.appt-page-subtitle { color:var(--text-muted); font-size:.78rem; margin-top:4px; }
.appt-header-actions { display:flex; gap:8px; flex-wrap:wrap; justify-content:flex-end; }
.appt-toolbar { display:flex; align-items:center; gap:8px; flex-wrap:wrap; background:var(--bg-card); border:1px solid var(--border-color); border-radius:var(--appt-radius); padding:10px; margin-bottom:12px; }
.appt-toolbar-spacer { flex:1; }
.appt-view-toggle { display:inline-flex; border:1px solid var(--border-color); border-radius:9px; overflow:hidden; background:var(--bg-card); }
.appt-view-toggle button { border:0; border-right:1px solid var(--border-color); background:transparent; color:var(--text-muted); padding:7px 10px; min-height:34px; font-size:.75rem; cursor:pointer; white-space:nowrap; }
.appt-view-toggle button:last-child { border-right:0; }
.appt-view-toggle button.active { background:var(--primary); color:#fff; }
.appt-toolbar input,.appt-toolbar select { min-width:0; max-width:100%; flex:1 1 145px; min-height:36px; font-size:.78rem; border:1px solid var(--border-color); border-radius:9px; background:var(--bg-card); color:var(--text-primary); padding:6px 9px; }
.appt-table-wrap { border:1px solid var(--border-color); border-radius:var(--appt-radius); overflow:auto; background:var(--bg-card); }
.appt-table { width:100%; border-collapse:collapse; font-size:.82rem; }
.appt-table th { color:var(--text-muted); font-size:.7rem; text-transform:uppercase; letter-spacing:.04em; padding:10px 12px; text-align:left; border-bottom:1px solid var(--border-color); white-space:nowrap; }
.appt-table td { padding:11px 12px; border-bottom:1px solid var(--border-color); vertical-align:middle; }
.appt-table tr:last-child td { border-bottom:0; }
.appt-table tbody tr { cursor:pointer; transition:background .15s; }
.appt-table tbody tr:hover { background:rgba(99,102,241,.05); }
.appt-status-badge { display:inline-flex; align-items:center; gap:5px; border-radius:999px; padding:4px 9px; font-size:.7rem; font-weight:700; white-space:nowrap; }
.appt-status-badge.pending { color:#4f46e5; background:rgba(99,102,241,.12); }
.appt-status-badge.confirmed { color:#1d4ed8; background:rgba(37,99,235,.12); }
.appt-status-badge.completed { color:#047857; background:rgba(5,150,105,.12); }
.appt-status-badge.cancelled { color:#b91c1c; background:rgba(220,38,38,.1); }
.appt-status-badge.no_show { color:#b45309; background:rgba(217,119,6,.12); }
[data-theme="dark"] .appt-status-badge.pending { color:#c7d2fe; background:rgba(99,102,241,.24); }
[data-theme="dark"] .appt-status-badge.confirmed { color:#bfdbfe; background:rgba(37,99,235,.24); }
[data-theme="dark"] .appt-status-badge.completed { color:#a7f3d0; background:rgba(5,150,105,.22); }
[data-theme="dark"] .appt-status-badge.cancelled { color:#fecaca; background:rgba(220,38,38,.2); }
[data-theme="dark"] .appt-status-badge.no_show { color:#fde68a; background:rgba(217,119,6,.22); }
.appt-row-actions { display:flex; gap:5px; justify-content:flex-end; flex-wrap:wrap; }
.appt-icon-btn { width:30px; height:30px; display:inline-grid; place-items:center; border:1px solid var(--border-color); border-radius:8px; color:var(--text-muted); background:var(--bg-card); cursor:pointer; }
.appt-icon-btn:hover { color:#fff; background:var(--primary); border-color:var(--primary); }
.appt-icon-btn.danger:hover { background:var(--danger,#dc2626); border-color:var(--danger,#dc2626); }
.appt-empty { text-align:center; color:var(--text-muted); padding:48px 16px; }
.appt-empty i { display:block; font-size:2rem; opacity:.35; margin-bottom:10px; }
.appt-calendar { border:1px solid var(--border-color); border-radius:var(--appt-radius); background:var(--bg-card); overflow:hidden; }
.appt-cal-nav { display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:10px; padding:10px; border-bottom:1px solid var(--border-color); }
.appt-cal-nav-actions { display:flex; align-items:center; gap:6px; }
.appt-cal-nav-actions:last-child { justify-content:flex-end; }
.appt-cal-title { font-weight:800; text-align:center; }
.appt-day-lane { display:grid; grid-template-columns:76px minmax(0,1fr); min-height:58px; border-bottom:1px solid var(--border-color); }
.appt-day-lane:last-child { border-bottom:0; }
.appt-day-hour { padding:12px 10px; color:var(--text-muted); font:700 .72rem var(--font-mono,monospace); border-right:1px solid var(--border-color); }
.appt-day-events { padding:6px; display:grid; gap:5px; }
.appt-cal-event { display:block; width:100%; border:1px solid var(--border-color); border-left:3px solid var(--primary); border-radius:8px; padding:7px 9px; cursor:pointer; min-width:0; background:var(--bg-secondary,#f6f7fb); color:var(--text-primary); text-align:left; font:inherit; }
.appt-cal-event:hover { border-color:var(--primary); }
.appt-cal-event-time { display:block; font-weight:800; font-size:.72rem; color:var(--primary); }
.appt-cal-event-name { display:block; font-size:.78rem; font-weight:700; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.appt-cal-event .appt-picker-meta { display:block; }
.appt-week-scroll { overflow-x:auto; }
.appt-week-grid { min-width:840px; display:grid; grid-template-columns:repeat(7,minmax(120px,1fr)); }
.appt-week-day { min-height:330px; border-right:1px solid var(--border-color); }
.appt-week-day:last-child { border-right:0; }
.appt-week-head { padding:9px; text-align:center; font-size:.72rem; font-weight:800; border-bottom:1px solid var(--border-color); background:var(--bg-secondary,#f6f7fb); }
.appt-week-head.today { color:var(--primary); box-shadow:inset 0 -2px var(--primary); }
.appt-week-events { padding:6px; display:grid; gap:5px; }
.appt-timeline-scroll { overflow:auto; max-width:100%; background:var(--bg-card); overscroll-behavior:contain; }
.appt-timeline-scroll:focus-visible { outline:2px solid var(--primary); outline-offset:-2px; }
.appt-timeline-grid { display:grid; align-items:start; }
.appt-timeline-corner,.appt-timeline-head { position:sticky; top:0; z-index:5; height:48px; background:var(--bg-secondary,#f6f7fb); border-bottom:1px solid var(--border-color); }
.appt-timeline-corner { border-right:1px solid var(--border-color); }
.appt-timeline-head { display:grid; place-items:center; padding:5px; border-right:1px solid var(--border-color); font-size:.72rem; font-weight:800; text-align:center; }
.appt-timeline-head:last-child { border-right:0; }
.appt-timeline-head.today { color:var(--primary); box-shadow:inset 0 -2px var(--primary); }
.appt-time-axis { position:relative; border-right:1px solid var(--border-color); background:var(--bg-card); }
.appt-time-label { position:absolute; right:8px; transform:translateY(-50%); color:var(--text-muted); font:700 .65rem var(--font-mono,monospace); }
.appt-time-column { position:relative; border-right:1px solid var(--border-color); background:var(--bg-card); min-width:0; }
.appt-time-column:last-child { border-right:0; }
.appt-time-line { position:absolute; left:0; right:0; height:1px; background:var(--border-color); opacity:.72; z-index:1; pointer-events:none; }
.appt-time-closed { position:absolute; left:0; right:0; background:rgba(148,163,184,.11); background-image:repeating-linear-gradient(135deg,transparent,transparent 7px,rgba(148,163,184,.08) 7px,rgba(148,163,184,.08) 8px); z-index:0; pointer-events:none; }
.appt-time-break { position:absolute; left:0; right:0; background:rgba(245,158,11,.09); border-top:1px dashed rgba(217,119,6,.28); border-bottom:1px dashed rgba(217,119,6,.28); z-index:1; pointer-events:none; }
.appt-available-slot { position:absolute; left:4px; right:4px; z-index:2; display:flex; align-items:center; justify-content:space-between; gap:4px; min-width:0; padding:3px 7px; border:1px dashed color-mix(in srgb,var(--primary) 48%,var(--border-color)); border-radius:7px; background:color-mix(in srgb,var(--primary) 7%,var(--bg-card)); color:var(--primary); font:750 .69rem var(--font-mono,monospace); cursor:pointer; overflow:hidden; transition:background .15s,border-color .15s,box-shadow .15s; }
.appt-available-slot:hover { background:color-mix(in srgb,var(--primary) 15%,var(--bg-card)); border-color:var(--primary); box-shadow:0 1px 4px rgba(15,23,42,.1); }
.appt-available-slot:focus-visible { outline:2px solid var(--primary); outline-offset:1px; z-index:4; }
.appt-available-slot:disabled { cursor:wait; opacity:.62; }
.appt-slot-load-state { position:absolute; z-index:2; top:8px; left:6px; right:6px; padding:6px; border:0; border-radius:7px; color:var(--text-muted); background:color-mix(in srgb,var(--bg-secondary,#f6f7fb) 88%,transparent); font-size:.68rem; text-align:center; }
.appt-slot-load-state.error { color:var(--danger,#dc2626); cursor:pointer; border:1px solid color-mix(in srgb,var(--danger,#dc2626) 25%,var(--border-color)); }
.appt-block-load-state { position:absolute; z-index:3; top:8px; left:6px; right:6px; min-height:36px; padding:6px; border:1px solid var(--border-color); border-radius:7px; color:var(--text-muted); background:var(--bg-secondary,#f6f7fb); font-size:.68rem; cursor:pointer; }
.appt-time-block { position:absolute; z-index:3; left:4px; right:4px; min-width:0; display:flex; flex-direction:column; align-items:flex-start; justify-content:center; gap:2px; overflow:hidden; padding:4px 7px; border:1px solid color-mix(in srgb,var(--text-muted) 38%,var(--border-color)); border-radius:7px; background:color-mix(in srgb,var(--text-muted) 12%,var(--bg-card)); color:var(--text-primary); text-align:left; cursor:pointer; box-shadow:inset 3px 0 color-mix(in srgb,var(--text-muted) 65%,transparent); }
.appt-time-block:hover { border-color:var(--text-muted); background:color-mix(in srgb,var(--text-muted) 18%,var(--bg-card)); }
.appt-time-block:focus-visible { outline:2px solid var(--primary); outline-offset:1px; z-index:6; }
.appt-time-block-time { font:800 .66rem var(--font-mono,monospace); white-space:nowrap; }
.appt-time-block-label { max-width:100%; overflow:hidden; color:var(--text-muted); font-size:.65rem; font-weight:700; text-overflow:ellipsis; white-space:nowrap; }
.appt-timeline-event { position:absolute; z-index:4; min-width:0; }
.appt-timeline-event > .appt-cal-event { height:100%; overflow:hidden; padding:5px 7px; box-shadow:0 1px 2px rgba(15,23,42,.06); }
.appt-now-line { position:absolute; left:0; right:0; height:2px; background:#ef4444; z-index:5; pointer-events:none; }
.appt-now-line::before { content:''; position:absolute; width:7px; height:7px; border-radius:50%; background:#ef4444; left:-3px; top:-2px; }
.appt-modal { --text-muted:var(--text-secondary); --appt-accent-text:#4338ca; max-width:720px; width:calc(100vw - 28px); max-height:92vh; display:flex; flex-direction:column; }
[data-theme="dark"] .appt-modal { --appt-accent-text:#c7d2fe; }
.appt-modal .modal-body { overflow:auto; min-height:0; overscroll-behavior:contain; }
.appt-modal .modal-header,.appt-modal .modal-footer { flex-shrink:0; }
.appt-modal .modal-header > div { min-width:0; overflow-wrap:anywhere; }
.appt-modal .modal-footer { flex-wrap:wrap; }
.appt-modal .form-control { min-width:0; max-width:100%; }
.appt-staff-label { display:inline-flex; align-items:center; gap:6px; overflow-wrap:anywhere; }
.appt-staff-label i { color:var(--text-muted); flex-shrink:0; }
.appt-staff-change { margin-top:8px; }
.appt-cal-event-staff { display:block; color:var(--text-primary); font-size:.7rem; font-weight:700; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.appt-edit-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.appt-edit-grid > div { min-width:0; }
.appt-edit-wide { grid-column:1 / -1; }
.appt-edit-fieldset { min-width:0; border:0; padding:0; margin:0; }
.appt-edit-availability { margin-top:6px; color:var(--text-muted); font-size:.75rem; overflow-wrap:anywhere; }
.appt-edit-availability.error { color:var(--danger,#dc2626); }
.appt-timeline-scroll { max-width:100%; overscroll-behavior-x:contain; }
.appt-modal-overlay { z-index:9000; }
.appt-modal-overlay .modal-close { min-width:44px; min-height:44px; }
.appt-stepper { display:grid; grid-template-columns:repeat(5,1fr); gap:6px; padding:12px 18px; border-bottom:1px solid var(--border-color); }
.appt-step { min-width:0; color:var(--text-muted); font-size:.68rem; text-align:center; }
.appt-step-dot { width:25px; height:25px; margin:0 auto 4px; display:grid; place-items:center; border-radius:50%; border:1px solid var(--border-color); font-weight:800; background:var(--bg-card); }
.appt-step.active,.appt-step.done { color:var(--primary); }
.appt-step.active .appt-step-dot { color:#fff; background:var(--primary); border-color:var(--primary); }
.appt-step.done .appt-step-dot { color:var(--primary); border-color:var(--primary); background:rgba(99,102,241,.1); }
.appt-picker-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.appt-picker-card { min-height:44px; border:1px solid var(--border-color); border-radius:11px; padding:11px; background:var(--bg-card); color:var(--text-primary); cursor:pointer; text-align:left; min-width:0; }
.appt-picker-card:hover,.appt-picker-card.selected { border-color:var(--primary); box-shadow:0 0 0 2px rgba(99,102,241,.1); }
.appt-picker-title { font-size:.82rem; font-weight:750; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.appt-picker-meta { color:var(--text-muted); font-size:.7rem; margin-top:3px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.appt-contact-tabs { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; padding:4px; margin:12px 0; border:1px solid var(--border-color); border-radius:10px; background:var(--bg-secondary); }
.appt-contact-tab { min-height:44px; border:0; border-radius:8px; background:transparent; color:var(--text-muted); font:inherit; font-size:.78rem; font-weight:700; cursor:pointer; display:flex; align-items:center; justify-content:center; gap:7px; }
.appt-contact-tab.active { color:var(--primary); background:var(--bg-card); box-shadow:0 1px 3px rgba(15,23,42,.12); }
.appt-contact-tab:focus-visible { outline:2px solid var(--primary); outline-offset:2px; }
.appt-inline-contact-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.appt-inline-contact-wide { grid-column:1/-1; }
.appt-field-hint { margin-top:4px; font-size:.68rem; }
#appt-create-modal .modal-footer .btn-primary { flex:1 1 190px; }
.appt-date-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:7px; }
.appt-date-card { min-height:44px; border:1px solid var(--border-color); border-radius:10px; background:var(--bg-card); color:var(--text-primary); padding:9px 6px; cursor:pointer; text-align:center; }
.appt-date-card:hover,.appt-date-card.selected { border-color:var(--primary); color:var(--primary); background:rgba(99,102,241,.06); }
.appt-date-day { font-size:.68rem; color:var(--text-muted); text-transform:uppercase; }
.appt-date-number { font-weight:800; font-size:.85rem; margin-top:3px; }
.appt-slot-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:7px; }
.appt-slot { min-height:44px; border:1px solid var(--border-color); border-radius:9px; padding:9px 6px; background:var(--bg-card); color:var(--text-primary); font:750 .8rem var(--font-mono,monospace); cursor:pointer; }
.appt-slot:hover,.appt-slot.selected { border-color:var(--primary); color:#fff; background:var(--primary); }
.appt-nearest { border:1px solid rgba(99,102,241,.22); background:rgba(99,102,241,.05); border-radius:11px; padding:10px; margin-bottom:14px; }
.appt-nearest-list { display:flex; flex-wrap:wrap; gap:6px; margin-top:7px; }
.appt-nearest-btn { border:1px solid rgba(99,102,241,.3); color:var(--primary); background:var(--bg-card); border-radius:8px; padding:7px 9px; font-size:.72rem; cursor:pointer; }
.appt-notice { display:flex; gap:8px; align-items:flex-start; border-radius:10px; padding:10px 11px; margin-bottom:12px; font-size:.78rem; }
.appt-notice[hidden] { display:none !important; }
.appt-notice.info { color:#1d4ed8; background:rgba(37,99,235,.09); border:1px solid rgba(37,99,235,.18); }
.appt-notice.warning { color:#9a3412; background:rgba(234,88,12,.09); border:1px solid rgba(234,88,12,.2); }
[data-theme="dark"] .appt-notice.info { color:#bfdbfe; background:rgba(37,99,235,.2); border-color:rgba(147,197,253,.32); }
[data-theme="dark"] .appt-notice.warning { color:#fed7aa; background:rgba(234,88,12,.18); border-color:rgba(253,186,116,.32); }
.appt-summary { border:1px solid var(--border-color); border-radius:12px; overflow:hidden; }
.appt-summary-row { display:grid; grid-template-columns:130px 1fr; gap:12px; padding:10px 12px; border-bottom:1px solid var(--border-color); font-size:.8rem; }
.appt-summary-row:last-child { border-bottom:0; }
.appt-summary-label { color:var(--text-muted); }
.appt-summary-value { font-weight:700; min-width:0; overflow-wrap:anywhere; }
.appt-detail-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }
.appt-detail-card { border:1px solid var(--border-color); border-radius:11px; padding:11px; background:var(--bg-secondary,#f6f7fb); }
.appt-detail-label { color:var(--text-muted); font-size:.68rem; margin-bottom:4px; }
.appt-modal .text-muted,.appt-modal .appt-detail-label,.appt-modal .appt-picker-meta { color:var(--text-secondary); }
.appt-detail-danger-action { color:#b91c1c !important; }
[data-theme="dark"] .appt-detail-danger-action { color:#fca5a5 !important; }
.appt-modal .btn-danger { color:#fff; background:#b91c1c; border-color:#b91c1c; }
.appt-modal .btn-danger:hover { background:#991b1b; border-color:#991b1b; }
.appt-modal .appt-step.active,.appt-modal .appt-step.done,.appt-modal .appt-contact-tab.active,.appt-modal .appt-nearest-btn,.appt-modal .appt-date-card.selected,.appt-modal .appt-date-card.selected .appt-date-day { color:var(--appt-accent-text); }
.appt-modal .appt-step.active .appt-step-dot { background:#4338ca; border-color:#4338ca; }
.appt-modal .appt-step.done .appt-step-dot { color:var(--appt-accent-text); border-color:var(--appt-accent-text); }
.appt-modal .appt-slot.selected { color:#fff; background:#4338ca; border-color:#4338ca; }
[data-theme="dark"] .appt-modal .appt-step.active,[data-theme="dark"] .appt-modal .appt-step.done,[data-theme="dark"] .appt-modal .appt-contact-tab.active { color:#c7d2fe; }
[data-theme="dark"] .appt-modal .appt-step.active .appt-step-dot { color:#111827; background:#c7d2fe; border-color:#c7d2fe; }
[data-theme="dark"] .appt-modal .appt-step.done .appt-step-dot { color:#c7d2fe; border-color:#c7d2fe; }
[data-theme="dark"] .appt-modal .appt-slot.selected { color:#111827; background:#c7d2fe; border-color:#c7d2fe; }
.appt-detail-value { font-size:.84rem; font-weight:700; overflow-wrap:anywhere; }
.appt-slot-choice-modal { width:calc(100vw - 24px); max-width:500px; }
.appt-slot-choice-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.appt-slot-choice-card { min-height:112px; display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:11px; padding:14px; border:1px solid var(--border-color); border-radius:12px; background:var(--bg-card); color:var(--text-primary); text-align:left; cursor:pointer; }
.appt-slot-choice-card:hover,.appt-slot-choice-card:focus-visible { border-color:var(--primary); box-shadow:0 0 0 2px rgba(99,102,241,.1); outline:0; }
.appt-slot-choice-card.primary { background:color-mix(in srgb,var(--primary) 7%,var(--bg-card)); border-color:color-mix(in srgb,var(--primary) 35%,var(--border-color)); }
.appt-slot-choice-card > i:first-child { color:var(--primary); font-size:1.15rem; }
.appt-slot-choice-card span { min-width:0; }
.appt-slot-choice-card strong,.appt-slot-choice-card small { display:block; }
.appt-slot-choice-card strong { font-size:.84rem; }
.appt-slot-choice-card small { margin-top:4px; color:var(--text-muted); font-size:.69rem; line-height:1.35; }
.appt-block-modal { max-width:760px; }
.appt-block-tabs { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; padding:8px 18px; border-bottom:1px solid var(--border-color); background:var(--bg-secondary,#f6f7fb); }
.appt-block-tabs button { min-height:44px; border:1px solid transparent; border-radius:9px; background:transparent; color:var(--text-muted); font:inherit; font-size:.77rem; font-weight:700; cursor:pointer; }
.appt-block-tabs button.active { border-color:var(--border-color); background:var(--bg-card); color:var(--primary); box-shadow:0 1px 3px rgba(15,23,42,.08); }
.appt-block-tabs button:focus-visible { outline:2px solid var(--primary); outline-offset:1px; }
.appt-block-form-grid { display:grid; grid-template-columns:1.25fr 1fr 1fr; gap:12px; }
.appt-block-field-wide { grid-column:1/-1; }
.appt-block-footer { display:flex; justify-content:flex-end; gap:8px; flex-wrap:wrap; }
.appt-block-list { display:grid; gap:9px; }
.appt-block-card { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:12px; padding:12px; border:1px solid var(--border-color); border-radius:12px; background:var(--bg-card); }
.appt-block-card.cancelled { opacity:.72; background:var(--bg-secondary,#f6f7fb); }
.appt-block-card-main { min-width:0; }
.appt-block-card-title { overflow:hidden; font-size:.84rem; font-weight:800; text-overflow:ellipsis; white-space:nowrap; }
.appt-block-card-meta { display:flex; align-items:center; flex-wrap:wrap; gap:7px 12px; margin-top:5px; color:var(--text-muted); font-size:.69rem; }
.appt-block-card-reason { margin-top:7px; color:var(--text-muted); font-size:.72rem; overflow-wrap:anywhere; }
.appt-block-status { display:inline-flex; align-items:center; border-radius:999px; padding:3px 7px; font-weight:750; }
.appt-block-status.active { background:rgba(100,116,139,.13); color:#475569; }
.appt-block-status.cancelled { background:rgba(5,150,105,.11); color:#047857; }
.appt-block-card-actions { display:flex; justify-content:flex-end; }
.appt-block-detail-modal { width:calc(100vw - 24px); max-width:500px; }
.appt-block-detail-summary { display:grid; gap:9px; }
.appt-block-detail-summary > strong { font-size:.95rem; }
.appt-block-detail-summary > span { color:var(--text-muted); font-size:.78rem; }
.appt-block-detail-summary p { margin:2px 0 0; padding:10px; border-radius:9px; background:var(--bg-secondary,#f6f7fb); font-size:.78rem; white-space:pre-wrap; }
@media (max-width:900px) {
    .appt-toolbar-spacer { display:none; }
}
@media (max-width:768px) {
    .appt-page-header { align-items:stretch; flex-direction:column; }
    .appt-header-actions { justify-content:stretch; }
    .appt-header-actions .btn { flex:0 0 44px; min-height:44px; padding-left:10px; padding-right:10px; }
    .appt-header-actions .appt-new-btn { flex:1 1 auto; }
    .appt-header-actions .appt-settings-btn span,.appt-header-actions .appt-block-btn span { display:none; }
    .appt-toolbar { align-items:stretch; }
    .appt-toolbar input,.appt-toolbar select { flex:1 1 135px; min-width:0; min-height:44px; font-size:16px; }
    .appt-view-toggle { width:100%; }
    .appt-view-toggle button { flex:1; min-height:44px; }
    .appt-icon-btn { width:44px; height:44px; }
    .appt-cal-nav { grid-template-columns:auto 1fr auto; }
    .appt-cal-nav .btn { min-height:44px; }
    .appt-timeline-grid.week { min-width:760px !important; }
    .appt-table-wrap { border:0; background:transparent; overflow:visible; }
    .appt-table,.appt-table tbody { display:block; }
    .appt-table thead { display:none; }
    .appt-table tr { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin-bottom:9px; border:1px solid var(--border-color); border-radius:12px; padding:10px; background:var(--bg-card); overflow-wrap:anywhere; }
    .appt-table td { display:block; padding:0; border:0; min-width:0; }
    .appt-table td::before { content:attr(data-label); display:block; color:var(--text-muted); font-size:.65rem; margin-bottom:2px; }
    .appt-table td.appt-mobile-wide { grid-column:1 / -1; }
    .appt-row-actions { justify-content:flex-start; }
    .appt-picker-grid { grid-template-columns:1fr; }
    .appt-inline-contact-grid { grid-template-columns:1fr; }
    .appt-inline-contact-wide { grid-column:auto; }
    .appt-date-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
    .appt-slot-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
    .appt-step span { display:none; }
    .appt-summary-row { grid-template-columns:95px 1fr; }
    .appt-detail-grid { grid-template-columns:1fr; }
    .appt-slot-choice-grid { grid-template-columns:1fr; }
    .appt-slot-choice-card { min-height:88px; }
    .appt-block-form-grid { grid-template-columns:1fr; }
    .appt-block-field-wide { grid-column:auto; }
    .appt-block-card { grid-template-columns:1fr; }
    .appt-block-card-actions { justify-content:stretch; }
    .appt-block-card-actions .btn { width:100%; min-height:44px; }
    .appt-modal-overlay { padding:6px; }
    .appt-modal { width:100% !important; max-height:calc(100dvh - 12px); margin:0 !important; }
    .appt-modal .modal-footer .btn { flex:1 1 130px; min-height:44px; white-space:normal; }
    .appt-modal .form-control { font-size:16px; min-height:44px; }
    .appt-edit-grid { grid-template-columns:1fr; }
    .appt-cal-nav { grid-template-columns:1fr auto; gap:8px; }
    .appt-cal-nav > div:nth-child(2) { grid-column:1 / -1; grid-row:1; }
    .appt-cal-nav > div:last-child { justify-self:end; }
    .appt-modal .modal-footer { padding-bottom:max(12px,env(safe-area-inset-bottom)); }
}
@media (max-width:420px) {
    #appt-create-modal .modal-footer .btn-primary { flex-basis:100%; }
    #appt-block-manager-modal .modal-footer .btn-primary { flex-basis:100%; }
}

/* A quiet schedule: staff first, bookings second, availability on request. */
.appt-page { --appt-radius:16px; --text-muted:var(--text-secondary); --appt-accent-text:#4338ca; }
[data-theme="dark"] .appt-page { --appt-accent-text:#c7d2fe; }
.appt-page-header { align-items:center; margin-bottom:20px; }
.appt-page-title { font-size:1.3rem; letter-spacing:-.025em; }
.appt-page-subtitle { font-size:.8rem; margin-top:6px; }
.appt-header-actions { align-items:center; flex-wrap:nowrap; }
.appt-header-actions > .appt-new-btn { order:-1; min-height:44px; padding:10px 16px; }
.appt-page-actions { position:relative; }
.appt-page-actions summary { display:grid; place-items:center; width:44px; height:44px; border:1px solid var(--border-color); border-radius:10px; cursor:pointer; background:var(--bg-card); }
.appt-page-actions summary::-webkit-details-marker,.appt-more-filters summary::-webkit-details-marker { display:none; }
.appt-page-action-menu { position:absolute; inset-inline-end:0; top:calc(100% + 8px); z-index:20; display:grid; gap:6px; padding:8px; width:240px; max-width:calc(100vw - 32px); background:var(--bg-card); border:1px solid var(--border-color); border-radius:12px; box-shadow:0 10px 28px rgba(15,23,42,.14); }
.appt-page-action-menu .btn { justify-content:flex-start; min-height:44px; white-space:normal; width:100%; }
.appt-staff-panel { min-width:0; background:var(--bg-card); border:1px solid var(--border-color); border-radius:var(--appt-radius); padding:16px; margin-bottom:12px; }
.appt-staff-panel-heading { display:flex; justify-content:space-between; gap:12px; align-items:center; font-size:.82rem; font-weight:700; margin-bottom:12px; }
#appt-result-summary { color:var(--text-muted); font-size:.75rem; font-weight:400; text-align:end; }
.appt-staff-rail { display:flex; gap:8px; overflow-x:auto; padding:2px 2px 6px; overscroll-behavior-x:contain; scrollbar-width:thin; }
.appt-staff-chip { display:flex; align-items:center; gap:9px; flex:0 0 auto; min-height:48px; max-width:260px; padding:7px 12px 7px 8px; color:var(--text-secondary); font:inherit; font-size:.82rem; border:1px solid var(--border-color); border-radius:12px; background:var(--bg-card); cursor:pointer; }
.appt-staff-chip.active { color:var(--text-primary); border-color:var(--primary); background:color-mix(in srgb,var(--primary) 6%,var(--bg-card)); box-shadow:inset 0 0 0 1px var(--primary); }
.appt-staff-avatar { display:grid; place-items:center; flex-shrink:0; width:30px; height:30px; border-radius:50%; color:var(--text-primary); background:color-mix(in srgb,var(--staff-color) 13%,var(--bg-card)); font-weight:750; }
.appt-staff-chip-name { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-weight:650; }
.appt-staff-chip-count { color:var(--text-muted); font-size:.75rem; font-variant-numeric:tabular-nums; }
.appt-staff-select { display:none; }
.appt-staff-dot { flex:0 0 8px; width:8px; height:8px; border-radius:50%; background:var(--staff-color); }
.appt-staff-label { min-width:0; gap:7px; }
.appt-staff-label > span:last-child { min-width:0; overflow:hidden; text-overflow:ellipsis; }
.appt-toolbar { display:grid; grid-template-columns:auto minmax(160px,1fr) auto; gap:12px; padding:0; border:0; border-radius:0; background:transparent; align-items:start; }
.appt-view-toggle { border-radius:10px; width:auto; height:44px; }
.appt-view-toggle button { min-height:44px; padding:8px 16px; font-size:.82rem; }
.appt-view-toggle button.active { color:var(--appt-accent-text); background:color-mix(in srgb,var(--primary) 10%,var(--bg-card)); font-weight:750; }
.appt-search-field { display:flex; align-items:center; gap:8px; padding:0 12px; min-width:0; border:1px solid var(--border-color); border-radius:10px; background:var(--bg-card); color:var(--text-muted); }
.appt-search-field input { border:0; padding:10px 0; min-height:42px; flex:1; width:100%; outline-offset:0; }
.appt-more-filters { position:relative; }
.appt-more-filters > summary { display:flex; align-items:center; justify-content:center; gap:8px; min-height:44px; padding:8px 14px; border:1px solid var(--border-color); border-radius:10px; font-size:.82rem; background:var(--bg-card); cursor:pointer; list-style:none; }
.appt-more-filters[open] > summary { border-color:var(--primary); color:var(--primary); }
.appt-filter-count:not(:empty) { display:grid; place-items:center; min-width:18px; height:18px; font-size:.7rem; font-weight:700; border-radius:50%; background:var(--primary); color:#fff; }
.appt-filter-fields { position:absolute; top:calc(100% + 8px); inset-inline-end:0; z-index:15; display:grid; grid-template-columns:1fr 1fr; gap:14px; width:min(440px,calc(100vw - 40px)); padding:16px; border:1px solid var(--border-color); border-radius:12px; background:var(--bg-card); box-shadow:0 10px 28px rgba(15,23,42,.14); }
.appt-filter-fields label { display:grid; gap:6px; min-width:0; color:var(--text-secondary); font-size:.76rem; }
.appt-filter-fields input,.appt-filter-fields select { width:100%; min-height:44px; font-size:.84rem; }
.appt-filter-fields > button { grid-column:1/-1; justify-self:start; min-height:44px; }
.appt-cal-nav { display:flex; flex-wrap:wrap; padding:16px; gap:12px; }
.appt-cal-title { flex:1 1 240px; text-align:start; font-size:.95rem; font-weight:700; letter-spacing:-.015em; }
.appt-cal-nav-actions { gap:6px; }
.appt-cal-nav .btn { min-width:44px; min-height:44px; }
.appt-availability-toggle { display:flex; align-items:center; gap:6px; min-height:44px; border:0; background:transparent; color:var(--text-secondary); font:inherit; font-size:.78rem; padding:8px; cursor:pointer; }
.appt-availability-toggle[aria-expanded="true"] { color:var(--primary); }
.appt-timeline-scroll { max-height:min(60dvh,580px); }
.appt-timeline-head { height:48px; }
.appt-timeline-corner { height:48px; inset-inline-start:0; z-index:7; }
.appt-staff-lane-head { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; padding:10px; }
.appt-staff-lane-head > span:last-child { font-size:.7rem; font-weight:400; color:var(--text-muted); }
.appt-time-axis { position:sticky; inset-inline-start:0; z-index:6; }
.appt-time-closed { background:color-mix(in srgb,var(--text-muted) 5%,var(--bg-card)); }
.appt-cal-event { --text-secondary:color-mix(in srgb,var(--text-primary) 82%,var(--bg-card)); --text-muted:var(--text-secondary); padding:10px; background:color-mix(in srgb,var(--staff-color,var(--primary)) 5%,var(--bg-card)); border-radius:9px; }
.appt-cal-event-time { display:flex; align-items:center; justify-content:space-between; gap:5px; color:var(--text-secondary); font-size:.72rem; font-weight:650; font-variant-numeric:tabular-nums; }
.appt-cal-event-name { font-size:.84rem; margin-top:4px; line-height:1.35; }
.appt-cal-event-staff { color:var(--text-secondary); font-weight:500; font-size:.72rem; margin-top:4px; line-height:1.35; }
.appt-cal-event .appt-picker-meta { margin-top:4px; line-height:1.4; }
.appt-event-status { flex:0 0 7px; width:7px; height:7px; border-radius:50%; background:var(--status-color); }
.appt-timeline-event > .appt-cal-event { padding:3px 7px; box-shadow:none; }
.appt-timeline-event .appt-cal-event-name { margin-top:1px; line-height:1.2; }
.appt-timeline-event .appt-cal-event-staff { display:none; }
.appt-calendar-hint { margin:0; padding:8px 14px; border-bottom:1px solid var(--border-color); color:var(--text-secondary); font-size:12px; line-height:1.5; }
.appt-page .appt-available-slot { color:var(--appt-accent-text); background:color-mix(in srgb,var(--primary) 3%,var(--bg-card)); border-color:color-mix(in srgb,var(--primary) 26%,var(--border-color)); }
.appt-calendar-start-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(60px,1fr)); gap:6px; }
.appt-calendar-start-grid .appt-slot { display:flex; align-items:center; justify-content:space-between; gap:4px; min-height:44px; padding:7px; font-size:12px; color:var(--appt-accent-text); }
.appt-inline-start-times { border-top:1px solid var(--border-color); padding-top:12px; }
.appt-inline-start-times h4 { margin:0 0 8px; font-size:12px; color:var(--text-secondary); font-weight:600; }
.appt-create-staff-field { margin:16px 0 0; min-width:0; }
.appt-create-staff-field select, #appt-create-date { width:100%; min-width:0; max-width:100%; min-height:44px; box-sizing:border-box; }
.appt-create-staff-field .form-label { display:block; }
.appt-create-staff-field .text-muted { display:block; margin-top:6px; line-height:1.5; overflow-wrap:anywhere; }
.appt-timeline-event .appt-picker-meta { display:none; }
.appt-week-board { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); align-items:stretch; max-height:70dvh; overflow-y:auto; }
.appt-agenda-day { min-width:0; border-inline-end:1px solid var(--border-color); }
.appt-agenda-day:last-child { border-inline-end:0; }
.appt-agenda-heading { display:flex; justify-content:space-between; align-items:center; gap:6px; padding:12px 10px; background:var(--bg-card); border-bottom:1px solid var(--border-color); }
.appt-agenda-heading h3 { font-size:.78rem; font-weight:650; margin:0; }
.appt-agenda-heading > span { color:var(--text-muted); font-size:.72rem; font-variant-numeric:tabular-nums; }
.appt-agenda-day.today .appt-agenda-heading { color:var(--appt-accent-text); background:color-mix(in srgb,var(--primary) 5%,var(--bg-card)); }
.appt-agenda-items { display:grid; align-content:start; gap:8px; padding:8px; }
.appt-agenda-empty { color:var(--text-muted); font-size:.78rem; line-height:1.5; padding:12px 4px; margin:0; }
.appt-agenda { display:grid; }
.appt-agenda .appt-agenda-day { border-inline-end:0; border-bottom:1px solid var(--border-color); }
.appt-agenda .appt-agenda-heading { padding:12px 16px; }
.appt-agenda .appt-agenda-items { padding:12px; }
.appt-agenda .appt-cal-event { padding:12px 14px; }
.appt-agenda .appt-cal-event-name { white-space:normal; overflow-wrap:anywhere; font-size:.95rem; }
.appt-agenda .appt-cal-event-staff,.appt-agenda .appt-picker-meta { white-space:normal; overflow-wrap:anywhere; font-size:.8rem; }
.appt-agenda-block { display:flex; gap:10px; align-items:center; border:1px dashed var(--border-color); border-radius:9px; padding:12px; text-align:start; color:var(--text-secondary); background:var(--bg-secondary); font:inherit; font-size:.78rem; min-height:44px; cursor:pointer; }
.appt-agenda-block strong { display:block; font-weight:500; margin-top:4px; }
.appt-availability-panel { border-top:1px solid var(--border-color); padding:16px; }
.appt-availability-panel details + details { margin-top:8px; }
.appt-availability-panel summary { padding:12px 0; font-size:.82rem; cursor:pointer; min-height:44px; }
.appt-details-btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:44px; padding:8px; font:inherit; font-size:.78rem; border:0; background:transparent; color:var(--primary); cursor:pointer; white-space:nowrap; }
.appt-table th { padding:14px 12px; text-transform:none; letter-spacing:0; font-size:.76rem; }
.appt-table td { padding:14px 12px; }
.appt-page :is(button,summary,select,input):focus-visible { outline:2px solid var(--primary); outline-offset:3px; }
.appt-modal-overlay { animation:none; }
.appt-modal { animation:none; border-radius:16px; max-height:calc(100dvh - 32px); }
#appt-create-modal .appt-modal { height:min(680px,calc(100dvh - 32px)); }
#appt-create-modal .modal-body { flex:1; }
.appt-modal .modal-header { padding:18px 20px; }
.appt-modal .modal-footer { padding:14px 20px; border-top:1px solid var(--border-color); background:var(--bg-card); }
#appt-create-modal .modal-footer .btn-primary { flex:0 1 auto; min-width:132px; }
.appt-modal .modal-footer .btn { min-height:44px; padding:10px 16px; }
.appt-stepper { flex-shrink:0; padding:14px 20px; }
.appt-step span { display:block; line-height:1.35; overflow-wrap:anywhere; }
.appt-step-dot { width:28px; height:28px; }
.appt-slot-grid { grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; }
.appt-slot { font-family:inherit; font-size:.85rem; font-weight:600; font-variant-numeric:tabular-nums; border-radius:10px; }
.appt-slot:hover { color:var(--primary); background:color-mix(in srgb,var(--primary) 7%,var(--bg-card)); }
.appt-slot.selected { color:#fff; background:var(--primary); border-color:var(--primary); }
.appt-picker-card.selected { background:color-mix(in srgb,var(--primary) 5%,var(--bg-card)); }
.appt-detail-actions { position:relative; }
.appt-detail-actions > summary { display:flex; align-items:center; justify-content:center; gap:8px; list-style:none; min-height:44px; padding:10px 14px; border:1px solid var(--border-color); border-radius:9px; background:var(--bg-card); color:var(--text-secondary); font-size:.84rem; cursor:pointer; }
.appt-detail-actions > summary::-webkit-details-marker { display:none; }
.appt-detail-action-menu { position:absolute; inset-inline-end:0; bottom:calc(100% + 8px); z-index:4; display:grid; gap:5px; width:240px; max-width:calc(100vw - 48px); max-height:50dvh; overflow-y:auto; padding:8px; border:1px solid var(--border-color); border-radius:12px; background:var(--bg-card); box-shadow:0 8px 24px rgba(15,23,42,.18); }
.appt-modal .appt-detail-action-menu .btn { width:100%; justify-content:flex-start; text-align:start; white-space:normal; }
.appt-staff-panel-heading,.appt-staff-chip { font-size:14px; }
.appt-cal-event-name { font-size:14px; }
.appt-cal-event-time,.appt-cal-event-staff,.appt-cal-event .appt-picker-meta { font-size:12px; }
@media (max-width:900px) {
    .appt-page-header { align-items:flex-start; }
    .appt-page-title { font-size:1.15rem; }
    .appt-toolbar { grid-template-columns:auto minmax(100px,1fr) auto; gap:8px; }
    .appt-view-toggle button { padding-inline:12px; }
}
@media (max-width:768px) {
    .page-content.appt-page { padding:12px; }
    .appt-page-header { flex-direction:row; gap:12px; align-items:center; }
    .appt-page-title { font-size:18px; }
    .appt-page-title > i { display:none; }
    .appt-page-subtitle { font-size:.72rem; }
    .appt-header-actions { flex-shrink:0; gap:6px; }
    .appt-header-actions > .appt-new-btn { flex:0 0 44px; padding:10px; }
    .appt-header-actions > .appt-new-btn span { display:none; }
    .appt-page-action-menu .appt-settings-btn span,.appt-page-action-menu .appt-block-btn span { display:inline; }
    .appt-staff-panel { padding:12px; }
    .appt-staff-panel-heading { margin-bottom:8px; }
    .appt-staff-rail { display:none; }
    .appt-staff-select { display:grid; gap:6px; font-size:.75rem; color:var(--text-secondary); }
    .appt-staff-select > span { display:none; }
    .appt-staff-select select { width:100%; min-width:0; max-width:100%; height:46px; border:1px solid var(--border-color); border-radius:10px; background:var(--bg-card); color:var(--text-primary); padding:8px 10px; font:inherit; font-size:16px; }
    .appt-toolbar { grid-template-columns:minmax(0,1fr) auto; }
    .appt-view-toggle { grid-column:1/-1; display:flex; width:100%; }
    .appt-view-toggle button { flex:1; }
    .appt-search-field input { font-size:16px; min-width:0; }
    .appt-more-filters { position:static; }
    .appt-toolbar { position:relative; }
    .appt-filter-fields { width:100%; box-sizing:border-box; top:100%; grid-template-columns:1fr; }
    .appt-filter-fields input,.appt-filter-fields select { font-size:16px; }
    .appt-cal-nav { padding:12px; gap:8px; }
    .appt-cal-title { flex:1 0 100%; font-size:.88rem; }
    .appt-agenda .appt-cal-event-name { font-size:16px; }
    .appt-agenda .appt-cal-event-staff,.appt-agenda .appt-picker-meta { font-size:14px; }
    .appt-agenda .appt-cal-event-time { font-size:13px; }
    .appt-cal-nav > .appt-cal-nav-actions { flex:1; justify-content:flex-start; }
    .appt-cal-nav .appt-availability-toggle { font-size:.72rem; max-width:48%; text-align:start; }
    .appt-table tr { padding:14px; gap:8px 12px; }
    .appt-table td { padding:0; }
    .appt-table td::before { display:none; }
    .appt-table td:nth-child(1) { grid-area:1/1/2/2; color:var(--text-secondary); font-size:.75rem; }
    .appt-table td:nth-child(2) { grid-area:1/2/2/3; text-align:end; font-weight:700; }
    .appt-table td:nth-child(3) { grid-area:2/1/3/3; font-size:1rem; font-weight:700; }
    .appt-table td:nth-child(4) { grid-area:3/1/4/3; color:var(--text-secondary); font-size:.82rem; }
    .appt-table td:nth-child(5) { grid-area:4/1/5/3; font-size:.82rem; }
    .appt-table td:nth-child(5)::before { display:inline; content:attr(data-label) ': '; font-size:.75rem; }
    .appt-table td:nth-child(6) { grid-area:5/1/6/2; align-self:center; }
    .appt-table td:nth-child(7) { grid-area:5/2/6/3; }
    .appt-table td:nth-child(3) { font-size:16px; }
    .appt-table td:nth-child(4),.appt-table td:nth-child(5) { font-size:14px; }
    #appt-detail-modal .modal-footer { display:grid !important; grid-template-columns:1fr 1fr; gap:8px; }
    #appt-detail-modal .modal-footer > .btn-primary { grid-column:1/-1; grid-row:1; }
    #appt-detail-modal .modal-footer > .btn { width:100%; min-width:0; }
    .appt-detail-actions > summary { font-size:13px; }
    .appt-detail-action-menu { inset-inline-start:0; inset-inline-end:auto; }
    .appt-row-actions { justify-content:flex-end; }
    .appt-details-btn { padding:8px 0; white-space:normal; text-align:end; }
    .appt-modal-overlay { padding:8px; }
    .appt-modal { width:100% !important; max-height:calc(100dvh - 16px); border-radius:14px; }
    #appt-create-modal .appt-modal { height:calc(100dvh - 16px); }
    .appt-modal .modal-header { padding:12px 16px; }
    .appt-stepper { padding:12px; gap:4px; }
    .appt-step span { display:block; font-size:.65rem; }
    .appt-modal .modal-footer { padding:12px 16px max(12px,env(safe-area-inset-bottom)); }
    #appt-create-modal .modal-footer { display:grid !important; grid-template-columns:1fr 1fr; }
    #appt-create-modal .modal-footer .btn { min-width:0; margin:0; width:100%; font-size:.82rem; }
    .appt-slot-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
    #appt-create-modal input, #appt-create-modal select, #appt-create-modal textarea { font-size:16px; }
    .appt-create-staff-field { margin-top:14px; }
}
@media (prefers-reduced-motion:reduce) {
    .appt-page *, .appt-modal-overlay * { animation:none !important; transition:none !important; scroll-behavior:auto !important; }
}