/* Hourmeet forms: registration typography/fields and public-profile progress/chips. */
.appointment-dialog{width:min(580px,calc(100vw - 32px));max-width:580px;max-height:calc(100dvh - 32px);padding:0;overflow:hidden;background:var(--workspace-surface,#fff);color:var(--workspace-ink,#172554);border:1px solid var(--workspace-line,#e2e9ee);border-radius:24px 8px 24px 8px;font:15px/1.5 system-ui,-apple-system,sans-serif}
.appointment-dialog>form{display:flex;flex-direction:column;max-height:calc(100dvh - 34px);min-height:0}
.appointment-dialog [hidden]{display:none!important}
.appointment-header{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:24px 24px 18px;flex:none}
.appointment-header h2{font-size:24px;line-height:1.25;margin:0 0 5px;letter-spacing:-.02em;font-weight:700}.appointment-header p{font-size:14px;line-height:1.5;color:var(--workspace-muted);margin:0}
.appointment-close{display:flex;align-items:center;justify-content:center;flex:none;width:44px;height:44px;border-radius:50%;border:1px solid var(--workspace-line);background:var(--workspace-surface);color:var(--workspace-muted)}
.appointment-progress{display:flex;align-items:center;gap:12px;margin:0 24px;padding:0;list-style:none;flex:none;cursor:default}
.appointment-progress li{display:flex;align-items:center;gap:8px;flex:1;font-size:13px;font-weight:600;line-height:1.4;color:var(--workspace-muted);min-width:0}
.appointment-progress li:first-child::after{content:"";height:1px;min-width:12px;flex:1;background:var(--workspace-line);margin-left:4px}
.appointment-progress li[aria-current="step"]{color:var(--workspace-accent-text)}.appointment-progress .is-complete{color:var(--workspace-accent-text)}.appointment-progress .is-complete::after{background:var(--workspace-accent)}
.appointment-step-icon{display:inline-flex;align-items:center;justify-content:center;flex:none;width:28px;height:28px;border:1px solid var(--workspace-line);border-radius:50%;font-size:12px;font-weight:700;line-height:1}
.appointment-progress [aria-current="step"] .appointment-step-icon{background:var(--workspace-accent);color:var(--workspace-on-accent);border-color:var(--workspace-accent)}
.appointment-progress .is-complete .appointment-step-icon{background:var(--workspace-accent);color:var(--workspace-on-accent);border-color:var(--workspace-accent)}
.appointment-step-icon .hm-icon{width:15px;height:15px}
.appointment-body{padding:22px 24px;overflow-y:auto;min-height:0;overscroll-behavior:contain;overflow-anchor:none;scrollbar-width:thin;scrollbar-color:var(--workspace-line) transparent}
.appointment-fields,.appointment-time-field{min-width:0;border:0;padding:0;margin:0}.appointment-fields{display:grid;gap:20px}.appointment-fields-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.appointment-fields label{display:grid;gap:8px;font-size:14px;font-weight:650;min-width:0}.appointment-fields .input{width:100%;max-width:100%;min-width:0;font-family:inherit;font-size:16px;font-weight:400;line-height:1.5;min-height:48px;padding:12px;border-radius:10px;background:var(--workspace-surface);color:var(--workspace-ink);border-color:var(--workspace-line)}
.appointment-fields .input[aria-invalid="true"]{border-color:var(--billing-error-ink,#a33232)}
.appointment-context{padding-bottom:20px;border-bottom:1px solid var(--workspace-line)}.appointment-context>label{align-content:start;gap:6px}.appointment-context>label>span:first-child{font-size:12px;font-weight:500;color:var(--workspace-muted)}
.appointment-fixed{font-size:16px;line-height:1.45;font-weight:700;overflow-wrap:anywhere}.appointment-field-hint{font-size:12px;font-weight:400;line-height:1.5;color:var(--workspace-muted)}.appointment-field-error{font-size:12px;font-weight:500;line-height:1.5;color:var(--billing-error-ink,#a33232)}
.appointment-date-heading{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-bottom:-10px}.appointment-date-heading>label{font-size:14px}.appointment-zone{font-size:11px;line-height:1.4;color:var(--workspace-muted);text-align:end}
.appointment-date-picker{display:grid;grid-template-columns:1fr 1.1fr;gap:12px;align-items:center}.appointment-quick-dates{display:grid;grid-template-columns:1fr 1fr;gap:8px}.appointment-quick-dates .btn{min-height:44px;font-size:13px;padding:8px 10px;border-radius:9px;background:var(--workspace-surface);color:var(--workspace-muted)}
.appointment-quick-dates [aria-pressed="true"]{border-color:var(--workspace-accent);background:var(--workspace-accent);color:var(--workspace-on-accent)}
.appointment-time-field legend{font-size:14px;font-weight:600;margin-bottom:12px}.appointment-slots{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;min-height:96px;align-content:start;overflow:visible}
.appointment-slots>p,.appointment-slot-error{grid-column:1/-1}.appointment-slots>p,.appointment-slot-error p{font-size:13px;color:var(--workspace-muted);line-height:1.6;margin:0}.appointment-slot-status{display:flex;align-items:flex-start;gap:10px;padding:10px 0}
.appointment-fields .appointment-slot{display:block;position:relative;cursor:pointer;font-weight:500}.appointment-slot input{position:absolute;opacity:0;width:1px;height:1px}.appointment-slot span{display:flex;align-items:center;justify-content:center;min-width:0;min-height:44px;padding:8px 5px;border:1px solid var(--workspace-line);border-radius:9px;color:var(--workspace-ink);background:var(--workspace-surface);font-size:14px;font-variant-numeric:tabular-nums}
.appointment-slot input:checked+span{font-weight:600;color:var(--workspace-on-accent);background:var(--workspace-accent);border-color:var(--workspace-accent)}.appointment-slot input:focus-visible+span{outline:2px solid var(--workspace-accent);outline-offset:3px}.appointment-slot-error .btn{margin-top:10px;min-height:44px;font-size:13px}
.appointment-more-times,.appointment-edit-time{color:var(--workspace-accent-text);font:inherit;font-weight:600;font-size:13px;background:none;border:0;cursor:pointer;text-underline-offset:3px;min-height:44px;padding:10px 0}.appointment-more-times{display:block;text-align:start;flex:none;font-size:12px;margin:0}
.appointment-chosen-time{font-size:12px;line-height:1.5;font-weight:600;color:var(--workspace-accent-text);margin:0;margin-left:auto;text-align:end}
.appointment-review{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding-bottom:20px;border-bottom:1px solid var(--workspace-line)}.appointment-review strong{font-size:16px;line-height:1.5}.appointment-review p{font-size:13px;line-height:1.5;color:var(--workspace-muted);margin:5px 0 0}.appointment-edit-time{padding-top:0;min-height:44px;flex:none}
.appointment-message{font-size:13px;line-height:1.6;margin:18px 0 0;color:var(--workspace-muted)}.appointment-message:empty{display:none}.appointment-message.is-error{color:var(--billing-error-ink,#a33232)}
.appointment-footer{display:flex;justify-content:space-between;gap:12px;padding:16px 24px calc(18px + env(safe-area-inset-bottom,0px));border-top:1px solid var(--workspace-line);flex:none;background:var(--workspace-surface)}.appointment-footer .btn{min-height:48px;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 20px;border-radius:999px;font-family:inherit;font-size:15px;font-weight:700;border:0}.appointment-footer .appointment-back{background:var(--workspace-accent-soft);color:var(--workspace-accent-text)}.appointment-footer .primary{background:var(--workspace-accent);color:var(--workspace-on-accent)}.appointment-footer .primary{min-width:160px}
#saveAppointment:disabled:not([aria-busy="true"]){opacity:.55;cursor:not-allowed}
@media(hover:hover){.appointment-slot:hover span{border-color:var(--workspace-accent)}.appointment-more-times:hover,.appointment-edit-time:hover{text-decoration:underline}}
@media(max-width:640px){.appointment-dialog{width:calc(100vw - 24px);max-height:calc(100dvh - 24px)}.appointment-dialog>form{max-height:calc(100dvh - 26px)}.appointment-header{padding:20px 20px 16px}.appointment-progress{margin-inline:20px;gap:12px}.appointment-progress li{font-size:12px;gap:7px}.appointment-body{padding:20px}.appointment-fields{gap:20px}.appointment-fields-grid{gap:16px}.appointment-date-picker{grid-template-columns:1fr;gap:10px}.appointment-quick-dates{grid-template-columns:1fr 1fr}.appointment-quick-dates .btn{border-radius:9px}.appointment-date-picker>.input{min-height:48px}.appointment-footer{padding-inline:20px}.appointment-footer .primary{flex:1;min-width:0;max-width:220px}.appointment-header h2{font-size:22px}.appointment-header p{font-size:13px}.appointment-review strong{font-size:15px}}

.appointment-contact-field{display:grid;gap:8px;min-width:0}

.appointment-dialog input::placeholder{color:var(--workspace-muted);opacity:1}
.appointment-dialog :is(button,input,select):focus-visible{outline:3px solid color-mix(in srgb,var(--workspace-accent),var(--workspace-surface) 45%);outline-offset:2px}

.appointment-times-actions{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:48px}
.appointment-slot-feedback{font-size:12px;line-height:1.5;color:var(--workspace-muted);margin:0}
.appointment-slot-skeleton{display:block;block-size:44px;border:1px solid var(--workspace-line);border-radius:9px;background:var(--workspace-subtle)}
@media(prefers-reduced-motion:no-preference){.appointment-slot-skeleton{animation:appointment-skeleton-pulse 1.4s ease-in-out infinite}@keyframes appointment-skeleton-pulse{0%,100%{opacity:.55}50%{opacity:1}}}

.appointment-prerequisite{width:min(500px,calc(100vw - 24px));max-height:calc(100dvh - 24px);overflow:auto}.appointment-prerequisite-body{padding-top:8px;padding-bottom:28px}.appointment-prerequisite-icon{display:grid;place-items:center;width:44px;height:44px;background:var(--workspace-accent-soft);color:var(--workspace-accent-text);border-radius:12px;margin-bottom:18px}.appointment-prerequisite-icon .hm-icon{width:22px;height:22px}.appointment-prerequisite-body p{margin:0;font-size:15px;line-height:1.75}.appointment-prerequisite-body .appointment-prerequisite-note{margin-top:14px;font-size:13px;color:var(--workspace-muted)}.appointment-prerequisite .appointment-footer{position:sticky;bottom:0}.appointment-prerequisite .hm-form-actions.hm-form-actions>[data-form-action="secondary"]{flex:0 0 auto;max-inline-size:none;overflow-wrap:normal}.appointment-dialog button:focus-visible{outline:2px solid var(--workspace-accent);outline-offset:3px}

.appointment-additional-services{margin-bottom:24px}
.appointment-additional-services summary{font-weight:600;color:var(--workspace-accent-text);cursor:pointer;min-height:44px;padding-block:10px}
.appointment-additional-services>div{display:grid;gap:12px;margin-top:12px}
.appointment-additional-services label{display:flex;align-items:center;gap:12px;cursor:pointer}
.appointment-additional-services input{inline-size:20px;block-size:20px;accent-color:var(--workspace-accent)}
.appointment-additional-services strong,.appointment-additional-services small{display:block}
.appointment-additional-services small{color:var(--workspace-muted)}

.ag-service-breakdown{list-style:none;padding:0;margin:0 0 24px}
.ag-service-breakdown li{display:flex;justify-content:space-between;gap:16px;padding-block:10px;border-bottom:1px solid var(--workspace-line);flex-wrap:wrap}
.ag-service-breakdown li:last-child{border:0}
.appointment-contact-field textarea{width:100%;min-height:104px;resize:vertical;line-height:1.5}
.ag-observations{margin:0 0 18px;padding:16px 18px;border:0;border-radius:14px;background:var(--workspace-subtle)}
.ag-observations h3{margin:0 0 8px;font-size:1rem}
.ag-observations p{margin:0;white-space:pre-wrap;overflow-wrap:anywhere}

/* Read appointment context in one pass; actions remain outside the scrolling body. */
.ag-detail[open]{display:flex;flex-direction:column;overflow:hidden;width:min(600px,calc(100vw - 24px))}
.ag-detail>header,.ag-detail>footer{flex-shrink:0}
.ag-detail .ag-detail-body{min-height:0;overflow-y:auto;overscroll-behavior:contain;padding-top:0}
.ag-detail>footer{position:static}
.ag-detail-summary{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:4px 0 20px;border-bottom:1px solid var(--workspace-line)}
.ag-detail-summary .ag-detail-when{padding:0;border:0;min-width:0;gap:12px}
.ag-detail-summary .ag-detail-when>svg{margin-top:3px}
.ag-detail-summary .ag-detail-when>div{gap:6px}
.ag-detail-summary .ag-detail-when strong{font-size:15px;line-height:1.45}
.ag-detail-summary .ag-detail-when span{font-size:22px;font-weight:650;line-height:1.35}
.ag-detail-summary>.ag-status{flex:none;white-space:nowrap;margin-top:3px;font-size:11px}
.ag-detail .ag-detail-data{margin:18px 0;gap:18px 22px}
.ag-detail .ag-detail-data dt{margin-bottom:5px}
.ag-detail .ag-detail-data dd{line-height:1.5}
.ag-detail .ag-detail-data small{margin-top:3px}
.ag-detail .ag-detail-note{margin:0;font-size:12px!important;line-height:1.6}
.ag-detail .ag-cancel-section{margin-top:16px;padding-top:14px}
.ag-detail .ag-observations h3{font-size:14px;margin-bottom:6px}
.ag-detail .ag-observations p{font-size:14px;line-height:1.6}
@media(max-width:540px){
 .ag-detail-summary{flex-wrap:wrap;gap:10px;padding-bottom:16px}
 .ag-detail-summary>.ag-status{margin:0 0 0 36px}
 .ag-detail .ag-detail-data{gap:16px}
 .ag-detail .ag-observations{padding:14px}
 .ag-detail .ag-cancel-section{justify-content:center;gap:4px;text-align:center}
 .ag-detail .ag-cancel-section p{flex-basis:100%}
}

.ag-detail>.ag-cancel-section{flex-shrink:0;margin:0;padding:10px 28px;border-top:1px solid var(--workspace-line)}
@media(max-width:540px){.ag-detail>.ag-cancel-section{padding:8px 20px;gap:0}}

.ag-detail-summary .ag-detail-time{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 8px}
.ag-detail-summary .ag-detail-time .ag-detail-duration{font-size:13px;font-weight:400;white-space:nowrap}
@media(max-width:380px){.ag-detail-data>div:has(a[href^="tel:"]){grid-column:1/-1}}