/* Q_Calendar v1.5 Smart Span Lanes — MIT */
/* Base + Month + Week/Day + Agenda with span offsets */
.qcal-root{ --qcal-bg:#ffffff; --qcal-surface:#ffffff; --qcal-text:#0f172a; --qcal-muted:#64748b; --qcal-border:#e2e8f0;
            --qcal-chip:#0ea5e9; --qcal-chip-text:#ffffff; --qcal-other:#f8fafc; --qcal-hour-h:48px; }
.qcal-root[data-theme="dark"], [data-theme="dark"] .qcal-root{ --qcal-bg:#0b1220; --qcal-surface:#0f172a; --qcal-text:#e2e8f0; --qcal-muted:#94a3b8; --qcal-border:#1e293b; --qcal-chip:#0ea5e9; --qcal-chip-text:#0b1220; --qcal-other:#0b1220; }

.qcal-root{ font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, Arial; color:var(--qcal-text); background:var(--qcal-bg); border:1px solid var(--qcal-border); border-radius:12px; overflow:hidden; }
.qcal-views{ display:flex; gap:8px; padding:8px 12px 0; }
.qcal-tab{ font-size:12px; padding:6px 10px; border-radius:999px; border:1px solid var(--qcal-border); background:var(--qcal-surface); cursor:pointer; }
.qcal-tab:hover{ filter:brightness(1.05); }

.qcal-header{ display:flex; align-items:center; gap:8px; padding:10px 12px; border-bottom:1px solid var(--qcal-border); background:var(--qcal-surface); }
.qcal-title{ font-weight:600; }
.qcal-spacer{ flex:1; }
.qcal-controls .qcal-btn{ font-size:12px; border:1px solid var(--qcal-border); background:var(--qcal-surface); padding:6px 10px; border-radius:8px; cursor:pointer; }
.qcal-controls .qcal-btn:hover{ filter:brightness(1.05); }

.qcal-stage{ padding:8px; }

/* Month */
.qcal-dow{ display:grid; grid-template-columns: repeat(7, 1fr); gap:6px; padding:0 2px 6px; }
.qcal-dow-cell{ font-size:12px; text-transform:uppercase; color:var(--qcal-muted); padding:2px 6px; }

.qcal-month{ position:relative; display:grid; grid-template-columns: repeat(7, 1fr); grid-auto-rows: 130px; gap:6px; }
.qcal-day{ background:var(--qcal-surface); border:1px solid var(--qcal-border); border-radius:10px; padding:6px; display:flex; flex-direction:column; }
.qcal-day.is-other{ background:var(--qcal-other); opacity:.85; }
.qcal-day.is-today{ box-shadow: inset 0 0 0 2px var(--qcal-chip); }
.qcal-date{ font-size:12px; color:var(--qcal-muted); display:flex; justify-content:flex-end; }
.qcal-pile{ display:flex; flex-direction:column; gap:4px; margin-top: calc(var(--qcal-span-offset, 0px) + 4px); overflow:hidden; }

.qcal-chip{ display:block; width:100%; text-align:left; font-size:12px; line-height:1.2; padding:4px 6px; color:var(--qcal-chip-text); background:var(--qcal-chip); border:none; border-radius:8px; cursor:pointer; text-decoration:none; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.qcal-chip.is-compact{ font-size:10px; padding:2px 4px; border-radius:6px; }
.qcal-more{ font-size:11px; padding:2px 6px; border-radius:6px; border:1px dashed var(--qcal-border); background:transparent; color:var(--qcal-muted); cursor:pointer; }
.qcal-more:hover{ background:rgba(2,132,199,.08); }

/* Month overlay span bars */
.qcal-month-overlay{ position:absolute; inset:0; pointer-events:none; }
.qcal-spanbar{ position:absolute; background:var(--qcal-chip); color:var(--qcal-chip-text); border-radius:0; border:1px solid rgba(0,0,0,.08); box-shadow:0 2px 6px rgba(15,23,42,.08); height:18px; display:flex; align-items:center; overflow:hidden; pointer-events:auto; }
.qcal-spanbar.is-start{ border-top-left-radius:8px; border-bottom-left-radius:8px; }
.qcal-spanbar.is-end{ border-top-right-radius:8px; border-bottom-right-radius:8px; }
.qcal-spanbar .qcal-spanbar-label{ font-size:11px; line-height:1; padding:0 8px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.qcal-spanbar:hover{ filter:brightness(1.05); }

/* Week/Day */
.qcal-week{ display:flex; flex-direction:column; gap:6px; }
.qcal-week-head, .qcal-week-allday, .qcal-week-body{ display:grid; gap:6px; align-items:stretch; }
.qcal-head-day{ background:var(--qcal-surface); border:1px solid var(--qcal-border); border-radius:10px; padding:6px; font-size:12px; color:var(--qcal-muted); }
.qcal-head-day.is-today{ box-shadow: inset 0 0 0 2px var(--qcal-chip); color:var(--qcal-text); }
.qcal-hours-label{ font-size:11px; color:var(--qcal-muted); display:flex; align-items:center; justify-content:center; }
.qcal-week-allday .qcal-pile{ background:var(--qcal-surface); border:1px solid var(--qcal-border); border-radius:10px; padding:6px; min-height:44px; }

.qcal-week-body{ position:relative; }
.qcal-hours{ position:relative; background:var(--qcal-surface); border:1px solid var(--qcal-border); border-radius:10px; }
.qcal-hour{ position:absolute; left:6px; font-size:11px; color:var(--qcal-muted); transform:translateY(-50%); }
.qcal-col{ position:relative; background:var(--qcal-surface); border:1px solid var(--qcal-border); border-radius:10px; overflow:hidden; }
.qcal-col:before{ content:""; position:absolute; left:0; right:0; top:0; bottom:0; background-image: linear-gradient(to bottom, transparent 95%, var(--qcal-border) 95%); background-size: 100% var(--qcal-hour-h); pointer-events:none; opacity:.6; }

.qcal-block{ position:absolute; border-radius:8px; padding:6px; font-size:12px; background:var(--qcal-chip); color:var(--qcal-chip-text); box-shadow:0 4px 10px rgba(15,23,42,.12); overflow:hidden; }
.qcal-block-title{ font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.qcal-block-time{ font-size:11px; opacity:.9; }

/* Agenda */
.qcal-agenda{ display:flex; flex-direction:column; gap:10px; }
.qcal-agenda-day{ background:var(--qcal-surface); border:1px solid var(--qcal-border); border-radius:10px; overflow:hidden; }
.qcal-agenda-head{ padding:8px 10px; font-weight:600; background:var(--qcal-other); color:var(--qcal-text); border-bottom:1px solid var(--qcal-border); }
.qcal-agenda-head.is-today{ background:rgba(14,165,233,.12); }
.qcal-agenda-list{ padding:8px; display:flex; flex-direction:column; gap:6px; }
.qcal-agenda-item{ display:flex; align-items:center; gap:10px; padding:8px; border:1px solid var(--qcal-border); border-left:4px solid var(--qcal-chip); border-radius:8px; text-decoration:none; color:inherit; }
.qcal-agenda-time{ font-size:12px; color:var(--qcal-muted); min-width:84px; }
.qcal-agenda-title{ font-size:14px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

/* Popover */
.qcal-popover{ position:absolute; z-index:9999; }
.qcal-popover .qcal-pop{
  max-width: 300px; background: var(--qcal-surface); border: 1px solid var(--qcal-border);
  box-shadow: 0 12px 28px rgba(16,24,40,.18); border-radius: 10px; padding: 8px;
}
.qcal-popover .qcal-row{ font-size: 12px; padding: 6px 4px; border-bottom: 1px dashed var(--qcal-border); color:var(--qcal-text); }
.qcal-popover .qcal-row:last-child{ border-bottom: 0; }

/* Responsive */
@media (max-width: 900px){
  .qcal-month{ grid-auto-rows: 110px; }
}
@media (max-width: 700px){
  .qcal-dow-cell{ font-size:11px; }
  .qcal-month{ grid-auto-rows: 96px; }
  .qcal-head-day{ font-size:11px; }
}
