.appointment-form{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:26px;align-items:start}
.appointment-screen-popup:has(.appointment-repeat-form){max-width:760px}
.appointment-form.appointment-repeat-form{grid-template-columns:minmax(0,1fr);gap:14px}
.appointment-repeat-form .appointment-fields,.appointment-repeat-form .appointment-booking{gap:14px}
.appointment-popup-main .appointment-repeat-form .appointment-section-title{margin-bottom:14px}
.appointment-repeat-date .field{margin-bottom:12px}
.appointment-repeat-date-controls{display:grid;grid-template-columns:44px minmax(0,1fr) 44px;gap:8px;align-items:stretch}
.appointment-repeat-date-controls input{min-width:0;width:100%;height:50px}
.appointment-repeat-date-controls .btn{min-width:44px;min-height:44px;padding:0}
.appointment-repeat-date-controls svg{width:20px;height:20px}
.appointment-repeat-date .field-hint:last-child{margin-bottom:0}
.appointment-repeat-customer{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:4px 12px;margin-bottom:12px;overflow-wrap:anywhere}
.appointment-repeat-customer strong{font-size:16px}.appointment-repeat-customer>span{font-size:12px;color:var(--muted)}
.appointment-repeat-facts{display:grid;gap:8px;margin:0;font-size:13px}
.appointment-repeat-facts>div{display:grid;grid-template-columns:54px minmax(0,1fr);gap:10px}.appointment-repeat-facts dt{color:var(--muted)}.appointment-repeat-facts dd{margin:0;overflow-wrap:anywhere}
.appointment-repeat-price{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-top:12px;font-size:13px}.appointment-repeat-price>span{color:var(--muted)}.appointment-repeat-price>strong{font-size:16px;font-variant-numeric:tabular-nums}
.appointment-repeat-edit{margin-top:12px;border-top:1px solid var(--line)}
.appointment-repeat-edit>summary,.appointment-repeat-extras>summary{cursor:pointer;min-height:44px;align-content:center;font-size:13px;color:var(--green)}
.appointment-repeat-form .appointment-repeat-edit>.customer-form-card,.appointment-repeat-form .appointment-repeat-extras>.customer-form-card{padding:12px 0 0;border:0;border-radius:0;box-shadow:none;background:none}
.appointment-repeat-extras.customer-form-card,.appointment-popup-main .appointment-repeat-extras.customer-form-card{padding-block:4px}
.appointment-repeat-save.appointment-summary,.appointment-popup-main .appointment-repeat-save.appointment-summary{position:static;padding-block:14px}
.appointment-repeat-save .appointment-save{margin-top:0;gap:8px}.appointment-repeat-save .save-status{text-align:center}
@media(max-width:600px){.appointment-popup-main .appointment-repeat-save.appointment-summary{padding-block:12px}.appointment-repeat-customer{display:grid;gap:4px}}

