/* ── Animated gradient border on the KPI cards ── */
@keyframes borderGlow {
  0%,100% { box-shadow: 0 0 0 0 transparent; }
  50%      { box-shadow: 0 0 18px 2px rgba(245,158,11,.12); }
}
.kpi-card        { transition: transform .2s, box-shadow .2s; }
.kpi-card:hover  { transform: translateY(-3px); animation: borderGlow 2s infinite; }
.kpi-card .icon  { font-size: 1.6rem; line-height: 1; }

/* Live pulse dot */
.live-dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: #10B981; display: inline-block;
  animation: livePulse 1.4s infinite;
}
@keyframes livePulse {
  0%,100% { opacity:1; transform:scale(1); }
  50%      { opacity:.4; transform:scale(.7); }
}

/* Activity feed */
.activity-item { transition: background .15s; }
.activity-item:hover { background: rgba(255,255,255,.03); }

/* Donut chart placeholder */
.mini-bar { height: 6px; border-radius: 3px; background: #1E1E2E; overflow:hidden; }
.mini-bar-fill { height: 100%; border-radius: 3px; transition: width .6s ease; }

/* Status chip */
.chip {
  display:inline-flex; align-items:center; gap:4px;
  padding:2px 9px; border-radius:99px; font-size:.7rem; font-weight:800;
}
.chip-amber  { background:#78350F22;color:#FCD34D;border:1px solid #78350F44; }
.chip-green  { background:#14532D22;color:#4ADE80;border:1px solid #14532D44; }
.chip-blue   { background:#1E3A5F22;color:#60A5FA;border:1px solid #1E3A5F44; }
.chip-purple { background:#3B1FA022;color:#C084FC;border:1px solid #3B1FA044; }
.chip-red    { background:#7F1D1D22;color:#F87171;border:1px solid #7F1D1D44; }
.chip-slate  { background:#1E293B22;color:#94A3B8;border:1px solid #1E293B44; }
.chip-orange { background:#431407aa;color:#FB923C;border:1px solid #9A3412aa; }

/* Kitchen order card */
.kitchen-card {
  background:#111118; border:1.5px solid #1E1E2E; border-radius:12px;
  padding:12px; transition:all .2s; cursor:pointer;
}
.kitchen-card:hover { border-color:#F59E0B44; }
.kitchen-card.urgent { border-color:#EF444444; background:linear-gradient(135deg,#7f1d1d11,#111118); }
.kitchen-card.ready  { border-color:#10B98144; }

/* Sparkline container */
#sparkline-canvas { display:block; }
/* ── Animated gradient border on the KPI cards ── */
@keyframes borderGlow {
  0%,100% { box-shadow: 0 0 0 0 transparent; }
  50%      { box-shadow: 0 0 18px 2px rgba(245,158,11,.12); }
}
.kpi-card        { transition: transform .2s, box-shadow .2s; }
.kpi-card:hover  { transform: translateY(-3px); animation: borderGlow 2s infinite; }
.kpi-card .icon  { font-size: 1.6rem; line-height: 1; }

/* Live pulse dot */
.live-dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: #10B981; display: inline-block;
  animation: livePulse 1.4s infinite;
}
@keyframes livePulse {
  0%,100% { opacity:1; transform:scale(1); }
  50%      { opacity:.4; transform:scale(.7); }
}

/* Activity feed */
.activity-item { transition: background .15s; }
.activity-item:hover { background: rgba(255,255,255,.03); }

/* Donut chart placeholder */
.mini-bar { height: 6px; border-radius: 3px; background: #1E1E2E; overflow:hidden; }
.mini-bar-fill { height: 100%; border-radius: 3px; transition: width .6s ease; }

/* Status chip */
.chip {
  display:inline-flex; align-items:center; gap:4px;
  padding:2px 9px; border-radius:99px; font-size:.7rem; font-weight:800;
  white-space: nowrap; /* Prevent chips splitting into multiple rows internally */
}
.chip-amber  { background:#78350F22;color:#FCD34D;border:1px solid #78350F44; }
.chip-green  { background:#14532D22;color:#4ADE80;border:1px solid #14532D44; }
.chip-blue   { background:#1E3A5F22;color:#60A5FA;border:1px solid #1E3A5F44; }
.chip-purple { background:#3B1FA022;color:#C084FC;border:1px solid #3B1FA044; }
.chip-red    { background:#7F1D1D22;color:#F87171;border:1px solid #7F1D1D44; }
.chip-slate  { background:#1E293B22;color:#94A3B8;border:1px solid #1E293B44; }
.chip-orange { background:#431407aa;color:#FB923C;border:1px solid #9A3412aa; }

/* Kitchen order card */
.kitchen-card {
  background:#111118; border:1.5px solid #1E1E2E; border-radius:12px;
  padding:12px; transition:all .2s; cursor:pointer;
  min-w: 0; /* Ensures box contents respect text-truncation limits */
}
.kitchen-card:hover { border-color:#F59E0B44; }
.kitchen-card.urgent { border-color:#EF444444; background:linear-gradient(135deg,#7f1d1d11,#111118); }
.kitchen-card.ready  { border-color:#10B98144; }

/* Fully responsive dynamic container rules for Canvas graphics */
.style-canvas-container {
  position: relative;
  width: 100%;
}
#sparkline-canvas { 
  display: block; 
  width: 100% !important; 
  height: 100px !important; 
}