/* Food 1 refactor branch — Annual Audit Map visual layer only.
   Scoped to #control-row-c3. No business, filter, persistence or form logic. */
#control-row-c3{
  --audit-navy:#082B67;
  --audit-blue:#0B5DDB;
  --audit-cyan:#19D5EA;
  --audit-cyan-strong:#00BFD8;
  --audit-ice:#F8FDFF;
  --audit-line:rgba(17,184,214,.22);
  --audit-glass:rgba(255,255,255,.86);
  position:relative;
}

#control-row-c3 > div{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  border:1px solid rgba(56,189,248,.30)!important;
  border-radius:30px!important;
  background:
    linear-gradient(90deg,transparent 0 68%,rgba(34,211,238,.055) 68% 68.15%,transparent 68.15%),
    linear-gradient(0deg,transparent 0 74%,rgba(14,165,233,.045) 74% 74.15%,transparent 74.15%),
    radial-gradient(circle at 82% 7%,rgba(34,211,238,.12),transparent 22%),
    radial-gradient(circle at 13% 92%,rgba(14,165,233,.07),transparent 24%),
    linear-gradient(145deg,#fff 0%,#fbfeff 54%,#f3fbff 100%)!important;
  box-shadow:0 24px 70px rgba(8,47,73,.10),0 0 0 1px rgba(255,255,255,.9) inset!important;
}

#control-row-c3 > div::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  opacity:.72;
  background:
    radial-gradient(circle at 4% 9%,rgba(8,43,103,.22) 0 1px,transparent 1.6px) 0 0/14px 14px,
    linear-gradient(135deg,transparent 0 8%,rgba(34,211,238,.10) 8.05% 8.12%,transparent 8.17% 100%),
    linear-gradient(45deg,transparent 0 92%,rgba(14,165,233,.08) 92.05% 92.12%,transparent 92.17% 100%);
  mask-image:linear-gradient(to bottom,rgba(0,0,0,.75),transparent 26%,transparent 75%,rgba(0,0,0,.48));
}

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

#control-row-c3 h2{
  color:var(--audit-navy)!important;
  letter-spacing:-.035em;
  font-weight:750!important;
  text-shadow:0 1px 0 rgba(255,255,255,.95);
}
#control-row-c3 h2 + p{color:#58708F!important;}

/* Add Audit CTA */
#control-row-c3 button:has(svg.lucide-plus){
  position:relative;
  background:linear-gradient(135deg,#082B67 0%,#064FAF 60%,#0878D8 100%)!important;
  border:1px solid rgba(34,211,238,.70)!important;
  color:#fff!important;
  box-shadow:0 10px 26px rgba(7,95,234,.22),0 0 0 3px rgba(34,211,238,.09),0 0 20px rgba(34,211,238,.22)!important;
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease!important;
}
#control-row-c3 button:has(svg.lucide-plus):hover{
  transform:translateY(-2px);
  border-color:rgba(34,211,238,.95)!important;
  box-shadow:0 14px 34px rgba(7,95,234,.28),0 0 0 4px rgba(34,211,238,.11),0 0 28px rgba(34,211,238,.32)!important;
}

/* KPI HUD cards */
#control-row-c3 .mt-6.grid > div{
  position:relative;
  overflow:hidden;
  min-height:116px;
  border-radius:20px!important;
  border:1px solid rgba(125,211,252,.30)!important;
  background:linear-gradient(145deg,rgba(255,255,255,.94),rgba(242,250,255,.76))!important;
  box-shadow:0 11px 30px rgba(8,47,73,.07),inset 0 1px 0 rgba(255,255,255,.98),inset 0 -1px 0 rgba(34,211,238,.07)!important;
  backdrop-filter:blur(12px);
}
#control-row-c3 .mt-6.grid > div::before{
  content:"";
  position:absolute;
  right:18px;
  top:14px;
  width:32px;
  height:20px;
  opacity:.42;
  background:radial-gradient(circle,#21cfe3 1.4px,transparent 1.8px) 0 0/7px 7px;
}
#control-row-c3 .mt-6.grid > div::after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:0;height:2px;
  background:linear-gradient(90deg,#10c7df,rgba(34,211,238,.18),#10c7df);
  box-shadow:0 0 10px rgba(34,211,238,.26);
}
#control-row-c3 .mt-6.grid > div:nth-child(2)::after{background:linear-gradient(90deg,#F59E0B,rgba(245,158,11,.15),#F59E0B);}
#control-row-c3 .mt-6.grid > div:nth-child(3)::after{background:linear-gradient(90deg,#10B981,rgba(16,185,129,.15),#10B981);}
#control-row-c3 .mt-6.grid > div:nth-child(4)::after{background:linear-gradient(90deg,#0EA5E9,rgba(14,165,233,.15),#0EA5E9);}

