/* Time-only Focus presentation. Load after focus-workspace-preview.css.
   Shared canvas/navigation activation is owned by the rollout integrator. */
#panel-timesheet .time-session {
  display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 24px;
  align-items: center; padding: 24px; margin-block: 18px 24px;
  border: 1px solid var(--border); border-radius: 24px; background: var(--card);
}
#panel-timesheet .time-session-copy { min-inline-size: 0; }
#panel-timesheet .time-session-label { font-size: 12px; color: var(--muted); }
#panel-timesheet .time-session h2 { margin: 10px 0; font-size: 24px; overflow-wrap: anywhere; }
#panel-timesheet .time-session .time-note { max-inline-size: 65ch; margin: 0; }
#panel-timesheet .time-session-clock { font-size: clamp(28px,4vw,52px); line-height: 1.3; font-weight: 400; font-variant-numeric: tabular-nums; white-space: nowrap; }
#panel-timesheet .time-session .time-actions { grid-column: 1 / -1; }
#panel-timesheet .time-session [hidden] { display: none; }
#panel-timesheet .time-session :focus-visible { outline: 3px solid var(--green); outline-offset: 3px; }

html[data-rattib-material="glass"]:is(.rt-route:not(#_),:has(.time-dialog[open])) body.workspace-framed :is(#panel-timesheet,#time-entry-dialog,#time-settings-dialog,#time-export-dialog) {
  --time-ink: var(--preview-ink,#f7f5ee); --time-muted: var(--preview-muted,#cbc5d2);
  --time-line: var(--preview-line,rgb(246 240 249 / .16)); --time-surface: #211b2b;
  --time-input: #2b2337; --time-soft: rgb(34 27 45 / .88);
  --time-accent: var(--preview-accent,#9bc8a7); --time-action-bg: var(--preview-action,#00d492);
  --time-action-fg: var(--preview-action-ink,#0c0a07);
  color: var(--time-ink); font-family: var(--preview-ui,"Instrument Sans","IBM Plex Sans Arabic",sans-serif);
}
html[data-theme="light"][data-rattib-material="glass"]:is(.rt-route:not(#_),:has(.time-dialog[open])) body.workspace-framed :is(#panel-timesheet,#time-entry-dialog,#time-settings-dialog,#time-export-dialog) {
  --time-ink: var(--preview-ink,#24342c); --time-muted: var(--preview-muted,#4d6156);
  --time-line: var(--preview-line,rgb(35 70 50 / .17)); --time-surface: #fdfdf9;
  --time-input: #fff; --time-soft: #f3f7f1; --time-accent: var(--preview-accent,#256947);
  --time-action-bg: var(--preview-action,#127451); --time-action-fg: #fff;
}
html[data-rattib-material="glass"].rt-route:not(#_) body.workspace-framed #panel-timesheet { padding: 8px 14px 24px; background: none; border: 0; box-shadow: none; }
html[data-rattib-material="glass"].rt-route:not(#_) body.workspace-framed #panel-timesheet .time-head { gap: 20px; border: 0; padding: 4px 0 12px; margin: 0; }
html[data-rattib-material="glass"].rt-route:not(#_) body.workspace-framed #panel-timesheet .time-head h1 { font: 400 clamp(36px,4vw,52px)/1.2 var(--preview-display,"Instrument Serif",Georgia,serif); letter-spacing: -.02em; }
html[lang="ar"][data-rattib-material="glass"].rt-route:not(#_) body.workspace-framed #panel-timesheet .time-head h1 { font-family: "IBM Plex Sans Arabic",sans-serif; font-size: clamp(28px,3vw,38px); line-height: 1.55; letter-spacing: 0; }
html[data-rattib-material="glass"].rt-route:not(#_) body.workspace-framed #panel-timesheet .time-head p { color: var(--time-muted); font: 400 14px/1.8 var(--preview-ui,"Instrument Sans","IBM Plex Sans Arabic",sans-serif); text-transform: none; letter-spacing: 0; }
html[data-rattib-material="glass"].rt-route:not(#_) body.workspace-framed #panel-timesheet .time-session { color: var(--time-ink); background: var(--time-soft); border-color: var(--time-line); box-shadow: var(--preview-shadow); border-radius: 26px; }
html[data-rattib-material="glass"].rt-route:not(#_) body.workspace-framed #panel-timesheet .time-session[data-state="running"] { border-inline-start: 3px solid var(--time-accent); }
html[data-rattib-material="glass"].rt-route:not(#_) body.workspace-framed #panel-timesheet .time-session :is(.time-session-label,.time-note) { color: var(--time-muted); }
html[data-rattib-material="glass"].rt-route:not(#_) body.workspace-framed #panel-timesheet .time-session-clock { color: var(--time-accent); font-family: var(--preview-mono,"IBM Plex Mono",monospace); }
html[data-rattib-material="glass"].rt-route:not(#_) body.workspace-framed #panel-timesheet :is(.time-filters,.time-advanced,.time-allocation,.time-list) { padding: 18px; border: 1px solid var(--time-line); border-radius: 20px; background: var(--time-soft); color: var(--time-ink); box-shadow: none; }
html[data-rattib-material="glass"].rt-route:not(#_) body.workspace-framed #panel-timesheet .time-advanced { padding-block: 2px; }
html[data-rattib-material="glass"].rt-route:not(#_) body.workspace-framed #panel-timesheet .time-advanced summary { color: var(--time-muted); font-size: 13px; }
html[data-rattib-material="glass"].rt-route:not(#_) body.workspace-framed #panel-timesheet .time-totals { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 14px; padding: 0; background: none; border: 0; box-shadow: none; }
html[data-rattib-material="glass"].rt-route:not(#_) body.workspace-framed #panel-timesheet .time-total-card { display: grid; gap: 12px; min-inline-size: 0; padding: 20px; background: var(--time-soft); border: 1px solid var(--time-line); border-radius: 20px; }
html[data-rattib-material="glass"].rt-route:not(#_) body.workspace-framed #panel-timesheet .time-total-label { color: var(--time-muted); font-size: 12px; font-weight: 400; }
html[data-rattib-material="glass"].rt-route:not(#_) body.workspace-framed #panel-timesheet .time-total-value { color: var(--time-ink); font: 400 clamp(21px,2vw,30px)/1.4 var(--preview-mono,"IBM Plex Mono",monospace); overflow-wrap: anywhere; }
html[data-rattib-material="glass"].rt-route:not(#_) body.workspace-framed #panel-timesheet .time-list { overflow: auto; padding: 0; }
html[data-rattib-material="glass"].rt-route:not(#_) body.workspace-framed #panel-timesheet .time-list :is(table,thead,tbody,tr,th,td) { background: transparent; color: var(--time-ink); border-color: var(--time-line); }
html[data-rattib-material="glass"].rt-route:not(#_) body.workspace-framed #panel-timesheet .time-list th { color: var(--time-muted); font-size: 12px; }
html[data-rattib-material="glass"].rt-route:not(#_) body.workspace-framed #panel-timesheet :is(.time-note,.muted,.time-field) { color: var(--time-muted); }
html[data-rattib-material="glass"].rt-route:not(#_) body.workspace-framed #panel-timesheet .time-empty { padding: 36px 24px; background: transparent; border: 0; }
html[data-rattib-material="glass"].rt-route:not(#_) body.workspace-framed #panel-timesheet .time-empty h2 { color: var(--time-ink); font-size: 21px; }
html[data-rattib-material="glass"]:is(.rt-route:not(#_),:has(.time-dialog[open])) body.workspace-framed :is(#panel-timesheet,#time-entry-dialog,#time-settings-dialog,#time-export-dialog) :is(button,.ghost) { min-block-size: 44px; min-inline-size: 44px; padding: 10px 15px; border: 1px solid var(--time-line); border-radius: 12px; color: var(--time-ink); background: var(--time-soft); font: 500 13px/1.6 var(--preview-ui,"Instrument Sans","IBM Plex Sans Arabic",sans-serif); box-shadow: none; white-space: normal; overflow-wrap: anywhere; }
html[data-rattib-material="glass"]:is(.rt-route:not(#_),:has(.time-dialog[open])) body.workspace-framed :is(#panel-timesheet,#time-entry-dialog,#time-settings-dialog,#time-export-dialog) .time-primary { background: var(--time-action-bg); color: var(--time-action-fg); border-color: var(--time-action-bg); }
html[data-rattib-material="glass"]:is(.rt-route:not(#_),:has(.time-dialog[open])) body.workspace-framed :is(#panel-timesheet,#time-entry-dialog,#time-settings-dialog,#time-export-dialog) button:disabled { opacity: .65; filter: none; cursor: not-allowed; }
html[data-rattib-material="glass"]:is(.rt-route:not(#_),:has(.time-dialog[open])) body.workspace-framed :is(#panel-timesheet,#time-entry-dialog,#time-settings-dialog,#time-export-dialog) :is(input:not([type="checkbox"]),select,textarea) { box-sizing: border-box; min-inline-size: 0; max-inline-size: 100%; min-block-size: 44px; padding: 10px 12px; color: var(--time-ink); background: var(--time-input); border: 1px solid var(--preview-control-line,#887c93); border-radius: 12px; font-family: inherit; }
html[data-rattib-material="glass"]:has(.time-dialog[open]) body.workspace-framed .time-dialog { padding: 28px; border: 1px solid var(--time-line); border-radius: 24px; color: var(--time-ink); background: var(--time-surface); background-image: none; backdrop-filter: none; box-shadow: 0 24px 80px rgb(0 0 0 / .3); }
html[data-rattib-material="glass"]:has(.time-dialog[open]) body.workspace-framed .time-dialog::backdrop { background: rgb(9 7 15 / .7); backdrop-filter: blur(6px); }
html[data-rattib-material="glass"]:has(.time-dialog[open]) body.workspace-framed .time-dialog :is(.time-field,.time-note) { color: var(--time-muted); }
html[data-rattib-material="glass"]:has(.time-dialog[open]) body.workspace-framed .time-dialog .time-details { background: transparent; border-color: var(--time-line); }
html[data-rattib-material="glass"]:has(.time-dialog[open]) body.workspace-framed .time-dialog .time-details summary { background: var(--time-surface); color: var(--time-ink); }
html[data-rattib-material="glass"]:is(.rt-route:not(#_),:has(.time-dialog[open])) body.workspace-framed :is(#panel-timesheet,#time-entry-dialog,#time-settings-dialog,#time-export-dialog) :is(button,input,select,textarea,summary):focus-visible { outline: 3px solid var(--time-accent); outline-offset: 3px; }
html[data-rattib-material="glass"]:is(.rt-route:not(#_),:has(.time-dialog[open])) body.workspace-framed :is(#panel-timesheet,#time-entry-dialog,#time-settings-dialog,#time-export-dialog) [aria-invalid="true"] { border-color: var(--danger); }

@media (max-width: 760px) {
  #panel-timesheet .time-session { grid-template-columns: minmax(0,1fr); gap: 18px; padding: 20px; }
  #panel-timesheet .time-session-clock { font-size: clamp(32px,10vw,48px); }
  html[data-rattib-material="glass"].rt-route:not(#_) body.workspace-framed #panel-timesheet { padding: 8px 4px 24px; }
  html[data-rattib-material="glass"].rt-route:not(#_) body.workspace-framed #panel-timesheet .time-totals { grid-template-columns: minmax(0,1fr); gap: 10px; }
  html[data-rattib-material="glass"].rt-route:not(#_) body.workspace-framed #panel-timesheet .time-total-card { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px; flex-wrap: wrap; }
  html[data-rattib-material="glass"].rt-route:not(#_) body.workspace-framed #panel-timesheet .time-head .time-actions { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); inline-size: 100%; }
  html[data-rattib-material="glass"].rt-route:not(#_) body.workspace-framed #panel-timesheet .time-row-actions { flex-wrap: wrap; }
  html[data-rattib-material="glass"]:has(.time-dialog[open]) body.workspace-framed .time-dialog { padding: 20px; }
}
@media (forced-colors: active) {
  html[data-rattib-material="glass"]:is(.rt-route:not(#_),:has(.time-dialog[open])) body.workspace-framed :is(#panel-timesheet,#time-entry-dialog,#time-settings-dialog,#time-export-dialog) { --time-ink: CanvasText; --time-muted: CanvasText; --time-line: CanvasText; --time-surface: Canvas; --time-soft: Canvas; --time-input: Canvas; --time-accent: Highlight; --time-action-bg: ButtonFace; --time-action-fg: ButtonText; }
}