/* CI 8.1 revision 3: approved calendar workspace. Screen only.
   Existing controls, permission states, categorical colors and print styles own
   their behavior. The collapsed context rail deliberately remains visible. */
@media screen {
  html[data-fliq-ci="8.1"] :is(#calendarView,.fliq-offline-calendar) {
    --calendar-context-width:280px;
    container-type:inline-size;
  }
  html:root[data-fliq-ci="8.1"] #calendarSidebar {
    width:280px; max-width:100%; padding:12px; background:var(--fliq81-sidebar);
    border-right:1px solid var(--fliq8-divider); border-radius:0; box-shadow:none;
    top:var(--calendar-sidebar-top,68px); bottom:var(--calendar-sidebar-bottom,32px);
  }
  html:root[data-fliq-ci="8.1"] #appShell:not([hidden]):has(#calendarView:not([hidden]))>#calendarSidebar:not([hidden]) {display:flex;}
  html:root[data-fliq-ci="8.1"] #calendarSidebar.is-collapsed {width:48px;padding:0;overflow:visible;}
  html:root[data-fliq-ci="8.1"] #calendarSidebar button {appearance:none;min-width:44px;min-height:44px;padding:8px 12px;border:0;border-radius:8px;background:transparent;color:var(--fliq8-text);font:400 13px/1.5 var(--fliq81-font);box-shadow:none;cursor:pointer;}
  html:root[data-fliq-ci="8.1"] #calendarSidebar button:hover {background:var(--fliq8-selected);}
  html:root[data-fliq-ci="8.1"] #calendarSidebarToggle {
    display:flex; align-items:center; flex:0 0 auto; width:100%; min-width:44px;
    min-height:44px; margin:0; padding:8px 0; gap:8px; border:0; border-radius:8px;
    background:transparent; color:var(--fliq81-plan-accent); text-align:left;
    position:relative; z-index:1;
  }
  html:root[data-fliq-ci="8.1"] #calendarSidebarToggle>span[aria-hidden] {
    display:block; width:44px; height:28px; flex:0 0 44px; font-size:0;
    background:currentColor; mask:url("icons/chevron-left.svg") center/18px 18px no-repeat;
  }
  html:root[data-fliq-ci="8.1"] #calendarSidebar.is-collapsed #calendarSidebarToggle {
    width:44px; height:44px; min-height:44px; margin:8px 2px;
    background:var(--fliq81-plan-tint); border:1px solid var(--fliq8-control);
  }
  html:root[data-fliq-ci="8.1"] #calendarSidebar.is-collapsed #calendarSidebarToggle>span[aria-hidden] {flex-basis:42px;width:42px;mask-image:url("icons/chevron-right.svg");}
  html:root[data-fliq-ci="8.1"] #calendarSidebar.is-collapsed .calendar-sidebar-title {display:none;}
  html:root[data-fliq-ci="8.1"] #calendarSidebarContent:not([hidden]) {display:block;overflow:auto;padding:8px 4px;scrollbar-width:thin;min-height:0;}
  html:root[data-fliq-ci="8.1"] #calendarSidebarContent[hidden] {display:none;}
  html:root[data-fliq-ci="8.1"] #calendarSidebar :is(h3,.calendar-sidebar-title) {font-size:13px;line-height:1.5;font-weight:600;margin:0;}
  html:root[data-fliq-ci="8.1"] #calendarSidebar .sidebar-active-calendar {display:grid;gap:4px;padding:12px;background:var(--fliq81-plan-tint);border:1px solid var(--fliq8-divider);border-radius:8px;}
  html:root[data-fliq-ci="8.1"] #calendarSidebar .sidebar-active-calendar>h3 {font-size:12px;font-weight:400;color:var(--fliq-text-secondary);}
  html:root[data-fliq-ci="8.1"] #calendarSidebar .sidebar-active-calendar>strong {font-size:14px;line-height:1.5;overflow-wrap:break-word;}
  html:root[data-fliq-ci="8.1"] #calendarSidebar [data-change-sidebar-calendar] {margin-top:4px;background:var(--fliq8-surface);color:var(--fliq81-plan-accent);border:1px solid var(--fliq8-control);padding:8px 12px;}
  html:root[data-fliq-ci="8.1"] #calendarSidebarContent>.sidebar-library {padding-top:16px;margin-top:16px;overflow:visible;border-top:1px solid var(--fliq8-divider);}
  html:root[data-fliq-ci="8.1"] #calendarSidebar .sidebar-library-actions {display:grid;grid-template-columns:1fr;gap:0;margin:4px 0 8px;}
  html:root[data-fliq-ci="8.1"] #calendarSidebar .sidebar-library-actions button {text-decoration:none;color:var(--fliq81-plan-accent);justify-content:flex-start;text-align:left;}
  html:root[data-fliq-ci="8.1"] #calendarSidebar .sidebar-library-field {display:grid;gap:4px;margin:8px 0;min-width:0;}
  html:root[data-fliq-ci="8.1"] #calendarSidebar .sidebar-library-field :is(input,select) {min-width:0;width:100%;max-width:100%;}
  html:root[data-fliq-ci="8.1"] #calendarSidebar .sidebar-session {
    display:grid;gap:4px;padding:12px;margin-top:8px;min-width:0;
    background:var(--fliq8-surface);border:1px solid var(--fliq8-divider);
    border-left:3px solid var(--fliq-training-type-accent,var(--fliq81-plan-accent));border-radius:8px;
  }
  html:root[data-fliq-ci="8.1"] #calendarSidebar .sidebar-session-actions {display:flex;gap:4px;flex-wrap:wrap;margin-top:4px;}
  html:root[data-fliq-ci="8.1"] #calendarSidebar .sidebar-session-actions button {flex:1 1 80px;width:auto;min-height:44px;padding:8px;text-align:center;}
  html:root[data-fliq-ci="8.1"] #calendarSidebar :is([data-sidebar-schedule],[data-offline-sidebar-insert]) {color:var(--fliq81-plan-accent);background:var(--fliq81-plan-tint);border:1px solid var(--fliq8-control);border-radius:8px;}
  html:root[data-fliq-ci="8.1"] #appShell:has(#calendarView:not([hidden])):has(>#calendarSidebar:not(.is-collapsed):not([hidden]))>#mainContent {width:calc(100% - 280px);max-width:none;margin-left:280px;margin-right:0;padding:16px 24px 24px;}
  html:root[data-fliq-ci="8.1"] #appShell:has(#calendarView:not([hidden])):has(>#calendarSidebar.is-collapsed:not([hidden]))>#mainContent {width:calc(100% - 48px);max-width:none;margin-left:48px;margin-right:0;padding:16px 24px 24px;}

  /* Calendar identity and actions share a compact row. The full protected mark
     is retained; wrapping responds to the actual remaining content width. */
  html:root[data-fliq-ci="8.1"] #calendarView>.page-heading {display:flex;align-items:center;justify-content:space-between;gap:12px 16px;flex-wrap:wrap;margin:0 0 12px;padding:0;border:0;}
  html:root[data-fliq-ci="8.1"] #calendarView>.page-heading>div:first-child {display:flex;align-items:center;gap:12px 16px;flex-wrap:wrap;min-width:0;}
  html:root[data-fliq-ci="8.1"] #calendarView .page-heading h1 {font-size:18px;line-height:1.4;margin:0;padding-left:16px;border-left:1px solid var(--fliq8-divider);}
  html:root[data-fliq-ci="8.1"] #calendarView .page-heading .eyebrow {display:none;}
  html:root[data-fliq-ci="8.1"] #calendarView .page-actions {display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:0;}
  html:root[data-fliq-ci="8.1"] #calendarView .calendar-toolbar {margin:0 0 12px;padding:8px 0;gap:8px 12px;border-top:1px solid var(--fliq8-divider);border-bottom:0;align-items:center;justify-content:space-between;}
  html:root[data-fliq-ci="8.1"] #calendarView .calendar-period-row.fliq-calendar-period {margin:0 auto 0 0;min-width:0;flex:1 1 220px;}
  html:root[data-fliq-ci="8.1"] #calendarView .calendar-period-row.fliq-calendar-period h2 {font-size:15px;line-height:1.5;margin:0;}
  html:root[data-fliq-ci="8.1"] :is(#calendarView .segmented-control,.fliq-offline-calendar .view-switch) {padding:0;gap:0;border:0;background:var(--fliq81-sidebar);}
  html:root[data-fliq-ci="8.1"] :is(#calendarView .segmented-control,.fliq-offline-calendar .view-switch) button:is(.active,[aria-pressed=true]) {background:var(--fliq81-plan-tint);color:var(--fliq81-plan-accent);border-color:var(--fliq8-control);box-shadow:none;}
  html:root[data-fliq-ci="8.1"] #trainingTimeline.week-view[data-fliq-day-headers] .calendar-weekdays {display:none;}
  html:root[data-fliq-ci="8.1"] #trainingTimeline.week-view[data-fliq-day-headers] .calendar-days {grid-template-columns:repeat(7,minmax(0,1fr));}
  html:root[data-fliq-ci="8.1"] #trainingTimeline.week-view[data-fliq-day-headers] .calendar-week-actions {display:none;}
  html:root[data-fliq-ci="8.1"] #calendarView .fliq-calendar-week-menu {appearance:none;display:grid;place-items:center;flex:0 0 44px;width:44px;min-width:44px;height:44px;min-height:44px;padding:4px;border:1px solid var(--fliq8-control);border-radius:8px;background:var(--fliq8-surface);color:var(--fliq8-text);font-size:20px;box-shadow:none;}
  html:root[data-fliq-ci="8.1"] #trainingTimeline.week-view .calendar-days {border-radius:8px 8px 0 0;overflow:hidden;}
  html:root[data-fliq-ci="8.1"] #trainingTimeline.week-view .calendar-day {padding:0;min-height:0;}
  html:root[data-fliq-ci="8.1"] #trainingTimeline.week-view .calendar-day-heading {display:grid;grid-template-columns:minmax(0,1fr);align-items:center;gap:0;padding:4px;border-bottom:1px solid var(--fliq8-divider);background:var(--fliq81-sidebar);font-size:12px;font-weight:500;}
  html:root[data-fliq-ci="8.1"] #trainingTimeline.week-view :is(.calendar-day-create,.calendar-day-label) {margin:0;padding:4px;min-height:44px;width:100%;font-size:12px;line-height:1.4;word-break:normal;overflow-wrap:break-word;}
  html:root[data-fliq-ci="8.1"] #trainingTimeline.week-view .calendar-day-actions {display:flex;flex-wrap:nowrap;align-items:center;justify-content:flex-end;gap:0;}
  html:root[data-fliq-ci="8.1"] #trainingTimeline.week-view .calendar-day-actions>strong {margin-right:auto;min-width:20px;width:20px;height:24px;font-size:12px;background:var(--fliq81-plan-tint);color:var(--fliq81-plan-accent);}
  html:root[data-fliq-ci="8.1"] #trainingTimeline.week-view .calendar-day-units {display:grid;align-content:start;gap:8px;margin:0;padding:8px;}
  html:root[data-fliq-ci="8.1"] #trainingTimeline.week-view .calendar-day-empty {padding:4px 0;font-size:12px;}
  html:root[data-fliq-ci="8.1"] #trainingTimeline.week-view .calendar-day.today {outline:2px solid var(--fliq81-plan-accent);outline-offset:-2px;background:var(--fliq8-surface);}
  html:root[data-fliq-ci="8.1"] #trainingTimeline.week-view .calendar-day.today>.calendar-day-heading {color:var(--fliq81-plan-accent);background:var(--fliq81-plan-tint);}
  html:root[data-fliq-ci="8.1"] #trainingTimeline.week-view .session-card {padding:4px;border-radius:8px;}
  html:root[data-fliq-ci="8.1"] #trainingTimeline.week-view .session-card-trigger {padding:8px 4px;gap:4px;}
  html:root[data-fliq-ci="8.1"] #trainingTimeline.week-view .session-card:has(>.session-menu-button) .session-card-trigger {padding-top:4px;}
  html:root[data-fliq-ci="8.1"] #trainingTimeline.week-view .session-card:has(>.session-menu-button) .session-title {min-height:44px;padding-right:36px;display:flex;align-items:center;}
  html:root[data-fliq-ci="8.1"] #trainingTimeline.week-view :is(.session-title,.session-card-meta,.session-card-indicators,.session-iqss) {font-size:12px;line-height:1.5;}
  html:root[data-fliq-ci="8.1"] #trainingTimeline.week-view .session-title {font-size:13px;font-weight:600;}

  /* Offline uses the same context rail and keeps the existing controls and
     template editor/library routes. Its native parent remains the navigation. */
  html:root[data-fliq-ci="8.1"] .app-shell.fliq-offline-workspace {grid-template-columns:204px 280px minmax(0,1fr);align-items:start;}
  html:root[data-fliq-ci="8.1"] .app-shell.fliq-offline-workspace:has(>#calendarSidebar.is-collapsed) {grid-template-columns:204px 48px minmax(0,1fr);}
  html:root[data-fliq-ci="8.1"] .fliq-offline-workspace>.sidebar {grid-column:1;grid-row:1;height:100dvh;position:sticky;top:0;flex-direction:column;}
  html:root[data-fliq-ci="8.1"] .fliq-offline-workspace>#calendarSidebar {grid-column:2;grid-row:1;position:sticky;left:auto;top:0;bottom:auto;height:100dvh;min-height:44px;display:flex;flex-direction:column;}
  html:root[data-fliq-ci="8.1"] .fliq-offline-workspace>#mainContent {grid-column:3;grid-row:1;min-width:0;width:100%;padding:16px 24px 24px;}
  html:root[data-fliq-ci="8.1"] .fliq-offline-calendar .page-header {max-width:none;gap:12px;align-items:center;flex-wrap:wrap;margin:0 0 12px;}
  html:root[data-fliq-ci="8.1"] .fliq-offline-calendar .page-header>div:first-child {display:flex;align-items:center;gap:12px 16px;flex-wrap:wrap;}
  html:root[data-fliq-ci="8.1"] .fliq-offline-calendar .page-header h1 {font-size:18px;line-height:1.4;}
  html:root[data-fliq-ci="8.1"] .fliq-offline-calendar .page-header .supporting {font-size:12px;margin:0;flex-basis:100%;}
  html:root[data-fliq-ci="8.1"] .fliq-offline-calendar .page-header .eyebrow {display:none;}
  html:root[data-fliq-ci="8.1"] .fliq-offline-calendar .calendar-controls {display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px 12px;margin:0 0 12px;max-width:none;padding:8px 0;border-top:1px solid var(--fliq8-divider);border-bottom:0;}
  html:root[data-fliq-ci="8.1"] .fliq-offline-calendar .period-navigation {flex-wrap:wrap;gap:4px;}
  html:root[data-fliq-ci="8.1"] .fliq-offline-calendar #periodLabel {font-size:15px;line-height:1.5;}
  html:root[data-fliq-ci="8.1"] .fliq-offline-calendar :is(.calendar-kpis,.calendar-legend,.calendar-training-legend) {margin:0 0 12px;gap:8px;}
  html:root[data-fliq-ci="8.1"] .fliq-offline-calendar .calendar-kpis {display:flex;flex-wrap:wrap;}
  html:root[data-fliq-ci="8.1"] .fliq-offline-calendar .calendar-kpis article {display:flex;align-items:baseline;gap:8px;padding:8px 12px;min-height:0;flex:1 1 140px;}
  html:root[data-fliq-ci="8.1"] .fliq-offline-calendar .calendar-kpis strong {font-size:18px;}
  html:root[data-fliq-ci="8.1"] .fliq-offline-calendar .week-grid {min-height:0;grid-template-columns:repeat(7,minmax(112px,1fr));width:auto;}
  html:root[data-fliq-ci="8.1"] .fliq-offline-calendar .day-head {min-height:64px;padding:8px;background:var(--fliq81-sidebar);}
  html:root[data-fliq-ci="8.1"] .fliq-offline-calendar .day-head.today {color:var(--fliq81-plan-accent);background:var(--fliq81-plan-tint);border-bottom-color:var(--fliq81-plan-accent);}
  html:root[data-fliq-ci="8.1"] .fliq-offline-calendar .day-head strong {font-size:15px;}
  html:root[data-fliq-ci="8.1"] .fliq-offline-calendar .day-sessions {padding:8px;gap:8px;}
  html:root[data-fliq-ci="8.1"] .fliq-offline-calendar .session-card {min-width:0;max-width:100%;}
  html:root[data-fliq-ci="8.1"] .fliq-offline-calendar .session-card .offline-session-trigger {display:grid;grid-template-columns:minmax(0,1fr);gap:4px;padding:4px 8px 8px;min-width:0;}
  html:root[data-fliq-ci="8.1"] .fliq-offline-calendar .session-card-title {grid-row:1;display:flex;align-items:center;min-height:44px;padding-right:36px;font-size:13px;font-weight:600;}
  html:root[data-fliq-ci="8.1"] .fliq-offline-calendar .session-card .session-card-meta {grid-row:2;margin:0;}
  html:root[data-fliq-ci="8.1"] .fliq-offline-calendar .session-card .unit-card-facts {grid-row:3;}
  html:root[data-fliq-ci="8.1"] .fliq-offline-calendar .session-card .session-training-type {grid-row:4;justify-self:start;white-space:normal;}
  html:root[data-fliq-ci="8.1"] .fliq-offline-calendar .session-card-iqss {white-space:normal;overflow-wrap:break-word;}
  html:root[data-fliq-ci="8.1"] .fliq-offline-calendar .calendar {max-width:none;margin:0;overflow-x:auto;}
  @media(min-width:1800px) {
    html:root[data-fliq-ci="8.1"] #trainingTimeline.week-view .calendar-day-heading {grid-template-columns:minmax(0,1fr) auto;}
  }
  @media(max-width:1100px) {
    html:root[data-fliq-ci="8.1"] .app-shell.fliq-offline-workspace {grid-template-columns:280px minmax(0,1fr);}
    html:root[data-fliq-ci="8.1"] .app-shell.fliq-offline-workspace:has(>#calendarSidebar.is-collapsed) {grid-template-columns:48px minmax(0,1fr);}
    html:root[data-fliq-ci="8.1"] .fliq-offline-workspace>.sidebar {grid-column:1/-1;grid-row:1;position:static;height:auto;flex-direction:row;flex-wrap:wrap;gap:16px;}
    html:root[data-fliq-ci="8.1"] .fliq-offline-workspace>#calendarSidebar {grid-column:1;grid-row:2;}
    html:root[data-fliq-ci="8.1"] .fliq-offline-workspace>#mainContent {grid-column:2;grid-row:2;}
  }
  @media(max-width:699px) {
    html:root[data-fliq-ci="8.1"] #calendarSidebar,
    html:root[data-fliq-ci="8.1"] #calendarSidebar:not(.is-collapsed),
    html:root[data-fliq-ci="8.1"] .fliq-offline-workspace>#calendarSidebar {
      position:relative;left:auto;top:auto;bottom:auto;width:100%;max-width:none;height:auto;
      padding:8px 12px;border-right:0;border-bottom:1px solid var(--fliq8-divider);z-index:auto;
    }
    html:root[data-fliq-ci="8.1"] #calendarSidebar.is-collapsed {width:100%;padding:0 12px;min-height:60px;}
    html:root[data-fliq-ci="8.1"] #calendarSidebarContent:not([hidden]) {max-height:60dvh;}
    html:root[data-fliq-ci="8.1"] #appShell:has(#calendarView:not([hidden])):has(>#calendarSidebar:not([hidden]))>#mainContent,
    html:root[data-fliq-ci="8.1"] #appShell:has(#calendarView:not([hidden])):has(>#calendarSidebar.is-collapsed:not([hidden]))>#mainContent {width:100%;margin:0;padding:16px;}
    html:root[data-fliq-ci="8.1"] .app-shell.fliq-offline-workspace,
    html:root[data-fliq-ci="8.1"] .app-shell.fliq-offline-workspace:has(>#calendarSidebar.is-collapsed) {grid-template-columns:minmax(0,1fr);}
    html:root[data-fliq-ci="8.1"] .fliq-offline-workspace>#calendarSidebar {grid-column:1;grid-row:2;}
    html:root[data-fliq-ci="8.1"] .fliq-offline-workspace>#mainContent {grid-column:1;grid-row:3;padding:16px;}
    html:root[data-fliq-ci="8.1"] #calendarView .page-heading h1 {padding:0;border:0;font-size:22px;}
    html:root[data-fliq-ci="8.1"] #calendarView .calendar-period-row.fliq-calendar-period {flex-basis:100%;}
  }
}
@media print { #calendarSidebar {display:none!important;} }