#control-row-c3 .mt-6.grid > div .grid.h-10.w-10{
  width:54px!important;
  height:54px!important;
  border-radius:50%!important;
  background:rgba(239,250,255,.88)!important;
  color:#079DB4!important;
  border:1px solid rgba(125,211,252,.32)!important;
  box-shadow:0 0 0 7px rgba(224,247,255,.52),0 0 20px rgba(34,211,238,.12)!important;
}
#control-row-c3 .mt-6.grid > div:nth-child(2) .grid.h-10.w-10{color:#C97700!important;background:rgba(255,248,230,.9)!important;}
#control-row-c3 .mt-6.grid > div:nth-child(3) .grid.h-10.w-10{color:#059669!important;background:rgba(236,253,245,.9)!important;}
#control-row-c3 .mt-6.grid > div:nth-child(4) .grid.h-10.w-10{color:#0B5DDB!important;background:rgba(239,246,255,.9)!important;}
#control-row-c3 .mt-6.grid > div .text-2xl{font-size:2rem!important;line-height:1!important;color:var(--audit-navy)!important;}

/* Filter/info strip */
#control-row-c3 .mt-5.flex.flex-wrap.items-center.gap-3.rounded-2xl{
  border:1px solid rgba(56,189,248,.26)!important;
  background:linear-gradient(180deg,rgba(255,255,255,.88),rgba(242,250,255,.70))!important;
  box-shadow:0 8px 24px rgba(8,47,73,.05),inset 0 1px 0 #fff;
  backdrop-filter:blur(12px);
  padding:14px 16px!important;
}
#control-row-c3 select{
  border-color:rgba(125,211,252,.42)!important;
  background:rgba(255,255,255,.90)!important;
  color:#24415F!important;
  box-shadow:0 4px 12px rgba(8,47,73,.04),inset 0 1px 0 #fff;
  transition:border-color .2s ease,box-shadow .2s ease!important;
}
#control-row-c3 select:focus{
  outline:none!important;
  border-color:#22D3EE!important;
  box-shadow:0 0 0 3px rgba(34,211,238,.12)!important;
}

/* Audit map grid */
#control-row-c3 .mt-5.overflow-x-auto.rounded-2xl{
  position:relative;
  border:1px solid rgba(34,211,238,.34)!important;
  border-radius:20px!important;
  background:rgba(255,255,255,.78)!important;
  box-shadow:0 12px 32px rgba(8,47,73,.07),0 0 18px rgba(34,211,238,.06)!important;
  backdrop-filter:blur(14px);
}
#control-row-c3 .mt-5.overflow-x-auto.rounded-2xl::before{
  content:"";
  position:absolute;
  left:18px;right:18px;top:0;height:1px;
  z-index:5;
  background:linear-gradient(90deg,transparent,#22D3EE 18%,#38BDF8 82%,transparent);
  box-shadow:0 0 10px rgba(34,211,238,.45);
}

