/* ==========================================================================
   The engine sites' calendar widget — shared by the booking widget
   (booking-widget.js, #booking-app) and the shifts widget (shifts-widget.js,
   #shifts-app). Both roots get the class .cal-widget; each widget keeps only
   its own rules inline. The accent is one variable, --cw-accent: booking keeps
   its cyan (--color-primary, undefined -> #06b6d4), the shifts page sets the
   site's colour. Loaded by booking.html / shifts.html, and by the widgets
   themselves on pages without those templates (the manage page).
   ========================================================================== */
.cal-widget{--cw-accent:var(--color-primary,#06b6d4)}
.cal-widget .bk-full{color:#94a3b8;text-decoration:line-through;cursor:pointer}
.cal-widget .bk-card{max-width:560px;margin:0 auto;background:#fff;border:1px solid #e2e8f0;border-radius:1rem;padding:1.5rem;box-shadow:0 1px 3px rgba(15,23,42,.06);display:flex;flex-direction:column;gap:1.4rem}
.cal-widget .bk-sec{display:flex;flex-direction:column;gap:.4rem}
.cal-widget .bk-step-title{font-size:.8rem;font-weight:800;color:#94a3b8;letter-spacing:.02em}
.cal-widget .bk-picked{display:flex;align-items:center;justify-content:space-between;gap:.75rem;background:#f8fafc;border:1px solid #e2e8f0;border-radius:.75rem;padding:.7rem 1rem}
.cal-widget .bk-picked-label{font-size:.75rem;color:#64748b}
.cal-widget .bk-picked-date{font-weight:800;font-size:1.05rem;color:#0f172a}
.cal-widget .bk-change{background:#fff;color:#0f172a;border:1px solid #cbd5e1;border-radius:9999px;padding:.45rem 1rem;font-weight:700;font-size:.85rem;cursor:pointer;font:inherit;white-space:nowrap}
.cal-widget .bk-change:hover{background:#f8fafc}
.cal-widget .bk-field{margin-bottom:.6rem;display:flex;flex-direction:column;gap:.25rem}
.cal-widget .bk-field input:not([type=checkbox]),.cal-widget .bk-field textarea,.cal-widget select{padding:.5rem .6rem;border:1px solid #d9dee6;border-radius:.5rem;font:inherit;width:100%}
.cal-widget .bk-cal-head{display:flex;align-items:center;justify-content:space-between;margin:.5rem 0}
.cal-widget .bk-cal-title{font-weight:800;font-size:1.05rem}
.cal-widget .bk-nav{border:1px solid #d9dee6;background:#fff;border-radius:.5rem;width:2.2rem;height:2.2rem;cursor:pointer;display:flex;align-items:center;justify-content:center;color:#334155}
.cal-widget .bk-nav:hover:not(:disabled){background:#f8fafc}
.cal-widget .bk-nav:disabled{opacity:.35;cursor:default}
.cal-widget .bk-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:.25rem}
.cal-widget .bk-wd{text-align:center;font-size:.75rem;font-weight:700;color:#64748b;padding:.25rem 0}
.cal-widget .bk-cell{aspect-ratio:1;border:0;border-radius:.5rem;background:transparent;cursor:default;font:inherit}
.cal-widget .bk-empty{visibility:hidden}
.cal-widget .bk-off{color:#cbd5e1}
.cal-widget .bk-ok{background:#e8f4fa;background:color-mix(in srgb,var(--cw-accent) 12%,#fff);color:#0f172a;cursor:pointer;font-weight:700}
.cal-widget .bk-ok:hover{background:#d3ebf7;background:color-mix(in srgb,var(--cw-accent) 24%,#fff)}
.cal-widget .bk-sel,.cal-widget .bk-sel:hover{background:var(--cw-accent);color:#fff}
.cal-widget .bk-today{box-shadow:inset 0 0 0 2px var(--cw-accent)}
.cal-widget .bk-ok.bk-few{background:#fef3c7;color:#92400e}
.cal-widget .bk-ok.bk-few:hover{background:#fde68a}
.cal-widget .bk-sel.bk-few,.cal-widget .bk-sel.bk-few:hover{background:var(--cw-accent);color:#fff}
.cal-widget .bk-quick{margin-top:.6rem;background:#fff;border:1px dashed #cbd5e1;border-radius:9999px;padding:.5rem 1rem;font:inherit;font-size:.85rem;color:#334155;cursor:pointer;align-self:center}
.cal-widget .bk-quick:hover{border-color:var(--cw-accent);color:#0f172a}
.cal-widget .bk-actions{display:flex;gap:.5rem;margin-top:.75rem}
.cal-widget .bk-actions button{flex:1;padding:.75rem 1.5rem}
.cal-widget .bk-muted{color:#94a3b8;padding:1rem 0}
.cal-widget .bk-btn-outline{background:#fff;color:#334155;border:1px solid #cbd5e1}
.cal-widget .bk-btn-outline:hover{background:#f8fafc;color:#0f172a}
.cal-widget .bk-error{background:#fef2f2;color:#b91c1c;border:1px solid #fecaca;border-radius:.5rem;padding:.6rem .9rem;margin:.5rem 0;font-size:.9rem}
.cal-widget .bk-field-err{color:#b91c1c;font-size:.82rem;margin-top:.3rem;font-weight:600}
.cal-widget .bk-field input.bk-invalid,.cal-widget .bk-field .bk-invalid{border-color:#f87171;background:#fff7f7}
.cal-widget .bk-notice{background:#fffbeb;color:#b45309;border:1px solid #fde68a;border-radius:.5rem;padding:.6rem .9rem;margin-bottom:.75rem;font-size:.9rem}
.cal-widget .bk-done{max-width:480px;margin:0 auto;text-align:center;padding:1rem 0}
.cal-widget .bk-done-icon{width:64px;height:64px;line-height:64px;border-radius:50%;background:#ecfdf5;color:#059669;font-size:2rem;font-weight:700;margin:0 auto 1rem}
.cal-widget .bk-done-title{margin:.25rem 0 .5rem;font-size:1.35rem}
.cal-widget .bk-done-summary{text-align:right;background:#f8fafc;border:1px solid #e2e8f0;border-radius:.75rem;padding:1rem 1.25rem;margin:1rem 0}
.cal-widget .bk-done-row{display:flex;gap:.75rem;padding:.3rem 0}
.cal-widget .bk-done-label{color:#64748b;min-width:4.5rem;font-size:.9rem}
.cal-widget .bk-done-value{font-weight:600}
.cal-widget .bk-done-actions{display:flex;gap:.6rem;justify-content:center;flex-wrap:wrap;margin:1rem 0 .25rem}
.cal-widget .bk-done-cancel{margin-top:.5rem;font-size:.85rem}
.cal-widget .bk-done-cancel a{color:#94a3b8;text-decoration:underline}
