/* tdeck-calendar.css — shared operations-calendar component layer (WP-08).
   Loaded on BOTH the dashboard and reminders views (see TDECK_Plugin::assets()).
   The calendar's base grid/day/event styling still lives in the shared
   component library in tdeck-app.css; this file adds the pieces the shared
   interactive component needs on top of it:
     1. the client-side filter bar + removable chips,
     2. the per-view print button,
     3. the themeable tone→colour rules (fed by WP-01's Theme Lab tokens), and
     4. a print-tuned layout that resets the dark planning surface for paper.
   Keep it self-contained: no JS library, no external assets. */

/* ---------- 1. Colour rules (WP-01 Theme Lab tokens) --------------------- */
/* The tone→colour map now reads dedicated calendar tokens so a tenant can
   retint the calendar independently of the global alert palette. Each token
   defaults (in tdeck-theme.css) to the matching brand/alert token, so it keeps
   following the brand until explicitly overridden in the Theme Lab. Loaded
   after tdeck-app.css, so these equal-specificity rules win. */
.tdeck-calendar-legend .blue{color:var(--tdeck-calendar-tone-session)}
.tdeck-calendar-legend .orange{color:var(--tdeck-calendar-tone-soon)}
.tdeck-calendar-legend .red{color:var(--tdeck-calendar-tone-expired)}
.tdeck-day-dots .blue,.tdeck-calendar-event.blue{--tdeck-cal-tone:var(--tdeck-calendar-tone-session)}
.tdeck-day-dots .orange,.tdeck-calendar-event.orange{--tdeck-cal-tone:var(--tdeck-calendar-tone-soon)}
.tdeck-day-dots .red,.tdeck-calendar-event.red{--tdeck-cal-tone:var(--tdeck-calendar-tone-expired)}
.tdeck-day-dots .blue{background:var(--tdeck-calendar-tone-session)!important}
.tdeck-day-dots .orange{background:var(--tdeck-calendar-tone-soon)!important}
.tdeck-day-dots .red{background:var(--tdeck-calendar-tone-expired)!important}
.tdeck-calendar-chip.blue{color:var(--tdeck-calendar-tone-session)}
.tdeck-calendar-chip.orange{color:var(--tdeck-calendar-tone-soon)}
.tdeck-calendar-chip.red{color:var(--tdeck-calendar-tone-expired)}

/* ---------- 2. Print button (per-view, dashboard) ------------------------ */
.tdeck-calendar-print{border:1px solid color-mix(in srgb,var(--tdeck-topbar-text) 18%,transparent);background:color-mix(in srgb,var(--tdeck-topbar-text) 10%,transparent);color:var(--tdeck-topbar-text);border-radius:999px;padding:7px 14px;font-size:11px;font-weight:500;cursor:pointer;display:inline-flex;align-items:center;gap:6px}
.tdeck-calendar-print:hover{background:var(--tdeck-secondary);color:var(--tdeck-panel-text)}

/* ---------- 3. Filter bar + removable chips ------------------------------ */
/* Decluttered: no filled box — a light control strip closed off with a hairline
   divider. Selects read as one clean row on the calendar surface. */
.tdeck-calendar-filters{display:flex;flex-wrap:wrap;align-items:end;gap:12px 14px;margin:0 0 16px;padding:0 0 15px;border-bottom:1px solid color-mix(in srgb,var(--tdeck-topbar-text) 10%,transparent)}
.tdeck-calendar-filters label{display:grid;gap:5px;min-width:158px;flex:1 1 158px}
.tdeck-calendar-filters label>span{font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.07em;color:var(--tdeck-topbar-muted)}
.tdeck-calendar-filters select{width:100%;border:1px solid color-mix(in srgb,var(--tdeck-topbar-text) 15%,transparent);background:var(--tdeck-ui-surface);color:var(--tdeck-topbar-text);border-radius:10px;padding:9px 11px;font-size:12.5px;font-weight:500;cursor:pointer;transition:border-color .18s ease,box-shadow .18s ease}
.tdeck-calendar-filters select:hover{border-color:color-mix(in srgb,var(--tdeck-brand-accent) 40%,transparent)}
.tdeck-calendar-filters select:focus-visible{outline:none;border-color:var(--tdeck-brand-accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--tdeck-brand-accent) 16%,transparent)}
.tdeck-calendar-clear{align-self:end;border:1px solid transparent;background:transparent;color:var(--tdeck-topbar-muted);border-radius:999px;padding:9px 12px;font-size:11px;font-weight:600;cursor:pointer;white-space:nowrap;transition:color .16s ease,background .16s ease}
.tdeck-calendar-clear:hover{color:var(--tdeck-danger);background:color-mix(in srgb,var(--tdeck-danger) 10%,transparent)}
.tdeck-calendar-chips{display:flex;flex-wrap:wrap;gap:8px;flex:1 1 100%;min-width:0}
.tdeck-calendar-chips:empty{display:none}
.tdeck-cal-chip{display:inline-flex;align-items:center;gap:7px;border:1px solid color-mix(in srgb,var(--tdeck-brand-accent) 30%,transparent);border-radius:999px;background:color-mix(in srgb,var(--tdeck-brand-accent) 8%,var(--tdeck-ui-surface));color:var(--tdeck-topbar-text);padding:5px 11px;font-size:12px;font-weight:500;cursor:pointer;transition:border-color .16s ease}
.tdeck-cal-chip i{font-style:normal;font-weight:600;font-size:14px;line-height:1;color:var(--tdeck-topbar-muted)}
.tdeck-cal-chip:hover{border-color:var(--tdeck-danger)}
.tdeck-cal-chip:hover i{color:var(--tdeck-danger)}
@media(max-width:680px){.tdeck-calendar-filters label{flex-basis:100%}.tdeck-calendar-clear{align-self:stretch}}

