.demo{--demo-appt: #008080;--demo-appt-bg: #cce6e6;--demo-appt-soft: #e8f3f3;--demo-appt-soft-edge: #80bfbf;--demo-line: rgb(226 232 240);--demo-muted: #566378;--demo-selected: #e6f4f3;background:var(--aw-color-bg-canvas);color:var(--aw-color-text-default)}.demo-wrap{max-width:64rem;margin-inline:auto;padding:1.5rem 1rem 3rem}.demo-title{max-width:30ch;font-size:clamp(28px,5vw,44px);font-weight:700;line-height:1.12;letter-spacing:-.02em;color:var(--aw-color-text-heading);text-wrap:balance}.demo-notice{margin-top:.75rem;color:var(--demo-muted)}.demo-setup{display:grid;gap:1rem;margin-top:1rem}.demo-field{min-width:0;border:0;padding:0;margin:0}.demo-label{display:block;margin-bottom:.375rem;padding:0;font-size:.875rem;font-weight:600;color:var(--aw-color-text-heading)}.demo-input{display:block;width:100%;min-height:44px;padding:.5rem .75rem;border:1px solid var(--demo-line);border-radius:12px;background:#fff;font:inherit;color:inherit}.demo-input:focus{outline:2px solid var(--aw-color-primary);outline-offset:1px;border-color:transparent;box-shadow:none}.demo-chips{display:flex;flex-wrap:wrap;gap:.5rem}.demo-chip,.demo-time{position:relative}.demo-chip input,.demo-time input{position:absolute;width:1px;height:1px;opacity:0}.demo-chip span,.demo-time span{display:flex;align-items:center;justify-content:center;min-height:44px;border:1px solid var(--demo-line);background:#fff;cursor:pointer}.demo-chip span{padding-inline:.875rem;border-radius:999px;font-size:.875rem}@media (hover: hover){.demo-chip:hover span,.demo-time:hover span,.demo-service:hover{border-color:var(--aw-color-primary)}}.demo-chip input:checked+span,.demo-time input:checked+span{border-color:var(--aw-color-primary);background:var(--demo-selected);color:var(--aw-color-secondary);font-weight:600}.demo-chip input:focus-visible+span,.demo-time input:focus-visible+span{outline:2px solid var(--aw-color-primary);outline-offset:2px}.demo-faces{display:grid;gap:1rem;margin-top:1rem}.demo-panel{min-width:0;padding:1rem;border:1px solid var(--demo-line);border-radius:12px;background:#fff}.demo-panel--agenda{scroll-margin-top:5.5rem}.demo-heading{font-size:1rem;font-weight:600;color:var(--demo-muted)}.demo-booking{display:grid;gap:1rem;margin-top:.75rem}.demo-business{font-size:1.375rem;font-weight:700;line-height:1.2;letter-spacing:-.01em;color:var(--aw-color-text-heading);overflow-wrap:anywhere}.demo-services{display:grid;gap:.5rem}.demo-service{display:flex;align-items:center;gap:.625rem;min-height:48px;padding:.5rem .75rem;border:1px solid var(--demo-line);border-radius:12px;cursor:pointer}.demo-service:has(input:checked){border-color:var(--aw-color-primary);background:var(--demo-selected)}.demo-service input{flex:none;accent-color:var(--aw-color-secondary)}.demo-service-name{flex:1;min-width:0}.demo-service-time{flex:none;font-size:.875rem;color:var(--demo-muted);font-variant-numeric:tabular-nums}.demo-times{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.5rem}.demo-time span{border-radius:12px;font-variant-numeric:tabular-nums}.demo-card{overflow:hidden;padding:.25rem .5rem;border-left:4px solid var(--demo-appt);border-radius:5px;background:var(--demo-appt-bg);font-size:.8125rem;line-height:1.25;color:var(--aw-color-text-heading);font-variant-numeric:tabular-nums}.demo-card strong,.demo-card span{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.demo-card strong{font-weight:600}.demo-summary{display:grid}.demo-summary>*{grid-area:1 / 1}.demo-summary .demo-card{align-self:start;padding-block:.5rem;font-size:.9375rem}.demo-status strong{font-weight:600}.demo-action{width:100%}.demo-action[hidden]{display:none}.demo-action:disabled{opacity:.5;box-shadow:none;cursor:not-allowed}.demo-date{margin-top:.25rem;font-weight:600;color:var(--aw-color-text-heading);min-height:1.5em}.demo-day{position:relative;margin-top:.75rem}.demo-hours{margin:0;padding:0;list-style:none}.demo-hours li{position:relative;height:60px;padding-left:0;border-top:1px solid var(--demo-line);font-size:.75rem;line-height:1.5rem;color:var(--demo-muted);font-variant-numeric:tabular-nums}.demo-hours li:after{content:"";position:absolute;top:30px;left:48px;right:0;border-top:1px dashed var(--demo-line)}.demo-lane{position:absolute;inset:0 0 0 48px}.demo-lane .demo-card{position:absolute;left:0;right:0;margin-top:1px;padding-block:.125rem}.demo-lane .demo-card--sample{border-left-color:var(--demo-appt-soft-edge);background:var(--demo-appt-soft)}.demo-slot{position:absolute;left:0;right:0;margin-top:1px;border:1px dashed var(--demo-appt);border-radius:5px}.demo-lane .demo-card--new{z-index:30;box-shadow:0 0 0 1px var(--demo-appt)}.demo-card--new.is-flying{transition:transform .5s cubic-bezier(.4,0,.2,1),width .5s cubic-bezier(.4,0,.2,1),height .5s cubic-bezier(.4,0,.2,1)}@media (prefers-reduced-motion: reduce){.demo-card--new.is-flying{transition:none}}.demo-reminder{display:none;margin-top:1rem}.demo-reminder.is-visible{display:block}.demo-reminder-label{font-size:.875rem;font-weight:600;color:var(--aw-color-text-heading)}.demo-bubble{margin-top:.375rem;padding:.625rem .75rem;border-radius:12px;background:var(--aw-color-bg-canvas);overflow-wrap:anywhere}.demo-reminder-note{margin-top:.375rem;font-size:.8125rem;color:var(--demo-muted)}.demo-end{display:flex;flex-direction:column;gap:.75rem;margin-top:1.5rem}.demo-end-note{color:var(--demo-muted)}@media (min-width: 640px){.demo-wrap{padding:2.5rem 1.5rem 4rem}.demo-end{flex-direction:row;align-items:center;gap:1.25rem}.demo-end .btn-primary{flex:none}}@media (min-width: 768px){.demo-setup{grid-template-columns:minmax(0,20rem) minmax(0,1fr);align-items:start;gap:1.5rem;margin-top:1.5rem}.demo-faces{grid-template-columns:380px minmax(0,1fr);align-items:start;gap:1.5rem;margin-top:1.5rem}.demo-panel{padding:1.5rem}.demo-reminder{display:block;visibility:hidden}.demo-reminder.is-visible{visibility:visible}}