.appointment-loading{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;width:100vw;height:100dvh;padding:36px 24px;overflow:hidden;overscroll-behavior:none}
.appointment-loading-backdrop{position:absolute;inset:0;background:linear-gradient(135deg,#edf3ed99,#f5f0e7b3);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);pointer-events:none}
html:has(.appointment-loading),body:has(.appointment-loading){overflow:hidden}
:root:has(.appointment-loading){scrollbar-gutter:auto}
.app-content:has(.appointment-loading){animation:none;opacity:1;pointer-events:auto}
.appointment-loading-card{position:relative;display:grid;justify-items:center;width:min(100%,300px);padding:28px 22px;text-align:center}
.appointment-loading-symbol{position:relative;display:grid;place-items:center;width:72px;height:72px;margin-bottom:20px;color:var(--green)}
.appointment-loading-symbol>svg{width:27px;height:27px;stroke-width:1.6}
.appointment-loading-spinner{position:absolute;inset:0;border:3px solid #e0e9e1;border-top-color:var(--green);border-right-color:#c58a46;border-radius:50%;animation:appointment-loading-spin 1.2s linear infinite}
.appointment-loading-card>p{margin:0;font-size:16px;font-weight:600;line-height:1.5;color:var(--green);text-wrap:balance}
.appointment-loading-caption{margin-top:8px;font-size:12px;line-height:1.5;color:var(--muted)}
@keyframes appointment-loading-spin{to{transform:rotate(360deg)}}
@media(max-width:600px){.appointment-loading{padding:28px 20px}.appointment-loading-card{max-width:270px;padding:24px 18px}.appointment-loading-symbol{width:64px;height:64px;margin-bottom:18px}}
@media(prefers-reduced-motion:reduce){.appointment-loading-spinner{animation:none}}

.appointment-summary.appointment-pending-summary{position:static;min-width:0}
.appointment-pending-content{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px}
.appointment-pending-content>div{min-width:0}
.appointment-pending-note{margin-top:20px}
.appointment-pending-note h3{margin:0 0 8px;font-size:13px}
.appointment-pending-actions{display:flex;flex-wrap:wrap;gap:10px;border-top:1px solid var(--line);margin-top:24px;padding-top:20px}
.appointment-pending-actions .btn{min-height:44px}
@media(max-width:700px){.appointment-pending-content{grid-template-columns:minmax(0,1fr);gap:24px}.appointment-pending-actions .btn{flex:1;padding:10px 12px}}

html.appointment-popup-open{overflow:hidden;scrollbar-gutter:stable}
.appointment-screen-popup{width:min(1160px,calc(100% - 48px));height:min(920px,calc(100dvh - 48px));max-width:none;max-height:none;margin:auto;padding:0;border:1px solid var(--line);border-radius:18px;background:var(--wash);color:var(--ink);box-shadow:0 24px 80px #12362d33;overflow:hidden}
.appointment-screen-popup[open]{display:grid;grid-template-rows:auto minmax(0,1fr)}
.appointment-screen-popup::backdrop{background:#102e285c;backdrop-filter:blur(2px)}
.appointment-popup-header{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 24px;border-bottom:1px solid var(--line);background:var(--white)}
.appointment-popup-heading{display:flex;align-items:center;flex-wrap:wrap;gap:8px 16px;min-width:0}
.appointment-popup-status{display:flex;align-items:center;flex-wrap:wrap;gap:8px}
.appointment-popup-status:empty{display:none}
.appointment-popup-status>.appointment-badge,.appointment-popup-status .appointment-signals>.is-confirmed{display:inline-flex;align-items:center;justify-content:center;min-width:80px;height:28px;padding:4px 9px;border:1px solid transparent;font-size:12px;font-weight:700;line-height:18px}
.appointment-popup-status .appointment-signals>.is-confirmed{border-color:#99ccad}
.appointment-edit-actions{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:10px}
.appointment-edit-actions>.btn{min-width:0;min-height:44px;padding:10px 8px}
.appointment-popup-header h1{margin:0;font:28px/1.2 Georgia,serif;letter-spacing:-.5px}
.appointment-heading-date{display:inline-block;font-size:.7em;font-weight:400;line-height:1.4;letter-spacing:0}
.appointment-save>.appointment-save-hint{margin:0;font-size:12px;line-height:1.6}
.appointment-popup-header .btn{min-height:44px;padding:9px 12px;font-size:13px;flex-shrink:0}
.appointment-popup-header svg{width:18px;height:18px}
.appointment-popup-body{min-height:0;overflow:auto;overscroll-behavior:contain;padding:24px;scrollbar-gutter:stable}
.appointment-popup-main{min-width:0}
.appointment-popup-main>.customer-back,.appointment-popup-main>.customer-heading{display:none}
.appointment-popup-main .customer-form-card{padding:22px}
.appointment-popup-main .appointment-summary{top:0}
.appointment-popup-main .appointment-outcome-panel{margin-bottom:18px;gap:16px}
.appointment-popup-main .appointment-section-title{font-size:21px;margin-bottom:18px}
.busy .appointment-popup-body{opacity:.75;pointer-events:none}
@media(max-width:600px){.appointment-screen-popup{width:calc(100% - 16px);height:calc(100dvh - 16px);border-radius:12px}.appointment-popup-header{padding:10px 14px;gap:8px}.appointment-popup-header h1{font-size:23px}.appointment-popup-header .btn{padding:8px;font-size:12px}.appointment-popup-body{padding:14px;scrollbar-gutter:auto}.appointment-popup-main .customer-form-card{padding:16px}.appointment-popup-main .appointment-form,.appointment-popup-main .appointment-fields{gap:14px}}



.appointment-agenda{list-style:none;padding:0;margin:0}.appointment-agenda-hour{display:grid;grid-template-columns:70px minmax(0,1fr);gap:16px;padding:12px 24px;border-top:1px solid var(--line)}.appointment-agenda-time{padding-top:12px}.appointment-agenda-time strong{font-size:20px;font-weight:600;font-variant-numeric:tabular-nums}.appointment-agenda-content{display:grid;gap:6px;min-width:0}
.appointment-agenda-booking{min-width:0;border:1px solid var(--line);border-left:3px solid var(--green);border-radius:8px;background:var(--white)}.appointment-agenda-booking.is-cancelled{border-left-color:#c9b4a7;background:#faf8f4}
.appointment-agenda-entry{display:grid;grid-template-columns:minmax(0,1fr) auto 16px;align-items:center;gap:16px;min-height:64px;padding:9px 12px;text-decoration:none;color:var(--ink);border-radius:6px}.appointment-agenda-entry:hover{background:#f5f8f0}.appointment-agenda-entry:focus-visible{outline:2px solid var(--green);outline-offset:2px}.appointment-agenda-info{min-width:0;display:grid;gap:4px}.appointment-agenda-primary{display:flex;gap:12px;align-items:baseline;min-width:0;line-height:19px}.appointment-agenda-primary strong{font-size:14px;font-weight:600;max-width:55%;color:var(--green)}.appointment-agenda-primary>span{font-size:13px;color:var(--ink);flex:1}.appointment-agenda-primary>*{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}.appointment-agenda-secondary{display:flex;flex-wrap:wrap;gap:2px 10px;font-size:12px;line-height:16px;color:var(--muted)}.appointment-agenda-secondary>span:first-child{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.appointment-agenda-note{font-size:11px;line-height:15px;color:var(--muted);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.appointment-agenda-meta{display:grid;justify-items:end;align-content:center;gap:5px}.appointment-agenda-meta .appointment-badge{font-size:10px;line-height:14px;padding:3px 6px}.appointment-agenda-price{font-size:12px;line-height:16px;font-weight:600;white-space:nowrap}.appointment-agenda-open{display:flex;color:var(--green)}.appointment-agenda-open svg{width:16px;height:16px}.appointment-agenda-booking>.appointment-outcome-actions{padding:0 12px 8px;gap:6px;justify-content:flex-end}
.appointment-agenda-free{display:flex;align-items:center;gap:8px;padding:4px 8px;border:1px dashed #b7c8b8;border-radius:8px;background:#f5f8f0}.appointment-available-label{font-size:11px;font-weight:600;color:var(--green);flex-shrink:0}.appointment-free-experts{display:flex;flex-wrap:wrap;gap:5px;min-width:0;flex:1}.appointment-free-experts .btn{min-height:32px;font-size:12px;line-height:18px;padding:5px 8px;gap:4px;white-space:normal}.appointment-free-experts .btn>span{overflow-wrap:anywhere;min-width:0}.appointment-free-experts svg{width:14px;height:14px;flex-shrink:0}.appointment-agenda-message{margin:20px 24px;padding:16px;border:1px dashed var(--line);border-radius:12px;font-size:14px;color:var(--muted)}
@media(max-width:600px){.appointment-agenda-hour{grid-template-columns:minmax(0,1fr);gap:6px;padding:10px 12px}.appointment-agenda-time{padding:0;line-height:20px}.appointment-agenda-time strong{font-size:16px}.appointment-agenda-entry{gap:8px;padding:9px 10px;grid-template-columns:minmax(0,1fr) auto 12px}.appointment-agenda-primary{display:grid;gap:0;line-height:18px}.appointment-agenda-primary strong{max-width:100%;font-size:13px}.appointment-agenda-primary>span{font-size:12px}.appointment-agenda-secondary{font-size:11px;gap:0 7px;line-height:15px}.appointment-agenda-info{gap:3px}.appointment-agenda-meta{gap:4px}.appointment-agenda-price{font-size:11px}.appointment-agenda-open svg{width:12px;height:12px}.appointment-agenda-free{gap:6px;padding:5px 6px}.appointment-free-experts .btn{padding:5px 7px;font-size:12px}.appointment-agenda-message{margin:18px}}
.appointment-fields{display:grid;gap:20px;min-width:0}.appointment-fields .customer-form-card{min-width:0}
.appointment-service-fields{margin-top:16px;min-width:0}.appointment-service-fields>.field:last-of-type{margin-bottom:0}
.appointment-section-title{font:23px Georgia,serif;display:flex;align-items:center;gap:12px;margin:0 0 24px}
.appointment-fields .appointment-discount-card{padding:12px 14px}
.appointment-discount-fields{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);align-items:start;gap:10px}
.appointment-discount-fields .field{min-width:0;margin:0}
.appointment-discount-fields label{font-size:12px;margin-bottom:6px}
.appointment-discount-fields .field :is(input,select){min-width:0;height:40px;min-height:40px;padding:8px 10px;font-size:13px}
.appointment-discount-fields input:disabled{background:var(--wash);color:var(--muted)}
.appointment-discount-fields .optional,.appointment-discount-fields .field-error:empty{display:none}
#appointment-customer-search>label{display:block;font-size:13px;margin-bottom:9px}#appointment-customer-search .text-link{color:var(--green);font-weight:600}
.appointment-customer-results{border:1px solid var(--line);border-radius:12px;margin-top:14px;max-height:245px;overflow:auto}
.appointment-customer-choice{display:grid;grid-template-columns:minmax(0,1fr) 20px;gap:4px 12px;background:transparent;border:0;border-bottom:1px solid var(--line);width:100%;text-align:left;padding:13px 14px;color:var(--ink);cursor:pointer;font:inherit;min-height:66px}
.appointment-customer-choice:last-child{border-bottom:0}.appointment-customer-choice:hover{background:var(--wash)}.appointment-customer-choice strong{font-size:14px;overflow-wrap:anywhere}.appointment-customer-choice span{font-size:12px;color:var(--muted);grid-column:1}.appointment-customer-choice svg{grid-column:2;grid-row:1/3;width:19px;height:19px;align-self:center}
.appointment-selected{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px;padding:12px 14px;background:#eff3e9;border:1px solid #d9e3d0;border-radius:12px}.appointment-selected:has(>.appointment-customer-context){grid-template-columns:minmax(0,1fr) minmax(0,2fr) auto}.appointment-selected-identity{min-width:0;display:grid;gap:5px}.appointment-selected-identity strong{font-size:15px;overflow-wrap:anywhere}.appointment-selected-identity>span{font-size:12px;color:var(--muted)}.appointment-selected>.btn{grid-column:-2;font-size:12px;padding:10px;min-height:44px}
.appointment-customer-context{display:grid;gap:16px;margin-top:14px;min-width:0}.appointment-customer-context h3{font:600 13px system-ui;margin:0 0 10px}.appointment-customer-flags{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.appointment-customer-rating,.appointment-customer-ban{display:inline-flex;align-items:center;gap:8px;padding:7px 10px;border:1px solid;border-radius:8px;font-size:12px;font-weight:600;line-height:20px}.appointment-customer-rating{background:#fff6da;border-color:#e6c66b;color:#805700}.appointment-customer-rating>span{font-size:18px;letter-spacing:1px}.appointment-customer-ban{background:#fff0ed;border-color:#e4b4aa;color:#923d30}.appointment-customer-ban svg{width:17px;height:17px;flex-shrink:0}.appointment-customer-ban-hint{margin:-8px 0 0;font-size:12px;color:#923d30;line-height:1.5}.appointment-customer-note{padding:12px 14px;border:1px solid #e6d7a8;border-left:3px solid #c39736;border-radius:8px;background:#fffbef}.appointment-customer-note p{margin:0;font-size:13px;line-height:1.6;white-space:pre-wrap;overflow-wrap:anywhere}.appointment-customer-recent{min-width:0}.appointment-customer-recent .field-hint{margin:0}.appointment-customer-recent .btn{margin-top:8px;font-size:12px}.appointment-customer-recent-list{list-style:none;margin:0;padding:0;border:1px solid var(--line);border-radius:10px;overflow:hidden}.appointment-customer-recent-list>li{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px 14px;padding:12px;background:var(--white)}.appointment-customer-recent-list>li+li{border-top:1px solid var(--line)}.appointment-customer-recent-main{display:grid;gap:5px;min-width:0;flex:1 1 180px}.appointment-customer-recent-main strong{font-size:13px;color:var(--green);overflow-wrap:anywhere}.appointment-customer-recent-main>span{font-size:12px;line-height:1.5;color:var(--muted);overflow-wrap:anywhere}.appointment-customer-recent-meta{display:flex;flex-wrap:wrap;align-items:center;align-content:start;gap:8px;font-size:12px}.appointment-customer-recent-meta>span:last-child{white-space:nowrap;font-weight:600}
.appointment-details .appointment-customer-context h3{margin:0 0 10px}
.appointment-customer-recent{padding:8px 10px;border:1px solid #ead38f;border-radius:10px;background:#fff6d7}
.appointment-customer-context .appointment-customer-recent>h3{font-size:12px;margin-bottom:6px}
.appointment-customer-recent-list{border-color:#eadba9}
.appointment-customer-recent-list>li{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:3px 10px;padding:6px 8px;background:#fffbeb}
.appointment-customer-recent-main{gap:2px}
.appointment-customer-recent-main strong{font-size:12px;line-height:18px}
.appointment-customer-recent-main>span{font-size:11px;line-height:16px}
.appointment-customer-recent-list>li+li{border-color:#eadba9}
.appointment-customer-recent-list>li.is-cancelled{background:#fff5df}
.appointment-customer-recent-side{display:flex;align-items:center;gap:6px;min-width:0}
.appointment-customer-recent .appointment-repeat{margin:0;min-height:32px;padding:5px 8px;font-size:11px;gap:5px;border-color:#d5b45c;background:#fff0b5;white-space:nowrap}
.appointment-customer-recent .appointment-repeat svg{width:14px;height:14px}
.appointment-customer-recent-side .appointment-badge{font-size:10px;line-height:16px;padding:2px 6px}
.appointment-customer-recent .appointment-repeat:hover:not(:disabled){background:#ffe79a;border-color:#b78d28}
.appointment-repeat svg{width:17px;height:17px;flex-shrink:0}
.appointment-customer-recent-cancel-reason{grid-column:1/-1;margin:0;font-size:11px;line-height:16px;color:#923d30;white-space:pre-wrap;overflow-wrap:anywhere}
@media(max-width:600px){.appointment-customer-recent-side{flex-direction:column;align-items:flex-end;gap:3px}}
.appointment-selected>.appointment-customer-context{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;margin:0}
.appointment-selected .appointment-customer-flags{flex:0 0 auto;max-width:100%;gap:6px}
.appointment-selected .appointment-customer-rating,.appointment-selected .appointment-customer-ban{padding:2px 6px;gap:5px;font-size:11px}
.appointment-selected .appointment-customer-rating>span{font-size:15px}
.appointment-selected .appointment-customer-rating>strong{font-size:11px}
.appointment-selected .appointment-customer-ban-hint{flex-basis:100%;order:1;margin:0;font-size:11px}
.appointment-selected .appointment-customer-note{display:flex;align-items:baseline;gap:6px;flex:1 1 130px;min-width:0;padding:4px 0 4px 10px;border:0;border-left:2px solid #c39736;border-radius:0;background:transparent}
.appointment-selected .appointment-customer-note h3{flex-shrink:0;margin:0;font-size:12px;line-height:1.5}
.appointment-selected .appointment-customer-note p{min-width:0;font-size:12px;line-height:1.5}
@media(max-width:600px){.appointment-selected,.appointment-selected:has(>.appointment-customer-context){grid-template-columns:minmax(0,1fr) auto;gap:8px 10px;padding:10px 12px}.appointment-selected>.btn{grid-column:2;grid-row:1}.appointment-selected>.appointment-customer-context{grid-column:1/-1;grid-row:2}}

.appointment-working-hours{font-size:13px;color:var(--muted);margin-bottom:16px}.appointment-working-hours strong{color:var(--ink)}
.appointment-slots{display:grid;grid-template-columns:repeat(auto-fill,minmax(66px,1fr));gap:8px;margin:14px 0}.appointment-slot{min-height:44px;border:1px solid var(--line);border-radius:10px;background:var(--white);color:var(--green);font:600 13px system-ui;cursor:pointer;font-variant-numeric:tabular-nums}.appointment-slot:hover:not(:disabled){background:var(--wash);border-color:var(--green)}.appointment-slot[aria-pressed=true]{background:var(--green);color:white;border-color:var(--green)}.appointment-slot:disabled{background:#f2f1eb;color:#84877c;opacity:1;text-decoration:line-through;text-decoration-thickness:1.5px;cursor:not-allowed}
.appointment-notes{margin-bottom:0}.appointment-summary{position:sticky;top:24px}.appointment-summary .eyebrow{font-size:10px;letter-spacing:1.7px;margin-bottom:19px}.appointment-summary h2{font:26px Georgia,serif;line-height:1.25;overflow-wrap:anywhere;margin:0 0 10px}.appointment-summary p.muted{font-size:12px;margin-bottom:23px}.appointment-summary dl{margin:0}.appointment-summary dl>div{display:flex;justify-content:space-between;gap:18px;margin-bottom:16px;font-size:13px}.appointment-summary dt{color:var(--muted);flex-shrink:0}.appointment-summary dd{text-align:right;overflow-wrap:anywhere;margin:0}.appointment-total{border-top:1px solid var(--line);padding-top:20px;display:flex;justify-content:space-between;gap:10px;align-items:center}.appointment-total span{font-size:12px;color:var(--muted)}.appointment-total strong{font:25px Georgia,serif}.appointment-save{display:grid;gap:12px;margin-top:28px}.appointment-save>.btn{font-size:14px}.appointment-save .save-status{font-size:11px}.appointment-save .btn-quiet{min-height:40px;padding:6px}
.appointment-slot[aria-pressed=true]:hover:not(:disabled){background:var(--green);color:white;border-color:var(--green)}
.appointment-booking{display:grid;gap:20px;min-width:0;padding:0;margin:0;border:0}.appointment-booking:disabled input,.appointment-booking:disabled select{color:var(--ink);opacity:1;background:var(--wash)}
.appointment-cancel-area{border-top:1px solid var(--line);margin-top:20px;padding-top:20px}.appointment-cancel-area .btn{width:100%;font-size:13px}.appointment-cancel-area .field-hint{font-size:11px;margin-bottom:0}.appointment-cancel{color:#923d30;border-color:#ddc4bb}.appointment-cancel-confirm{background:#923d30;border-color:#923d30}.appointment-cancel-confirm:hover{background:#753025}
.appointment-dialog form{display:block}.appointment-dialog .field{width:100%}.appointment-dialog-actions{display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap}.appointment-dialog input{font-size:14px}.appointment-dialog .field label{font-size:13px}.appointment-conflict{margin-top:15px}
.appointment-badge{display:inline-flex;width:fit-content;background:#f5e9e1;color:#853b2f;border-radius:6px;padding:5px 8px;font-size:11px;font-weight:600;white-space:nowrap}.appointment-hour .appointment-badge{color:#853b2f;margin-top:4px}.is-cancelled .appointment-hour strong{text-decoration:line-through;color:var(--muted)}.is-cancelled{background:#faf8f4}.appointment-open{display:flex;align-items:center;justify-content:flex-end;gap:8px;color:var(--green);font-size:12px;min-height:44px;margin-top:5px;text-decoration:none}.appointment-open:hover{text-decoration:underline}.appointment-open svg{width:16px;height:16px}
.appointment-detail-grid{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:26px;align-items:start}.appointment-details,.appointment-cancellation{min-width:0;overflow-wrap:anywhere}.appointment-details h2,.appointment-cancellation h2{font:27px Georgia,serif;margin:0 0 12px}.appointment-details h3,.appointment-cancellation h3{font-size:14px;margin:26px 0 12px}.appointment-details dl{margin:28px 0 0}.appointment-details dl>div{display:flex;gap:20px;justify-content:space-between;border-bottom:1px solid var(--line);padding:14px 0;font-size:14px}.appointment-details dt{color:var(--muted);flex-shrink:0}.appointment-details dd{margin:0;text-align:right}.appointment-cancellation p{font-size:14px;line-height:1.6}.appointment-cancellation .hint-box{margin:24px 0}
.appointment-day-bar{border-bottom:1px solid var(--line);padding:16px 20px}.appointment-day-filters{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.appointment-day-filters.has-agenda-filters{grid-template-columns:repeat(4,minmax(0,1fr))}.appointment-day-filters>div{min-width:0}.appointment-day-bar label{display:block;font-size:12px;margin-bottom:6px}.appointment-day-filters input[type=date],.appointment-day-filters select{width:100%;min-width:0;height:44px;min-height:44px;padding:10px 12px;font-size:14px}.appointment-day-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px}.appointment-day-actions .btn{min-width:44px;min-height:44px;padding:9px 12px;font-size:12px}
.appointment-list{list-style:none;padding:0;margin:0}.appointment-row{display:grid;grid-template-columns:90px minmax(0,1fr) 145px;gap:24px;padding:24px;border-top:1px solid var(--line);align-items:start}.appointment-hour{display:grid;gap:5px}.appointment-hour strong{font-size:23px;font-weight:600;font-variant-numeric:tabular-nums}.appointment-hour span{font-size:11px;color:var(--muted)}.appointment-person{display:grid;gap:5px;min-width:0}.appointment-person>span{font-size:14px;overflow-wrap:anywhere}.appointment-person small{font-size:12px;color:var(--muted);overflow-wrap:anywhere}.appointment-note{font-size:12px;color:var(--muted);white-space:pre-wrap;overflow-wrap:anywhere;margin:6px 0 0}.appointment-price{display:grid;gap:5px;text-align:right}.appointment-price strong{font-size:16px;font-weight:600}.appointment-price span{font-size:10px;color:var(--muted)}
@media(max-width:850px){.appointment-form{grid-template-columns:minmax(0,1fr)}.appointment-summary{position:static}.appointment-summary dl>div{max-width:none}.appointment-summary h2{font-size:27px}}
@media(max-width:600px){.workspace-nav{gap:20px;padding:0 16px;overflow-x:auto;white-space:nowrap}.workspace-nav a{flex-shrink:0;font-size:12px}.appointment-form{gap:20px}.appointment-fields{gap:16px}.appointment-section-title{font-size:22px;margin-bottom:20px}.appointment-day-bar{padding:14px}.appointment-day-filters{gap:12px 10px}.appointment-day-actions .btn{min-height:44px;padding:9px 12px}.appointment-row{grid-template-columns:67px minmax(0,1fr);gap:10px 15px;padding:20px 18px}.appointment-hour strong{font-size:21px}.appointment-person .customer-name{font-size:15px}.appointment-person>span{font-size:13px}.appointment-price{grid-column:2;text-align:left;display:flex;align-items:center;gap:8px}.appointment-price strong{font-size:14px}.appointment-save{margin-top:24px}.appointment-slots{grid-template-columns:repeat(auto-fill,minmax(62px,1fr))}.appointment-customer-choice{padding:12px}}
@media(max-width:850px){.appointment-detail-grid{grid-template-columns:minmax(0,1fr)}.appointment-day-filters.has-agenda-filters{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.appointment-booking{gap:16px}.appointment-price{flex-wrap:wrap}.appointment-open{flex-basis:100%;justify-content:flex-start;margin:0}.appointment-hour .appointment-badge{font-size:10px;padding:5px}.appointment-details dl>div{font-size:13px;gap:12px}.appointment-dialog{padding:22px}.appointment-dialog-actions .btn{flex:1;white-space:normal}}

.appointment-badge.status-active{background:#ffedbd;color:#78520b}.appointment-badge.status-completed{background:#d9eddf;color:#24583d}.appointment-badge.status-no_show{background:#fff0d6;color:#805710}
/* Keep status colors below drag/drop and newly-created highlights in the cascade. */
.appointment-agenda-booking:where(:has(.appointment-badge.status-active)),.appointment-row:where(:has(.appointment-badge.status-active)){background:#fff5d9;border-color:#e5ce98;border-left-color:#c18a24}
.appointment-agenda-booking:where(:has(.appointment-badge.status-completed)),.appointment-row:where(:has(.appointment-badge.status-completed)){background:#f2f3f1;border-color:#d8ddd8;border-left-color:#b6c1b8}
.appointment-row:where(:has(.appointment-badge.status-active)){box-shadow:inset 3px 0 #c18a24}
.appointment-row:where(:has(.appointment-badge.status-completed)){box-shadow:inset 3px 0 #b6c1b8}
.appointment-day-counts{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin:0;padding:4px 12px;background:#f8f8f2;border-bottom:1px solid var(--line)}.appointment-count{display:flex;align-items:center;gap:8px;min-width:0;min-height:40px;padding:6px 8px;border:1px solid transparent;border-radius:7px;background:transparent;color:var(--green);text-align:left;font:inherit;cursor:pointer}.appointment-count:hover{background:#edf2e7;border-color:#cbd8c5}.appointment-count[aria-pressed=true]{background:#e3eddf;border-color:#96af91}.appointment-count:focus-visible{outline:2px solid var(--green);outline-offset:1px}.appointment-day-counts .appointment-count-label{font-size:12px;color:var(--muted);margin:0;min-width:0;overflow-wrap:anywhere}.appointment-day-counts .appointment-count-value{margin:0;font-size:20px;font-weight:400;flex-shrink:0;line-height:1.2;font-variant-numeric:tabular-nums;color:var(--green)}
.appointment-outcome-actions{display:flex;gap:10px;flex-wrap:wrap}.appointment-outcome-actions .btn{font-size:13px;min-height:44px;padding:10px 14px}.appointment-row>.appointment-outcome-actions{grid-column:2/-1}.appointment-outcome-panel{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:24px}.appointment-outcome-panel h2{font:24px Georgia,serif;margin:0 0 12px}.appointment-outcome-panel p{font-size:13px;color:var(--muted);margin:10px 0 0}.appointment-outcome-panel>div{min-width:0}.appointment-result-notes{margin-top:28px}.appointment-result-notes .field{margin-bottom:0}
@media(max-width:850px){.appointment-outcome-panel{align-items:stretch;flex-direction:column}}
@media(max-width:600px){.appointment-day-counts{grid-template-columns:repeat(2,minmax(0,1fr));padding:4px 8px;gap:4px}.appointment-row>.appointment-outcome-actions{grid-column:1/-1;margin-top:4px}.appointment-outcome-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.appointment-outcome-actions .btn{padding:10px 8px;font-size:12px}.appointment-outcome-actions svg{width:16px;height:16px}.appointment-hour .appointment-badge{white-space:normal;max-width:100%;text-align:center}.appointment-result-notes .customer-form-footer .btn{width:100%}}
.appointment-signals{display:flex;flex-wrap:wrap;gap:3px 8px;font-size:11px;line-height:16px}.appointment-signals:empty{display:none}.appointment-first{color:#7e5a16}.appointment-nearby,.is-confirmed{color:var(--green)}.awaiting-confirmation{color:#936422}.appointment-discount{font-size:10px;color:#816019;text-align:right;line-height:15px}.appointment-confirm-action{display:flex;justify-content:flex-end;padding:0 12px 5px}.appointment-confirm-action .btn{font-size:11px;min-height:32px;padding:4px 10px}.appointment-outcome-panel .appointment-confirm-action{padding:0}.appointment-free-choice{display:flex;align-items:stretch;gap:0;max-width:100%;min-width:0;border:1px solid var(--line);border-radius:6px;background:var(--white)}.appointment-free-choice>.btn{border:0;background:transparent}.appointment-free-choice>a{min-width:0;flex:1;border-radius:5px 0 0 5px}.appointment-free-choice>.appointment-block{width:28px;min-width:28px;min-height:32px;padding:5px;color:var(--muted);border-left:1px solid var(--line);border-radius:0 5px 5px 0}.appointment-free-choice>.appointment-block svg{width:16px;height:16px}.appointment-free-choice>a:hover{background:#e7efdf}.appointment-free-choice>.appointment-block:hover{color:#805710;background:#fff0d6}.appointment-leave{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px;padding:8px 12px;border:1px dashed #cebfa6;border-radius:8px;background:#f7f2e9;font-size:12px}.appointment-leave .btn{font-size:12px;min-height:40px;padding:7px 12px}.appointment-history{margin-top:24px}.appointment-history-list{margin:0;padding:0;list-style:none}.appointment-history-list>li{padding:14px 0;border-bottom:1px solid var(--line);overflow-wrap:anywhere}.appointment-history-list strong{display:block;font-size:14px}.appointment-history-list small{display:block;color:var(--muted);font-size:11px;margin-top:5px}.appointment-history-list p,.appointment-history-list ul{font-size:12px;color:var(--muted);line-height:1.7;margin:8px 0 0}.appointment-history-list ul{padding-left:18px}.appointment-custom-time{margin:12px 0 20px}.appointment-total small{display:block;margin-top:4px}@media(max-width:600px){.appointment-signals{font-size:10px;gap:2px 6px}.appointment-free-choice{flex-wrap:nowrap}.appointment-confirm-action .btn{min-height:44px}.appointment-free-experts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%}.appointment-free-choice .btn:first-child{flex:1}.appointment-discount{max-width:92px}.appointment-agenda-meta{max-width:110px}.customer-history .customer-pagination{gap:8px;flex-wrap:wrap;font-size:12px}}
.appointment-agenda-booking:has(>.appointment-confirm-action.is-compact){display:grid;grid-template-columns:minmax(0,1fr) 44px;align-items:center}.appointment-agenda-booking:has(>.appointment-confirm-action.is-compact)>.appointment-agenda-entry{grid-template-columns:minmax(0,1fr) auto;gap:10px}.appointment-agenda-booking:has(>.appointment-confirm-action.is-compact) .appointment-agenda-open{display:none}.appointment-agenda-booking>.appointment-confirm-action.is-compact{padding:0 4px 0 0;grid-column:2;grid-row:1;align-self:stretch;align-items:center;justify-content:center}.appointment-confirm-action.is-compact .btn{width:36px;min-height:44px;padding:8px;border:1px solid var(--line);border-radius:8px;background:#f8f7f1;color:#927441}.appointment-confirm-action.is-compact .btn.is-confirmed{background:#e7efdf;color:var(--green);border-color:#b7c8b8}.appointment-confirm-action.is-compact svg{width:24px;height:24px;flex-shrink:0}.appointment-agenda-booking>.appointment-outcome-actions{grid-column:1/-1}

/* Use the available row width for badges while keeping the expert easy to find. */
.appointment-agenda-info{grid-template-columns:minmax(0,max-content) minmax(0,1fr);align-items:center;gap:6px 20px}
.appointment-agenda-details{display:grid;gap:5px;min-width:0}
.appointment-agenda-primary strong{max-width:none}
.appointment-agenda-secondary{align-items:center}
.appointment-agenda-secondary>.appointment-agenda-expert{display:inline-flex;align-items:center;gap:6px;min-width:0;max-width:100%;padding:2px 7px;border-radius:5px;background:#edf3ed;color:var(--green);line-height:20px}
.appointment-agenda-expert>span{font-size:11px;font-weight:400;flex-shrink:0}
.appointment-agenda-expert>strong{min-width:0;font-size:14px;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.appointment-agenda-info>.appointment-signals{min-width:0}
.appointment-agenda-info>.appointment-agenda-note{grid-column:1/-1}
@media(max-width:600px){.appointment-agenda-info{grid-template-columns:minmax(0,1fr);gap:6px}.appointment-agenda-secondary{gap:4px 7px}.appointment-agenda-secondary>.appointment-agenda-expert{padding:1px 6px}.appointment-agenda-expert>strong{font-size:13px}}

/* Keep first visits and confirmation states visible in every appointment list. */
.appointment-signals{align-items:center;gap:5px 6px}
.appointment-signals>.appointment-first,.appointment-signals>.appointment-online,.appointment-signals>.is-confirmed,.appointment-signals>.awaiting-confirmation{display:inline-flex;align-items:center;gap:5px;padding:4px 9px;border:1px solid;border-radius:6px;font-size:11px;font-weight:700;line-height:16px;white-space:nowrap}
.appointment-signals>.appointment-online{color:#235c8b;background:#e8f3fc;border-color:#b7d6ed}
.appointment-online svg{width:14px;height:14px}
.appointment-signals>.appointment-first{color:#5b3da0;background:#f0e9ff;border-color:#cdb9ef}
.appointment-signals>.is-confirmed{color:#17613e;background:#e3f4e9;border-color:#99ccad}
.appointment-signals>.awaiting-confirmation{color:#80500c;background:#fff0cb;border-color:#e1b85b}
.appointment-signals>span>span[aria-hidden]{font-size:13px;line-height:16px}

.appointment-confirm-action{gap:6px;flex-wrap:wrap;align-items:center}
.appointment-row>.appointment-confirm-action{grid-column:2/-1;padding:0;justify-content:flex-start}
.appointment-confirm-action .appointment-whatsapp,.appointment-confirm-action.is-compact .appointment-whatsapp{color:#fff;background:#25d366;border-color:#25d366;gap:6px}
.appointment-confirm-action .appointment-whatsapp svg{width:26px;height:26px;flex-shrink:0}
.appointment-confirm-action .appointment-whatsapp:hover,.appointment-confirm-action.is-compact .appointment-whatsapp:hover{background:#1dbb59;border-color:#1dbb59}
.appointment-confirm-action .appointment-sms{font-size:12px;font-weight:600}
.appointment-confirm-action .appointment-sms:disabled{background:#f0f1ee;border-color:#d9ddd7;color:#64716b;opacity:1;cursor:not-allowed}
.appointment-sms-feedback{position:fixed;z-index:90;right:16px;bottom:calc(16px + env(safe-area-inset-bottom,0px));display:flex;align-items:center;gap:12px;max-width:min(480px,calc(100% - 32px));padding:12px 12px 12px 16px;border:1px solid var(--line);border-radius:12px;background:var(--white);color:var(--ink);box-shadow:0 6px 24px #174b4026;font-size:14px;line-height:1.5}
.appointment-sms-feedback>.btn{flex:none;min-width:44px;min-height:44px;padding:10px}
.appointment-agenda-booking:has(>.appointment-confirm-action.is-compact){grid-template-columns:minmax(0,1fr) auto}
.appointment-agenda-booking>.appointment-confirm-action.is-compact{flex-direction:row;flex-wrap:nowrap;gap:4px;padding:5px 8px 5px 0}
.appointment-confirm-action.is-compact .btn{width:44px;min-height:44px}
.appointment-outcome-panel .appointment-confirm-action{flex-shrink:0}
@media(max-width:600px){.appointment-row>.appointment-confirm-action{grid-column:1/-1}.appointment-outcome-panel .appointment-confirm-action{justify-content:flex-start}}
@media(max-width:600px){.appointment-agenda-booking:has(>.appointment-confirm-action.is-compact){grid-template-columns:minmax(0,1fr)}.appointment-agenda-booking>.appointment-confirm-action.is-compact{grid-column:1;grid-row:auto;justify-content:flex-end;padding:0 10px 8px}.appointment-outcome-panel .appointment-confirm-action{flex-shrink:1}}

@media(max-width:600px){.appointment-day-filters,.appointment-day-filters.has-agenda-filters{grid-template-columns:repeat(2,minmax(0,1fr))}}

.appointment-movable{position:relative;cursor:grab;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
.appointment-movable :is(a,button){-webkit-user-drag:none;-webkit-touch-callout:none}
.appointment-movable:focus-visible,[data-transfer-focus]:focus-visible{outline:2px solid var(--green);outline-offset:2px}
.appointment-drag-hint{position:fixed;bottom:18px;left:50%;transform:translateX(-50%);z-index:40;width:max-content;max-width:calc(100vw - 24px);margin:0;padding:10px 14px;border:1px solid #b7c8b8;border-radius:10px;background:#f5f8f0;box-shadow:0 4px 18px #173b2520;font-size:12px;line-height:1.6;color:var(--green);pointer-events:none}
.appointment-drag-hint:empty{display:none}
.appointment-transfer-active [data-transfer-focus]{outline:1px dashed #9aaa91;outline-offset:2px}
.appointment-transfer-active [data-transfer-unavailable]{opacity:.45;cursor:not-allowed}
.appointment-transfer-active [data-transfer-unavailable] :is(a,button){cursor:not-allowed}
.appointment-transfer-active .is-drag-source{opacity:.45;outline:2px solid var(--green)}
.appointment-transfer-active .is-drop-target{outline:3px solid var(--green);outline-offset:2px;background:#e7efdf;box-shadow:0 0 0 5px #e7efdf}
.appointment-transfer-summary{white-space:pre-line}
.btn.appointment-list-outcome.appointment-currency-complete{min-width:44px;width:auto;min-height:44px;padding:6px 10px}
.appointment-currency-symbol{font-size:22px;font-weight:700;line-height:1}
.appointment-currency-symbol.is-currency-code{font-size:14px}

.appointment-list-page{margin-top:20px}
.appointment-list-page>.customer-heading{margin-bottom:16px;gap:16px}
.appointment-list-page>.customer-heading .eyebrow{font-size:10px;line-height:14px;margin-bottom:6px}
.appointment-list-page>.customer-heading h1{font-size:34px;line-height:1.1;margin-bottom:4px}
.appointment-list-page>.customer-heading p:last-child{font-size:13px;line-height:18px}
.appointment-list-page>.customer-heading .calendar-actions .btn{min-height:44px;padding:10px 14px;font-size:13px}
.appointment-list-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 20px}
.appointment-list-toolbar>.appointment-day-actions{flex-shrink:0}
.appointment-free-choice{border-color:#c9c469;background:#fbfae8;box-shadow:0 1px 2px #173b2514}
.appointment-free-choice>a.btn{background:#faf8cf;color:var(--green)}
.appointment-free-choice>a svg{stroke-width:2.3}
.appointment-free-choice>a.btn:hover{background:#f5f0b5;color:var(--green)}
.appointment-free-choice>.appointment-block{background:#fbfae8;color:#687047;border-left-color:#dcd69c}
.appointment-free-choice.is-past{border-color:var(--line);background:#f3f4ef;box-shadow:none;color:var(--muted)}
.appointment-free-choice.is-past>a.btn{border-radius:5px;background:#f3f4ef}
.appointment-free-choice.is-past>a.btn:hover{background:#e7efdf}
@media(max-width:850px){.appointment-list-page>.customer-heading{flex-wrap:wrap}.appointment-list-toolbar{flex-wrap:wrap}.appointment-list-toolbar>.appointment-day-actions{margin-left:auto}}
@media(max-width:600px){.appointment-list-page{margin-top:16px}.appointment-list-page>.customer-heading{gap:12px;margin-bottom:14px}.appointment-list-page>.customer-heading h1{font-size:30px}.appointment-list-page>.customer-heading .calendar-actions{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);width:100%;gap:6px}.appointment-list-page>.customer-heading .calendar-actions .btn{padding:8px 6px;font-size:12px;gap:5px}.appointment-list-page>.customer-heading .calendar-actions svg{width:16px;height:16px;flex-shrink:0}.appointment-day-filters input[type=date],.appointment-day-filters select{padding:9px;font-size:14px}.appointment-list-toolbar{padding:10px 14px;gap:8px}.appointment-list-toolbar>.appointment-day-actions{width:100%;justify-content:space-between;gap:6px}.appointment-day-actions .btn{padding:9px 10px}.appointment-day-counts .appointment-count-label{font-size:11px}.appointment-day-counts .appointment-count-value{font-size:18px}}

@media(max-width:600px),(pointer:coarse){.appointment-free-experts .btn{min-height:44px}.appointment-free-choice>.appointment-block{width:36px;min-width:36px;min-height:44px}}

/* Shared spacing and button dimensions for appointment confirmation controls. */
.appointment-outcome-panel{flex-wrap:wrap;gap:24px}
.appointment-outcome-panel>div:first-child{display:grid;justify-items:start;gap:8px;flex:1 1 280px}
.appointment-outcome-panel h2,.appointment-outcome-panel p{margin:0}
.appointment-outcome-panel .appointment-signals{gap:8px}
.appointment-detail-actions{display:flex;flex-direction:column;align-items:flex-end;gap:8px;max-width:100%;margin-left:auto}
.appointment-detail-actions:empty{display:none}
.appointment-confirm-action,.appointment-agenda-booking>.appointment-confirm-action.is-compact{gap:8px}
.appointment-confirm-action:not(.is-compact){display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,176px);width:max-content;max-width:100%;padding:0}
.appointment-confirm-action>.btn{box-sizing:border-box;height:44px;min-height:44px;min-width:0;padding:8px;font-size:12px;line-height:16px;border-radius:8px;gap:8px;white-space:normal;text-align:center}
.appointment-confirm-action:not(.is-compact)>.btn{width:100%}
.appointment-confirm-action.is-compact>.btn{width:44px;min-width:44px;height:44px;padding:8px}
.appointment-confirm-action>.btn svg{width:20px;height:20px;flex-shrink:0}
.appointment-confirm-action>.btn[data-action="appointment-confirmation"]{border:1px solid #b7c8b8;background:#f5f8f0;color:var(--green)}
.appointment-confirm-action>.btn[data-action="appointment-confirmation"]:hover{background:#e7efdf;border-color:var(--green)}
.appointment-confirm-action.is-compact>.btn[data-action="appointment-confirmation"]{padding-inline:4px;font-size:11px}
.appointment-confirm-action>.btn.is-confirmed[data-action="appointment-confirmation"]{background:#187744;border-color:#187744;color:#fff}
.appointment-confirm-action>.btn.is-confirmed[data-action="appointment-confirmation"]:hover{background:#125c34;border-color:#125c34;color:#fff}
@media(max-width:850px){.appointment-outcome-panel>div:first-child{flex-basis:auto}.appointment-detail-actions{width:100%}}
@media(max-width:600px){
  .appointment-confirm-action:not(.is-compact){grid-auto-columns:minmax(0,1fr);width:100%}
  .appointment-detail-actions>.appointment-confirm-action:has(>.btn:only-child){width:144px}
  .appointment-confirm-action:not(.is-compact)>.btn{padding:4px;font-size:11px;line-height:16px}
  .appointment-confirm-action:not(.is-compact)>.appointment-whatsapp{font-size:0;gap:0}
  .appointment-confirm-action:not(.is-compact)>.appointment-whatsapp svg{width:24px;height:24px}
}

/* Place the change details beside the event summary to keep the audit trail compact. */
.appointment-history>h2{margin:0 0 8px}
.appointment-history-list>li{display:grid;grid-template-columns:minmax(210px,1fr) minmax(0,2fr);gap:8px 24px;align-items:center;padding:10px 0}
.appointment-history-list>li:last-child{border-bottom:0;padding-bottom:0}
.appointment-history-list strong{line-height:20px}
.appointment-history-list small{line-height:16px;margin-top:2px}
.appointment-history-list p,.appointment-history-list ul{margin:0;line-height:1.5}
.appointment-history-list ul{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:4px 20px;list-style:none;padding:0}
.appointment-history-field{font-weight:600;color:var(--ink)}
.appointment-history-summary{position:relative;min-width:0;padding-left:36px}
.appointment-history-icon{position:absolute;left:0;top:5px;display:grid;place-items:center;width:28px;height:28px;border-radius:8px}
.appointment-history-icon svg{width:18px;height:18px;stroke-width:1.9}
.appointment-history-icon.history-positive{color:#25634a;background:#e7f0e5}
.appointment-history-icon.history-change{color:#356580;background:#eaf0f5}
.appointment-history-icon.history-negative{color:#a04436;background:#f9ebe6}
.appointment-history-icon.history-neutral{color:#88651e;background:#f5efdf}
.appointment-history-list .appointment-history-meta{display:flex;align-items:center;gap:5px;min-width:0;height:16px;line-height:16px}
.appointment-history-meta time{color:var(--ink);font-size:12px;font-weight:650;font-variant-numeric:tabular-nums;white-space:nowrap}
.appointment-history-actor{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.appointment-history-list .appointment-cancel-text{grid-column:1/-1}
@media(max-width:600px){.appointment-history-list>li{grid-template-columns:minmax(0,1fr);gap:6px}.appointment-history-list ul{gap:4px}}

.appointment-day-counts{grid-template-columns:repeat(3,minmax(0,1fr))}
.appointment-day-counts.has-free-count{grid-template-columns:repeat(4,minmax(0,1fr))}


.appointment-count[aria-pressed=true] .appointment-count-label{color:var(--green);font-weight:600}
@media(max-width:600px),(pointer:coarse){.appointment-count{min-height:44px;padding:6px;gap:6px}}

.appointment-confirm-action.appointment-list-actions{display:flex;flex-wrap:nowrap;width:auto;min-width:0;max-width:100%;justify-content:flex-end}
.appointment-confirm-action.appointment-list-actions>.btn{width:auto;flex:0 0 auto}
.appointment-confirm-action.appointment-list-actions>.appointment-list-outcome{white-space:nowrap;color:var(--green);background:var(--white);border-color:var(--line)}
.appointment-confirm-action.appointment-list-actions>.appointment-list-outcome:hover{background:var(--wash);border-color:var(--green)}
.appointment-confirm-action.appointment-list-actions>.appointment-list-outcome svg{width:16px;height:16px}
@media(max-width:900px){.appointment-agenda-booking:has(>.appointment-list-actions>.appointment-list-outcome){grid-template-columns:minmax(0,1fr)}.appointment-agenda-booking:has(>.appointment-list-actions>.appointment-list-outcome)>.appointment-list-actions{grid-column:1;grid-row:auto;padding:0 10px 8px;justify-content:flex-start;overflow-x:auto}.appointment-row>.appointment-list-actions{justify-content:flex-start;overflow-x:auto}}
@media(max-width:600px){.appointment-agenda-booking>.appointment-list-actions{justify-content:flex-start;overflow-x:auto;gap:6px}}
.appointment-confirm-action.appointment-list-actions>.appointment-list-cancel{color:#923d30;background:#fff4f1;border:1px solid #ddc4bb;min-width:44px}
.appointment-confirm-action.appointment-list-actions>.appointment-list-cancel:hover{background:#fbe4dd;border-color:#923d30}

.appointment-confirm-action.appointment-list-actions>.appointment-restore{width:auto;min-width:104px;padding:8px 12px;white-space:nowrap;color:var(--green);background:#f5f8f0;border:1px solid #b7c8b8}
.appointment-confirm-action.appointment-list-actions>.appointment-restore:hover{background:#e7efdf;border-color:var(--green)}

.appointment-cancel-dialog{width:min(540px,calc(100% - 32px));max-height:calc(100dvh - 32px);padding:24px;overflow:hidden}
.appointment-cancel-dialog[open]{display:flex;flex-direction:column}
.appointment-cancel-dialog h2{flex-shrink:0;margin:0 0 10px}
.appointment-cancel-dialog #appointment-cancel-message{flex-shrink:0;font-size:13px;line-height:1.5;margin:0 0 16px}
.appointment-cancel-dialog form{display:flex;flex-direction:column;flex-wrap:nowrap;gap:16px;min-height:0}
.appointment-cancel-fields{overflow-y:auto;min-height:0;padding:4px;margin:-4px -4px 0}
.appointment-cancel-reasons{border:0;padding:0;margin:0 0 16px;min-width:0;display:grid;gap:6px}
.appointment-cancel-reasons legend{font-size:13px;font-weight:650;padding:0;margin-bottom:8px}
.appointment-cancel-option{display:flex;align-items:center;gap:10px;min-height:44px;padding:9px 12px;border:1px solid var(--line);border-radius:9px;background:#f7f9f5;font-size:13px;font-weight:600;line-height:1.4;cursor:pointer}
.appointment-cancel-option:hover{border-color:#a7beb0}
.appointment-cancel-option:has(input:checked){border-color:var(--green);background:#e7efdf;color:var(--green)}
.appointment-cancel-option input[type=radio]{width:17px;height:17px;min-height:0;padding:0;margin:0;flex:0 0 17px;accent-color:var(--green)}
.appointment-cancel-option span{min-width:0;overflow-wrap:anywhere}
.appointment-cancel-dialog .field{margin-bottom:12px}
.appointment-cancel-dialog textarea{font-size:14px;line-height:1.5;min-height:80px;max-height:160px;resize:vertical}
.appointment-cancel-dialog .appointment-cancel-hint{font-size:12px;line-height:1.5;margin:0}
.appointment-cancel-dialog .appointment-dialog-actions{flex-shrink:0;padding-top:14px;border-top:1px solid var(--line)}
.appointment-cancel-dialog .appointment-dialog-actions .btn{min-height:44px}
.appointment-cancel-text{white-space:pre-wrap}
.appointment-slot-history{padding:16px 20px;margin:24px 0 0;min-width:0}
.appointment-slot-history>summary{cursor:pointer;font-size:14px;font-weight:650;line-height:24px;min-height:28px;color:var(--green)}
.appointment-slot-history>summary:focus-visible{outline:3px solid #c88f4c;outline-offset:4px;border-radius:4px}
.appointment-slot-history-count{display:inline-block;margin-left:10px;padding:1px 9px;border-radius:20px;background:var(--wash);font-size:12px;font-weight:500}
.appointment-slot-history-context{font-size:12px;color:var(--muted);margin:12px 0 0}
.appointment-slot-history-events{max-height:280px;overflow-y:auto;overscroll-behavior:contain;padding-right:10px!important}
.appointment-slot-history-events>li:last-child{border-bottom:0}
.appointment-slot-history-events ul>li{white-space:pre-wrap;overflow-wrap:anywhere}
.appointment-slot-history-events .appointment-slot-history-customer{color:var(--ink);margin-top:8px}
.appointment-slot-history .customer-pagination{margin-top:12px}
@media(max-width:600px){.appointment-slot-history{padding:14px 16px}.appointment-slot-history>summary{min-height:44px;align-content:center}.appointment-slot-history-events{max-height:260px}.appointment-slot-history .customer-pagination{gap:8px;flex-wrap:wrap}}
@media(max-width:600px){.appointment-cancel-dialog{padding:20px}.appointment-cancel-dialog h2{font-size:24px}.appointment-cancel-dialog .appointment-dialog-actions .btn{padding:10px 12px}}

.appointment-just-created,.appointment-just-restored{animation:appointment-row-pulse .9s ease-in-out 2;scroll-margin-block:24px}
/* Implicit start/end frames preserve each row's normal status background. */
@keyframes appointment-row-pulse{20%,55%{background-color:#ffe680}}
.appointment-reveal-focus:focus{outline:none}
@media(prefers-reduced-motion:reduce){.appointment-list-page #appointment-list :is(.appointment-just-created,.appointment-just-restored){background-color:#fff0a8}}

/* Separate customer and expert actions from the appointment detail link. */
.appointment-agenda-entry{position:relative;isolation:isolate}
.appointment-entry-link{position:absolute;inset:0;z-index:1;border-radius:6px}
.appointment-entry-link:focus-visible{outline:2px solid var(--green);outline-offset:2px}
.appointment-customer-link{position:relative;z-index:2;color:var(--green);font-size:16px;font-weight:600;line-height:20px;text-decoration:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.appointment-customer-link:hover{text-decoration:underline;text-underline-offset:3px}
.appointment-customer-link{display:inline-flex;align-items:baseline;gap:4px}
.appointment-customer-name{min-width:0;overflow:hidden;text-overflow:ellipsis}
.appointment-customer-count{flex:none;white-space:nowrap;font-variant-numeric:tabular-nums}
.appointment-customer-link:focus-visible,.appointment-agenda-expert:focus-visible{outline:2px solid var(--green);outline-offset:3px;border-radius:3px}
button.appointment-agenda-expert{position:relative;z-index:2;border:0;font-family:inherit;cursor:pointer;text-align:left}
button.appointment-agenda-expert:hover{background:#dce9df}
@media(max-width:600px){.appointment-customer-link{font-size:15px;line-height:20px}}

/* Compact day navigation and direct filtering from appointment information. */
.appointment-list-page .appointment-list-toolbar{border-bottom:1px solid var(--line);flex-wrap:wrap;padding:12px 20px}
.appointment-list-toolbar>.appointment-day-actions{margin-left:auto;align-items:center;flex-wrap:wrap;justify-content:flex-end;gap:6px}
.appointment-date-selection{display:flex;align-items:center;gap:6px;min-width:0}
.appointment-day-actions .btn{height:44px;min-height:44px;flex-shrink:0;box-sizing:border-box}
.appointment-date-selection>input[type=date]{appearance:none;-webkit-appearance:none;box-sizing:border-box;display:block;flex:0 0 144px;width:144px;min-width:0;height:44px;min-height:44px;max-height:44px;margin:0;padding:0 10px;border:1px solid var(--line);border-radius:10px;background:var(--white);color:var(--ink);font-family:inherit;font-size:14px;line-height:42px;text-align:center}
.appointment-date-selection>input[type=date]::-webkit-date-and-time-value{min-height:0;line-height:42px;text-align:center}
.appointment-date-selection>input[type=date]::-webkit-datetime-edit{display:inline-flex;align-items:center;min-height:42px;padding:0}
.appointment-active-filter{display:inline-flex;align-items:center;gap:6px;max-width:100%;min-height:32px;padding:4px 8px;border:1px solid #b7c8b8;border-radius:6px;background:#edf3ed;color:var(--green);font:inherit;font-size:12px;cursor:pointer;text-align:left;overflow-wrap:anywhere}
.appointment-active-filter svg{width:14px;height:14px;flex-shrink:0}
.appointment-service-filter{position:relative;z-index:2;display:block;min-width:0;max-width:100%;padding:0;border:0;border-radius:3px;background:transparent;color:var(--ink);font:inherit;font-size:13px;line-height:20px;text-align:left;cursor:pointer;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.appointment-service-filter:hover{text-decoration:underline;text-underline-offset:3px;color:var(--green)}
.appointment-service-filter:focus-visible,.appointment-active-filter:focus-visible{outline:2px solid var(--green);outline-offset:3px}
.appointment-agenda-primary>.appointment-service-filter{flex:0 1 auto}
.appointment-agenda-primary>.appointment-customer-link{max-width:60%}
.appointment-list-actions>.btn.appointment-awaiting-confirmation{background:#fff7df;border-color:#d7b46b;color:#80500c;animation:appointment-confirm-pulse 1.4s ease-in-out infinite}
.appointment-list-actions>.btn.appointment-awaiting-confirmation:hover,.appointment-list-actions>.btn.appointment-awaiting-confirmation:focus-visible{animation-play-state:paused}
@keyframes appointment-confirm-pulse{0%,100%{background-color:#fff7df;border-color:#d7b46b;color:#80500c;box-shadow:0 0 0 0 #e6a51500}40%,60%{background-color:#f2bd31;border-color:#ad760d;color:#493000;box-shadow:0 0 0 3px #e6a51540}}
@media(prefers-reduced-motion:reduce){.appointment-list-actions>.btn.appointment-awaiting-confirmation{animation:none}}

/* Each booking owns its time and expert, including bookings at the same hour. */
.appointment-list-page .appointment-agenda-hour{grid-template-columns:minmax(0,1fr);padding:8px 20px}
.appointment-card-list{display:grid;gap:6px;padding:8px 20px}
.appointment-open-slot-row{display:grid;grid-template-columns:148px minmax(0,1fr);gap:12px;align-items:center}
.appointment-open-slot-row>.appointment-agenda-time{padding:8px 12px}
.appointment-agenda-booking.appointment-compact-booking{display:grid;grid-template-columns:148px minmax(0,1fr) auto;align-items:stretch;padding:0}
.appointment-booking-schedule{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:6px;min-width:0;padding:10px 12px;border-right:1px solid var(--line)}
.appointment-booking-time{display:flex;align-items:center;min-height:28px;color:var(--ink);font-size:21px;line-height:28px;font-weight:600;font-variant-numeric:tabular-nums;text-decoration:none}
.appointment-booking-time:hover{color:var(--green);text-decoration:underline;text-underline-offset:3px}
.appointment-booking-time:focus-visible{outline:2px solid var(--green);outline-offset:2px;border-radius:3px}
.appointment-list-page .appointment-booking-schedule>.appointment-agenda-expert{display:inline-flex;align-items:center;gap:5px;max-width:100%;min-height:26px;padding:4px 7px;border:1px solid #d5e2d5;border-radius:6px;background:#edf3ed;color:var(--green)}
.appointment-compact-booking>.appointment-agenda-entry{grid-template-columns:minmax(0,1fr);gap:0;min-height:64px}
.appointment-compact-booking .appointment-agenda-info{grid-template-columns:minmax(0,1fr);align-content:center;gap:5px}
.appointment-agenda-side{display:flex;flex-direction:column;align-items:flex-end;justify-content:center;gap:8px;min-width:0;padding:9px 12px 9px 0}
.appointment-agenda-side>.appointment-agenda-meta{display:flex;flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:4px 8px;max-width:none}
.appointment-agenda-side>.appointment-list-actions,.appointment-row-side>.appointment-list-actions{padding:0;justify-content:flex-end;gap:6px}
.appointment-row{grid-template-columns:80px minmax(0,1fr) auto;gap:16px;padding-top:16px;padding-bottom:16px}
.appointment-row-side{display:grid;justify-items:end;gap:8px;min-width:0}
.appointment-row-side>.appointment-price{grid-column:auto}
.appointment-list-page .appointment-agenda-secondary{gap:6px;align-items:center}
.appointment-list-page .appointment-agenda-secondary>.appointment-signals{display:contents}
.appointment-list-page .appointment-agenda-secondary>.appointment-agenda-expert,.appointment-list-page .appointment-agenda-secondary .appointment-signals>span,.appointment-list-page .appointment-badge{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;gap:5px;box-sizing:border-box;height:26px;min-height:26px;max-width:100%;padding:4px 8px;border:1px solid transparent;border-radius:6px;font-size:11px;font-weight:700;line-height:16px;white-space:nowrap}
.appointment-list-page .appointment-agenda-expert>span,.appointment-list-page .appointment-agenda-expert>strong{font-size:11px;line-height:16px}
.appointment-list-page .appointment-agenda-secondary>.appointment-agenda-expert{border-color:#d5e2d5}
.appointment-list-page .appointment-signals>.appointment-online{border-color:#b7d6ed}
.appointment-list-page .appointment-signals>.appointment-first{border-color:#cdb9ef}
.appointment-list-page .appointment-signals>.appointment-nearby{background:#edf3ed;border-color:#d5e2d5}
.appointment-list-page .appointment-signals>.customer-banned{background:#fff0ed;border-color:#e7c1b8}
@media(max-width:600px){.appointment-agenda-booking.appointment-compact-booking{grid-template-columns:minmax(0,1fr)}.appointment-agenda-side{padding:0 10px 10px;gap:6px}.appointment-agenda-side>.appointment-list-actions{flex-wrap:wrap}.appointment-row{grid-template-columns:60px minmax(0,1fr);gap:10px}.appointment-row-side{grid-column:1/-1;justify-self:end}.appointment-row-side>.appointment-price{justify-content:flex-end;text-align:right}.appointment-row-side>.appointment-list-actions{flex-wrap:wrap}.appointment-compact-booking .appointment-agenda-primary{gap:2px}.appointment-agenda-primary>.appointment-customer-link{max-width:100%}}
@media(max-width:700px){.appointment-list-page .appointment-list-toolbar{padding:10px 14px}.appointment-list-toolbar>.appointment-all-dates{flex:0 0 100%;width:100%}.appointment-list-toolbar>.appointment-day-actions{display:grid;grid-template-columns:44px minmax(0,1fr) 44px;width:100%;margin:0;gap:6px}.appointment-date-selection>input[type=date]{width:100%;flex:1 1 0}.appointment-day-actions>.btn{margin:0}}

.appointment-all-dates{min-height:44px;padding:9px 12px;font-size:12px}
.appointment-all-dates[aria-pressed=true]{background:var(--green);border-color:var(--green);color:white}
.appointment-all-dates[aria-pressed=true]:hover:not(:disabled){background:var(--green-hover);color:white}
.appointment-date-group>h2{margin:0;padding:16px 22px;background:var(--wash);border-block:1px solid var(--line);font:22px/1.4 Georgia,serif;color:var(--green)}
.appointment-list-page #appointment-list>.customer-result-count{margin:0}
@media(max-width:600px){.appointment-date-group>h2{padding:14px;font-size:19px}}

/* Keep mobile counters in equal cells without splitting their labels. */
@media(max-width:700px){
  .appointment-day-counts{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;padding:6px 8px}
  .appointment-day-counts.has-free-count{grid-template-columns:repeat(4,minmax(0,1fr))}
  .appointment-day-counts .appointment-count{flex-direction:column;justify-content:center;gap:2px;min-height:50px;padding:4px;text-align:center}
  .appointment-day-counts .appointment-count-label{font-size:11px;line-height:16px;white-space:nowrap;overflow-wrap:normal}
  .appointment-day-counts .appointment-count-value{font-size:20px;line-height:24px}
}

/* Keep the same row structure on desktop and phone: schedule left, price and actions right. */
@media(max-width:600px){
  .appointment-list-page .appointment-agenda-hour{padding:8px 10px;gap:4px}
  .appointment-card-list{padding:8px 10px}
}
  .appointment-open-slot-row{grid-template-columns:100px minmax(0,1fr);gap:6px;align-items:stretch;border:1px dashed #b7c8b8;border-radius:8px;background:#f5f8f0}
  .appointment-open-slot-row>.appointment-agenda-time{display:flex;align-items:center;padding:10px 11px;border-right:1px solid var(--line)}
  .appointment-open-slot-row>.appointment-agenda-time strong{font-size:18px}
  .appointment-open-slot-row>.appointment-agenda-content{padding:8px 9px 8px 0}
  .appointment-open-slot-row .appointment-agenda-free{flex-direction:column;align-items:stretch;gap:4px;padding:0;border:0;border-radius:0;background:transparent}
  .appointment-open-slot-row .appointment-free-experts{grid-template-columns:repeat(auto-fit,minmax(min(100%,132px),1fr))}
  .appointment-agenda-booking.appointment-compact-booking{position:relative;isolation:isolate;grid-template-columns:98px minmax(0,1fr);grid-template-rows:auto 1fr auto;align-items:stretch;gap:4px 6px;padding:0}
  .appointment-compact-booking>.appointment-booking-schedule{grid-column:1;grid-row:1/-1;padding:8px 8px 8px 9px;justify-content:flex-start}
  .appointment-list-page .appointment-booking-schedule>.appointment-agenda-expert>span{display:none}
  .appointment-booking-time{font-size:18px;line-height:24px;min-height:44px}
  .appointment-compact-booking>.appointment-agenda-entry{grid-column:2;grid-row:2;display:grid;margin-top:-4px;padding:0 9px 0 0;min-height:0;align-items:start}
  .appointment-compact-booking .appointment-agenda-info,.appointment-compact-booking .appointment-agenda-details{display:grid;gap:4px}
  .appointment-compact-booking .appointment-agenda-primary{display:grid;align-content:start;gap:1px}
  .appointment-compact-booking .appointment-customer-link{max-width:100%;white-space:normal;overflow-wrap:break-word;text-overflow:clip}
  .appointment-compact-booking .appointment-service-filter{font-size:12px;line-height:18px}
  .appointment-compact-booking .appointment-agenda-secondary{gap:4px 6px}
  .appointment-list-page .appointment-compact-booking .appointment-agenda-secondary>.appointment-agenda-expert,.appointment-list-page .appointment-compact-booking .appointment-signals>span,.appointment-list-page .appointment-compact-booking .appointment-badge{height:22px;min-height:22px;padding:2px 6px}
  .appointment-compact-booking>.appointment-agenda-side{display:contents}
  .appointment-compact-booking .appointment-agenda-meta{grid-column:2;grid-row:1;display:flex;flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:4px 8px;max-width:none;padding:4px 9px 0 0}
  .appointment-list-page .appointment-compact-booking .appointment-badge.status-active{display:none}
  .appointment-compact-booking .appointment-agenda-price{max-width:100%;white-space:nowrap;text-align:right}
  .appointment-compact-booking .appointment-list-actions{position:relative;z-index:2;grid-column:2;grid-row:3;box-sizing:border-box;width:auto;margin:0 9px 8px 0;padding:0;gap:4px;flex-wrap:nowrap;justify-content:flex-end;align-self:end}
  .appointment-compact-booking .appointment-list-actions>.btn{min-width:44px;min-height:44px}
  .appointment-leave-row>.appointment-booking-schedule{padding:8px 8px 8px 9px;justify-content:flex-start}
  .appointment-leave-row .appointment-booking-time:hover{color:var(--ink);text-decoration:none}
  .appointment-leave-row .appointment-leave{height:100%;box-sizing:border-box;align-content:center}
@media(max-width:389px){
  .appointment-agenda-booking.appointment-compact-booking{grid-template-columns:82px minmax(0,1fr)}
  .appointment-open-slot-row{grid-template-columns:84px minmax(0,1fr)}
  .appointment-compact-booking .appointment-list-actions>.btn:not(.appointment-restore){flex:0 1 44px;min-width:0;width:44px;max-width:44px;padding:0 2px;font-size:10px}
}

/* Tablet and desktop have room for details beside the price and actions. */
@media(min-width:701px){
  .appointment-list-page .appointment-agenda-hour,.appointment-card-list{padding:6px 20px}
  .appointment-agenda-booking.appointment-compact-booking{grid-template-columns:98px minmax(0,1fr) auto;grid-template-rows:auto 1fr;gap:4px 12px}
  .appointment-compact-booking>.appointment-booking-schedule{padding-top:6px;padding-bottom:6px;gap:4px;justify-content:center}
  .appointment-compact-booking .appointment-booking-time{min-height:30px}
  .appointment-compact-booking>.appointment-agenda-entry{grid-column:2;grid-row:1/-1;margin-top:0;padding:8px 0;align-items:center}
  .appointment-compact-booking .appointment-agenda-meta{grid-column:3;grid-row:1;padding:6px 10px 0 0}
  .appointment-compact-booking .appointment-list-actions{grid-column:3;grid-row:2;margin:0 10px 6px 0}
}

.appointment-addon-fields{margin:0 0 20px;padding:0;border:0;min-width:0}.appointment-addon-fields legend{padding:0;font-size:14px;font-weight:600}.appointment-addon-options{display:grid;gap:8px;margin-top:10px}.appointment-addon-choice{display:grid;grid-template-columns:18px minmax(0,1fr) auto;align-items:center;gap:10px;min-height:44px;padding:10px 12px;border:1px solid var(--line);border-radius:8px;font-size:13px;cursor:pointer}.appointment-addon-choice:has(input:checked){border-color:#9db7a2;background:#edf4ed}.appointment-addon-choice input{width:18px;height:18px;margin:0;padding:0;accent-color:var(--green)}.appointment-addon-choice span{overflow-wrap:anywhere}.appointment-addon-choice strong{font-size:12px;white-space:nowrap}.appointment-addon-fields[aria-invalid=true]{outline:1px solid var(--error);outline-offset:4px}

/* The detail link covers the card; individual controls only cover their own content. */
.appointment-compact-booking>.appointment-agenda-entry{position:static;isolation:auto}
.appointment-compact-booking :is(.appointment-customer-link,.appointment-service-filter,.appointment-agenda-expert){width:fit-content;max-width:100%;justify-self:start}
.appointment-compact-booking .appointment-booking-time{position:relative;z-index:2}
.appointment-compact-booking .appointment-list-actions{pointer-events:none}
.appointment-compact-booking .appointment-list-actions>.btn{pointer-events:auto}

/* Finished appointments and leave slots recede while pending bookings stay prominent. */
.appointment-compact-booking.is-completed{grid-template-rows:auto 1fr;color:#626e67}
.appointment-compact-booking.is-completed .appointment-agenda-entry{padding-bottom:8px}
.appointment-compact-booking.is-completed :is(.appointment-booking-time,.appointment-customer-link,.appointment-service-filter,.appointment-agenda-price,.appointment-agenda-note){color:#626e67}
.appointment-compact-booking.is-completed .appointment-customer-link{font-weight:600}
.appointment-compact-booking.is-completed :is(.appointment-agenda-expert,.appointment-signals>span,.appointment-badge){color:#626e67;background:#e8ece7;border-color:#d6ddd5}
.appointment-open-slot-row.appointment-leave-row{background:#f3f3f0;border-color:#d4d9d2;color:#68736a}
.appointment-leave-row .appointment-leave{background:transparent;border-color:transparent;color:#68736a}
.appointment-leave-row :is(.appointment-booking-time,.appointment-agenda-expert){color:#68736a}
.appointment-list-page .appointment-leave-row .appointment-agenda-expert{color:#68736a;background:#e9ece6;border-color:#d6ddd2}
.appointment-leave-row .appointment-leave .btn{color:#68736a;background:#f7f8f5;border-color:#d8ddd5}
.appointment-leave-row .appointment-leave .btn:hover{color:var(--green);background:#e8ede5;border-color:#b7c8b8}
@media(min-width:701px){.appointment-compact-booking.is-completed .appointment-agenda-meta{grid-row:1/-1;align-self:center;padding-block:8px}}

.appointment-payment-discount{display:block;flex-basis:100%;color:var(--green);font-size:11px;line-height:16px;text-align:right;overflow-wrap:anywhere}
.appointment-details dl>.appointment-payment-discount-detail{padding-top:10px;border-top:1px solid var(--line)}
.appointment-payment-discount-detail dd,.appointment-receipt .appointment-receipt-discount dt,.appointment-receipt-discount dd{color:var(--green);font-weight:600}

/* Receipt details are read-only and fit the appointment side panel and phones. */
.appointment-receipt{margin-top:20px;padding-top:16px;border-top:1px solid var(--line)}
.appointment-cancellation .appointment-receipt h3{margin:0 0 12px;font-size:16px}
.appointment-receipt h4{margin:18px 0 8px;font-size:13px}
.appointment-receipt-items{list-style:none;margin:0;padding:0}
.appointment-receipt-items li{display:flex;align-items:start;justify-content:space-between;gap:12px;padding:10px 0;font-size:13px;border-bottom:1px solid var(--line)}
.appointment-receipt-items li>div{min-width:0}
.appointment-receipt-items strong{display:block;font-weight:600}
.appointment-receipt-items small{display:block;color:var(--muted);font-size:11px;line-height:1.5;margin-top:3px}
.appointment-receipt-items li>span{flex-shrink:0;white-space:nowrap;font-variant-numeric:tabular-nums}
.appointment-receipt-items .is-addon{padding-left:12px;font-size:12px}
.appointment-receipt-items .is-addon strong{font-weight:400}
.appointment-receipt dl{margin:12px 0 0}
.appointment-receipt dl>div{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:5px 0;font-size:13px}
.appointment-receipt dt{color:var(--muted);min-width:0}
.appointment-receipt dd{margin:0;text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.appointment-receipt .is-total{margin-top:6px;padding-top:12px;border-top:1px solid var(--line);font-size:17px;font-weight:700}
.appointment-receipt .is-total dt{color:var(--green)}
.appointment-receipt-balance{padding-top:10px;border-top:1px solid var(--line);font-weight:600}

/* Make the individual list filters stand out on hover and keyboard focus. */
.appointment-list-page :is(.appointment-agenda-expert,.appointment-service-filter){transition:background-color .15s ease,color .15s ease,border-color .15s ease}
.appointment-list-page :is(.appointment-compact-booking,.appointment-leave-row) .appointment-agenda-expert:is(:hover,:focus-visible){background:var(--green);border-color:var(--green);color:#fff}
.appointment-list-page .appointment-compact-booking .appointment-service-filter:is(:hover,:focus-visible){background:#dceee2;color:#136c47;text-decoration:underline;text-underline-offset:3px}

.appointment-completed-service{min-width:0;max-width:100%;font-size:12px;line-height:18px;color:inherit;overflow-wrap:anywhere}

.appointment-movable .appointment-entry-link{cursor:grab}
.appointment-transfer-active .is-drag-source,.appointment-transfer-active .is-drag-source *{cursor:grabbing}

/* Compact appointment actions, expert filter and customer search. */
.appointment-list-toolbar{flex-wrap:wrap}
.appointment-list-search-tools{display:flex;flex-wrap:wrap;flex-shrink:0;align-items:stretch;gap:8px;min-width:0;max-width:100%}
.appointment-list-toolbar>.appointment-active-filter{margin-left:auto;min-width:0}
.appointment-list-expert{box-sizing:border-box;width:180px;min-width:0;max-width:100%;height:44px;min-height:44px;padding:8px 12px;font-family:inherit;font-size:13px;line-height:20px;color:var(--ink);background:var(--white);border:1px solid #ccdeef;border-radius:10px}
.appointment-list-expert.is-selection-restored:focus{outline:none;box-shadow:none;border-color:#ccdeef}
.appointment-list-search-tools>.appointment-create{position:relative;flex:0 0 44px;width:44px;height:44px;min-height:44px;padding:0;gap:0}
.appointment-create-label{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.appointment-create svg{width:18px;height:18px;flex-shrink:0}
.appointment-list-search-tools>.appointment-all-dates,.appointment-list-search-tools>.appointment-reset-filters{flex:0 0 44px;width:44px;height:44px;min-height:44px;padding:0;line-height:18px}
.appointment-all-dates svg,.appointment-reset-filters svg{width:19px;height:19px;flex-shrink:0}
.appointment-list-search{position:relative;width:220px;max-width:100%;min-width:0;margin:0}
.appointment-list-search input[type=search]{display:block;box-sizing:border-box;min-width:0;width:100%;height:44px;min-height:44px;margin:0;padding:9px 32px;font-size:14px;line-height:24px}
.appointment-list-search input[type=search]::placeholder{font-family:inherit;font-size:12px;font-weight:600}
.appointment-list-search input[type=search]:placeholder-shown{text-align:center}
.appointment-list-search input::-webkit-search-cancel-button{-webkit-appearance:none}
.appointment-search-submit,.appointment-search-clear{position:absolute;top:0;display:flex;align-items:center;justify-content:center;width:32px;height:44px;padding:0;border:0;border-radius:8px;background:transparent;color:var(--muted);cursor:pointer}
.appointment-search-submit{left:0}.appointment-search-clear{right:0}
.appointment-list-search button:hover{color:var(--green)}
.appointment-list-search button:focus-visible{outline:2px solid var(--green);outline-offset:-3px}
.appointment-list-search button svg{width:17px;height:17px}
@media(max-width:700px){
 .appointment-list-page .appointment-list-toolbar{padding:10px 8px}
 .appointment-list-search-tools{display:grid;grid-template-columns:44px minmax(0,1.05fr) minmax(0,.95fr);width:100%;flex:0 0 100%;gap:4px}
 .appointment-list-search-tools:has(>.appointment-create){grid-template-columns:44px 44px minmax(0,1.05fr) minmax(0,.95fr)}
 .appointment-list-search-tools:has(>.appointment-reset-filters){grid-template-columns:44px 44px minmax(0,1fr)}
 .appointment-list-search-tools:has(>.appointment-create):has(>.appointment-reset-filters){grid-template-columns:44px 44px 44px minmax(0,1fr)}
 .appointment-list-search-tools:has(>.appointment-reset-filters) .appointment-list-search{grid-column:1/-1}
 .appointment-list-search{width:100%}
 .appointment-list-expert{width:100%;font-size:13px;padding-left:6px;padding-right:2px}
 .appointment-list-search input[type=search]{font-size:16px;padding-left:27px;padding-right:6px}
 .appointment-list-search:has(.appointment-search-clear) input[type=search]{padding-right:27px}
 .appointment-search-submit,.appointment-search-clear{width:27px}
}
@media(max-width:360px){
 .appointment-list-search-tools{grid-template-columns:44px minmax(0,1fr)}
 .appointment-list-search-tools:has(>.appointment-create){grid-template-columns:44px 44px minmax(0,1fr)}
 .appointment-list-search-tools:has(>.appointment-reset-filters){grid-template-columns:44px 44px minmax(0,1fr)}
 .appointment-list-search-tools:has(>.appointment-create):has(>.appointment-reset-filters){grid-template-columns:44px 44px 44px minmax(0,1fr)}
 .appointment-list-search{grid-column:1/-1}
 .appointment-list-expert{font-size:16px}
}
/* Compact rows keep the price with the service and reveal secondary actions in place. */
.appointment-list-page .appointment-agenda-booking.appointment-compact-booking{grid-template-columns:84px minmax(0,1fr) auto;grid-template-rows:auto;gap:0;align-items:stretch}
.appointment-list-page .appointment-compact-booking>.appointment-booking-schedule{grid-column:1;grid-row:1;padding:6px 8px;justify-content:center}
.appointment-list-page .appointment-compact-booking>.appointment-agenda-entry{grid-column:2;grid-row:1;margin:0;padding:6px 8px;min-width:0;align-self:center}
.appointment-list-page .appointment-compact-booking>.appointment-agenda-side{grid-column:3;grid-row:1;display:flex;flex-direction:column;justify-content:center;gap:3px;padding:6px 8px 6px 0;min-width:0}
.appointment-list-page .appointment-compact-booking .appointment-agenda-meta{padding:0;display:flex;justify-content:flex-end;gap:4px}
.appointment-list-page .appointment-compact-booking .appointment-agenda-primary{display:grid;gap:2px}
.appointment-list-page .appointment-service-price{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 10px;min-width:0}
.appointment-list-page .appointment-service-price .appointment-agenda-price{font-size:12px;text-align:left;white-space:nowrap;font-variant-numeric:tabular-nums}
.appointment-list-page .appointment-service-price .appointment-payment-discount{text-align:left}
.appointment-list-page .appointment-compact-booking .appointment-list-actions{position:relative;display:flex;align-items:center;justify-content:flex-end;gap:4px;margin:0;padding:0;grid-column:auto;grid-row:auto;z-index:4}
.appointment-list-page .appointment-compact-booking .appointment-actions-toggle{min-width:24px;width:24px;min-height:44px;padding:0;border-color:transparent;background:transparent;font-size:22px;line-height:1;color:var(--muted)}
.appointment-actions-panel{position:absolute;right:calc(100% + 4px);top:50%;display:flex;align-items:center;gap:5px;width:max-content;max-width:calc(100vw - 116px);padding:6px;border:1px solid var(--line);border-radius:10px;background:#fffefa;box-shadow:0 5px 16px #174b4020;opacity:0;visibility:hidden;pointer-events:none;transform:translate(8px,-50%);transition:opacity .15s ease,transform .15s ease,visibility .15s}
.appointment-actions-panel .btn{flex:0 0 auto;min-height:44px;padding:8px 10px;font-size:12px;white-space:nowrap}
.appointment-actions-panel>.btn.appointment-awaiting-confirmation{background:#fff7df;border-color:#d7b46b;color:#80500c;animation:appointment-confirm-pulse 1.4s ease-in-out infinite}
.appointment-actions-panel>.btn.appointment-awaiting-confirmation:is(:hover,:focus-visible){animation-play-state:paused}
.appointment-actions-panel>.btn.is-confirmed{background:#197643;border-color:#197643;color:#fff}
.appointment-reveal-actions.is-open .appointment-actions-panel,.appointment-reveal-actions:focus-within .appointment-actions-panel{opacity:1;visibility:visible;pointer-events:auto;transform:translate(0,-50%)}
@media(hover:hover) and (pointer:fine){.appointment-compact-booking:hover .appointment-actions-panel{opacity:1;visibility:visible;pointer-events:auto;transform:translate(0,-50%)}.appointment-actions-toggle{opacity:0}.appointment-compact-booking:hover .appointment-actions-toggle,.appointment-reveal-actions:focus-within .appointment-actions-toggle{opacity:1}}
@media(max-width:389px){.appointment-list-page .appointment-agenda-booking.appointment-compact-booking{grid-template-columns:70px minmax(0,1fr) auto}.appointment-actions-panel{gap:3px;padding:4px}.appointment-actions-panel .btn{padding:8px}}
@media(prefers-reduced-motion:reduce){.appointment-actions-panel{transition:none}.appointment-actions-panel>.btn.appointment-awaiting-confirmation{animation:none}}

/* Share row sizing and the time divider across bookings, leave and free slots. */
.appointment-list-page{--appointment-schedule-width:86px;--appointment-row-height:64px}
.appointment-list-page .appointment-agenda,.appointment-list-page .appointment-card-list{display:grid;grid-template-columns:minmax(0,1fr);grid-auto-rows:1fr;gap:6px;padding:6px 20px}
.appointment-list-page .appointment-agenda-hour,.appointment-list-page .appointment-agenda-hour>.appointment-agenda-content{display:contents}
.appointment-list-page .appointment-agenda-booking.appointment-compact-booking{grid-template-columns:calc(var(--appointment-schedule-width) - 2px) minmax(0,1fr) auto;min-height:var(--appointment-row-height)}
.appointment-list-page .appointment-open-slot-row{grid-template-columns:var(--appointment-schedule-width) minmax(0,1fr);gap:0;min-height:var(--appointment-row-height)}
.appointment-list-page :is(.appointment-compact-booking,.appointment-open-slot-row)>.appointment-booking-schedule{justify-content:center;gap:4px;padding:6px 8px}
.appointment-list-page .appointment-open-slot-row>.appointment-booking-schedule{padding-left:10px}
.appointment-list-page .appointment-booking-schedule>.appointment-booking-time{min-height:30px;font-size:18px;line-height:24px}
.appointment-list-page .appointment-booking-schedule>.appointment-available-label{display:inline-flex;align-items:center;min-height:26px;box-sizing:border-box;padding:4px 7px;border:1px solid #d5e2d5;border-radius:6px;background:#edf3ed;font-size:11px;line-height:16px;color:var(--green)}
.appointment-list-page .appointment-booking-schedule .appointment-agenda-expert strong{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.appointment-list-page .appointment-open-slot-row>.appointment-agenda-content{align-content:center;padding:6px 8px}
.appointment-list-page .appointment-leave-row .appointment-leave{height:auto;padding:0;border:0;border-radius:0}
.appointment-list-page .appointment-free-row .appointment-booking-time:hover{color:var(--ink);text-decoration:none}
/* Desktop rows stay compact without making every row as tall as the longest one. */
@media(min-width:1024px) and (hover:hover) and (pointer:fine){
 .appointment-list-page{--appointment-row-height:54px}
 .appointment-list-page .appointment-agenda,.appointment-list-page .appointment-card-list{grid-auto-rows:auto;align-content:start}
 .appointment-list-page .appointment-compact-booking>:is(.appointment-agenda-entry,.appointment-agenda-side),.appointment-list-page .appointment-open-slot-row>.appointment-agenda-content{padding-top:4px;padding-bottom:4px}
 .appointment-list-page .appointment-compact-booking :is(.appointment-agenda-info,.appointment-agenda-details){gap:2px}
 .appointment-list-page .appointment-compact-booking .appointment-agenda-secondary:empty{display:none}
}
/* Small and touch screens size each row to its own content instead of the tallest row. */
@media(max-width:1023px),(pointer:coarse){
 .appointment-list-page{--appointment-row-height:0px}
 .appointment-list-page .appointment-agenda,.appointment-list-page .appointment-card-list{grid-auto-rows:auto;align-content:start;gap:4px;padding:4px 10px}
 .appointment-list-page :is(.appointment-compact-booking,.appointment-open-slot-row)>.appointment-booking-schedule{gap:2px;padding-block:4px}
 .appointment-list-page .appointment-booking-schedule>.appointment-booking-time{min-height:24px;line-height:24px}
 .appointment-list-page .appointment-booking-schedule>:is(.appointment-agenda-expert,.appointment-available-label){min-height:24px;padding-block:3px}
 .appointment-list-page .appointment-compact-booking>:is(.appointment-agenda-entry,.appointment-agenda-side),.appointment-list-page .appointment-open-slot-row>.appointment-agenda-content{padding-top:4px;padding-bottom:4px}
 .appointment-list-page .appointment-compact-booking :is(.appointment-agenda-info,.appointment-agenda-details){gap:2px}
 .appointment-list-page .appointment-compact-booking .appointment-agenda-secondary:empty{display:none}
 .appointment-list-page .appointment-free-experts{display:flex;flex-wrap:nowrap;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:thin;padding-block:3px}
 .appointment-list-page .appointment-free-choice{flex:0 0 auto}
}
@media(max-width:389px){.appointment-list-page{--appointment-schedule-width:72px}}

/* A brighter blue workspace, with readable status colors and compact rows. */
#app:has(.appointment-list-page) .workspace-menu{border-color:#dce7f4;box-shadow:0 6px 24px #225da008}
#app:has(.appointment-list-page) .workspace-nav a[aria-current=page]{background:#e7f2ff;border-color:#bdd9f8;color:#1268b7}
#app:has(.appointment-list-page) .tag{background:#edf6ff;border-color:#d5e7f9;color:#225e91}
.appointment-list-page>.customer-panel{border-color:#d6e5f5;box-shadow:0 5px 22px #225da008}
.appointment-list-page .appointment-list-toolbar{background:#fff}
.appointment-list-page .appointment-list-search input[type=search]{border-color:#ccdeef}
.appointment-list-page .appointment-list-search input[type=search]::placeholder{color:#6a8097}
.appointment-list-page .appointment-all-dates[aria-pressed=true]{background:#2379c9;border-color:#2379c9;color:#fff}
.appointment-list-page .appointment-active-filter{background:#e9f4ff;border-color:#b9d7f7;color:#1765a9}
.appointment-list-page .appointment-day-counts{background:#f7fbff;border-color:#dce9f6}
.appointment-list-page .appointment-count{--count-ink:#176bb5;--count-wash:#e7f2ff;--count-line:#add0f5}
.appointment-list-page .appointment-count[data-filter=free]{--count-ink:#087d76;--count-wash:#e2f9f3;--count-line:#93dcd0}
.appointment-list-page .appointment-count[data-filter=active]{--count-ink:#bc3269;--count-wash:#fff0f6;--count-line:#f3b2cc}
.appointment-list-page .appointment-count[data-filter=completed]{--count-ink:#117648;--count-wash:#e4f8ed;--count-line:#9bdab7}
.appointment-list-page .appointment-count[data-filter=no_show]{--count-ink:#a65a13;--count-wash:#fff3e2;--count-line:#edc28d}
.appointment-list-page .appointment-count[data-filter=cancelled]{--count-ink:#65748b;--count-wash:#edf1f8;--count-line:#bbc9dc}
.appointment-list-page .appointment-count:is(:hover,[aria-pressed=true]){background:var(--count-wash);border-color:var(--count-line)}
.appointment-list-page .appointment-count :is(.appointment-count-label,.appointment-count-value){color:var(--count-ink)}
.appointment-list-page .appointment-count-value{font-weight:600}
.appointment-list-page .appointment-date-group>h2{background:#eaf4ff;border-color:#d2e5f8;color:#235b8f}
.appointment-list-page .appointment-agenda-booking.appointment-compact-booking{background:#f5faff;border-color:#cce1f6;border-left-color:#428fe0;color:#193955}
.appointment-list-page .appointment-compact-booking.is-awaiting{background:#fff4f8;border-color:#f3cbdb;border-left-color:#e84e8b}
.appointment-list-page .appointment-compact-booking.is-verified{background:#f0f7ff;border-color:#c3dcf8;border-left-color:#3488dd}
.appointment-list-page .appointment-compact-booking.is-completed{background:#edfbf3;border-color:#bde8cf;border-left-color:#22a66b;color:#193955}
.appointment-list-page .appointment-compact-booking[data-status=no_show]{background:#fff6e9;border-color:#f1d5ab;border-left-color:#e29a3b}
.appointment-list-page .appointment-compact-booking.is-cancelled{background:#f3f6fb;border-color:#d9e2ed;border-left-color:#9baac0}
.appointment-list-page .appointment-compact-booking .appointment-agenda-entry:hover{background:transparent}
.appointment-list-page .appointment-compact-booking :is(.appointment-customer-link,.appointment-booking-time){color:#3f454b}
.appointment-list-page .appointment-compact-booking :is(.appointment-service-filter,.appointment-completed-service,.appointment-agenda-price,.appointment-payment-discount,.appointment-discount){color:#3f454b}
.appointment-list-page .appointment-compact-booking .appointment-customer-link:hover{color:#3f454b}
.appointment-list-page .appointment-compact-booking .appointment-service-filter:is(:hover,:focus-visible){background:#dcefff;color:#3f454b}
.appointment-list-page :is(.appointment-compact-booking,.appointment-leave-row) .appointment-booking-schedule>.appointment-agenda-expert{padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;color:#3f454b}
.appointment-list-page .appointment-booking-schedule>.appointment-agenda-expert>strong{font-size:12px;font-weight:500}
.appointment-list-page :is(.appointment-compact-booking,.appointment-leave-row) .appointment-agenda-expert:is(:hover,:focus-visible){background:transparent;color:#3f454b;text-decoration:underline;text-underline-offset:3px}
.appointment-list-page .appointment-open-slot-row .appointment-booking-time,.appointment-list-page .appointment-open-slot-row .appointment-booking-time:hover{color:#3f454b}
.appointment-list-page .appointment-agenda-note{color:#60758a}
.appointment-customer-heading{display:flex;align-items:center;gap:8px;min-width:0}
.appointment-heading-signals{display:inline-flex;align-items:center;gap:6px;flex:0 0 auto;vertical-align:middle}
.appointment-heading-signals:empty,.appointment-agenda-secondary:has(>.appointment-signals:empty){display:none}
.appointment-heading-signals>.appointment-online{display:inline-flex;align-items:center;gap:4px;height:20px;padding:2px 6px;box-sizing:border-box;border:1px solid #b7d6ed;border-radius:6px;background:#e8f3fc;color:#235c8b;font-size:10px;font-weight:700;line-height:14px;white-space:nowrap}
.appointment-heading-signals>.appointment-online svg{width:12px;height:12px}
.appointment-list-page .appointment-customer-heading>.appointment-customer-link{flex:0 1 auto;max-width:100%;min-width:0}
.appointment-list-confirmation{display:inline-flex;align-items:center;flex:0 0 auto;gap:4px;height:20px;padding:2px 6px;border:1px solid;border-radius:6px;box-sizing:border-box;font-size:10px;font-weight:650;line-height:14px;white-space:nowrap}
.appointment-list-confirmation svg{width:12px;height:12px;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.appointment-list-confirmation.is-awaiting{background:#ffe4ef;border-color:#f6b5d0;color:#ac2458}
.appointment-list-confirmation.is-verified{background:#deefff;border-color:#abd0f7;color:#1664a8}
.appointment-list-page .appointment-compact-booking.is-completed .appointment-badge.status-completed{background:#168453;border-color:#168453;color:#fff;font-weight:700}
.appointment-list-page .appointment-badge.status-no_show{background:#fff0d5;border-color:#e9c080;color:#96520d}
.appointment-list-page .appointment-badge.status-cancelled{background:#e8eef7;border-color:#c3d0e1;color:#506784}
.appointment-list-page .appointment-actions-panel{background:#fff;border-color:#c9dff2;box-shadow:0 5px 18px #20578b22}
.appointment-list-page .appointment-actions-panel>.btn.appointment-awaiting-confirmation{animation:none;background:#ffe6f0;border-color:#f2b4ce;color:#b02f62}
.appointment-list-page .appointment-actions-panel>.btn.appointment-awaiting-confirmation:hover{background:#ffd7e8;border-color:#e990b5}
.appointment-list-page .appointment-actions-panel>.btn.is-confirmed{background:#2379c9;border-color:#2379c9;color:#fff}
.appointment-list-page .appointment-open-slot-row.appointment-free-row{align-items:stretch;border:1px dashed #a8dfd2;border-radius:8px;background:#edfbf8}
.appointment-list-page .appointment-free-row .appointment-agenda-free{min-width:0;padding:0;border:0;border-radius:0;background:transparent}
.appointment-list-page .appointment-booking-schedule>.appointment-available-label{padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;font-size:12px;font-weight:500;color:#3f454b}
.appointment-list-page .appointment-free-choice{background:#fff;border-color:#b8dbdf}
.appointment-list-page .appointment-free-choice>.btn{background:transparent;color:#3f454b}
.appointment-list-page .appointment-free-choice>a:hover{background:#ddf6f5;color:#3f454b}
.appointment-list-page .appointment-free-choice>.appointment-block{background:#f3fbfb;border-color:#c5e2e3;color:#63858b}
.appointment-list-page .appointment-open-slot-row.appointment-leave-row{background:#fff6ed;border-color:#efcfaf;color:#9a591e}
.appointment-list-page .appointment-leave-row .appointment-leave{background:transparent;color:#9a591e}
.appointment-list-page .appointment-leave>span{padding:3px 8px;border:1px solid #f2d2a8;border-radius:6px;background:#ffefd9;color:#9a591e;font-weight:600}
.appointment-list-page .appointment-leave .btn{background:#fff;border-color:#edcfb1;color:#9a591e}
/* Keep one set of free-slot actions, grouped on desktop and split into rows on phones. */
.appointment-free-expert-row,.appointment-free-expert-actions{display:contents}
.appointment-free-expert-row>.appointment-free-mobile-schedule{display:none}
@media(max-width:700px){
 .appointment-list-page .appointment-open-slot-row.appointment-free-row,
 .appointment-list-page .appointment-free-row>.appointment-agenda-content,
 .appointment-list-page .appointment-free-row .appointment-agenda-free,
 .appointment-list-page .appointment-free-row .appointment-free-experts{display:contents}
 .appointment-list-page .appointment-free-row>.appointment-booking-schedule{display:none}
 .appointment-list-page .appointment-free-expert-row{display:grid;grid-template-columns:var(--appointment-schedule-width) minmax(0,1fr);min-width:0;min-height:60px;border:1px dashed #a8dfd2;border-radius:8px;background:#edfbf8}
 .appointment-list-page .appointment-free-expert-row>.appointment-free-mobile-schedule{display:flex;gap:2px;padding:4px 10px;border-right:1px solid var(--line)}
 .appointment-list-page .appointment-free-expert-actions{display:flex;align-items:center;min-width:0;padding:6px 8px}
 .appointment-list-page .appointment-free-expert-actions>.appointment-free-choice{width:100%}
 .appointment-list-page .appointment-free-expert-actions>.appointment-free-choice>.btn:first-child{justify-content:space-between;flex:1;min-width:0;min-height:44px}
 .appointment-list-page .appointment-free-expert-actions .appointment-block{width:36px;min-width:36px;min-height:44px}
}
/* The time divider stays aligned; the expert occupies the next column on wider screens. */
@media(min-width:701px){
 .appointment-list-page{--appointment-expert-width:100px}
 .appointment-list-page .appointment-agenda-booking.appointment-compact-booking{grid-template-columns:calc(var(--appointment-schedule-width) - 2px + var(--appointment-expert-width)) minmax(0,1fr) auto}
 .appointment-list-page .appointment-open-slot-row:is(.appointment-leave-row,.appointment-free-row){grid-template-columns:calc(var(--appointment-schedule-width) + var(--appointment-expert-width)) minmax(0,1fr)}
 .appointment-list-page :is(.appointment-compact-booking,.appointment-leave-row,.appointment-free-row)>.appointment-booking-schedule{display:grid;grid-template-columns:minmax(0,1fr) var(--appointment-expert-width);grid-template-rows:minmax(0,1fr);gap:0;padding:0;border-right:1px solid var(--line)}
 .appointment-list-page :is(.appointment-compact-booking,.appointment-leave-row,.appointment-free-row) .appointment-booking-time{grid-column:1;grid-row:1;align-self:stretch;justify-content:flex-start;padding:0 8px;border-right:1px solid var(--line)}
 .appointment-list-page .appointment-leave-row .appointment-booking-time{padding-left:10px;color:#3f454b}
 .appointment-list-page :is(.appointment-compact-booking,.appointment-leave-row) .appointment-agenda-expert{grid-column:2;grid-row:1;align-self:center;justify-self:center;width:fit-content;max-width:calc(100% - 12px)}
 .appointment-list-page .appointment-free-row .appointment-available-label{grid-column:2;grid-row:1;align-self:center;justify-self:center;width:fit-content}
}
@media(max-width:700px){
 .appointment-customer-heading{display:block;line-height:20px;white-space:normal}
 .appointment-heading-signals{gap:4px;margin-left:4px}
 .appointment-heading-signals>.appointment-list-confirmation{margin-left:0}
 .appointment-list-page .appointment-customer-heading>.appointment-customer-link{display:inline;white-space:normal;overflow-wrap:break-word}
 .appointment-list-page .appointment-customer-heading .appointment-customer-name{overflow:visible}
 .appointment-list-confirmation{width:16px;min-width:16px;height:16px;justify-content:center;gap:0;padding:2px;margin-left:3px;vertical-align:-2px}
 .appointment-list-confirmation svg{width:10px;height:10px}
 .appointment-confirmation-label{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
}

/* Keep day navigation beside the page title, above the appointment filters. */
.appointment-list-page>.appointment-list-heading{align-items:center;flex-wrap:nowrap;gap:16px}
.appointment-list-heading>div:first-child{flex:1;min-width:0}
.appointment-list-page>.appointment-list-heading h1{font-size:28px;line-height:1.2;margin:0}
.appointment-list-heading>.appointment-day-actions{flex:0 0 auto;flex-wrap:nowrap;align-items:center;gap:6px}
@media(max-width:700px){
 .appointment-list-page>.appointment-list-heading{flex-wrap:wrap;gap:12px}
 .appointment-list-page>.appointment-list-heading h1{font-size:24px}
 .appointment-list-heading>div:first-child{flex-basis:100%}
 .appointment-list-heading>.appointment-day-actions{display:grid;grid-template-columns:44px minmax(0,1fr) 44px;width:100%;flex:1 0 100%}
}

/* Online inbox stays in the navigation on every screen size. */
.appointment-online-pill{display:inline-flex;align-items:center;justify-content:center;min-width:36px;height:36px;padding:0 10px;border:0;border-radius:999px;background:#ff4055;color:#fff;font-size:12px;font-weight:700;line-height:1;white-space:nowrap;box-sizing:border-box;flex:none}
.appointment-online-pill strong{font-size:12px;font-variant-numeric:tabular-nums}
.workspace-menu .workspace-nav .workspace-online-link{display:flex;margin-top:-4px;padding:8px 14px;font-size:14px;min-height:44px}
.workspace-online-label{flex:1}
.appointment-low-price{display:inline-flex;align-items:center;gap:4px;padding:2px 6px;border:1px solid #e0b473;border-radius:5px;background:#fff2d9;color:#8a4608;font-size:11px;font-weight:700;white-space:nowrap}
.appointment-price-warning{margin:12px 0;padding:12px 16px;border:1px solid #e0b473;border-radius:8px;background:#fff5e3;color:#7e4107}
.appointment-price-warning p{margin:6px 0 0;font-size:13px;line-height:1.5}
.appointment-list-page .appointment-low-price{max-width:100%;box-sizing:border-box;white-space:normal;line-height:15px}

.appointment-list-heading>.appointment-day-actions[hidden]{display:none}
.appointment-online-pill[hidden]{display:none}
.workspace-menu .workspace-nav .workspace-online-link:has(.appointment-online-pill[hidden]){display:none}
.online-appointment-arrival{position:fixed;z-index:200;display:flex;align-items:center;justify-content:center;min-width:40px;height:32px;padding:0 10px;box-sizing:border-box;border:2px solid #fff;border-radius:12px;background:#ff4055;color:#fff;font:700 14px/1 system-ui;box-shadow:0 3px 12px #7f1b3540;pointer-events:none;animation:online-arrival-float 1.8s ease-out both}
.online-appointment-pulse{animation:online-arrival-pulse .8s ease-out}
@keyframes online-arrival-float{0%{opacity:0;transform:translateY(8px) scale(.85)}15%,65%{opacity:1;transform:translateY(0) scale(1)}100%{opacity:0;transform:translateY(-12px) scale(1)}}
@keyframes online-arrival-pulse{0%,100%{box-shadow:0 0 0 0 #ff405500}45%{box-shadow:0 0 0 7px #ff405530}}
@media(prefers-reduced-motion:reduce){.online-appointment-arrival{animation:none}.online-appointment-pulse{animation:none}}
.appointment-list-confirmation.is-declined,.awaiting-confirmation.is-declined{display:inline-flex;align-items:center;padding:2px 6px;border-radius:6px;background:#fff0e8;border-color:#dfb49f;color:#a13d22;font-size:10px;font-weight:600}.appointment-list-confirmation:is(.is-verified,.is-declined){width:auto;height:20px;min-width:0}.appointment-list-page .appointment-compact-booking.is-declined{background:#fff7f0;border-color:#eed1bd;border-left-color:#cc6c45}.appointment-heading-signals:has(.is-declined),.appointment-heading-signals:has(.is-verified){max-width:100%;flex-wrap:wrap}.appointment-customer-heading:has(.is-declined),.appointment-customer-heading:has(.is-verified){flex-wrap:wrap}
@media(max-width:389px){.appointment-list-page .appointment-compact-booking:is(.is-declined,.is-verified) .appointment-agenda-side>.appointment-list-actions{flex-direction:column;gap:2px}}