/* Cable workspace screen material. Controls have one frame; reading surfaces
   stay opaque. Calculation, document and printed-report behaviour is unchanged. */
@media screen {
  body.page-cable {
    --ci-surface: #fff;
    --ci-tint: rgba(255,255,255,.88);
    --ci-highlight: rgba(255,255,255,.98);
    --ci-edge: #8996a8;
    --ci-shadow: 0 2px 6px rgba(30,45,70,.06);
    --ci-group: #f6f7fa;
    --ci-group-edge: #e1e5ed;
    --ci-selected: #dcecff;
    --ci-selected-ink: #0055a4;
  }
  html[data-theme="night"] body.page-cable {
    --ci-surface: #2b2e39;
    --ci-tint: rgba(43,46,57,.94);
    --ci-highlight: rgba(62,66,82,.9);
    --ci-edge: #7d879c;
    --ci-shadow: 0 2px 6px rgba(0,0,0,.16);
    --ci-group: #22242e;
    --ci-group-edge: #414654;
    --ci-selected: #354f70;
    --ci-selected-ink: #d1e8ff;
  }
  #cable-inputs > .vd-card {
    background: var(--ci-group) !important;
    border-color: var(--ci-group-edge) !important;
    border-radius: 18px !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }
  #cable-inputs :is(.field, select.dd, .seg-radio) {
    background: var(--ci-surface) !important;
    border: 1px solid var(--ci-edge) !important;
    border-radius: 12px !important;
    box-shadow: var(--ci-shadow) !important;
  }
  @supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    #cable-inputs :is(.field, select.dd, .seg-radio) {
      background: linear-gradient(160deg,var(--ci-highlight),var(--ci-tint)) !important;
      backdrop-filter: blur(8px) saturate(110%);
      -webkit-backdrop-filter: blur(8px) saturate(110%);
    }
  }
  #cable-inputs .field > :is(input, select.unit-sel) {
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    outline: none !important;
  }
  #cable-inputs .seg-radio label {
    border: 0 !important;
    border-radius: 9px !important;
    background: transparent !important;
    box-shadow: none !important;
    outline: none !important;
  }
  #cable-inputs .seg-radio label.active {
    background: var(--ci-selected) !important;
    color: var(--ci-selected-ink) !important;
  }
  #cable-inputs :is(.field,.seg-radio):has(:focus-visible),
  #cable-inputs select.dd:focus-visible {
    outline: 2px solid var(--ui-accent) !important;
    outline-offset: 3px;
  }
  #cable-inputs select option { background:var(--ci-surface); color:var(--ui-ink); }
  @media (prefers-reduced-transparency:reduce), (prefers-contrast:more) {
    #cable-inputs :is(.field,select.dd,.seg-radio) {
      background: var(--ci-surface) !important;
      backdrop-filter: none;
      -webkit-backdrop-filter: none;
      box-shadow: none !important;
    }
  }
  @media (forced-colors:active) {
    #cable-inputs :is(.field,select.dd,.seg-radio) {
      background: Canvas !important; border-color: ButtonText !important;
      box-shadow:none !important; backdrop-filter:none; -webkit-backdrop-filter:none;
    }
    #cable-inputs .seg-radio label.active { background:Highlight !important; color:HighlightText !important; forced-color-adjust:none; }
    #cable-inputs :is(.field,.seg-radio):has(:focus-visible),
    #cable-inputs select.dd:focus-visible { outline-color:Highlight !important; }
  }
}

