.dvwca{border:1px solid #e5e7eb;border-radius:14px;background:#fff;margin:8px 0; padding:12px}
.dvwca__head{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.dvwca__title{font-weight:600;color:#0f172a;font-size:1rem}
.dvwca__tools{display:flex;gap:8px}
.dvwca__btn{border:1px solid #e5e7eb;background:#fff;border-radius:8px;padding:6px 10px;cursor:pointer}
.dvwca__btn.is-on{background:#111827;color:#fff;border-color:#111827}
.dvwca__grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:12px}
.dvwca__card{border:1px solid #e5e7eb;border-radius:12px;background:#fff}
.dvwca__card-hd{padding:10px 12px;border-bottom:1px solid #e5e7eb;color:#0f172a;display:flex;align-items:center;justify-content:space-between;gap:8px}
.dvwca__card-tools .dvwca__btn{font-size:.85rem;padding:4px 8px}
.dvwca__card-body{padding:10px 12px}
.dvwca__empty{color:#64748b;padding:12px}
.dvwca__legend{display:grid;grid-template-columns:1fr auto;gap:6px 12px;margin-top:8px}
.dvwca__legend-row{display:contents}
.dvwca__legend .dot{width:10px;height:10px;border-radius:999px;display:inline-block;margin-right:8px;align-self:center}
.dvwca__legend .lab{display:flex;align-items:center;color:#0f172a}
.dvwca__legend .val{color:#334155;text-align:right}
.dvwca__kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin-bottom:8px}
.dvwca__kpi{border:1px solid #e5e7eb;border-radius:12px;background:#fff;padding:12px}
.dvwca__kpi .lab{color:#64748b;font-size:.9rem}
.dvwca__kpi .val{color:#0f172a;font-size:1.25rem;font-weight:700}

/* Dark theme */
.dvwca.dvwca-theme-dark{background:#0b0f1a;border-color:rgba(255,255,255,.1)}
.dvwca.dvwca-theme-dark .dvwca__title{color:#e6e9f2}
.dvwca.dvwca-theme-dark .dvwca__card{background:linear-gradient(180deg,#12182a,#0f1526);border-color:rgba(255,255,255,.12)}
.dvwca.dvwca-theme-dark .dvwca__card-hd{border-color:rgba(255,255,255,.12);color:#e6e9f2}
.dvwca.dvwca-theme-dark .dvwca__legend .lab{color:#e6e9f2}
.dvwca.dvwca-theme-dark .dvwca__legend .val{color:#cbd5e1}

/* === Ducks Vote Charts: improved grid layout === */
.dvwca__grid{ display:grid; grid-template-columns:repeat(12, minmax(0,1fr)); gap:16px; align-items:start; }
.dvwca__card{ grid-column: span 12; }
.dvwca__card--half{ grid-column: span 12; }
@media (min-width: 900px){
  .dvwca__card--half{ grid-column: span 6; }
}
/* Slight spacing improvements */
.dvwca__kpis{ margin-bottom: 12px; }
.dvwca__card-body .dvwca__chart{ width:100%; }
/* Safer defaults */
.dvwca *{ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

/* ====== Ducks Vote Analytics — UI polish v1.2.3 ====== */

/* Color tokens (light) */
:root{
  --dva-bg:#ffffff;
  --dva-card:#ffffff;
  --dva-border:#e5e7eb;
  --dva-text:#0f172a;
  --dva-sub:#64748b;
  --dva-accent:#6d28d9;
  --dva-shadow: 0 8px 24px rgba(2,6,23,.06), 0 2px 4px rgba(2,6,23,.06);
}

/* Dark theme tokens when parent adds .dvwca-theme-dark */
.dvwca.dvwca-theme-dark{
  --dva-bg:#0b1220;
  --dva-card:#0f172a;
  --dva-border:#1f2937;
  --dva-text:#e5e7eb;
  --dva-sub:#94a3b8;
  --dva-accent:#8b5cf6;
  --dva-shadow: 0 8px 24px rgba(0,0,0,.35), 0 2px 4px rgba(0,0,0,.35);
}

/* Container */
.dvwca{ background:var(--dva-bg); border-color:var(--dva-border); }

/* Header */
.dvwca__head{ padding:4px 2px 12px; }
.dvwca__title{ font-size:1.125rem; color:var(--dva-text); }
.dvwca__tools .dvwca__btn{
  border-color:var(--dva-border);
  transition:transform .14s ease, background-color .14s ease, color .14s ease;
}
.dvwca__tools .dvwca__btn:hover{ transform:translateY(-1px); }
.dvwca__btn.is-on{ background:var(--dva-text); color:#fff; border-color:var(--dva-text); }

/* KPI chips */
.dvwca__kpis{ display:grid; grid-template-columns:repeat(12, minmax(0,1fr)); gap:12px; margin:8px 0 14px; }
.dvwca__kpi{
  grid-column: span 12;
  border:1px solid var(--dva-border);
  background:var(--dva-card);
  border-radius:14px;
  box-shadow:var(--dva-shadow);
  padding:12px 14px;
}
@media (min-width: 640px){
  .dvwca__kpi{ grid-column:span 4; }
}
.dvwca__kpi .lab{ color:var(--dva-sub); font-size:.85rem; }
.dvwca__kpi .num{ color:var(--dva-text); font-weight:700; font-size:1.35rem; line-height:1.3; }

/* Grid + cards */
.dvwca__grid{ gap:16px; }
.dvwca__card{
  border-color:var(--dva-border);
  background:var(--dva-card);
  border-radius:16px;
  box-shadow:var(--dva-shadow);
  overflow:hidden;
}
.dvwca__card-hd{
  padding:12px 14px;
  border-bottom:1px solid var(--dva-border);
  background:linear-gradient(180deg, rgba(109,40,217,.06), rgba(109,40,217,0));
}
.dvwca__card-title{ color:var(--dva-text); font-weight:600; }
.dvwca__card-tools{ display:flex; align-items:center; gap:8px; }
.dvwca__card-tools .dvwca__btn{ font-size:.85rem; padding:4px 10px; }
.dvwca__card-body{ padding:14px; }

/* Chart canvas sizing & smoother render */
.dvwca__chart{ width:100%; max-width:100%; display:block; }
.dvwca__chart-wrap{ position:relative; min-height:220px; }
@media (min-width: 900px){
  .dvwca__chart-wrap{ min-height:260px; }
}

/* Legend */
.dvwca__legend{ gap:8px 12px; margin-top:10px; }
.dvwca__legend .lab{ color:var(--dva-text); }
.dvwca__legend .val{ color:var(--dva-sub); }

/* Empty state */
.dvwca__empty{ color:var(--dva-sub); border:1px dashed var(--dva-border); border-radius:12px; padding:18px; text-align:center; }

/* Loading state (optional: toggle .is-loading on .dvwca) */
.dvwca.is-loading{ pointer-events:none; opacity:.85; }
.dvwca.is-loading .dvwca__card-body{ position:relative; }
.dvwca.is-loading .dvwca__card-body::after{
  content:''; position:absolute; inset:0;
  background:linear-gradient(90deg, rgba(148,163,184,.15), rgba(148,163,184,.05), rgba(148,163,184,.15));
  animation:dva-shimmer 1.2s linear infinite;
}
@keyframes dva-shimmer{
  0%{ transform:translateX(-20%); }
  100%{ transform:translateX(20%); }
}

/* Two-up layout helper */
.dvwca__card--half{ grid-column:span 12; }
@media (min-width:900px){
  .dvwca__card--half{ grid-column:span 6; }
}

/* ====== 1.2.4 spacing & overlay fixes ====== */
.dvwca{ padding: 8px 8px 24px; }
.dvwca__kpis{ margin-bottom: 16px; position:relative; z-index:2; }
.dvwca__grid{ 
  display:grid; 
  grid-template-columns: repeat(12, minmax(0,1fr)); 
  gap: 18px;
}
.dvwca__card{ margin: 2px 2px 0; position:relative; z-index:1; }
.dvwca__card + .dvwca__card{ margin-top: 8px; }
.dvwca__card-hd{ min-height:44px; }

/* Ensure charts don't collapse causing overlay */
.dvwca__card-body{ padding: 16px; }
.dvwca__chart-wrap{ padding: 4px 2px 2px; }

/* KPI pill sizing so they don't float under cards */
.dvwca__kpi{ min-height:64px; display:flex; align-items:center; justify-content:space-between; }

/* Optional: give cards a slightly larger outer shadow so they don't visually sit on top of KPIs */
.dvwca__card{ box-shadow: 0 12px 28px rgba(2,6,23,.06), 0 2px 6px rgba(2,6,23,.06); }

/* Make sure nothing leaks out of container */
.dvwca{ overflow: hidden; }

/* ====== 1.2.5 sectioned layout (no markup changes) ====== */

/* Give the whole widget generous breathing room */
.dvwca{ padding: 16px 16px 28px; }

/* KPI row becomes its own card/section */
.dvwca__kpis{
  background: var(--dva-card);
  border: 1px solid var(--dva-border);
  border-radius: 16px;
  box-shadow: var(--dva-shadow);
  padding: 12px;
  margin: 0 0 22px;
}

/* Space out each area clearly */
.dvwca__card{ margin: 12px 2px 0; }
.dvwca__card:first-of-type{ margin-top: 0; }
.dvwca__card + .dvwca__card{ margin-top: 22px; }

/* Extra separation line in card header for clarity */
.dvwca__card-hd{
  border-bottom: 1px solid var(--dva-border);
  background: linear-gradient(180deg, rgba(109,40,217,.05), rgba(109,40,217,0));
}

/* Prevent overlaps at small widths */
.dvwca__kpi{ min-height: 60px; }
.dvwca__kpi .lab{ display:block; }
.dvwca__kpi .num{ display:block; margin-top: 2px; }

/* Improve title legibility and alignment */
.dvwca__card-title{ font-size: 1rem; line-height: 1.4; }

/* Optional: subtle divider between sections using pseudo element */
.dvwca__kpis::after{
  content:'';
  display:block;
  height: 2px;
  margin-top: 18px;
  margin-left: -12px;
  margin-right: -12px;
  background: linear-gradient(90deg, transparent, var(--dva-border), transparent);
  border-radius: 1px;
}

/* ====== 1.2.6 hard layout fix ====== */

/* Consistent sizing inside widget */
.dvwca, .dvwca * { box-sizing: border-box; }

/* Master grid: 12 cols with solid gaps */
.dvwca__grid{
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 24px;
}

/* KPI section spans full row */
.dvwca__kpis{
  grid-column: 1 / -1;
  margin: 0 !important;
  /* ensure no weird stacking */
  position: relative;
  z-index: 0;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 12px;
}

/* Each KPI box = clean block element, no floats */
.dvwca__kpi{
  float: none;
  display: flex;
  flex-direction: column;
  justify-content: center;
  border:1px solid var(--dva-border);
  background:var(--dva-card);
  border-radius:14px;
  box-shadow:var(--dva-shadow);
  padding:12px 14px;
  grid-column: span 12;
}
@media (min-width: 640px){
  .dvwca__kpi{ grid-column: span 4; }
}

/* Cards: use spans for half/whole */
.dvwca__card{ grid-column: span 12; margin: 0; }
@media (min-width: 900px){
  .dvwca__card--half{ grid-column: span 6; }
}

/* Clear, generous separation between sections */
.dvwca__kpis{ margin-bottom: 8px !important; }
.dvwca__card{ margin-top: 0; }
.dvwca__card + .dvwca__card{ margin-top: 0; } /* grid gap handles spacing */

/* Prevent visual overlap */
.dvwca{ overflow: visible; } /* allow shadows to render */