/* JCI Zone Conference — phone first. Volunteers use this on a phone at 11pm. */
:root{
  --zc-navy:#0b2545; --zc-blue:#134074; --zc-accent:#1b6ca8;
  --zc-bg:#f4f6f9; --zc-line:#e3e8ef; --zc-gold:#fff8e6; --zc-gold-line:#f0dfa8;
}
body{background:var(--zc-bg);-webkit-tap-highlight-color:transparent;}
.min-w-0{min-width:0}

.zc-nav{background:var(--zc-navy)}
.zc-main{padding-bottom:78px;max-width:960px}

/* ---- bottom tabs: 5 screens, thumb reachable ---- */
.zc-tabs{
  position:fixed;bottom:0;left:0;right:0;z-index:1030;
  display:flex;background:#fff;border-top:1px solid var(--zc-line);
  padding-bottom:env(safe-area-inset-bottom);
}
.zc-tab{
  flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;
  padding:8px 2px 6px;text-decoration:none;color:#7a869a;font-size:.68rem;
}
.zc-tab svg{width:21px;height:21px}
.zc-tab.on{color:var(--zc-accent);font-weight:600}

/* ---- cards ---- */
.zc-box{background:#fff;border:1px solid var(--zc-line);border-radius:10px;padding:12px}
.zc-box-h{font-size:.7rem;text-transform:uppercase;letter-spacing:.04em;color:#8492a6;font-weight:600;margin-bottom:4px}
.zc-gold{background:var(--zc-gold);border-color:var(--zc-gold-line)}

/* ---- the headline stats. every one is a link. ---- */
.zc-stat{
  display:block;background:#fff;border:1px solid var(--zc-line);border-radius:10px;
  padding:10px 8px;text-decoration:none;color:inherit;height:100%;
}
.zc-stat:active{background:#eef2f7}
.zc-stat-l{display:block;font-size:.68rem;text-transform:uppercase;letter-spacing:.03em;color:#8492a6;font-weight:600}
.zc-stat-n{display:block;font-size:1.6rem;font-weight:700;line-height:1.15;color:var(--zc-navy)}
.zc-stat-s{display:block;font-size:.7rem;color:#8492a6}

.zc-kv{list-style:none;margin:0;padding:0;font-size:.82rem}
.zc-kv li{display:flex;justify-content:space-between;padding:3px 0;border-bottom:1px dashed var(--zc-line)}
.zc-kv li:last-child{border:0}
.zc-kv a{text-decoration:none;color:#5a6b82}
.zc-kv.zc-warn b,.zc-kv li.zc-warn b{color:#b45309}

.zc-t td,.zc-t th{padding:.4rem .35rem;vertical-align:middle}
.zc-t th{font-size:.68rem;text-transform:uppercase;color:#8492a6;font-weight:600}
.zc-t a{text-decoration:none}
.zc-late{background:#fff4f4}

/* ---- status pills ---- */
.badge[class*="zc-s-"]{font-weight:600;font-size:.65rem}
.zc-s-new{background:#e7ecf3;color:#54657e}
.zc-s-contacted{background:#dbeafe;color:#1e40af}
.zc-s-interested{background:#fef3c7;color:#92400e}
.zc-s-not_interested{background:#f1f5f9;color:#94a3b8}
.zc-s-link_sent{background:#e0e7ff;color:#3730a3}
.zc-s-submitted{background:#fed7aa;color:#9a3412}
.zc-s-confirmed{background:#d1fae5;color:#065f46}

/* ---- person ---- */
.zc-avatar{width:64px;height:64px;border-radius:10px;object-fit:cover;flex-shrink:0;border:1px solid var(--zc-line)}
.zc-avatar-blank{display:flex;align-items:center;justify-content:center;background:var(--zc-blue);color:#fff;font-size:1.5rem;font-weight:600}
.zc-timeline{list-style:none;margin:0;padding:0 0 0 14px;border-left:2px solid var(--zc-line)}
.zc-timeline li{position:relative;padding:0 0 12px 10px}
.zc-timeline li:before{content:"";position:absolute;left:-19px;top:5px;width:8px;height:8px;border-radius:50%;background:var(--zc-accent)}

/* ---- reimbursement: amber until acknowledged ---- */
.zc-reimb{border:1px solid var(--zc-line);border-radius:8px;padding:10px;margin-bottom:8px}
.zc-reimb-act{border-color:#f0c674;background:#fffbf0}

/* ---- QR ---- */
.zc-qr{width:min(260px,72vw);height:auto;border:1px solid var(--zc-line);border-radius:10px;background:#fff;cursor:pointer}
.zc-qr-big{width:min(420px,94vw)}
.zc-refcode{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:1.5rem;font-weight:700;letter-spacing:.16em;color:var(--zc-navy);margin-top:8px}
.zc-upi-qr{width:min(220px,60vw);border:1px solid var(--zc-line);border-radius:8px;background:#fff;padding:6px}

/* ---- public form ---- */
.zc-public{background:var(--zc-bg)}
.zc-public-head{background:#fff;color:#12312b;padding:12px 0;border-bottom:1px solid #e6e0d0}
.zc-prev-img{max-height:150px;border-radius:8px;border:1px solid var(--zc-line)}
.zc-regno{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:1.7rem;font-weight:700;letter-spacing:.08em;color:var(--zc-navy);background:var(--zc-bg);border-radius:8px;padding:12px}

.zc-centre{min-height:100vh;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(180deg,#faf7ef,#f2ede0);padding:16px}
.zc-card-wrap{width:100%;max-width:380px}

/* Inputs at 16px — anything smaller makes iOS zoom on focus */
.form-control,.form-select{font-size:16px}
@media(min-width:768px){.form-control,.form-select{font-size:.95rem}}

.nav-pills .nav-link{padding:.25rem .7rem;font-size:.82rem;border-radius:20px}
.nav-pills .nav-link.active{background:var(--zc-accent)}
.btn-primary{background:var(--zc-accent);border-color:var(--zc-accent)}

/* ============ registration wizard ============ */
.zc-steps{display:flex;gap:4px;margin-bottom:8px}
.zc-step{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;font-size:.68rem;color:#9aa7b8}
.zc-step span{width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  background:#e7ecf3;color:#8492a6;font-weight:700;font-size:.78rem;transition:.2s}
.zc-step.on{color:var(--zc-accent);font-weight:600}
.zc-step.on span{background:var(--zc-accent);color:#fff;transform:scale(1.1)}
.zc-step.done span{background:#22c55e;color:#fff}
.zc-step.done span:after{content:"✓";font-size:.8rem}
.zc-step.done span{font-size:0}

.zc-pane{animation:zcIn .22s ease}
@keyframes zcIn{from{opacity:0;transform:translateX(8px)}to{opacity:1;transform:none}}

.zc-chips{display:flex;gap:6px;flex-wrap:wrap}
.zc-chip input{position:absolute;opacity:0;pointer-events:none}
.zc-chip span{display:inline-block;padding:8px 14px;border:1.5px solid var(--zc-line);border-radius:20px;
  font-size:.88rem;cursor:pointer;transition:.15s;background:#fff}
.zc-chip input:checked + span{border-color:var(--zc-accent);background:#e8f2fb;color:var(--zc-accent);font-weight:600}

.zc-invite{display:flex;align-items:center;gap:10px;background:#e8f6ec;border:1px solid #b7e0c4;
  border-radius:10px;padding:8px 12px;margin-bottom:12px}
.zc-invite-av{width:38px;height:38px;border-radius:50%;background:var(--zc-blue);color:#fff;
  display:flex;align-items:center;justify-content:center;font-weight:700;flex-shrink:0}

.zc-prev-round{width:120px;height:120px;border-radius:50%;object-fit:cover;border:3px solid #22c55e}

/* ============ done + navigator ============ */
.zc-celebrate{background:#fff;border:1px solid var(--zc-line);border-radius:12px;padding:24px 16px;text-align:center}
.zc-tick{width:56px;height:56px;border-radius:50%;background:#22c55e;color:#fff;font-size:1.9rem;
  display:flex;align-items:center;justify-content:center;margin:0 auto 10px;animation:zcPop .35s ease}
@keyframes zcPop{0%{transform:scale(0)}70%{transform:scale(1.15)}100%{transform:scale(1)}}

.zc-nav-cta{border:2px solid #f0c674;background:linear-gradient(180deg,#fffdf5,#fff8e6)}
.zc-perks{list-style:none;padding:0;margin:0}
.zc-perks li{display:flex;gap:10px;padding:8px 0;border-bottom:1px dashed var(--zc-line)}
.zc-perks li:last-child{border:0}
.zc-perks span{font-size:1.2rem;flex-shrink:0}

/* ============ dark public pages (register / done) ============ */
.zc-dark{background:#0a1d1a;color:#ece6d8}
.zc-dark .zc-public-head{background:#0f2a26;border-bottom:1px solid #17403a}
.zc-dark .card{background:#0f2a26;border:1px solid #17403a;color:#ece6d8}
.zc-dark .form-label{color:#ece6d8}
.zc-dark .form-control,.zc-dark .form-select{
  background:#0a1d1a;border-color:#17403a;color:#ece6d8}
.zc-dark .form-control::placeholder{color:#7f8f89}
.zc-dark .form-control:focus,.zc-dark .form-select:focus{
  background:#0a1d1a;border-color:#c8952e;color:#ece6d8;box-shadow:0 0 0 2px rgba(200,149,46,.25)}
.zc-dark .bg-light{background:#0a1d1a !important;color:#ece6d8}
.zc-dark .text-muted{color:#9aa8a2 !important}
.zc-dark .input-group-text{background:#0a1d1a;border-color:#17403a;color:#9aa8a2}
.zc-dark .btn-outline-secondary{color:#c8952e;border-color:#17403a}
.zc-dark .btn-primary{background:#c8952e;border-color:#c8952e;color:#0a1d1a;font-weight:700}
.zc-dark .btn-primary:hover{background:#e9c46a;border-color:#e9c46a;color:#0a1d1a}
.zc-dark .zc-regno{background:#0a1d1a;color:#e9c46a}
.zc-dark .zc-celebrate{background:#0f2a26;border-color:#17403a}
.zc-dark .zc-nav-cta{border-color:#c8952e;background:linear-gradient(180deg,#132f2a,#0f2a26)}
.zc-dark .zc-invite{background:#123a2c;border-color:#1c5a44}
.zc-dark .btn-warning{background:#c8952e;border-color:#c8952e;color:#0a1d1a}
.zc-dark .zc-steps .zc-step.on span{background:#c8952e;color:#0a1d1a}
.zc-dark .zc-steps .zc-step.on{color:#c8952e}
.zc-dark .zc-steps .zc-step.done span{background:#2a9d6f}
.zc-dark .zc-chip span{background:#0a1d1a;border-color:#17403a;color:#ece6d8}
.zc-dark .zc-chip input:checked + span{border-color:#c8952e;background:rgba(200,149,46,.15);color:#e9c46a}
.zc-dark .progress{background:#17403a}
.zc-dark .zc-prev-round{border-color:#2a9d6f}
.zc-dark details summary{color:#c8952e}

/* brass download button inside the app (QR screens) */
.btn-brass-app{background:#c8952e;border:none;color:#0a1d1a;font-weight:700}
.btn-brass-app:hover{background:#e9c46a;color:#0a1d1a}

/* Qissa logo on the dark register header */
.pub-logo{height:40px;width:auto;background:transparent;padding:0;display:block}
.zc-centre .zc-card-wrap .card img[alt="Qissa"]{background:transparent;padding:0}

/* light theme: register/public pages on warm paper to match the site */
body.zc-public{background:#faf7ef}