/* Hub v214: brighter, high-contrast work cards and stronger LS Command Center focus. */

/* Keep AdPilot on its own v213 visual treatment. */
html[data-hub-theme] .page-hub .primary-card:not(.primary-adpilot) {
  --bright-card-accent: #1557b0;
  --bright-card-surface: #eef5ff;
  border-color: color-mix(in srgb, var(--bright-card-accent) 28%, var(--hub-theme-line, #cbd9e7));
  border-top: 5px solid var(--bright-card-accent);
  background: linear-gradient(145deg, var(--hub-theme-surface, #fff) 34%, var(--bright-card-surface));
  box-shadow:
    0 12px 28px color-mix(in srgb, var(--bright-card-accent) 14%, transparent),
    inset 0 1px 0 rgba(255, 255, 255, .84);
}

html[data-hub-theme] .page-hub .primary-card:not(.primary-adpilot):hover {
  border-color: color-mix(in srgb, var(--bright-card-accent) 64%, var(--hub-theme-line, #cbd9e7));
  box-shadow:
    0 17px 34px color-mix(in srgb, var(--bright-card-accent) 22%, transparent),
    inset 0 1px 0 rgba(255, 255, 255, .92);
}

.page-hub .primary-graphic {
  --bright-card-accent: #1557b0;
  --bright-card-surface: #eaf3ff;
}

.page-hub .primary-production {
  --bright-card-accent: #9a5708;
  --bright-card-surface: #fff2dc;
}

.page-hub .primary-shipping {
  --bright-card-accent: #086983;
  --bright-card-surface: #e6f8fd;
}

.page-hub .primary-revenue-partner {
  --bright-card-accent: #14715f;
  --bright-card-surface: #e8f8f1;
}

.page-hub .primary-claim {
  --bright-card-accent: #aa3249;
  --bright-card-surface: #fff0f3;
}

html[data-hub-theme] .page-hub .primary-card:not(.primary-adpilot) .primary-icon {
  border: 1px solid color-mix(in srgb, var(--bright-card-accent) 28%, #fff);
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, .7),
    0 9px 20px color-mix(in srgb, var(--bright-card-accent) 20%, transparent);
}

html[data-hub-theme] .page-hub .primary-card:not(.primary-adpilot) small,
html[data-hub-theme] .page-hub .primary-card:not(.primary-adpilot) > b {
  color: var(--bright-card-accent);
}

.page-hub .secondary-grid > a[data-tool="supplies"] { --tool-color: #a94705; }
.page-hub .secondary-grid > a[data-tool="leave"] { --tool-color: #b52653; }
.page-hub .secondary-grid > a[data-tool="overtime"] { --tool-color: #6341c5; }
.page-hub .secondary-grid > a[data-tool="calculator"] { --tool-color: #006f69; }
.page-hub .secondary-grid > a[data-tool="expenses"] { --tool-color: #9b4a00; }
.page-hub .secondary-grid > a[data-tool="website"] { --tool-color: #176c4b; }
.page-hub .secondary-grid > a[data-tool="employees"] { --tool-color: #086b92; }

html[data-hub-theme] .page-hub .secondary-grid > a {
  border-color: color-mix(in srgb, var(--tool-color) 25%, var(--hub-theme-line, #cbd9e7));
  border-left: 4px solid var(--tool-color);
  background: linear-gradient(135deg, var(--hub-theme-surface, #fff) 42%, var(--tool-soft));
  box-shadow: 0 8px 18px color-mix(in srgb, var(--tool-color) 11%, transparent);
}

html[data-hub-theme] .page-hub .secondary-grid > a:hover {
  border-color: color-mix(in srgb, var(--tool-color) 62%, var(--hub-theme-line, #cbd9e7));
  background: linear-gradient(135deg, var(--hub-theme-surface, #fff) 20%, var(--tool-soft));
  box-shadow: 0 12px 24px color-mix(in srgb, var(--tool-color) 18%, transparent);
}

html[data-hub-theme] .page-hub .secondary-grid > a > span {
  border: 1px solid color-mix(in srgb, var(--tool-color) 22%, transparent);
  box-shadow: 0 5px 12px color-mix(in srgb, var(--tool-color) 15%, transparent);
}

/* Saturated dark surfaces preserve AA contrast for every semantic status color. */
#hub-status-assistant[data-command-color="midnight"] {
  --command-bg-start: #061a3a;
  --command-bg-middle: #08264f;
  --command-bg-end: #092e5d;
  --command-grid: rgba(92, 181, 255, .34);
  --command-action: #08264f;
  --command-action-hover: #092e5d;
}

#hub-status-assistant[data-command-color="ocean"] {
  --command-bg-start: #03242e;
  --command-bg-middle: #043640;
  --command-bg-end: #043744;
  --command-grid: rgba(61, 225, 236, .32);
  --command-action: #043640;
  --command-action-hover: #043744;
}

#hub-status-assistant[data-command-color="forest"] {
  --command-bg-start: #062419;
  --command-bg-middle: #0a3423;
  --command-bg-end: #0b3826;
  --command-grid: rgba(79, 231, 142, .30);
  --command-action: #0a3423;
  --command-action-hover: #0b3826;
}

#hub-status-assistant[data-command-color="violet"] {
  --command-bg-start: #20103d;
  --command-bg-middle: #321752;
  --command-bg-end: #401d67;
  --command-grid: rgba(210, 150, 255, .31);
  --command-action: #321752;
  --command-action-hover: #401d67;
}

#hub-status-assistant[data-command-color="graphite"] {
  --command-bg-start: #111b29;
  --command-bg-middle: #1b2b3b;
  --command-bg-end: #203246;
  --command-grid: rgba(146, 202, 255, .27);
  --command-action: #1b2b3b;
  --command-action-hover: #203246;
}

#hub-status-assistant[data-command-color] {
  border-width: 2px;
  border-color: color-mix(in srgb, var(--assistant-accent) 72%, #fff);
  box-shadow:
    0 22px 54px color-mix(in srgb, var(--assistant-accent) 25%, rgba(4, 18, 40, .28)),
    0 0 0 4px color-mix(in srgb, var(--assistant-accent) 14%, transparent);
}

#hub-status-assistant[data-command-color] .assistant-copy .eyebrow {
  display: inline-flex;
  width: fit-content;
  margin-bottom: 10px;
  padding: 5px 9px;
  border-radius: 999px;
  background: var(--assistant-accent);
  color: #07162d;
  box-shadow: 0 0 20px var(--assistant-soft);
  letter-spacing: .16em;
}

#hub-status-assistant[data-command-color] .assistant-copy h2 {
  text-shadow: 0 3px 18px rgba(0, 0, 0, .28);
}

#hub-status-assistant[data-command-color] .assistant-action {
  border-color: color-mix(in srgb, var(--assistant-accent) 34%, rgba(255, 255, 255, .3));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
}

#hub-status-assistant[data-command-color] .assistant-status-symbol {
  border-width: 2px;
  box-shadow: 0 0 28px var(--assistant-soft), inset 0 0 0 2px rgba(255, 255, 255, .06);
}

.hub-command-color-swatch {
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, .18),
    0 5px 14px rgba(4, 13, 29, .28);
}

.hub-command-color-swatch[data-preview="midnight"] { background: linear-gradient(135deg, #061a3a, #092e5d); }
.hub-command-color-swatch[data-preview="ocean"] { background: linear-gradient(135deg, #03242e, #043744); }
.hub-command-color-swatch[data-preview="forest"] { background: linear-gradient(135deg, #062419, #0b3826); }
.hub-command-color-swatch[data-preview="violet"] { background: linear-gradient(135deg, #20103d, #401d67); }
.hub-command-color-swatch[data-preview="graphite"] { background: linear-gradient(135deg, #111b29, #203246); }

html[data-dark="true"] .page-hub .primary-card:not(.primary-adpilot) {
  --bright-card-surface: color-mix(in srgb, var(--bright-card-accent) 18%, var(--hub-theme-surface, #101d38));
  box-shadow:
    0 12px 28px color-mix(in srgb, var(--bright-card-accent) 18%, transparent),
    inset 0 1px 0 rgba(255, 255, 255, .08);
}

html[data-dark="true"] .page-hub .secondary-grid > a {
  background: linear-gradient(
    135deg,
    var(--hub-theme-surface, #101d38) 38%,
    color-mix(in srgb, var(--tool-color) 18%, var(--hub-theme-surface, #101d38))
  );
}

@media (max-width: 700px) {
  .page-hub .primary-card:not(.primary-revenue-partner):not(.primary-adpilot) {
    border-top-width: 1px;
    border-left: 5px solid var(--bright-card-accent);
  }

  #hub-status-assistant[data-command-color] {
    box-shadow:
      0 16px 36px color-mix(in srgb, var(--assistant-accent) 22%, rgba(4, 18, 40, .26)),
      0 0 0 3px color-mix(in srgb, var(--assistant-accent) 13%, transparent);
  }
}

@media (prefers-reduced-motion: reduce) {
  .page-hub .primary-card:not(.primary-adpilot),
  .page-hub .secondary-grid > a {
    transition: none;
  }
}