/* =====================================================================
   CE Polls — front-end voting UI. Matches the CE26 / metro45 design system.
   Falls back to its own tokens if the theme vars aren't present.
   ===================================================================== */
.ce-poll{
  --p:var(--primary,#A860A8); --ph:var(--primary-hover,#8E4D8E);
  --ink:var(--text,#071437); --mut:var(--muted,#5E6674);
  --bd:var(--border,#EEF0F4); --g100:var(--gray-100,#F5F6F8);
  --rad:var(--radius,.65rem);
  position:relative; overflow:hidden; background:#fff;
  border:1px solid var(--bd); border-radius:1rem;
  box-shadow:var(--shadow,0 12px 34px rgba(0,0,0,.08));
  max-width:720px; margin:1.5rem auto; font-family:Inter,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  color:var(--ink);
}
.ce-poll-strip{height:4px;background:var(--gradient,linear-gradient(90deg,#F6C915 0%,#8DC63F 33%,#18BEEF 66%,#A860A8 100%))}
.ce-poll-inner{padding:1.6rem 1.6rem 1.4rem}
.ce-poll-title{font-size:1.35rem;font-weight:800;letter-spacing:-.01em;margin:.1rem 0 .5rem}
.ce-poll-intro{color:var(--mut);font-size:.98rem;margin:0 0 1rem}
.ce-poll-intro p{margin:0 0 .5rem}

.ce-poll-msg{padding:.9rem 1rem;border-radius:var(--rad);font-weight:600;font-size:.98rem}
.ce-poll-closed{background:var(--g100);color:var(--mut)}
.ce-poll-thanks{background:rgba(23,198,83,.10);color:#12864a}

/* ---- choice ---- */
.ce-poll-options{display:flex;flex-direction:column;gap:.55rem;margin:0 0 1rem}
.ce-opt{display:flex;align-items:center;gap:.75rem;padding:.85rem 1rem;border:1.5px solid var(--bd);
  border-radius:var(--rad);cursor:pointer;transition:.15s;font-weight:600}
.ce-opt:hover{border-color:var(--p);background:rgba(168,96,168,.04)}
.ce-opt input{position:absolute;opacity:0;width:0;height:0}
.ce-opt-box{flex:none;width:20px;height:20px;border:2px solid #cfd4dd;border-radius:50%;position:relative;transition:.15s}
.ce-opt input[type=checkbox]+.ce-opt-box{border-radius:6px}
.ce-opt input:checked+.ce-opt-box{border-color:var(--p);background:var(--p)}
.ce-opt input:checked+.ce-opt-box::after{content:"";position:absolute;inset:0;margin:auto;width:8px;height:8px;background:#fff;border-radius:50%}
.ce-opt input[type=checkbox]:checked+.ce-opt-box::after{width:6px;height:10px;background:none;border:2px solid #fff;border-top:0;border-left:0;transform:rotate(45deg) translate(-1px,-1px);border-radius:1px}
.ce-opt input:checked~.ce-opt-label{color:var(--p)}
.ce-opt:has(input:checked){border-color:var(--p);background:rgba(168,96,168,.06)}
.ce-opt-label{flex:1}
.ce-poll-hint{color:var(--mut);font-size:.85rem;margin:-.4rem 0 1rem}
.ce-opt-photo{width:44px;height:44px;object-fit:cover;border-radius:8px;flex:none}
/* photo grid layout when options have images */
.ce-poll-options.has-photos{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:.7rem}
.ce-poll-options.has-photos .ce-opt{flex-direction:column;align-items:stretch;text-align:center;gap:.5rem;padding:.8rem}
.ce-poll-options.has-photos .ce-opt-photo{width:100%;height:120px;border-radius:10px}
.ce-poll-options.has-photos .ce-opt-box{position:absolute;top:.6rem;right:.6rem}
.ce-poll-options.has-photos .ce-opt{position:relative}

/* ---- scorecard ---- */
.ce-poll-cards{display:flex;flex-direction:column;gap:1rem;margin:0 0 1rem}
.ce-card{border:1.5px solid var(--bd);border-radius:var(--rad);padding:1rem 1.1rem;transition:.15s}
.ce-card:focus-within{border-color:var(--p)}
.ce-card-head{display:flex;align-items:center;gap:1rem;margin:0 0 .95rem}
.ce-card-photo{width:96px;height:96px;object-fit:cover;object-position:top center;border-radius:14px;flex:none;box-shadow:0 4px 12px rgba(0,0,0,.12)}
.ce-card-idwrap{display:flex;flex-direction:column;gap:.15rem;min-width:0}
.ce-card-name{font-size:1.18rem;font-weight:800;line-height:1.15}
.ce-card-note{font-size:.85rem;color:var(--mut)}
.ce-card-total{margin-left:auto;font-weight:800;font-size:1.1rem;color:var(--p)}
.ce-card-total small{color:var(--mut);font-weight:600;font-size:.72em}
.ce-card-crit{display:flex;flex-direction:column;gap:.85rem}
.ce-crit-top{display:flex;justify-content:space-between;align-items:center;font-size:.92rem;font-weight:600;margin:0 0 .25rem}
.ce-crit-name{color:var(--ink)}
.ce-crit-val{color:var(--p);font-weight:800}
.ce-crit-val small{color:var(--mut);font-weight:600}
.ce-crit-range{width:100%;-webkit-appearance:none;appearance:none;height:6px;border-radius:6px;
  background:linear-gradient(90deg,var(--p) 0%,var(--p) var(--fill,0%),#E7E9EF var(--fill,0%),#E7E9EF 100%);outline:none}
.ce-crit-range::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:22px;height:22px;border-radius:50%;
  background:#fff;border:3px solid var(--p);box-shadow:0 2px 6px rgba(0,0,0,.18);cursor:pointer}
.ce-crit-range::-moz-range-thumb{width:22px;height:22px;border-radius:50%;background:#fff;border:3px solid var(--p);
  box-shadow:0 2px 6px rgba(0,0,0,.18);cursor:pointer}

/* ---- per-contestant submit ---- */
.ce-card-actions{display:flex;align-items:center;gap:.8rem;margin:.9rem 0 0}
.ce-card-submit{background:var(--p);color:#fff;border:none;font-weight:700;font-size:.92rem;
  border-radius:var(--rad);padding:.6rem 1.15rem;cursor:pointer;transition:.15s}
.ce-card-submit:hover{background:var(--ph);transform:translateY(-1px)}
.ce-card-submit:disabled{opacity:.6;cursor:default;transform:none}
.ce-card-submit:focus-visible{outline:2px solid var(--p);outline-offset:2px}
.ce-card-feedback{font-weight:600;font-size:.86rem}
.ce-card-feedback.err{color:#c02b45}
.ce-card-done{display:flex;align-items:center;gap:.5rem;margin:.9rem 0 0;font-weight:800;
  color:#12864a;background:rgba(23,198,83,.10);border-radius:var(--rad);padding:.6rem .9rem}
.ce-card-done .ce-check{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;
  background:#17C653;color:#fff;font-size:.72rem}
.ce-card.is-done{border-color:rgba(23,198,83,.5);background:rgba(23,198,83,.03)}
.ce-card.is-done .ce-crit-range{opacity:.75;cursor:default}
.ce-card.is-done .ce-crit-range::-webkit-slider-thumb{cursor:default}

/* ---- actions ---- */
.ce-poll-actions{margin:.4rem 0 0}
.ce-poll-submit{display:inline-flex;align-items:center;gap:.5rem;background:var(--p);color:#fff;border:none;
  font-weight:700;font-size:1rem;border-radius:var(--rad);padding:.85rem 1.6rem;cursor:pointer;transition:.15s}
.ce-poll-submit:hover{background:var(--ph);transform:translateY(-1px)}
.ce-poll-submit:disabled{opacity:.6;cursor:default;transform:none}
.ce-poll-submit:focus-visible{outline:2px solid var(--p);outline-offset:2px}
.ce-poll-feedback{margin-top:.8rem;font-weight:600;font-size:.95rem;min-height:1.2em}
.ce-poll-feedback.err{color:#c02b45}
.ce-poll-feedback.ok{color:#12864a}

.ce-poll-note{background:#fff8e5;border:1px solid #f6d878;color:#8a6d1a;padding:.6rem .9rem;border-radius:8px;font-size:.9rem;max-width:720px;margin:1rem auto}

/* ---- QR ---- */
.ce-qr{display:inline-block;text-align:center;background:#fff;border:1px solid var(--border,#EEF0F4);
  border-radius:1rem;padding:1rem 1rem .85rem;box-shadow:var(--shadow,0 12px 34px rgba(0,0,0,.08));margin:1rem auto}
.ce-qr img{width:100%;height:auto;display:block;margin:0 auto;border-radius:.4rem}
.ce-qr figcaption{margin-top:.6rem;font-weight:800;font-size:1rem;letter-spacing:-.01em;
  color:var(--primary,#A860A8);font-family:Inter,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif}
.ce-qr-center{text-align:center}

@media(max-width:600px){
  .ce-poll-inner{padding:1.2rem 1.1rem}
  .ce-poll-title{font-size:1.18rem}
  .ce-card-photo{width:76px;height:76px}
  .ce-card-name{font-size:1.05rem}
}