@media screen {
  /* Group surfaces stay solid to avoid layering translucent cards. */
  #cable-analysis :is(.vd-hero,.cable-check,.cable-details > .vd-card),
  #cable-document .vd-card,
  body.page-cable #amp-workspace {
    background:var(--ci-group) !important;
    border:1px solid var(--ci-group-edge) !important;
    border-radius:18px !important;
    box-shadow:none !important;
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
  }
  #cable-analysis .cable-check[data-status="fail"] { border-color:var(--fail) !important; }
  #cable-analysis .vd-tabs { gap:8px; }
  #cable-analysis .vd-tab,
  #cable-document :is(.add-btn,[data-export="pdf"]),
  body.page-cable #amp-workspace button,
  body.page-cable :is(#amp-workspace-dialog,dialog.amp-workspace-dialog) :is(button,input,select,textarea) {
    border-radius:12px !important;
    min-height:44px;
  }
  #cable-analysis .vd-tab,
  #cable-document .add-btn,
  body.page-cable #amp-workspace button {
    background:var(--ci-surface) !important;
    border:1px solid var(--ci-edge) !important;
    box-shadow:var(--ci-shadow) !important;
  }
  @supports ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))) {
    #cable-analysis .vd-tab,
    #cable-document .add-btn,
    body.page-cable #amp-workspace button {
      background:linear-gradient(160deg,var(--ci-highlight),var(--ci-tint)) !important;
      backdrop-filter:blur(8px) saturate(110%);
      -webkit-backdrop-filter:blur(8px) saturate(110%);
    }
  }
  #cable-analysis .vd-tab.active {
    background:var(--ci-selected) !important;
    color:var(--ci-selected-ink) !important;
    border-color:var(--ci-edge) !important;
  }
  #cable-document #notes-list li[contenteditable] {
    border-radius:8px;
    padding:6px 8px;
    overflow-wrap:anywhere;
  }
  #cable-document #notes-list li[contenteditable]:focus {
    background:var(--ci-surface);
  }
  #cable-analysis :is(button,summary):focus-visible,
  #cable-document :is(button,a,[contenteditable]):focus-visible,
  body.page-cable #amp-workspace button:focus-visible,
  body.page-cable :is(#amp-workspace-dialog,dialog.amp-workspace-dialog) :focus-visible {
    outline:2px solid var(--ui-accent) !important;
    outline-offset:3px;
  }
  body.page-cable :is(#amp-workspace-dialog,dialog.amp-workspace-dialog) {
    --aw-bg:var(--ci-surface);
    --aw-soft:var(--ci-group);
    --aw-line:var(--ci-edge);
  }
  @media (prefers-reduced-transparency:reduce), (prefers-contrast:more) {
    #cable-analysis .vd-tab,
    #cable-document .add-btn,
    body.page-cable #amp-workspace button {
      background:var(--ci-surface) !important;
      backdrop-filter:none; -webkit-backdrop-filter:none; box-shadow:none !important;
    }
    #cable-analysis .vd-tab.active { background:var(--ci-selected) !important; }
  }
  @media (forced-colors:active) {
    #cable-analysis :is(.vd-hero,.cable-check,.cable-details > .vd-card,.vd-tab),
    #cable-document :is(.vd-card,.add-btn),
    body.page-cable #amp-workspace,
    body.page-cable #amp-workspace button {
      background:Canvas !important; border-color:CanvasText !important;
      box-shadow:none !important; backdrop-filter:none; -webkit-backdrop-filter:none;
    }
    #cable-analysis .vd-tab.active {
      background:Highlight !important; color:HighlightText !important; forced-color-adjust:none;
    }
  }
}

@media screen {
  /* S6 (review fixes 31 Oct 2026): one Save/Print pair in the header and the
     Document section. Save is the blue primary, Print the secondary; both are
     12 px glass controls. Overrides calc-save's 4 px white default from here. */
  body.page-cable :is(#vd-save-btn,#vd-pdf-btn,#cable-document-save,#cable-document-print) {
    /* Sizes stay as before (header 38 px, Document 40 px, 44 px touch) so the
       one-screen desktop input view is unchanged. */
    border-radius:12px !important;
    box-shadow:var(--ci-shadow) !important;
  }
  body.page-cable :is(#vd-pdf-btn,#cable-document-print) {
    background:var(--ci-surface) !important;
    border:1px solid var(--ci-edge) !important;
    color:var(--ui-ink) !important;
  }
  @supports ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))) {
    body.page-cable :is(#vd-pdf-btn,#cable-document-print) {
      background:linear-gradient(160deg,var(--ci-highlight),var(--ci-tint)) !important;
      backdrop-filter:blur(8px) saturate(110%);
      -webkit-backdrop-filter:blur(8px) saturate(110%);
    }
  }
  body.page-cable :is(#vd-pdf-btn,#cable-document-print):hover:not(:disabled) { background:var(--ci-group) !important; }
  body.page-cable :is(#vd-save-btn,#cable-document-save) {
    background:var(--ui-accent) !important;
    border:1px solid var(--ui-accent) !important;
    color:var(--ui-on-accent) !important;
  }
  body.page-cable :is(#vd-save-btn,#cable-document-save):hover:not(:disabled) {
    background:var(--ui-accent-hover) !important;
    border-color:var(--ui-accent-hover) !important;
  }
  body.page-cable :is(#vd-save-btn,#vd-pdf-btn,#cable-document-save,#cable-document-print):focus-visible {
    outline:2px solid var(--ui-accent) !important;
    outline-offset:3px;
  }
  @media (prefers-reduced-transparency:reduce), (prefers-contrast:more) {
    body.page-cable :is(#vd-pdf-btn,#cable-document-print) {
      background:var(--ci-surface) !important;
      backdrop-filter:none; -webkit-backdrop-filter:none;
    }
    body.page-cable :is(#vd-save-btn,#vd-pdf-btn,#cable-document-save,#cable-document-print) { box-shadow:none !important; }
  }
  @media (forced-colors:active) {
    body.page-cable :is(#vd-save-btn,#vd-pdf-btn,#cable-document-save,#cable-document-print) {
      background:ButtonFace !important; color:ButtonText !important; border-color:ButtonText !important;
      box-shadow:none !important; backdrop-filter:none; -webkit-backdrop-filter:none;
    }
  }
}