/* The calendar's own controls. Everything here is at least 44px on a phone,
   because a date cell that needs aiming at is a date cell nobody taps. */
.cal-head{display:flex;align-items:center;gap:6px;margin:18px 0 14px}
.cal-step{width:44px;height:44px;flex:0 0 44px;border:1px solid var(--line);border-radius:12px;
  background:transparent;color:#f4eef0;font-size:20px;line-height:1}
.cal-month{flex:1;text-align:center;font-size:15px;letter-spacing:.1em;font-variant-numeric:tabular-nums}
.cal-today{min-height:44px;padding:0 14px;border:1px solid var(--line);border-radius:12px;
  background:transparent;color:var(--muted);font-size:13px}
.cal-add{width:44px;height:44px;flex:0 0 44px;border:0;border-radius:12px;background:var(--red);
  color:#16090d;font-size:22px;line-height:1}
.cal-step:hover,.cal-today:hover{border-color:var(--red);color:#fff;background:#32121a}

.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;text-align:center}
.cal-weekday{font-size:11px;color:var(--muted);padding:6px 0}
.cal-blank{display:block}
.cal-day{position:relative;min-height:44px;border:1px solid transparent;border-radius:10px;
  background:transparent;color:#e7dee1;font-size:15px;font-variant-numeric:tabular-nums;padding:0}
.cal-day:hover{border-color:#6b2a34;background:#1d1015}
.cal-day.today{color:#fff;border-color:#6b2a34}
.cal-day.selected{border-color:var(--red);background:#34131b;color:#fff;
  box-shadow:0 0 0 1px #e04a5744 inset}
.cal-dot{position:absolute;left:50%;bottom:6px;width:4px;height:4px;margin-left:-2px;
  border-radius:50%;background:var(--red)}

.cal-agenda{margin-top:20px}
.cal-agenda-head{font-size:12px;color:var(--red);letter-spacing:.14em;margin-bottom:10px}
.cal-empty{margin:0;padding:18px;border:1px dashed var(--line);border-radius:10px;
  color:var(--muted);font-size:14px;text-align:center}
.cal-event{display:flex;align-items:flex-start;gap:12px;border:1px solid var(--line);
  border-radius:10px;padding:12px 14px;margin-bottom:8px;background:#140d12}
.cal-event-time{flex:0 0 56px;color:var(--red);font-size:13px;font-weight:400;
  font-variant-numeric:tabular-nums}
.cal-event-body{flex:1;min-width:0}
.cal-event-body strong{display:block;font-size:14px}
.cal-event-body p{margin:4px 0 0;color:var(--muted);font-size:13px;line-height:1.6}
.cal-event-remove{min-height:44px;padding:0 10px;border:0;background:transparent;
  color:var(--silver-dim);font-size:12px}
.cal-event-remove:hover{color:var(--red)}

.cal-composer{display:grid;gap:12px;margin-top:18px}
.cal-composer-title{font-size:12px;color:var(--red);letter-spacing:.14em}
.cal-field{display:grid;gap:6px;margin:0}
.cal-field>span{color:var(--muted);font-size:13px}
.cal-field input,.cal-field textarea{border:1px solid #6e303a;border-radius:9px;padding:11px;
  background:#140c10;color:inherit;width:100%;min-height:44px}
.cal-field textarea{min-height:64px;resize:vertical}
.cal-composer-actions{display:flex;gap:10px;justify-content:flex-end}
.cal-cancel,.cal-save{min-height:44px;padding:0 20px;border-radius:10px;font-size:14px}
.cal-cancel{border:1px solid var(--line);background:transparent;color:var(--muted)}
.cal-save{border:0;background:var(--red);color:#16090d;font-weight:700}