/* Shared spreadsheet component. Loaded after the graphite shell stylesheet.
   The #ff28Comms alternative gives every rule enough specificity to own the
   sheet even inside the older Communications styles. Keep shell styles outside
   this component. Foreground and background colors belong together. */
:root {
  --ff-sheet-header: #87aeb6;
  --ff-sheet-header-text: #06141a;
  --ff-sheet-grid: #dadce0;
  --ff-sheet-cell: #fff;
  --ff-sheet-text: #202124;
  --ff-sheet-muted: #50545a;
  --ff-sheet-link: #174ea6;
}
body.dark :is(table.ff-sheet-table, #ff28Comms table.ff-sheet-table) {
  width: 100% !important; max-width: none !important; min-width: max-content !important;
  margin: 0 !important; border-collapse: collapse !important; border-spacing: 0 !important;
  table-layout: auto !important; border: 1px solid var(--ff-sheet-grid) !important;
  border-radius: 0 !important; background: var(--ff-sheet-cell) !important;
  color: var(--ff-sheet-text) !important; box-shadow: none !important;
  font: 13px/1.35 Arial, sans-serif !important;
}
body.dark :is(table.ff-sheet-table, #ff28Comms table.ff-sheet-table) :is(th, td) {
  height: 28px !important; padding: 4px 8px !important;
  border: 1px solid var(--ff-sheet-grid) !important; border-radius: 0 !important;
  background: var(--ff-sheet-cell) !important; color: var(--ff-sheet-text) !important;
  box-shadow: none !important; text-shadow: none !important;
  font-size: 13px !important; font-weight: 400 !important; line-height: 1.35 !important;
  vertical-align: middle !important; text-align: left !important;
  white-space: nowrap !important; text-transform: none !important;
}
body.dark :is(table.ff-sheet-table, #ff28Comms table.ff-sheet-table) :is(thead th, .header-cell, .row-num) {
  background: var(--ff-sheet-header) !important; color: var(--ff-sheet-header-text) !important;
  font-weight: 600 !important;
}
body.dark :is(table.ff-sheet-table, #ff28Comms table.ff-sheet-table) thead th {
  position: sticky !important; top: 0 !important; z-index: 4 !important;
  cursor: grab !important; user-select: none !important; text-align: center !important;
}
body.dark :is(table.ff-sheet-table, #ff28Comms table.ff-sheet-table) a {
  color: var(--ff-sheet-link) !important; text-decoration: underline !important;
  font-weight: inherit !important;
}
body.dark :is(table.ff-sheet-table, #ff28Comms table.ff-sheet-table) :is(.muted, .small, small, .reason, .age-part-sub, .age-serial-history-meta, .sheet-header-label) {
  color: var(--ff-sheet-muted) !important; background: transparent !important;
}
body.dark :is(table.ff-sheet-table, #ff28Comms table.ff-sheet-table) :is(button, .btn, input, textarea, select) {
  background: #fff !important; color: #202124 !important; border: 1px solid #80868b !important;
  border-radius: 3px !important; box-shadow: none !important; text-shadow: none !important;
  font: inherit !important; transform: none !important;
}
body.dark :is(table.ff-sheet-table, #ff28Comms table.ff-sheet-table) :is(button, .btn):hover {
  background: #e8f0fe !important; border-color: #185abc !important; color: #174ea6 !important;
}
body.dark :is(table.ff-sheet-table, #ff28Comms table.ff-sheet-table) :is(button, input, textarea, select, a):focus-visible {
  outline: 2px solid #1a73e8 !important; outline-offset: -2px !important;
}
body.dark :is(table.ff-sheet-table, #ff28Comms table.ff-sheet-table) :is(button, input, textarea, select):disabled {
  background: #f1f3f4 !important; color: #5f6368 !important; cursor: not-allowed !important; opacity: 1 !important;
}
body.dark :is(.claims-section-body, .claims-new-table-wrap, .age-table-wrap, .rma-table-wrap, .zagg-audit-wrap, .zagg-rma-review, .zagg-bundle-list, .sheet-wrap, #ff28Comms .comm-table-wrap) {
  overflow: auto !important; max-width: 100% !important; padding: 0 !important;
  background: #fff !important; color: #202124 !important;
  border: 1px solid var(--ff-sheet-grid) !important; border-radius: 0 !important; box-shadow: none !important;
}
body.dark :is(table.ff-sheet-table, #ff28Comms table.ff-sheet-table) :is(.claim-col-name, .claim-col-device, .rma-item-name, .age-part-name, .age-serial-history-unit) {
  white-space: normal !important; overflow-wrap: anywhere !important;
  overflow: visible !important; text-overflow: clip !important;
}
body.dark :is(table.ff-sheet-table, #ff28Comms table.ff-sheet-table) :is(.claim-col-name, .claim-col-device) {
  min-width: 160px !important; max-width: 360px !important;
}
body.dark :is(table.ff-sheet-table, #ff28Comms table.ff-sheet-table) :is(.claim-col-total, .claim-col-cost, .ff-sheet-number) {
  text-align: right !important; font-variant-numeric: tabular-nums !important;
}
body.dark :is(table.ff-sheet-table, #ff28Comms table.ff-sheet-table) .claim-ticket-cell {
  background: #fff !important; color: #202124 !important;
}
body.dark :is(table.ff-sheet-table, #ff28Comms table.ff-sheet-table) [data-supplier="jit"] .claim-ticket-cell {
  background: var(--ff-claim-jit) !important; color: #000 !important;
}
body.dark :is(table.ff-sheet-table, #ff28Comms table.ff-sheet-table) [data-supplier="used_jit_part"] .claim-ticket-cell {
  background: var(--ff-claim-used-jit) !important; color: #000 !important;
}
body.dark :is(table.ff-sheet-table, #ff28Comms table.ff-sheet-table) .claim-row-missed-payment .claim-ticket-cell {
  background: var(--ff-claim-missed) !important; color: #000 !important;
}
body.dark :is(table.ff-sheet-table, #ff28Comms table.ff-sheet-table) [data-insurance="other_st_bolt_likewize"] .claim-ticket-cell a {
  color: var(--ff-claim-other) !important;
}
body.dark :is(table.ff-sheet-table, #ff28Comms table.ff-sheet-table) .claim-details td {
  padding: 0 !important; background: #fff !important; color: #202124 !important;
}
body.dark :is(table.ff-sheet-table, #ff28Comms table.ff-sheet-table) .claim-details-grid {
  margin: 0 !important; padding: 12px !important; background: #f8f9fa !important;
  color: #202124 !important; border: 0 !important; border-radius: 0 !important;
  box-shadow: none !important; white-space: normal !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
body.dark :is(table.ff-sheet-table, #ff28Comms table.ff-sheet-table) .claim-details-grid :is(div, span, strong, b) {
  color: #202124 !important; white-space: normal !important; overflow-wrap: anywhere !important;
}
/* The user's compact Claims layout keeps seven data columns plus View. */
body.dark :is(table.ff-sheet-table, #ff28Comms table.ff-sheet-table).claims-sheet-table {
  min-width: 1040px !important; table-layout: fixed !important;
}
body.dark :is(table.ff-sheet-table, #ff28Comms table.ff-sheet-table).claims-sheet-table :is(.claim-col-name, .claim-col-device) {
  min-width: 0 !important; max-width: none !important;
}
body.dark :is(table.ff-sheet-table, #ff28Comms table.ff-sheet-table).claims-sheet-table .claim-col-ticket { width: 9% !important; }
body.dark :is(table.ff-sheet-table, #ff28Comms table.ff-sheet-table).claims-sheet-table .claim-col-claim { width: 12% !important; }
body.dark :is(table.ff-sheet-table, #ff28Comms table.ff-sheet-table).claims-sheet-table .claim-col-status { width: 12% !important; }
body.dark :is(table.ff-sheet-table, #ff28Comms table.ff-sheet-table).claims-sheet-table .claim-col-total { width: 7% !important; }
body.dark :is(table.ff-sheet-table, #ff28Comms table.ff-sheet-table).claims-sheet-table .claim-col-date:not(.claim-col-appointment) { width: 11% !important; }
body.dark :is(table.ff-sheet-table, #ff28Comms table.ff-sheet-table).claims-sheet-table .claim-col-name { width: 17% !important; }
body.dark :is(table.ff-sheet-table, #ff28Comms table.ff-sheet-table).claims-sheet-table .claim-col-device { width: 25% !important; }
body.dark :is(table.ff-sheet-table, #ff28Comms table.ff-sheet-table).claims-sheet-table .claim-col-more { width: 7% !important; min-width: 64px !important; max-width: none !important; }
body.dark :is(table.ff-sheet-table, #ff28Comms table.ff-sheet-table) .claim-more-btn { padding: 2px 6px !important; min-height: 24px !important; }
body.dark :is(table.ff-sheet-table, #ff28Comms table.ff-sheet-table) :is(.claim-details-grid strong, .claim-details-grid b) {
  font-weight: 600 !important;
}
body.dark :is(table.ff-sheet-table, #ff28Comms table.ff-sheet-table) :is(.age-status, .rma-status-pill, .rma-problem-pill, .claims-ticket-status, .comm-template-tag, .comm-review-tag, .comm-count) {
  background: #f1f3f4 !important; color: #30343b !important;
  border: 1px solid #dadce0 !important; border-radius: 3px !important;
  box-shadow: none !important; text-shadow: none !important;
}
body.dark :is(table.ff-sheet-table, #ff28Comms table.ff-sheet-table) :is(.healthy, .found, .success, .ok, .running, .zagg-audit-bundle-found, .zagg-audit-status-found, .repair) {
  background: #e6f4ea !important; color: #175e32 !important; border-color: #b6d7a8 !important;
}
body.dark :is(table.ff-sheet-table, #ff28Comms table.ff-sheet-table) :is(.slow_moving, .pending, .warning, .duplicate, .zagg-audit-bundle-error, .waiting) {
  background: #fff2cc !important; color: #684c00 !important; border-color: #e0c678 !important;
}
body.dark :is(table.ff-sheet-table, #ff28Comms table.ff-sheet-table) .aging {
  background: #fce8d5 !important; color: #853b00 !important; border-color: #e6bc95 !important;
}
body.dark :is(table.ff-sheet-table, #ff28Comms table.ff-sheet-table) :is(.dead_stock, .error, .failed, .danger, .missing, .wrong_status, .unexpected, .zagg-audit-bundle-missing, .zagg-audit-status-missing) {
  background: #fce8e6 !important; color: #a32018 !important; border-color: #e5b2ad !important;
}
body.dark :is(table.ff-sheet-table, #ff28Comms table.ff-sheet-table) .overstock {
  background: #d9f2ef !important; color: #075e58 !important; border-color: #8ccac4 !important;
}
body.dark :is(table.ff-sheet-table, #ff28Comms table.ff-sheet-table) input:not([type="checkbox"]) {
  width: 100% !important; min-width: 130px !important; box-sizing: border-box !important;
  padding: 3px 4px !important;
}
body.dark :is(table.ff-sheet-table, #ff28Comms table.ff-sheet-table).ff-sheet-editable :is(td, td input) { border-radius: 0 !important; }
body.dark :is(table.ff-sheet-table, #ff28Comms table.ff-sheet-table).ff-sheet-editable td input:not([type="checkbox"]) { border-color: transparent !important; }
body.dark :is(table.ff-sheet-table, #ff28Comms table.ff-sheet-table).ff-sheet-editable .header-cell input { background: var(--ff-sheet-header) !important; font-weight: 600 !important; }
body.dark :is(table.ff-sheet-table, #ff28Comms table.ff-sheet-table).ff-sheet-editable .row-num { text-align: center !important; width: 36px !important; }
body.dark .claims-board .claims-section .claims-section-bar {
  background: #e8eaed !important; color: #202124 !important;
  border: 1px solid var(--ff-sheet-grid) !important; border-radius: 0 !important;
  box-shadow: none !important; padding: 6px 10px !important;
}
body.dark .claims-board .claims-section .claims-section-bar :is(strong, span) { color: inherit !important; }
body.dark .claims-board .claims-section[data-section-key="Waiting for Payment"] .claims-section-bar {
  background: #e8eaed !important; color: #202124 !important;
}
@media (max-width: 700px) {
  body.dark :is(table.ff-sheet-table, #ff28Comms table.ff-sheet-table) .claim-details-grid { grid-template-columns: 1fr !important; }
}

body.dark :is(table.ff-sheet-table, #ff28Comms table.ff-sheet-table) .claims-ticket-status.diagnosis { background:#eee7f7!important;color:#593584!important;border-color:#cabbdb!important; }
body.dark :is(table.ff-sheet-table, #ff28Comms table.ff-sheet-table) .claims-ticket-status.ready { background:#e1f2f8!important;color:#13596d!important;border-color:#afd1dc!important; }
body.dark :is(table.ff-sheet-table, #ff28Comms table.ff-sheet-table) .claims-ticket-status.payment { background:#fce8d5!important;color:#853b00!important;border-color:#e6bc95!important; }
body.dark :is(table.ff-sheet-table, #ff28Comms table.ff-sheet-table) .claim-row-current-week .claim-status-cell { background:var(--ff-claim-current)!important;color:#000!important; }
body.dark :is(table.ff-sheet-table, #ff28Comms table.ff-sheet-table) .claim-row-previous-week .claim-status-cell { background:var(--ff-claim-previous)!important;color:#000!important; }
body.dark :is(table.ff-sheet-table, #ff28Comms table.ff-sheet-table) .claim-row-payment-due-week .claim-status-cell { background:#fff!important;color:#000!important; }
body.dark :is(table.ff-sheet-table, #ff28Comms table.ff-sheet-table) :is(.claim-row-missed-payment, .claim-row-unpaid-deferred) .claim-status-cell { background:var(--ff-claim-missed)!important;color:#000!important; }
body.dark .insurance-view-panel.insurance-sheet-static { margin:0!important;padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important; }
body.dark .claims-board { border-radius:0!important; }
body.dark .claims-board .claims-section { border-radius:0!important;box-shadow:none!important; }
body.dark .claims-board .claims-section .claims-section-bar { background-image:none!important; }

body.dark :is(table.ff-sheet-table, #ff28Comms table.ff-sheet-table).ff-sheet-editable label { color:#202124!important; }
body.dark .insurance-legend .legend-other_st_bolt_likewize { color:var(--ff-claim-other)!important;background:#fff!important; }

/* Claims colors express the configured schedule and insurer/supplier identity.
   Ordinary links stay black; insurance identification changes the font only. */
body.dark :is(table.ff-sheet-table, #ff28Comms table.ff-sheet-table):is(.claims-sheet-table, .claims-new-table) a { color:#000!important; }
body.dark :is(table.ff-sheet-table, #ff28Comms table.ff-sheet-table).claims-sheet-table [data-insurance="other_st_bolt_likewize"] .claim-ticket-cell a { color:var(--ff-claim-other)!important; }
body.dark :is(table.ff-sheet-table, #ff28Comms table.ff-sheet-table).claims-new-table .claims-ticket-status { background:#fff!important;color:#000!important;border-color:#dadce0!important; }

body.dark :is(table.ff-sheet-table, #ff28Comms table.ff-sheet-table).claims-sheet-table [data-insurance="other_st_bolt_likewize"] .claim-ticket-cell { color:var(--ff-claim-other)!important; }
body.dark :is(table.ff-sheet-table, #ff28Comms table.ff-sheet-table):is(.claims-sheet-table, .claims-new-table) button:hover { background:#f1f3f4!important;color:#000!important;border-color:#5f6368!important; }

/* Retain the chosen eight columns at narrow widths; scroll instead of hiding data. */
body.dark :is(table.ff-sheet-table, #ff28Comms table.ff-sheet-table).claims-sheet-table :is(.claim-col-ticket, .claim-col-claim, .claim-col-status, .claim-col-total, .claim-col-date:not(.claim-col-appointment), .claim-col-name, .claim-col-device, .claim-col-more) { display:table-cell!important; }


/* Website section navigation. Kept in this shared asset so UI changes
   can load without restarting the Hub or resetting automation state. */
#ff21WebsiteRoot .ff21-nav{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(150px,1fr))!important;
  gap:0!important;
  margin:0 0 14px!important;
  position:relative!important;
  z-index:5!important;
  overflow:hidden!important;
  border:1px solid #474747!important;
  border-radius:12px!important;
  background:#151515!important;
}

#ff21WebsiteRoot button.ff21-nav-card{
  appearance:none!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:48px!important;
  height:auto!important;
  width:100%!important;
  min-width:0!important;
  max-width:none!important;
  padding:10px 14px!important;
  margin:0!important;
  background:#151515!important;
  background-image:none!important;
  border:0!important;
  border-radius:0!important;
  color:#f5f5f5!important;
  font-weight:900!important;
  text-align:center!important;
  white-space:normal!important;
  overflow-wrap:anywhere!important;
  line-height:1.2!important;
  box-shadow:none!important;
  transform:none!important;
  cursor:pointer!important;
  transition:background-color .14s ease,box-shadow .14s ease!important;
}

#ff21WebsiteRoot button.ff21-nav-card + button.ff21-nav-card{border-left:1px solid #474747!important}

#ff21WebsiteRoot button.ff21-nav-card:hover{
  transform:none!important;
  background:#1c2328!important;
  box-shadow:inset 0 0 0 1px rgba(89,216,255,.17)!important;
}

#ff21WebsiteRoot button.ff21-nav-card.active{
  transform:none!important;
  background:#17262c!important;
  box-shadow:inset 0 0 0 1px var(--ff21-ice),inset 0 0 12px rgba(89,216,255,.12)!important;
}

@media(max-width:850px){
  #ff21WebsiteRoot .ff21-nav{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  #ff21WebsiteRoot .ff21-nav button.ff21-nav-card:nth-child(3){border-left:0!important}
  #ff21WebsiteRoot button.ff21-nav-card:nth-child(n+3){border-top:1px solid #474747!important}
}