/* Food 1 refactor branch — Qalibra Track visual layer only. No business/data logic. */
#control-row-c2{
  --qal-navy:#0A2A6B;
  --qal-blue:#075FEA;
  --qal-cyan:#14D8F5;
  --qal-cyan-soft:rgba(20,216,245,.18);
  --qal-ice:#F7FCFF;
  --qal-glass:rgba(255,255,255,.82);
  --qal-line:rgba(14,165,233,.22);
  position:relative;
}

#control-row-c2 > div{
  position:relative;
  isolation:isolate;
  overflow:hidden!important;
  border:1px solid rgba(56,189,248,.26)!important;
  border-radius:30px!important;
  background:
    radial-gradient(circle at 86% 5%,rgba(20,216,245,.14),transparent 29%),
    radial-gradient(circle at 70% 0%,rgba(59,130,246,.10),transparent 34%),
    linear-gradient(135deg,#fff 0%,#f8fdff 52%,#f1f9ff 100%)!important;
  box-shadow:0 22px 65px rgba(8,47,73,.10),0 0 0 1px rgba(255,255,255,.9) inset!important;
}

#control-row-c2 > div::before{
  content:"";
  position:absolute;
  z-index:-1;
  inset:0 0 auto 0;
  height:245px;
  opacity:.72;
  pointer-events:none;
  background:
    linear-gradient(90deg,transparent 0 72%,rgba(20,216,245,.12) 72% 72.12%,transparent 72.12% 78%,rgba(37,99,235,.10) 78% 78.12%,transparent 78.12%),
    linear-gradient(0deg,transparent 0 67%,rgba(20,216,245,.10) 67% 67.6%,transparent 67.6%),
    radial-gradient(circle at 79% 45%,rgba(20,216,245,.20) 0 2px,transparent 3px),
    linear-gradient(110deg,transparent 49.6%,rgba(56,189,248,.10) 50%,transparent 50.4%);
  mask-image:linear-gradient(to bottom,#000 0%,rgba(0,0,0,.8) 65%,transparent 100%);
}

#control-row-c2 > div::after{
  content:"";
  position:absolute;
  pointer-events:none;
  z-index:3;
  inset:12px;
  border-radius:22px;
  border:1px solid rgba(34,211,238,.11);
  clip-path:polygon(0 18px,18px 0,calc(100% - 18px) 0,100% 18px,100% calc(100% - 18px),calc(100% - 18px) 100%,18px 100%,0 calc(100% - 18px));
}

#control-row-c2 h2{
  color:var(--qal-navy)!important;
  letter-spacing:-.035em!important;
  text-shadow:0 1px 0 rgba(255,255,255,.95);
}
#control-row-c2 h2 + p{color:#5C708F!important;}

/* Toolbar — glass controls */
#control-row-c2 input[placeholder="Search equipment..."]{
  background:rgba(255,255,255,.82)!important;
  border-color:rgba(148,163,184,.34)!important;
  box-shadow:0 8px 24px rgba(8,47,73,.05),inset 0 1px 0 #fff;
  backdrop-filter:blur(12px);
  transition:border-color .2s ease,box-shadow .2s ease,transform .2s ease;
}
#control-row-c2 input[placeholder="Search equipment..."]:focus{
  border-color:rgba(34,211,238,.78)!important;
  box-shadow:0 0 0 3px rgba(34,211,238,.13),0 8px 28px rgba(14,165,233,.12)!important;
}

#control-row-c2 button{
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease,background .2s ease!important;
}
#control-row-c2 button:hover{transform:translateY(-2px);}

/* Annual Planner + Export glass buttons */
#control-row-c2 button[title*="annual calibration planner"],
#control-row-c2 button[title="Return to equipment register"],
#control-row-c2 button[title="Download Qalibra matrix for Excel"]{
  background:rgba(255,255,255,.82)!important;
  border-color:rgba(14,165,233,.22)!important;
  color:var(--qal-navy)!important;
  box-shadow:0 8px 22px rgba(8,47,73,.07),inset 0 1px 0 rgba(255,255,255,.95)!important;
  backdrop-filter:blur(12px);
}
#control-row-c2 button[title*="annual calibration planner"]:hover,
#control-row-c2 button[title="Return to equipment register"]:hover,
#control-row-c2 button[title="Download Qalibra matrix for Excel"]:hover{
  border-color:rgba(34,211,238,.72)!important;
  box-shadow:0 0 0 3px rgba(34,211,238,.10),0 12px 28px rgba(14,165,233,.13)!important;
}

/* Add Equipment — strongest CTA, no violet */
#control-row-c2 button:not([title]):has(svg.lucide-plus){
  background:linear-gradient(135deg,#082B70 0%,#075FEA 62%,#0A86E8 100%)!important;
  border:1px solid rgba(34,211,238,.55)!important;
  color:#fff!important;
  box-shadow:0 10px 26px rgba(7,95,234,.24),0 0 18px rgba(20,216,245,.16)!important;
}
#control-row-c2 button:not([title]):has(svg.lucide-plus):hover{
  box-shadow:0 14px 34px rgba(7,95,234,.29),0 0 24px rgba(20,216,245,.28)!important;
}

