/* FabTandem brand kit. Operational state colors retain their meanings. */
@media screen {
  :root {
    --fabtandem-electric: #0054ff;
    --fabtandem-blue: #0878ef;
    --fabtandem-blue-bright: #1689ff;
    --fabtandem-blue-soft: #e7f2ff;
    --fabtandem-night: #07090c;
    --fabtandem-night-raised: #0c1118;
    --fabtandem-ink: #1d252c;
    --fabtandem-background: #f4f2ed;
    --fabtandem-panel: #ffffff;
    --fabtandem-muted: #65717c;
    --fabtandem-steel: #334e5c;
    --fabtandem-font: Arial, Helvetica, sans-serif;
    --fabtandem-outline: #a9bacd;
  }
  body::before { background: var(--fabtandem-electric); }
  .release-key > span { font-weight: 400; }
  .board-header { border: 1px solid #26394f; border-bottom: 3px solid var(--fabtandem-electric); }
  .board-header > div:first-of-type {
    display: grid;
    grid-template-columns: 204px minmax(0, 1fr);
    column-gap: 18px;
    align-items: center;
    min-width: 0;
  }
  .board-header > div:first-of-type::before {
    content: "";
    grid-column: 1;
    grid-row: 1 / 3;
    width: 204px;
    height: 48px;
    background: url("./assets/fabtandem/fabtandem-reversed.svg") center / contain no-repeat;
  }
  .board-header > div:first-of-type > .eyebrow,
  .board-header > div:first-of-type > h1 { grid-column: 2; }
  .production-work-center-lane,
  .production-week-row,
  .production-week-headings,
  .work-center-page-lane { border-color: var(--fabtandem-outline); }
  .production-week-day { border-color: #b6c5d6; }
  .production-week-center { border-right: 1px solid #99aec6; }
  .production-work-center-head,
  .production-work-center-date-head { border-bottom-color: #a9bacd; }
  .pdf-card, .planning-job-card { border-color: #acbdd0; }
  .backlog-table tbody tr > td { border-top-color: #b6c5d6; border-bottom-color: #b6c5d6; }
  .backlog-table tbody tr > td:first-child { border-left-color: #b6c5d6; }
  .backlog-table tbody tr > td:last-child { border-right-color: #b6c5d6; }
  .board-zoom-controls, .production-week-toolbar, .work-center-page-toolbar,
  .backlog-toolbar, .planning-toolbar, .materials-planning-controls,
  .materials-table-wrap, .materials-detail-card,
  .materials-planning-summary article { border-color: #b6c5d6; }
  @media (max-width: 900px) {
    .board-header > div:first-of-type { grid-template-columns: 170px minmax(0, 1fr); column-gap: 12px; }
    .board-header > div:first-of-type::before { width: 170px; height: 40px; }
  }
  @media (max-width: 500px) {
    .board-header > div:first-of-type { display: block; }
    .board-header > div:first-of-type::before { display: block; width: 170px; height: 40px; margin-bottom: 10px; }
  }
}