/*
 * STRUCTURAL-COLOR-CONTRACT-V1
 * Final cascade layer for all PC and Mobile shells.
 * Navigation, headers, primary actions and future shared components use the
 * approved blue-to-cyan structure. Green is reserved for success semantics.
 */

:root,
html body.layout-skin-only,
html body.layout-skin-only [data-shared-shell],
html body.layout-skin-only .mobile-c-premium,
html body.layout-skin-only .mobile-c-native-workbench,
html body.layout-skin-only .mobile-layout-v2 {
  --structural-blue: #2563eb;
  --structural-blue-deep: #1d4ed8;
  --structural-cyan: #06b6d4;
  --structural-cyan-deep: #0891b2;
  --structural-navy: #153653;
  --structural-soft: #edf6ff;
  --structural-gradient: linear-gradient(135deg, #2563eb 0%, #168eea 52%, #06b6d4 100%);
  --brand-primary: var(--structural-blue);
  --brand-primary-hover: var(--structural-blue-deep);
  --brand-secondary: var(--structural-cyan);
  --brand-teal: #167fae;
  --brand-green: var(--status-success, #0f8f6f);
  --brand-gradient-primary: var(--structural-gradient);
  --button-primary: var(--structural-blue);
  --button-primary-bg: var(--structural-gradient);
  --button-primary-hover: var(--structural-blue-deep);
  --sidebar-bg-start: var(--structural-blue);
  --sidebar-bg-mid: #168eea;
  --sidebar-bg-end: #06a9d4;
  --sidebar-active-bg: linear-gradient(135deg, #eef6ff 0%, #e8f9ff 100%);
  --sidebar-active-text: #0b5f87;
  --cp-green: #167fae;
  --cp-green-deep: #075985;
  --cp-green-bright: var(--structural-cyan);
  --cp-system: var(--structural-navy);
  --v2-teal: var(--structural-cyan-deep);
  --status-success: #0f8f6f;
}

html body.layout-skin-only .sidebar,
html body.layout-skin-only .app-shell[data-shared-shell="pc"] > aside.sidebar.sidebar {
  background-color: #168eea !important;
  background-image: linear-gradient(168deg, #2563eb 0%, #168eea 52%, #06a9d4 100%) !important;
  box-shadow: 10px 0 34px rgba(31, 91, 151, 0.18) !important;
}

html body.layout-skin-only[data-visual-theme="product"] #product-center-app .pc-command {
  border-color: transparent !important;
  background-color: #ef6b35 !important;
  background-image: linear-gradient(118deg, #f47a2c 0%, #ec5f43 43%, #d94680 76%, #8757d9 100%) !important;
  box-shadow: 0 16px 36px rgba(199, 76, 55, 0.22) !important;
}

html body.layout-skin-only .sidebar .side-nav a.primary-link,
html body.layout-skin-only .sidebar .side-subnav a.primary-link,
html body.layout-skin-only .sidebar a.active,
html body.layout-skin-only .sidebar a[aria-current="page"],
html body.layout-skin-only .app-shell aside.sidebar .side-nav a.primary-link,
html body.layout-skin-only .app-shell aside.sidebar .side-nav a.active {
  color: #075985 !important;
  background-color: #f3f9ff !important;
  background-image: linear-gradient(135deg, #f5faff 0%, #e8f8ff 100%) !important;
  box-shadow: inset 3px 0 #38bdf8, 0 8px 20px rgba(31, 91, 151, 0.18) !important;
}

html body.layout-skin-only :where(
  button,
  .button,
  a.button,
  button[type="submit"],
  input[type="submit"],
  .pc-button-solid,
  .mobile-action-button:not(.secondary),
  .native-primary-action,
  .review-primary-button,
  .permission-approval-entry
):not(.sop-brand-button):not(.ghost):not(.secondary):not(.warn):not(.danger):not(.good):not(.status-success):not([disabled]) {
  color: #ffffff !important;
  border-color: var(--structural-blue) !important;
  background-color: var(--structural-blue) !important;
  background-image: var(--structural-gradient) !important;
  box-shadow: 0 8px 18px rgba(37, 99, 235, 0.2) !important;
}

html body.layout-skin-only .main-shell .top-actions .permission-approval-entry,
html body.layout-skin-only .main-shell .content .review-primary-button,
html body.layout-skin-only .main-shell .content .operations-subnav a.active {
  color: #ffffff !important;
  border-color: var(--structural-blue) !important;
  background-color: var(--structural-blue) !important;
  background-image: var(--structural-gradient) !important;
  box-shadow: 0 8px 18px rgba(37, 99, 235, 0.2) !important;
}

html body.layout-skin-only :where(
  button,
  .button,
  a.button,
  button[type="submit"],
  input[type="submit"],
  .pc-button-solid,
  .mobile-action-button:not(.secondary),
  .native-primary-action,
  .review-primary-button,
  .permission-approval-entry
):not(.sop-brand-button):not(.ghost):not(.secondary):not(.warn):not(.danger):not(.good):not(.status-success):not([disabled]):hover {
  border-color: var(--structural-blue-deep) !important;
  background-color: var(--structural-blue-deep) !important;
  background-image: linear-gradient(135deg, #1d4ed8 0%, #0284c7 52%, #0891b2 100%) !important;
}

html body.layout-skin-only .mobile-bottom-nav a.active,
html body.layout-skin-only .mobile-c-bottom-nav a.active,
html body.layout-skin-only .mobile-v3-bottom-nav a.active,
html body.layout-skin-only .mobile-v3-office-tabs a.active,
html body.layout-skin-only .premium-segment-tabs a.active {
  color: #075985 !important;
  border-color: rgba(37, 99, 235, 0.2) !important;
  background-color: #edf7ff !important;
  background-image: linear-gradient(180deg, #edf7ff 0%, #e8f8ff 100%) !important;
}

html body.layout-skin-only .top-actions .badge.good,
html body.layout-skin-only .identity-badge.good {
  color: #244b74 !important;
  border-color: #bfdbfe !important;
  background-color: #eff6ff !important;
  background-image: none !important;
}

html body.layout-skin-only :where(.status-success, .badge.good, .semantic-success) {
  color: var(--status-success) !important;
}

/*
 * Management daily control closure.
 * These controls are structural navigation, not business-status indicators.
 * Keep them on the office blue/cyan axis even when an older cached department
 * palette is still present earlier in the cascade.
 */
html body.layout-skin-only .executive-data-tabs a.active,
html body.layout-skin-only .main-shell .top-actions .permission-approval-entry,
html body.layout-skin-only .executive-filter button[type="submit"] {
  color: #ffffff !important;
  border-color: #2563eb !important;
  background-color: #2563eb !important;
  background-image: linear-gradient(135deg, #2563eb 0%, #168eea 52%, #06b6d4 100%) !important;
  box-shadow: 0 8px 18px rgba(37, 99, 235, 0.2) !important;
  text-shadow: 0 1px 1px rgba(8, 47, 107, 0.18) !important;
}

html body.layout-skin-only .executive-filter .button.ghost,
html body.layout-skin-only .pagination .button.secondary:not(.disabled) {
  color: #1d4ed8 !important;
  border-color: #bfd1e5 !important;
  background-color: #f7faff !important;
  background-image: none !important;
  box-shadow: 0 4px 12px rgba(37, 110, 232, 0.08) !important;
  text-shadow: none !important;
}

html body.layout-skin-only .executive-filter .button.ghost:hover,
html body.layout-skin-only .pagination .button.secondary:not(.disabled):hover {
  color: #ffffff !important;
  border-color: var(--structural-blue-deep) !important;
  background-color: var(--structural-blue-deep) !important;
  background-image: linear-gradient(135deg, #1d4ed8 0%, #0284c7 52%, #0891b2 100%) !important;
}

html body.layout-skin-only .pagination .button.secondary.disabled {
  color: #718096 !important;
  border-color: #d7e1ea !important;
  background-color: #eef3f7 !important;
  background-image: none !important;
  box-shadow: none !important;
  text-shadow: none !important;
}

html body.layout-skin-only .executive-data-tabs a:focus-visible,
html body.layout-skin-only .main-shell .top-actions .permission-approval-entry:focus-visible,
html body.layout-skin-only .executive-filter button:focus-visible,
html body.layout-skin-only .pagination .button:focus-visible {
  border-color: #1d4ed8 !important;
  outline: 0 !important;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.24), 0 8px 18px rgba(37, 99, 235, 0.16) !important;
}

/* Product SOP stays warm even though this final structural layer owns controls. */
html body.layout-skin-only[data-visual-theme="product"]
  .mobile-c-native-workbench.mobile-native-product-sop
  .mobile-product-sop-brand-tabs
  button:not([aria-selected="true"]) {
  border-color: #eadfd8 !important;
  background: #ffffff !important;
  background-image: none !important;
  color: #4f5967 !important;
  box-shadow: 0 4px 12px rgba(174, 74, 27, 0.06) !important;
}

html body.layout-skin-only[data-visual-theme="product"]
  .mobile-c-native-workbench.mobile-native-product-sop
  .mobile-product-sop-brand-tabs
  button[aria-selected="true"] {
  border-color: #f07a2f !important;
  background: linear-gradient(135deg, #f07a2f, #e95747) !important;
  color: #ffffff !important;
  box-shadow: 0 8px 18px rgba(174, 74, 27, 0.18) !important;
}

html body.layout-skin-only[data-visual-theme="product"]
  .mobile-c-native-workbench.mobile-native-product-sop
  .mobile-product-sop-brand-tabs
  button[aria-selected="true"] :is(span, em, small) {
  color: #ffffff !important;
}

html body.layout-skin-only[data-visual-theme="product"]
  .mobile-c-native-workbench.mobile-native-product-sop
  .mobile-product-sop-source-download {
  border-color: rgba(240, 122, 47, 0.2) !important;
  background: linear-gradient(110deg, #f07a2f, #e95747) !important;
}
