/* ============================================================
   WDMeet – Custom CSS  (Bootstrap 5 companion)
   ============================================================ */
:root{
  --brand:#1377bc; --brand-dark:#0e5e95; --accent:#f69322; --accent-dark:#d97a0f;
  --bg:#ffffff; --surface:#f7f9fc; --text:#0f2236; --muted:#6b7a90; --border:#e5ebf2;
  --radius:14px; --shadow:0 6px 24px rgba(19,119,188,.08);
}
*{box-sizing:border-box}
body{font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;color:var(--text);background:var(--bg);margin:0}
a{color:var(--brand);text-decoration:none}
a:hover{color:var(--brand-dark)}
.btn-brand{background:var(--brand);border-color:var(--brand);color:#fff}
.btn-brand:hover{background:var(--brand-dark);border-color:var(--brand-dark);color:#fff}
.btn-accent{background:var(--accent);border-color:var(--accent);color:#fff}
.btn-accent:hover{background:var(--accent-dark);border-color:var(--accent-dark);color:#fff}
.btn-outline-brand{border:1px solid var(--brand);color:var(--brand);background:#fff}
.btn-outline-brand:hover{background:var(--brand);color:#fff}
.text-brand{color:var(--brand)!important}
.text-accent{color:var(--accent)!important}
.bg-brand{background:var(--brand)!important;color:#fff}
.bg-soft{background:var(--surface)}
.card-soft{background:#fff;border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow)}
.navbar-brand{font-weight:700;letter-spacing:-.3px;color:var(--brand)!important}
.navbar-brand .dot{display:inline-block;width:10px;height:10px;border-radius:50%;background:var(--accent);margin-right:8px;vertical-align:middle}
.section{padding:72px 0}
.hero{padding:96px 0 72px;background:linear-gradient(180deg,#eaf3fb 0%,#fff 100%)}
.hero h1{font-weight:800;font-size:clamp(2rem,4vw,3.4rem);letter-spacing:-1px}
.hero p.lead{color:var(--muted);font-size:1.15rem;max-width:620px}
.event-card{padding:22px;border:1px solid var(--border);border-radius:var(--radius);transition:.18s;cursor:pointer;background:#fff;height:100%}
.event-card:hover{border-color:var(--brand);transform:translateY(-2px);box-shadow:var(--shadow)}
.event-card .badge-dur{background:#eaf3fb;color:var(--brand);border-radius:999px;padding:4px 10px;font-size:.78rem;font-weight:600}
.event-color-dot{width:14px;height:14px;border-radius:50%;display:inline-block;margin-right:8px;vertical-align:middle}
.calendar{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}
.calendar .dow{text-align:center;font-size:.75rem;color:var(--muted);font-weight:600;padding:6px 0}
.calendar .day{aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;border-radius:50%;border:1px solid transparent;cursor:pointer;font-weight:500;color:var(--text)}
.calendar .day.muted{color:#c5cdd8;cursor:default}
.calendar .day.disabled{color:#c5cdd8;cursor:not-allowed;text-decoration:line-through}
.calendar .day.available{background:#eaf3fb;color:var(--brand);font-weight:600}
.calendar .day.available:hover{background:var(--brand);color:#fff}
.calendar .day.selected{background:var(--brand);color:#fff}
.calendar .day.today{border-color:var(--accent)}
.slot-list{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.slot{padding:12px;border:1px solid var(--brand);color:var(--brand);border-radius:10px;background:#fff;text-align:center;font-weight:600;cursor:pointer;transition:.15s}
.slot:hover{background:#eaf3fb}
.slot.selected{background:var(--brand);color:#fff}
.step-pill{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:999px;background:#eaf3fb;color:var(--brand);font-size:.8rem;font-weight:600}
.sidebar{background:#0f2236;color:#cfd8e3;min-height:100vh;padding:18px 0}
.sidebar .brand{padding:0 20px 18px;border-bottom:1px solid #1c3552;color:#fff;font-weight:700}
.sidebar a{display:flex;align-items:center;gap:10px;padding:10px 20px;color:#cfd8e3;border-left:3px solid transparent}
.sidebar a:hover{background:#152c47;color:#fff}
.sidebar a.active{background:#152c47;color:#fff;border-left-color:var(--accent)}
.kpi{padding:20px;border-radius:var(--radius);background:#fff;border:1px solid var(--border)}
.kpi .label{color:var(--muted);font-size:.8rem;text-transform:uppercase;letter-spacing:.5px}
.kpi .value{font-size:1.8rem;font-weight:700;margin-top:4px}
.kpi .delta{font-size:.8rem;color:#1ea672}
.table thead th{font-size:.78rem;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);font-weight:600;border-bottom:1px solid var(--border)}
.status-pill{padding:3px 10px;border-radius:999px;font-size:.75rem;font-weight:600}
.status-confirmed{background:#e6f7ef;color:#1ea672}
.status-pending{background:#fff4e0;color:#b76f00}
.status-cancelled{background:#fde7e7;color:#c93a3a}
.footer{background:#0f2236;color:#9aa7ba;padding:32px 0;text-align:center}
.footer a{color:#cfd8e3}
.form-control:focus,.form-select:focus{border-color:var(--brand);box-shadow:0 0 0 .2rem rgba(19,119,188,.15)}
.divider{height:1px;background:var(--border);margin:24px 0}
.timezone-pill{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border:1px solid var(--border);border-radius:999px;color:var(--muted);font-size:.85rem;background:#fff}
.location-icon{width:36px;height:36px;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;background:#eaf3fb;color:var(--brand);font-weight:700;margin-right:10px}
/* Flash messages */
.alert-flash{position:fixed;top:20px;right:20px;z-index:9999;min-width:280px;animation:slideIn .3s ease}
@keyframes slideIn{from{transform:translateX(120%)}to{transform:translateX(0)}}
@media (max-width: 768px){
  .hero{padding:64px 0 40px}
  .slot-list{grid-template-columns:repeat(2,1fr)}
}