/* ==========================================================================
   Labor Intelligence Works — brand tokens
   Values are taken from the supplied brand style guide and the vector logo
   suite. Nothing here is invented, and nothing about the brand is defined
   anywhere else in the front end.
   ========================================================================== */
:root {
  --liw-navy:        #0A1E3D;  /* Deep Navy — primary */
  --liw-royal:       #1E4FAE;  /* Royal Blue — primary */
  --liw-light-blue:  #5B8FD6;  /* Light Blue — secondary */
  --liw-sky:         #E6EFFA;  /* Sky Blue — background */
  --liw-charcoal:    #1F2937;  /* Charcoal — text/body */
  --liw-gray:        #F4F6F9;  /* Light Gray — surfaces */
  --liw-muted:       #667085;
  --liw-border:      #D8E1EE;
  --liw-davidos:     #6FA6E6;

  --liw-heading-font: "SF Pro Display", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
  --liw-body-font:    "SF Pro Text", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;

  --liw-space:   4px;
  --liw-radius:  10px;
  --liw-rule:    1px solid var(--liw-border);
}

/* ---- workspace shell --------------------------------------------------- */
.liw-workspace { font-family: var(--liw-body-font); color: var(--liw-charcoal); }
.liw-workspace h2, .liw-workspace h3, .liw-workspace h4 {
  font-family: var(--liw-heading-font); color: var(--liw-navy); margin: 0 0 6px;
}
.liw-section { margin-top: 18px; }
.liw-section > h3 {
  font-size: 1.02em; letter-spacing: .01em;
  padding-bottom: 6px; border-bottom: 2px solid var(--liw-royal);
}

/* One card treatment, used everywhere, so panels stop competing. */
.liw-card {
  background: #fff; border: var(--liw-rule); border-radius: var(--liw-radius);
  padding: 14px 16px;
}
.liw-card + .liw-card { margin-top: 10px; }
.liw-panel { background: var(--liw-gray); border-radius: var(--liw-radius); padding: 14px 16px; }
.liw-accent { background: var(--liw-sky); border-left: 3px solid var(--liw-royal); }

.liw-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 10px 22px; }
.liw-field { font-size: .93em; }
.liw-field b { display: block; font-size: .78em; text-transform: uppercase;
  letter-spacing: .06em; color: var(--liw-muted); font-weight: 600; margin-bottom: 2px; }

.liw-muted { color: var(--liw-muted); font-size: .9em; }
.liw-status {
  display: inline-block; padding: 2px 10px; border-radius: 999px;
  background: var(--liw-sky); color: var(--liw-navy);
  font-size: .8em; font-weight: 600;
}
.liw-status.attention { background: #FFF4E5; color: #8A5A00; }

/* ---- tabs: one row, no competing buttons ------------------------------- */
.liw-tabs { display: flex; flex-wrap: wrap; gap: 4px; border-bottom: var(--liw-rule); margin-bottom: 12px; }
.liw-tab {
  border: 0; background: none; cursor: pointer; font: inherit;
  padding: 8px 12px; color: var(--liw-muted); border-bottom: 2px solid transparent;
}
.liw-tab:hover { color: var(--liw-navy); }
.liw-tab[aria-selected="true"] { color: var(--liw-navy); font-weight: 600; border-bottom-color: var(--liw-royal); }

/* ---- chronology, following the supplied case-timeline template --------- */
.liw-event { display: grid; grid-template-columns: 120px 1fr auto; gap: 12px;
  padding: 10px 12px; border-bottom: var(--liw-rule); align-items: start; }
.liw-event:nth-child(even) { background: var(--liw-sky); }
.liw-event .date { font-weight: 600; color: var(--liw-navy); font-size: .92em; }
.liw-event .title { font-weight: 600; }
.liw-event .meta { color: var(--liw-muted); font-size: .85em; margin-top: 2px; }
.liw-event.hidden-event { opacity: .5; }

/* ---- disclosure -------------------------------------------------------- */
.liw-disclosure { margin-top: 16px; border-top: var(--liw-rule); padding-top: 10px; }
.liw-disclosure > summary { cursor: pointer; font-family: var(--liw-heading-font);
  color: var(--liw-navy); font-weight: 600; }
.liw-disclosure > summary + * { margin-top: 8px; }

/* ---- brand chrome ------------------------------------------------------ */
.liw-brandbar { display: flex; align-items: center; gap: 10px; }
.liw-brandbar img { height: 34px; }
.liw-poweredby { height: 20px; opacity: .85; }
.liw-footnote { color: var(--liw-muted); font-size: .8em; }