#control-row-c3 .grid.grid-cols-12.border-b{
  background:linear-gradient(180deg,#F8FDFF 0%,#EEF9FF 100%)!important;
}
#control-row-c3 .grid.grid-cols-12.border-b > div{
  min-height:56px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#35506F!important;
  border-color:rgba(14,165,233,.12)!important;
  letter-spacing:.045em!important;
  font-size:12px!important;
  position:relative;
}
#control-row-c3 .grid.grid-cols-12.border-b > div.bg-blue-50{
  background:linear-gradient(180deg,rgba(207,250,254,.80),rgba(239,252,255,.92))!important;
  color:#075E7A!important;
  box-shadow:inset 0 -2px 0 #22D3EE,0 0 16px rgba(34,211,238,.12);
}
#control-row-c3 .grid.min-h-\[330px\].grid-cols-12 > div{
  border-color:rgba(14,165,233,.10)!important;
  background:rgba(255,255,255,.45);
  min-height:350px;
}
#control-row-c3 .grid.min-h-\[330px\].grid-cols-12 > div.bg-blue-50\/25{
  background:linear-gradient(180deg,rgba(236,254,255,.40),rgba(248,253,255,.55))!important;
}

/* Audit event cards */
#control-row-c3 .grid.min-h-\[330px\].grid-cols-12 .rounded-xl.border.p-3.shadow-sm{
  position:relative;
  border-radius:15px!important;
  background:linear-gradient(145deg,rgba(255,255,255,.96),rgba(241,252,255,.90))!important;
  border:1px solid rgba(34,211,238,.42)!important;
  box-shadow:0 10px 24px rgba(8,47,73,.09),0 0 18px rgba(34,211,238,.10)!important;
  overflow:visible;
}
#control-row-c3 .grid.min-h-\[330px\].grid-cols-12 .rounded-xl.border.p-3.shadow-sm::before{
  content:"";
  position:absolute;
  top:-5px;left:50%;transform:translateX(-50%);
  width:9px;height:9px;border-radius:50%;
  background:#22D3EE;
  border:2px solid #fff;
  box-shadow:0 0 0 2px rgba(34,211,238,.28),0 0 10px rgba(34,211,238,.65);
}
#control-row-c3 .grid.min-h-\[330px\].grid-cols-12 .rounded-xl.border.p-3.shadow-sm > .flex:first-child::after{
  content:"";
  position:absolute;
  left:14px;right:14px;top:82px;height:2px;
  background:linear-gradient(90deg,#20CFE4,rgba(32,207,228,.10));
  border-radius:2px;
}
#control-row-c3 .grid.min-h-\[330px\].grid-cols-12 .rounded-xl.border.p-3.shadow-sm .rounded-full{
  border:1px solid rgba(245,158,11,.42);
  background:rgba(255,247,214,.96)!important;
  color:#B45F00!important;
  box-shadow:0 2px 7px rgba(245,158,11,.10);
}
#control-row-c3 .grid.min-h-\[330px\].grid-cols-12 .rounded-xl.border.p-3.shadow-sm.bg-emerald-50\/80 .rounded-full{
  border-color:rgba(16,185,129,.35);
  background:rgba(236,253,245,.98)!important;
  color:#047857!important;
}
#control-row-c3 .grid.min-h-\[330px\].grid-cols-12 .rounded-xl.border.p-3.shadow-sm button{
  border-color:rgba(125,211,252,.30)!important;
  color:var(--audit-navy)!important;
  box-shadow:0 5px 12px rgba(8,47,73,.07)!important;
}
#control-row-c3 .grid.min-h-\[330px\].grid-cols-12 .rounded-xl.border.p-3.shadow-sm button:hover{
  border-color:#22D3EE!important;
  box-shadow:0 0 0 3px rgba(34,211,238,.10),0 7px 16px rgba(8,47,73,.09)!important;
}

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

@media(max-width:900px){
  #control-row-c3 > div{border-radius:24px!important;}
  #control-row-c3 .mt-6.grid > div{min-height:108px;}
}
@media(prefers-reduced-motion:reduce){
  #control-row-c3 *,#control-row-c3 *::before,#control-row-c3 *::after{transition:none!important;}
}