/* KPI HUD cards */
#control-row-c2 .mt-7.grid > div{
  position:relative;
  overflow:hidden;
  min-height:138px;
  border-radius:22px!important;
  border:1px solid rgba(125,211,252,.28)!important;
  background:linear-gradient(145deg,rgba(255,255,255,.92),rgba(239,249,255,.72))!important;
  box-shadow:0 12px 30px rgba(8,47,73,.07),inset 0 1px 0 rgba(255,255,255,.98),inset 0 -1px 0 rgba(14,165,233,.07)!important;
  backdrop-filter:blur(14px);
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease!important;
}
#control-row-c2 .mt-7.grid > div:hover{
  transform:translateY(-3px);
  border-color:rgba(34,211,238,.48)!important;
  box-shadow:0 16px 38px rgba(8,47,73,.10),0 0 18px rgba(34,211,238,.08)!important;
}
#control-row-c2 .mt-7.grid > div::before{
  content:"";
  position:absolute;
  width:74px;height:74px;
  right:-18px;top:-22px;
  border:1px solid rgba(34,211,238,.10);
  border-radius:50%;
  box-shadow:0 0 0 12px rgba(34,211,238,.025),0 0 0 24px rgba(14,165,233,.018);
}
#control-row-c2 .mt-7.grid > div::after{
  content:"";
  position:absolute;
  left:0;top:18px;bottom:18px;width:2px;
  border-radius:2px;
  background:#22D3EE;
  opacity:.5;
  box-shadow:0 0 10px currentColor;
}
#control-row-c2 .mt-7.grid > div:nth-child(2)::after{background:#FB7185;}
#control-row-c2 .mt-7.grid > div:nth-child(3)::after{background:#F59E0B;}
#control-row-c2 .mt-7.grid > div:nth-child(4)::after{background:#EF4444;}

#control-row-c2 .mt-7.grid > div > div > div:first-child{
  position:relative;
  border:1px solid rgba(125,211,252,.28);
  box-shadow:0 0 0 6px rgba(224,247,255,.6),0 0 20px rgba(34,211,238,.10);
}

/* Futuristic register shell */
#control-row-c2 .mt-6.overflow-x-auto{
  position:relative;
  overflow-x:auto!important;
  border-radius:22px!important;
  border:1px solid rgba(34,211,238,.36)!important;
  background:rgba(255,255,255,.76)!important;
  box-shadow:0 13px 34px rgba(8,47,73,.08),0 -2px 14px rgba(34,211,238,.08),0 2px 16px rgba(34,211,238,.07)!important;
  backdrop-filter:blur(14px);
}
#control-row-c2 .mt-6.overflow-x-auto::before{
  content:"";
  position:absolute;
  left:18px;right:18px;top:0;height:1px;
  background:linear-gradient(90deg,transparent,#22D3EE 18%,#38BDF8 82%,transparent);
  box-shadow:0 0 9px rgba(34,211,238,.42);
  z-index:2;
}

#control-row-c2 table{background:rgba(250,253,255,.68)!important;}
#control-row-c2 thead{
  background:linear-gradient(180deg,#F7FCFF 0%,#EDF8FF 100%)!important;
  color:var(--qal-navy)!important;
}
#control-row-c2 thead th{
  color:var(--qal-navy)!important;
  border-right:1px solid rgba(14,165,233,.09);
  padding-top:16px!important;
  padding-bottom:16px!important;
}
#control-row-c2 tbody tr{
  min-height:76px;
  background:rgba(255,255,255,.58);
  transition:background .2s ease,box-shadow .2s ease!important;
}
#control-row-c2 tbody tr:hover{background:rgba(240,249,255,.72)!important;}
#control-row-c2 tbody td{
  padding-top:19px!important;
  padding-bottom:19px!important;
  border-color:rgba(148,163,184,.13)!important;
  color:#334B6B;
}
#control-row-c2 tbody td:first-child{font-weight:800;color:var(--qal-navy)!important;}

/* Existing overdue behavior preserved; only presentation refined */
#control-row-c2 tr.qalyntra-cal-overdue{
  background:linear-gradient(90deg,rgba(254,242,242,.86),rgba(255,250,250,.70))!important;
  box-shadow:inset 3px 0 0 #EF4444,inset 9px 0 22px rgba(239,68,68,.06)!important;
}
#control-row-c2 tr.qalyntra-cal-critical{
  background:linear-gradient(90deg,rgba(255,247,237,.78),rgba(255,255,255,.58))!important;
}
#control-row-c2 tr.qalyntra-cal-warning{
  background:linear-gradient(90deg,rgba(255,251,235,.75),rgba(255,255,255,.58))!important;
}

/* Calibration status chips */
#control-row-c2 tbody td:nth-child(4) span,
#control-row-c2 tbody td:nth-child(4) > div{
  border-radius:999px!important;
}

#control-row-c2 :focus-visible{
  outline:2px solid #22D3EE!important;
  outline-offset:2px!important;
}

@media (max-width:1100px){
  #control-row-c2 > div::before{height:200px;opacity:.5;}
}
@media (max-width:760px){
  #control-row-c2 > div{border-radius:22px!important;}
  #control-row-c2 .mt-7.grid > div{min-height:128px;}
}
@media (prefers-reduced-motion:reduce){
  #control-row-c2 *,#control-row-c2 *::before,#control-row-c2 *::after{transition:none!important;}
}
