/* Dermatology Group of Florida — the live schedule on a provider's page (DECISIONS G22).
 * The ten-day grid, its notices, and the booking drawer, in tokens only. The same look as the day squares on /find/;
 * that page still carries its own copy of these rules (see DECISIONS G22: to be merged into this file). */
.week{display:grid;grid-template-columns:repeat(5,minmax(0,1fr)) var(--w-more);grid-auto-rows:1fr;gap:4px;min-width:0}
.week .chip{width:100%}
.week .more{grid-column:6;grid-row:1/3;height:auto}
.chip{display:inline-flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:0;min-width:0;min-height:var(--cell-h);padding:6px 1px 5px;border-radius:var(--r-chip);border:1px solid transparent;font-size:12px;line-height:1.2;text-align:center;white-space:nowrap;overflow:hidden;font-family:inherit;color:inherit}
.chip .d{font-weight:var(--fw-ui);opacity:.9;margin-bottom:2px} .chip .t{font-weight:var(--fw-strong);font-size:13px;line-height:1.25} .chip .m{font-size:11px;opacity:.85;text-decoration:underline;text-underline-offset:2px;margin-top:1px;white-space:normal;line-height:1.2} /* the link words wrap inside the chip instead of clipping (G37) */
.chip.open{background:var(--c-open);color:var(--c-open-ink)}
.chip.today{background:var(--c-open-strong);color:var(--c-open-strong-ink)}
.chip.closed{background:var(--c-closed);color:var(--c-closed-ink)} .chip.closed .t{font-weight:var(--fw-ui)}
.chip.unknown{background:var(--c-open-soft);border:1px dashed var(--c-open-strong);color:var(--c-open-ink)} .chip.unknown .t{font-weight:var(--fw-strong)} .chip.unknown .m{opacity:1}
.chip.more{background:var(--c-open);border-color:var(--c-open);color:var(--c-open-ink);justify-content:center} .chip.more .t{font-size:12px} .chip.more .m{opacity:1}
.chip .nw{display:none}
button.chip{cursor:pointer} button.chip:hover{filter:brightness(.96)} .chip:focus-visible{outline:2px solid var(--c-focus);outline-offset:2px}
.later,.notice{grid-column:1/-1;font-size:var(--fs-sm);color:var(--c-ink-muted);padding:10px 12px;border-radius:var(--r-chip);display:flex;justify-content:space-between;align-items:center;gap:var(--sp-3);flex-wrap:wrap}
.later{background:var(--c-closed)} .later b{color:var(--c-ink)}
.farline{font-size:var(--fs-sm);color:var(--c-ink-muted);margin-bottom:6px} .farline b{color:var(--c-ink)}
.far{display:flex;flex-wrap:wrap;gap:4px} .far .chip{flex:0 0 auto;min-width:92px;padding:8px 10px;min-height:0} .far .chip.unknown{min-width:110px;justify-content:center}
.notice{background:var(--c-surface-accent)}
.notice.phone{background:var(--c-phone);color:var(--c-phone-ink)}
.sk{position:relative;overflow:hidden;background:var(--c-closed);border-radius:6px;color:transparent}
.sk::after{content:"";position:absolute;inset:0;transform:translateX(-100%);background:linear-gradient(90deg,transparent,rgb(255 255 255 / .7),transparent);animation:sh 1.3s infinite}
@keyframes sh{to{transform:translateX(100%)}}
.toast{position:fixed;left:50%;bottom:22px;transform:translateX(-50%) translateY(20px);opacity:0;background:var(--c-ink);color:#fff;padding:10px 16px;border-radius:var(--r-pill);font-size:var(--fs-sm);pointer-events:none;transition:.25s;z-index:120;max-width:min(92vw,560px);text-align:center}
.toast.show{opacity:1;transform:translateX(-50%)}

/* booking drawer: the office's own NextPatient widget, then NextPatient's details page */
.backdrop{position:fixed;inset:0;background:var(--c-scrim);backdrop-filter:blur(2px);opacity:0;pointer-events:none;transition:opacity .2s;z-index:80}
.backdrop.open{opacity:1;pointer-events:auto}
.drawer{position:fixed;top:0;right:0;bottom:0;width:min(600px,100vw);background:var(--c-surface-accent);box-shadow:var(--sh-lg);transform:translateX(104%);transition:transform .28s cubic-bezier(.2,.8,.2,1);z-index:90;display:grid;grid-template-rows:auto 1fr;outline:none}
.drawer.open{transform:none}
.drawer .dh{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:start;padding:18px 22px 14px;border-bottom:1px solid var(--c-line);background:var(--c-surface)}
.drawer .dh .logo{height:24px;max-width:160px;object-fit:contain;object-position:left;display:block;margin-bottom:8px}
.drawer .dh .t{font:var(--fw-display) 22px/1.15 var(--f-display)}
.drawer .dh .s{font-size:var(--fs-sm);color:var(--c-ink-muted);margin-top:4px}
.drawer .x{border:1px solid var(--c-line);background:#fff;border-radius:50%;width:38px;height:38px;display:grid;place-items:center;color:var(--c-ink);cursor:pointer}
.drawer .db{overflow:auto;padding:18px 22px 28px;overscroll-behavior:contain}
.steps{display:flex;gap:8px;align-items:center;font-size:var(--fs-xs);color:var(--c-ink-muted);margin:0 0 14px;flex-wrap:wrap}
.steps .st{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:var(--r-pill);background:#fff;border:1px solid var(--c-line)}
.steps .st.on{background:var(--c-ink);color:#fff;border-color:var(--c-ink)}
.steps .st.done{color:var(--c-open-ink);border-color:var(--c-open);background:var(--c-open)}
.steps .st b{display:inline-grid;place-items:center;width:18px;height:18px;border-radius:50%;background:rgb(0 0 0 / .08);font-size:11px}
.steps .st.on b{background:rgb(255 255 255 / .22)}
.np-host{background:var(--c-surface);border:1px solid var(--c-line);border-radius:var(--r-lg);padding:16px 16px 6px;min-height:220px;position:relative}
.np-host .np-wait{position:absolute;inset:0;display:grid;place-items:center;color:var(--c-ink-muted);font-size:var(--fs-sm)}
.np-host .np-wait .spin{width:22px;height:22px;border:2.5px solid var(--c-line);border-top-color:var(--c-accent);border-radius:50%;animation:spin .8s linear infinite;margin:0 auto 10px}
@keyframes spin{to{transform:rotate(360deg)}}
.np-host [id^='nextpatient-widget'] .nextpatient-box{width:100%!important;max-width:100%!important;padding-bottom:0}
.np-host .nextpatient-font{font-family:var(--f-body)!important;font-size:14.5px}
.np-host .nextpatient-criteria-container{display:grid!important;gap:10px;margin-bottom:14px!important}
.np-host .nextpatient-criteria-box{display:block!important;margin:0!important;max-width:100%}
.np-host .nextpatient-criteria-label{font-size:12px!important;letter-spacing:.05em;text-transform:uppercase;color:var(--c-ink-muted)!important;margin:0 0 5px!important;font-weight:600}
.np-host .nextpatient-criteria-box select,.np-host .nextpatient-criteria-box input{width:100%!important;max-width:100%!important;height:46px!important;font:inherit!important;font-size:15px!important;border:1px solid var(--c-line)!important;border-radius:var(--r-md)!important;padding:0 12px!important;background:#fff;color:var(--c-ink)}
.np-host .nextpatient-criteria-box input[type=submit]{background:var(--c-cta);color:var(--c-cta-ink);border-color:var(--c-cta)!important;font-weight:600;cursor:pointer}
.np-host .nextpatient-provider-table .nextpatient-provider{border:1px solid var(--c-line)!important;border-radius:var(--r-lg);padding:12px!important;margin:0 0 10px!important;display:grid!important;grid-template-columns:56px 1fr;gap:12px;align-items:start}
.np-host .nextpatient-provider-image-cell{display:block!important;width:56px!important;height:56px!important;border-radius:50%;background-size:cover!important}
.np-host .nextpatient-provider-provider-cell{display:block!important;padding:0!important;min-width:0}
.np-host .nextpatient-provider-small-photo,.np-host .nextpatient-provider-name-block-left{display:none!important}
.np-host .nextpatient-provider-name{font-size:15.5px!important;line-height:1.25!important;font-weight:600}
.np-host .nextpatient-provider-blurb,.np-host .nextpatient-provider-age-range{font-size:12.5px!important;color:var(--c-ink-muted);line-height:1.4!important;margin:2px 0 6px!important}
.np-host .nextpatient-provider-blurb br{display:none}
.np-host .nextpatient-provider-address{font-size:12.5px!important;color:var(--c-ink-muted)}
.np-host .next-appt-block{margin-top:6px;font-size:13px} .np-host .next-appt-block .explanation{color:var(--c-ink-muted);font-size:12px}
.np-host .nextpatient-provider-times{display:flex;flex-wrap:wrap;gap:6px;padding-top:6px!important;text-align:left!important}
.np-host a.nextpatient-slot-time,.np-host a.nextpatient-slot-time:visited{width:auto!important;min-width:86px;height:auto!important;padding:7px 10px!important;margin:0!important;border-radius:var(--r-chip)!important;border:1px solid transparent!important;background:var(--c-open)!important;color:var(--c-open-ink)!important;font-weight:600;line-height:1.2!important;box-sizing:border-box}
.np-host a.nextpatient-slot-time:hover{filter:brightness(.95)}
.np-host .nextpatient-slot-time-day{font-size:11.5px!important;line-height:1.2!important;opacity:.85;padding:0!important}
.np-host .nextpatient-slot-time-time{font-size:14px!important;line-height:1.2!important}
.np-host a.nextpatient-slot-time-more{background:#fff!important;border-color:var(--c-line)!important;color:var(--c-ink)!important;font-size:13px!important;line-height:1.2!important}
.np-host .nextpatient-provider-more-times{text-align:left!important;margin-top:6px!important}
.np-host .nextpatient-no-times-available,.np-host .call-no-times{font-size:13.5px!important;color:var(--c-ink-muted);padding:8px 0!important}
.np-host .nextpatient-provider-table{display:grid}
.finish{background:var(--c-surface);border:1px solid var(--c-line);border-radius:var(--r-lg);padding:20px;display:grid;gap:12px}
.finish .big{font:var(--fw-display) 20px/1.2 var(--f-display)} .finish .mut{color:var(--c-ink-muted);font-size:var(--fs-sm)} .finish .row2{display:flex;gap:10px;flex-wrap:wrap}
.finish iframe{width:100%;height:min(72vh,760px);border:0;border-radius:var(--r-lg);background:#fff}
.finish .held{display:inline-flex;align-items:center;gap:8px;background:var(--c-open);color:var(--c-open-ink);border-radius:var(--r-chip);padding:8px 12px;font-weight:var(--fw-strong);font-size:var(--fs-sm);width:fit-content}
.drawer .fine{font-size:var(--fs-xs);color:var(--c-ink-muted);margin-top:14px;line-height:1.5} .drawer .fine a{color:var(--c-link)}
body.locked{overflow:hidden}
@media (max-width:640px){
  .chip .wd{display:none} .chip .nw{display:inline}
  .chip{font-size:11px;padding:6px 1px 5px} .chip .t{font-size:12px} .chip .m{font-size:10.5px}
  .week{--w-more:44px;gap:3px}
  .drawer{width:100vw} .drawer .db{padding:14px 14px 24px} .np-host{padding:12px 12px 4px}
}
@media (max-width:400px){ .chip .t{font-size:11.5px;letter-spacing:-.01em} .week{--w-more:40px;gap:2px} .sched .office{padding:var(--sp-2)} .sched{padding:var(--sp-4) var(--sp-2);margin-inline:-8px} } /* G37: times are not clipped in their chips at 360/390 */