/* ---------- 4. Print-tuned layout ---------------------------------------- */
/* The planning calendar renders on a dark gradient surface; reset it to white
   with legible cells for paper, and hide the interactive chrome (nav, view
   toggle, filters, print button) so only the schedule prints. */
@media print{
  .tdeck-ops-calendar{background:#fff!important;color:#111!important;border:1px solid #111!important;box-shadow:none!important;border-radius:0!important;padding:0!important}
  .tdeck-ops-calendar .tdeck-kicker,.tdeck-ops-calendar h2,.tdeck-ops-calendar .tdeck-muted,.tdeck-ops-calendar [data-tdeck-calendar-title]{color:#111!important}
  .tdeck-calendar-controls,.tdeck-calendar-nav,.tdeck-calendar-view-toggle,.tdeck-calendar-filters,.tdeck-calendar-print,.tdeck-calendar-legend{display:none!important}
  .tdeck-calendar-day,.tdeck-calendar-week-day,.tdeck-calendar-hour-row{background:#fff!important;color:#111!important;border:1px solid #333!important;box-shadow:none!important}
  .tdeck-calendar-day.is-today,.tdeck-calendar-week-day.is-today{box-shadow:inset 0 0 0 2px #111!important}
  .tdeck-calendar-dow,.tdeck-calendar-week-day header span,.tdeck-calendar-hour-row>strong,.tdeck-calendar-hour-row span,.tdeck-calendar-week-day em{color:#333!important}
  .tdeck-calendar-event{background:#fff!important;color:#111!important;border:1px solid #333!important;border-left:4px solid var(--tdeck-cal-tone,#333)!important}
  .tdeck-calendar-event em{color:#333!important}
  .tdeck-day-dots i,.tdeck-calendar-chip{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .tdeck-day-add,.tdeck-calendar-list-head{display:none!important}
}

/* ---------- 5. In-place session planning (plan mode) --------------------- */
/* Present only when the shared Session drawer is on the page (data-plan="1").
   A hover/focus "+" on each day and a selected-day rail with an Add button open
   that drawer pre-filled — the actual create still runs through the one
   validated tdeck_save_training_session path. */
.tdeck-ops-calendar-plan .tdeck-calendar-day{position:relative;transition:transform .15s ease,box-shadow .15s ease,background .18s ease,border-color .18s ease}
.tdeck-ops-calendar-plan .tdeck-calendar-day:hover{transform:translateY(-2px);box-shadow:0 8px 18px color-mix(in srgb,var(--tdeck-brand-accent) 15%,transparent)}
.tdeck-ops-calendar-plan .tdeck-calendar-day:focus-visible{outline:2px solid var(--tdeck-brand-accent);outline-offset:2px}

.tdeck-day-add{position:absolute;top:5px;right:5px;width:22px;height:22px;display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:7px;cursor:pointer;font-size:16px;font-weight:600;line-height:1;background:var(--tdeck-brand-gradient);color:var(--tdeck-button-text);box-shadow:0 2px 6px color-mix(in srgb,var(--tdeck-brand-accent) 40%,transparent);opacity:0;transform:scale(.82);transition:opacity .14s ease,transform .14s ease;pointer-events:none}
.tdeck-calendar-day:hover .tdeck-day-add,.tdeck-calendar-day:focus-within .tdeck-day-add,.tdeck-calendar-day.is-selected .tdeck-day-add{opacity:1;transform:scale(1);pointer-events:auto}
.tdeck-day-add:hover{filter:brightness(1.1)}
@media(hover:none){.tdeck-day-add{opacity:1;transform:none;pointer-events:auto}}

.tdeck-calendar-list-head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:0 0 12px;padding:11px 14px;border-radius:14px;background:color-mix(in srgb,var(--tdeck-brand-accent) 6%,var(--tdeck-ui-surface));border:1px solid color-mix(in srgb,var(--tdeck-brand-accent) 16%,transparent)}
.tdeck-calendar-list-head[hidden]{display:none}
.tdeck-cal-lh-info{display:flex;align-items:center;gap:9px;min-width:0}
.tdeck-cal-lh-info strong{font-size:13.5px;font-weight:600;color:var(--tdeck-topbar-text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tdeck-cal-lh-count{display:inline-flex;align-items:center;justify-content:center;min-width:22px;height:22px;padding:0 7px;border-radius:999px;background:var(--tdeck-brand-gradient);color:var(--tdeck-button-text);font-size:11px;font-weight:700}
.tdeck-cal-add{display:inline-flex;align-items:center;gap:6px;border:0;border-radius:999px;cursor:pointer;padding:8px 14px;font-size:12px;font-weight:600;background:var(--tdeck-brand-gradient);color:var(--tdeck-button-text);box-shadow:0 3px 10px color-mix(in srgb,var(--tdeck-brand-accent) 32%,transparent);transition:transform .14s ease,filter .14s ease}
.tdeck-cal-add:hover{transform:translateY(-1px);filter:brightness(1.08)}
.tdeck-cal-add span{font-size:15px;line-height:1}
@media(max-width:680px){.tdeck-calendar-list-head{margin-bottom:10px}.tdeck-cal-add{flex:1 1 100%;justify-content:center}}