/* CalCal components adapted from D:/fattech-booking/components.html and styles.css. */
:root{--bg:#fff;--rail-bg:#f9f9f9;--sidebar-bg:#fff;--canvas-bg:#f2f3f5;--card-bg:#fff;--ink:#131519;--ink-secondary:#53565e;--ink-muted:#747983;--hairline:#e8eaee;--navy:#0e1526;--navy-hover:#1b2338;--accent-new:#2563eb;--ring:#2563eb;--r-card:16px;--r-box:12px;--shadow-card:0 1px 2px rgba(16,20,30,.04),0 8px 24px rgba(16,20,30,.07)}
.orb{display:block;width:38px;height:38px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#dfeaff 0%,#9cc0fc 30%,#4d8df6 68%,#2a6cf0 100%);box-shadow:inset 0 0 0 1px rgba(255,255,255,.35)}
.btn-primary,.btn-outline{display:inline-flex;align-items:center;justify-content:center;gap:7px;font-size:13.5px;font-weight:500;padding:10px 16px;border-radius:var(--r-box);transition:box-shadow .18s cubic-bezier(.2,.7,.3,1),transform .18s cubic-bezier(.2,.7,.3,1),border-color .15s ease}
.btn-primary{border:0;background:linear-gradient(180deg,#1c2745,var(--navy));color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.16),0 1px 2px rgba(14,21,38,.20),0 6px 14px rgba(14,21,38,.16)}
.btn-primary:hover{background:linear-gradient(180deg,#243158,var(--navy-hover));transform:translateY(-1px);box-shadow:inset 0 1px 0 rgba(255,255,255,.16),0 2px 4px rgba(14,21,38,.22),0 10px 20px rgba(14,21,38,.20)}
.btn-primary:active{transform:translateY(0) scale(.97);box-shadow:inset 0 2px 6px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.08),0 1px 2px rgba(14,21,38,.15)}
.btn-outline{background:linear-gradient(180deg,#fff,#fcfcfd);border:1px solid #f0f1f4;color:var(--ink);box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 1px 2px rgba(16,20,30,.04),0 4px 10px rgba(16,20,30,.06)}
.btn-outline:hover{transform:translateY(-1px);border-color:#e6e8ec;box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 2px 4px rgba(16,20,30,.05),0 8px 16px rgba(16,20,30,.08)}
.btn-outline:active{transform:translateY(0) scale(.97);box-shadow:inset 0 2px 5px rgba(16,20,30,.10),0 1px 2px rgba(16,20,30,.04)}
.rail{display:flex;flex-direction:column;align-items:center;gap:12px;width:72px;flex:none;padding:18px 0;background:var(--rail-bg);border-right:1px solid var(--hairline);position:sticky;top:0;height:100vh}
.rail .orb{margin-bottom:20px}.rail-btn{width:40px;height:40px;border-radius:var(--r-box);display:grid;place-items:center;color:var(--ink-secondary);background:#fbfbfc;box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 1px 2px rgba(16,20,30,.05),0 3px 8px rgba(16,20,30,.06);transition:background-color .15s,color .15s,box-shadow .18s,transform .18s}
.rail-btn:hover{background:#fff;color:var(--ink);transform:translateY(-1px);box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 2px 4px rgba(16,20,30,.06),0 6px 14px rgba(16,20,30,.09)}
.rail-btn:active{transform:translateY(0) scale(.97)}.rail-btn.is-active{background:linear-gradient(180deg,#1c2745,var(--navy));color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.16),0 1px 2px rgba(14,21,38,.20),0 6px 14px rgba(14,21,38,.16)}
.rail-btn svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.rail-bottom{margin-top:auto}
.avatar-tile{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;color:#fff;font-size:12px;font-weight:600;flex:none}.avatar-tile--blue{background:#2f6af0}.avatar-tile--purple{background:#7d55e8}.avatar-tile--image{border-radius:8px;background:#fdeee2;color:#e07b3f}
.chat-row{display:flex;align-items:center;gap:10px;width:100%;text-align:left;padding:9px 10px;border-radius:10px;min-width:0;color:var(--ink)}.chat-row:hover{background:#f4f5f7}.chat-row.is-active{background:#eef2fa;color:#143f90}.chat-name{font-weight:500;font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.section-label{display:flex;align-items:center;gap:6px;color:var(--ink-muted);font-size:12.5px;font-weight:500;padding:4px 4px 8px}
.composer{background:var(--card-bg);box-shadow:var(--shadow-card);border-radius:var(--r-box);padding:18px;transition:box-shadow .2s}.composer:focus-within{box-shadow:0 1px 2px rgba(16,20,30,.05),0 10px 32px rgba(16,20,30,.10),0 0 0 3px rgba(37,99,235,.08)}.composer-actions{display:flex;align-items:center;justify-content:space-between;gap:10px}.btn-select,.btn-send{border-radius:999px}.badge-plus{font-size:11.5px;font-weight:500;color:var(--ink-secondary);border:1px solid var(--hairline);border-radius:999px;padding:3px 9px;background:#fafafa}
button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--ring);outline-offset:2px}
