/* ==========================================================================
   AMIC_COLOR_AND_EXECUTIVE_COMPACT_V1_0_0
   ========================================================================== */

:root{
  --amic-blue:#1d67d9;
  --amic-blue-soft:#edf5ff;

  --amic-cyan:#1098ad;
  --amic-cyan-soft:#ecfbfd;

  --amic-green:#2f9e44;
  --amic-green-soft:#eefbf1;

  --amic-amber:#e59b19;
  --amic-amber-soft:#fff8e8;

  --amic-violet:#7b61d1;
  --amic-violet-soft:#f5f1ff;

  --amic-rose:#cf5f7b;
  --amic-rose-soft:#fff1f5;

  --amic-indigo:#4057c7;
  --amic-indigo-soft:#f0f3ff;

  --amic-teal:#148c78;
  --amic-teal-soft:#eefbf8;

  --amic-slate:#58718e;
  --amic-slate-soft:#f4f7fb;
}

/* --------------------------------------------------------------------------
   GLOBAL CONTENT COLOR DIFFERENTIATION
   -------------------------------------------------------------------------- */

/* Keep structural surfaces light, then differentiate content blocks */
.main,
main{
  background:
    linear-gradient(180deg,rgba(232,242,255,.52),rgba(245,249,255,.24)) !important;
}

/* All primary cards receive a quiet top accent */
.card,
.panel,
.tile,
.content-card,
.metric,
.kpi,
.stat,
.widget,
.surface{
  position:relative;
  overflow:visible;
  transition:box-shadow .16s ease, transform .16s ease, border-color .16s ease;
}

/* Generic alternating accents across card collections */
.metrics > :nth-child(8n+1),
.metric-grid > :nth-child(8n+1),
.cards > :nth-child(8n+1),
.panel-grid > :nth-child(8n+1){
  border-top:3px solid var(--amic-blue) !important;
  background:linear-gradient(180deg,var(--amic-blue-soft),#fff 60%) !important;
}

.metrics > :nth-child(8n+2),
.metric-grid > :nth-child(8n+2),
.cards > :nth-child(8n+2),
.panel-grid > :nth-child(8n+2){
  border-top:3px solid var(--amic-green) !important;
  background:linear-gradient(180deg,var(--amic-green-soft),#fff 60%) !important;
}

.metrics > :nth-child(8n+3),
.metric-grid > :nth-child(8n+3),
.cards > :nth-child(8n+3),
.panel-grid > :nth-child(8n+3){
  border-top:3px solid var(--amic-violet) !important;
  background:linear-gradient(180deg,var(--amic-violet-soft),#fff 60%) !important;
}

.metrics > :nth-child(8n+4),
.metric-grid > :nth-child(8n+4),
.cards > :nth-child(8n+4),
.panel-grid > :nth-child(8n+4){
  border-top:3px solid var(--amic-cyan) !important;
  background:linear-gradient(180deg,var(--amic-cyan-soft),#fff 60%) !important;
}

.metrics > :nth-child(8n+5),
.metric-grid > :nth-child(8n+5),
.cards > :nth-child(8n+5),
.panel-grid > :nth-child(8n+5){
  border-top:3px solid var(--amic-amber) !important;
  background:linear-gradient(180deg,var(--amic-amber-soft),#fff 60%) !important;
}

.metrics > :nth-child(8n+6),
.metric-grid > :nth-child(8n+6),
.cards > :nth-child(8n+6),
.panel-grid > :nth-child(8n+6){
  border-top:3px solid var(--amic-rose) !important;
  background:linear-gradient(180deg,var(--amic-rose-soft),#fff 60%) !important;
}

.metrics > :nth-child(8n+7),
.metric-grid > :nth-child(8n+7),
.cards > :nth-child(8n+7),
.panel-grid > :nth-child(8n+7){
  border-top:3px solid var(--amic-indigo) !important;
  background:linear-gradient(180deg,var(--amic-indigo-soft),#fff 60%) !important;
}

.metrics > :nth-child(8n),
.metric-grid > :nth-child(8n),
.cards > :nth-child(8n),
.panel-grid > :nth-child(8n){
  border-top:3px solid var(--amic-teal) !important;
  background:linear-gradient(180deg,var(--amic-teal-soft),#fff 60%) !important;
}

/* Section cards alternate soft tint so adjacent concepts are easy to separate */
.section > .card:nth-child(6n+1),
.two > .card:nth-child(6n+1),
.two-col > .card:nth-child(6n+1){
  border-left:3px solid var(--amic-blue) !important;
  background:linear-gradient(90deg,var(--amic-blue-soft),#fff 18%) !important;
}
.section > .card:nth-child(6n+2),
.two > .card:nth-child(6n+2),
.two-col > .card:nth-child(6n+2){
  border-left:3px solid var(--amic-violet) !important;
  background:linear-gradient(90deg,var(--amic-violet-soft),#fff 18%) !important;
}
.section > .card:nth-child(6n+3),
.two > .card:nth-child(6n+3),
.two-col > .card:nth-child(6n+3){
  border-left:3px solid var(--amic-green) !important;
  background:linear-gradient(90deg,var(--amic-green-soft),#fff 18%) !important;
}
.section > .card:nth-child(6n+4),
.two > .card:nth-child(6n+4),
.two-col > .card:nth-child(6n+4){
  border-left:3px solid var(--amic-amber) !important;
  background:linear-gradient(90deg,var(--amic-amber-soft),#fff 18%) !important;
}
.section > .card:nth-child(6n+5),
.two > .card:nth-child(6n+5),
.two-col > .card:nth-child(6n+5){
  border-left:3px solid var(--amic-cyan) !important;
  background:linear-gradient(90deg,var(--amic-cyan-soft),#fff 18%) !important;
}
.section > .card:nth-child(6n),
.two > .card:nth-child(6n),
.two-col > .card:nth-child(6n){
  border-left:3px solid var(--amic-rose) !important;
  background:linear-gradient(90deg,var(--amic-rose-soft),#fff 18%) !important;
}

/* Semantic route-aware color hooks */
body.amic-route-server-reality .page-title,
body.amic-route-server-reality .page{
  border-left:4px solid var(--amic-cyan) !important;
}
body.amic-route-documentation-registry .page-title,
body.amic-route-documentation-registry .page{
  border-left:4px solid var(--amic-violet) !important;
}
body.amic-route-product-registry .page-title,
body.amic-route-product-registry .page{
  border-left:4px solid var(--amic-blue) !important;
}
body.amic-route-capability-registry .page-title,
body.amic-route-capability-registry .page{
  border-left:4px solid var(--amic-green) !important;
}
body.amic-route-dependency-graph .page-title,
body.amic-route-dependency-graph .page{
  border-left:4px solid var(--amic-indigo) !important;
}
body.amic-route-gap-drift-analysis .page-title,
body.amic-route-gap-drift-analysis .page{
  border-left:4px solid var(--amic-rose) !important;
}
body.amic-route-implementation-roadmap .page-title,
body.amic-route-implementation-roadmap .page{
  border-left:4px solid var(--amic-amber) !important;
}
body.amic-route-stage-gates .page-title,
body.amic-route-stage-gates .page{
  border-left:4px solid var(--amic-teal) !important;
}
body.amic-route-qualification-center .page-title,
body.amic-route-qualification-center .page{
  border-left:4px solid var(--amic-green) !important;
}
body.amic-route-evidence-audit .page-title,
body.amic-route-evidence-audit .page{
  border-left:4px solid var(--amic-violet) !important;
}
body.amic-route-implementation-queue .page-title,
body.amic-route-implementation-queue .page{
  border-left:4px solid var(--amic-cyan) !important;
}
body.amic-route-release-control .page-title,
body.amic-route-release-control .page{
  border-left:4px solid var(--amic-blue) !important;
}

/* Pipeline stages: status made more legible */
.pipeline > *,
.pipeline-item,
.phase,
.stage-card{
  border-left:4px solid #b9c7d8 !important;
  background:#f8fafc !important;
}

.pipeline .active,
.pipeline .current,
.pipeline [data-state="CURRENT"],
.pipeline [data-state="AUTHORIZED"]{
  border-left-color:var(--amic-blue) !important;
  background:var(--amic-blue-soft) !important;
}

.badge{
  font-weight:700 !important;
}

/* Tables: subtle alternating row color */
table tbody tr:nth-child(even){
  background:rgba(235,243,253,.48) !important;
}
table tbody tr:hover{
  background:#eaf3ff !important;
}

/* --------------------------------------------------------------------------
   EXECUTIVE CONTROL — DENSE DESKTOP OPERATIONS VIEW
   -------------------------------------------------------------------------- */

@media (min-width: 821px){

  body.amic-route-executive-control .main,
  body.amic-route-executive-control main{
    padding:10px 14px 10px !important;
  }

  /* Hero / title block */
  body.amic-route-executive-control .page,
  body.amic-route-executive-control .page-title,
  body.amic-route-executive-control .hero{
    min-height:auto !important;
    padding:12px 15px !important;
    margin-bottom:8px !important;
    gap:5px !important;
    border-left:4px solid var(--amic-blue) !important;
    background:linear-gradient(90deg,var(--amic-blue-soft),#fff 54%) !important;
  }

  body.amic-route-executive-control .page h1,
  body.amic-route-executive-control .page-title h1,
  body.amic-route-executive-control .hero h1{
    font-size:27px !important;
    line-height:1.05 !important;
    margin:0 !important;
  }

  body.amic-route-executive-control .page p,
  body.amic-route-executive-control .page-title p,
  body.amic-route-executive-control .hero p{
    font-size:11px !important;
    line-height:1.25 !important;
    margin:2px 0 0 !important;
  }

  /* KPI row */
  body.amic-route-executive-control .metrics,
  body.amic-route-executive-control .metric-grid{
    gap:8px !important;
    margin:0 0 8px !important;
  }

  body.amic-route-executive-control .metric,
  body.amic-route-executive-control .kpi,
  body.amic-route-executive-control .stat{
    min-height:84px !important;
    padding:9px 12px !important;
  }

  body.amic-route-executive-control .metric strong,
  body.amic-route-executive-control .metric .value,
  body.amic-route-executive-control .kpi strong{
    font-size:24px !important;
    line-height:1 !important;
    margin:3px 0 !important;
  }

  body.amic-route-executive-control .metric small,
  body.amic-route-executive-control .metric .label,
  body.amic-route-executive-control .metric .sub{
    font-size:10px !important;
    line-height:1.15 !important;
  }

  /* Pipeline */
  body.amic-route-executive-control .section{
    margin-top:8px !important;
    margin-bottom:8px !important;
  }

  body.amic-route-executive-control .section > h2,
  body.amic-route-executive-control .section-head h2{
    font-size:17px !important;
    margin:0 0 7px !important;
  }

  body.amic-route-executive-control .pipeline{
    gap:6px !important;
  }

  body.amic-route-executive-control .pipeline > *,
  body.amic-route-executive-control .pipeline-item,
  body.amic-route-executive-control .phase,
  body.amic-route-executive-control .stage-card{
    min-height:76px !important;
    padding:8px 10px !important;
    border-radius:8px !important;
  }

  body.amic-route-executive-control .pipeline strong,
  body.amic-route-executive-control .pipeline b{
    font-size:11px !important;
    line-height:1.15 !important;
  }

  body.amic-route-executive-control .pipeline span,
  body.amic-route-executive-control .pipeline small,
  body.amic-route-executive-control .pipeline p{
    font-size:9.5px !important;
    line-height:1.15 !important;
    margin-top:3px !important;
  }

  /* Lower cards */
  body.amic-route-executive-control .card{
    padding:10px 12px !important;
    margin-bottom:7px !important;
    border-radius:10px !important;
  }

  body.amic-route-executive-control .card h2,
  body.amic-route-executive-control .card .title,
  body.amic-route-executive-control .card .panel-title{
    font-size:16px !important;
    margin-bottom:6px !important;
  }

  body.amic-route-executive-control .row,
  body.amic-route-executive-control .status-line{
    padding:5px 0 !important;
    min-height:0 !important;
    font-size:10.5px !important;
    line-height:1.2 !important;
  }

  body.amic-route-executive-control .two,
  body.amic-route-executive-control .two-col{
    gap:8px !important;
  }

  body.amic-route-executive-control .empty{
    min-height:52px !important;
    padding:12px !important;
    font-size:10px !important;
  }

  body.amic-route-executive-control .footer-note{
    margin-top:6px !important;
    padding:6px 0 !important;
    font-size:9px !important;
  }
}

/* Keep mobile layout comfortable; no over-compression */
@media (max-width:820px){
  .card,
  .panel,
  .metric,
  .kpi{
    border-top-width:2px !important;
  }
}
