/* ==========================================================================
   Veritas One — the EC / sub registrar chooser.

   Opens when a request for an encumbrance certificate (or a certified copy)
   arrives without enough to search on. Same design system as the chat card
   (LandLens orange #ff6725, Inter Tight display, Inter UI, JetBrains Mono for
   codes and numbers), and self-contained: every token it needs is declared
   here, because the modal is lifted to <body> and so sits outside .sv.

   Layout: a rail of the ways a person can identify a property on the left,
   that way's fields on the right, and a readback of the assembled search
   above the button, so what is approved is never vaguer than what runs.
   Under 860px the rail becomes a scroll-snapped row and the panel a sheet.
   ========================================================================== */

/* --------------------------------------------------------------------------
   The card inside the answer that opens the chooser. It lives in the chat
   thread, so it inherits the .sv tokens and is sized like the approval card
   it will be replaced by.
   -------------------------------------------------------------------------- */
.sv-pick{
  display:flex;align-items:center;gap:11px;margin-top:12px;padding:11px 13px;
  border:1px solid var(--sv-stroke-2,#e3e7ed);border-radius:14px;background:var(--sv-white,#fff);
  box-shadow:0 2px 10px rgba(17,24,39,.04);
}
.sv-pick-ic{
  flex:none;width:30px;height:30px;border-radius:9px;color:#fff;
  background:linear-gradient(135deg,#ff6725,#e55a1c);
  display:flex;align-items:center;justify-content:center;box-shadow:0 3px 10px rgba(255,103,37,.28);
}
.sv-pick-ic svg{width:17px;height:17px;}
.sv-pick-t{flex:1;min-width:0;font-size:11px;line-height:1.45;color:var(--sv-sec,#6b7280);}
.sv-pick-t b{display:block;font-size:12.5px;font-weight:600;color:var(--sv-text,#111827);line-height:1.35;margin-bottom:1px;}
.sv-pick-go{
  flex:none;border:none;cursor:pointer;border-radius:9999px;padding:8px 15px;
  font-size:12px;font-weight:600;color:#fff;background:linear-gradient(135deg,#ff6725,#e55a1c);
  box-shadow:0 4px 12px rgba(255,103,37,.28);white-space:nowrap;
}
.sv-pick-go:focus-visible{outline:2px solid #c2491a;outline-offset:2px;}
@media (max-width:560px){
  .sv-pick{flex-wrap:wrap;}
  .sv-pick-go{width:100%;}
}

.sv-ecp{
  --e-primary:#ff6725; --e-primary-600:#e55a1c; --e-primary-700:#c2491a;
  --e-primary-50:#fff7f2; --e-primary-100:#ffe9dd;
  --e-text:#111827; --e-body:#374151; --e-sec:#6b7280; --e-muted:#9ca3af;
  --e-bg-2:#f9fafb; --e-bg-3:#f4f5f8; --e-white:#fff;
  --e-stroke:#e5e7eb; --e-stroke-2:#e3e7ed; --e-stroke-3:#d7dde5; --e-stroke-4:#eceff4;
  --e-err:#dc2626;
  --e-font-display:"Inter Tight",system-ui,sans-serif;
  --e-font-ui:"Inter","Inter Tight",system-ui,sans-serif;
  --e-font-mono:"JetBrains Mono","SF Mono",ui-monospace,monospace;
  --e-ease-out:cubic-bezier(.16,1,.3,1);
  --e-grad:linear-gradient(135deg,#ff6725,#e55a1c);

  position:fixed;inset:0;z-index:2000000;
  display:flex;align-items:center;justify-content:center;padding:20px;
  background:rgba(15,18,20,.5);
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
  font-family:var(--e-font-ui);color:var(--e-body);
  animation:sv-ecp-fade .18s ease;
  -webkit-tap-highlight-color:transparent;
}
.sv-ecp *,.sv-ecp *::before,.sv-ecp *::after{box-sizing:border-box;}
@keyframes sv-ecp-fade{from{opacity:0}to{opacity:1}}
@keyframes sv-ecp-pop{from{opacity:0;transform:translateY(12px) scale(.985)}to{opacity:1;transform:none}}

.sv-ecp-panel{
  position:relative;display:flex;flex-direction:column;
  width:min(880px,96vw);max-height:92vh;
  background:
    radial-gradient(720px 300px at 88% -10%,rgba(255,103,37,.07),transparent 62%),
    var(--e-white);
  border-radius:20px;
  box-shadow:0 24px 60px rgba(0,0,0,.28),0 2px 8px rgba(17,24,39,.06);
  overflow:hidden;
  animation:sv-ecp-pop .24s var(--e-ease-out);
}

/* ---------- head ---------- */
.sv-ecp-head{display:flex;align-items:flex-start;gap:12px;padding:16px 18px 14px;border-bottom:1px solid var(--e-stroke-4);}
.sv-ecp-ic{flex:none;width:34px;height:34px;border-radius:11px;background:var(--e-grad);color:#fff;
  display:flex;align-items:center;justify-content:center;box-shadow:0 5px 14px rgba(255,103,37,.3);}
.sv-ecp-ic svg{width:19px;height:19px;}
.sv-ecp-htxt{min-width:0;flex:1;}
.sv-ecp-title{font-family:var(--e-font-display);font-size:17px;font-weight:700;letter-spacing:-.02em;color:var(--e-text);line-height:1.25;}
.sv-ecp-sub{margin-top:3px;font-size:12px;line-height:1.45;color:var(--e-sec);}
.sv-ecp-x{flex:none;width:30px;height:30px;border:none;background:var(--e-bg-3);border-radius:9px;
  font-size:18px;line-height:1;color:var(--e-sec);cursor:pointer;transition:background .15s,color .15s;}
.sv-ecp-x:hover{background:var(--e-stroke-4);color:var(--e-text);}

/* ---------- body: rail + pane ---------- */
.sv-ecp-body{display:grid;grid-template-columns:232px minmax(0,1fr);min-height:0;flex:1;}
/* one way in (a certified copy): no rail, and a panel sized to its own fields */
.sv-ecp-panel.is-solo{width:min(560px,96vw);}
.sv-ecp-panel.is-solo .sv-ecp-body{grid-template-columns:minmax(0,1fr);}
.sv-ecp-rail{
  display:flex;flex-direction:column;gap:6px;padding:14px;
  background:var(--e-bg-2);border-right:1px solid var(--e-stroke-4);overflow-y:auto;
}
.sv-ecp-rail-lbl{font-size:9.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--e-muted);padding:2px 4px 4px;}
.sv-ecp-mode{
  display:flex;align-items:center;gap:10px;width:100%;text-align:left;cursor:pointer;
  padding:9px 10px;border-radius:12px;
  border:1px solid transparent;background:transparent;
  transition:background .16s,border-color .16s,box-shadow .16s;
}
.sv-ecp-mode:hover{background:var(--e-white);border-color:var(--e-stroke-4);}
.sv-ecp-mode-ic{flex:none;width:28px;height:28px;border-radius:9px;background:var(--e-white);
  border:1px solid var(--e-stroke-3);color:var(--e-sec);display:flex;align-items:center;justify-content:center;
  transition:background .16s,color .16s,border-color .16s;}
.sv-ecp-mode-ic svg{width:15px;height:15px;}
.sv-ecp-mode-t{min-width:0;display:flex;flex-direction:column;gap:1px;}
.sv-ecp-mode-t b{font-size:12.5px;font-weight:600;color:var(--e-text);line-height:1.3;}
.sv-ecp-mode-t span{font-size:11px;color:var(--e-sec);line-height:1.35;}
.sv-ecp-mode.is-on{background:var(--e-white);border-color:rgba(255,103,37,.32);box-shadow:0 2px 10px rgba(255,103,37,.10);}
.sv-ecp-mode.is-on .sv-ecp-mode-ic{background:var(--e-grad);border-color:transparent;color:#fff;box-shadow:0 3px 9px rgba(255,103,37,.3);}
.sv-ecp-mode.is-on .sv-ecp-mode-t b{color:var(--e-primary-700);}
.sv-ecp-mode:focus-visible{outline:2px solid var(--e-primary-700);outline-offset:2px;}

.sv-ecp-pane{padding:16px 18px;overflow-y:auto;min-height:0;}
.sv-ecp-pane-h{font-size:12.5px;line-height:1.5;color:var(--e-sec);margin-bottom:13px;}
.sv-ecp-pane-h b{color:var(--e-text);font-weight:600;}

/* ---------- fields ---------- */
.sv-ecp-row{display:grid;gap:10px;margin-bottom:11px;}
.sv-ecp-row.c2{grid-template-columns:1fr 1fr;}
.sv-ecp-row.c3{grid-template-columns:1fr 1fr 1fr;}
.sv-ecp-f{display:flex;flex-direction:column;gap:5px;min-width:0;}
.sv-ecp-f label{font-size:9.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--e-muted);}
.sv-ecp-f select,.sv-ecp-f input{
  width:100%;height:38px;padding:0 11px;
  font-family:var(--e-font-ui);font-size:12.5px;color:var(--e-text);
  background:var(--e-white);border:1px solid var(--e-stroke-3);border-radius:10px;
  transition:border-color .15s,box-shadow .15s,background .15s;
}
.sv-ecp-f select{
  cursor:pointer;appearance:none;-webkit-appearance:none;padding-right:30px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 9px center;background-size:14px;
}
.sv-ecp-f input.mono{font-family:var(--e-font-mono);letter-spacing:.01em;}
.sv-ecp-f select:focus,.sv-ecp-f input:focus{outline:none;border-color:rgba(255,103,37,.55);box-shadow:0 0 0 3px rgba(255,103,37,.15);}
/* background-color, not the shorthand: the shorthand would erase the chevron */
.sv-ecp-f select:disabled,.sv-ecp-f input:disabled{background-color:var(--e-bg-3);color:var(--e-muted);cursor:not-allowed;}
.sv-ecp-f .hint{font-size:10.5px;color:var(--e-muted);line-height:1.4;}
/* a value that arrived from what the person already typed in the chat */
.sv-ecp-f .kept{display:inline-flex;align-items:center;gap:4px;font-size:9.5px;font-weight:600;color:var(--e-primary-700);}
.sv-ecp-f .kept::before{content:'';width:5px;height:5px;border-radius:50%;background:var(--e-primary);}

/* rural / town switch inside the revenue-village way */
.sv-ecp-segs{display:inline-flex;background:var(--e-bg-3);border-radius:10px;padding:3px;gap:2px;margin-bottom:12px;}
.sv-ecp-seg{border:none;background:transparent;border-radius:8px;padding:6px 12px;font-size:11.5px;font-weight:600;
  color:var(--e-sec);cursor:pointer;transition:background .15s,color .15s;}
.sv-ecp-seg:hover{color:var(--e-text);}
.sv-ecp-seg.is-on{background:var(--e-primary);color:#fff;box-shadow:0 2px 6px rgba(255,103,37,.3);}

/* map way: the pin card */
.sv-ecp-pick{display:flex;align-items:center;gap:12px;padding:13px 14px;border:1px dashed var(--e-stroke-3);
  border-radius:14px;background:var(--e-bg-2);margin-bottom:12px;}
.sv-ecp-pick-t{flex:1;min-width:0;font-size:12px;color:var(--e-sec);line-height:1.45;}
.sv-ecp-pick-t b{display:block;font-size:12.5px;font-weight:600;color:var(--e-text);margin-bottom:2px;}
.sv-ecp-pin{flex:none;border:none;cursor:pointer;border-radius:9999px;padding:9px 15px;font-size:12px;font-weight:600;
  color:#fff;background:var(--e-grad);box-shadow:0 4px 12px rgba(255,103,37,.28);
  display:inline-flex;align-items:center;gap:6px;white-space:nowrap;}
.sv-ecp-pin svg{width:14px;height:14px;}
.sv-ecp-pin:disabled{opacity:.65;cursor:default;box-shadow:none;}
.sv-ecp-found{border:1px solid rgba(255,103,37,.3);background:var(--e-primary-50);border-radius:14px;padding:11px 13px;margin-bottom:12px;}
.sv-ecp-found-h{display:flex;align-items:center;gap:7px;font-size:11px;font-weight:700;letter-spacing:.04em;
  text-transform:uppercase;color:var(--e-primary-700);margin-bottom:8px;}
.sv-ecp-found-h svg{width:14px;height:14px;}
.sv-ecp-found-g{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:8px 14px;}
.sv-ecp-found-c{display:flex;flex-direction:column;gap:1px;min-width:0;}
.sv-ecp-found-c .k{font-size:9.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--e-muted);}
.sv-ecp-found-c .v{font-size:12.5px;font-weight:600;color:var(--e-text);overflow-wrap:anywhere;}
.sv-ecp-found-c .v.mono{font-family:var(--e-font-mono);}

.sv-ecp-note{font-size:11.5px;line-height:1.5;color:var(--e-sec);background:var(--e-bg-2);
  border:1px solid var(--e-stroke-4);border-radius:11px;padding:9px 11px;margin-top:2px;}
.sv-ecp-err{font-size:11.5px;line-height:1.5;color:var(--e-err);margin-top:8px;}
.sv-ecp-load{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--e-sec);padding:6px 0;}
.sv-ecp-dot{width:7px;height:7px;border-radius:50%;background:var(--e-primary);animation:sv-ecp-pulse 1s ease-in-out infinite;}
@keyframes sv-ecp-pulse{0%,100%{opacity:.35;transform:scale(.8)}50%{opacity:1;transform:scale(1.15)}}

/* ---------- foot: readback + go ---------- */
.sv-ecp-foot{display:flex;align-items:center;gap:14px;padding:13px 18px;border-top:1px solid var(--e-stroke-4);
  background:var(--e-white);flex-wrap:wrap;}
.sv-ecp-read{flex:1;min-width:180px;font-size:11.5px;line-height:1.5;color:var(--e-sec);}
.sv-ecp-read b{color:var(--e-text);font-weight:600;}
.sv-ecp-read .mono{font-family:var(--e-font-mono);color:var(--e-text);}
.sv-ecp-go{flex:none;border:none;cursor:pointer;border-radius:9999px;padding:11px 20px;
  font-size:13px;font-weight:600;color:#fff;background:var(--e-grad);
  box-shadow:0 5px 16px rgba(255,103,37,.3);display:inline-flex;align-items:center;gap:7px;
  transition:transform .15s var(--e-ease-out),box-shadow .15s,opacity .15s;}
.sv-ecp-go svg{width:14px;height:14px;}
.sv-ecp-go:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 8px 20px rgba(255,103,37,.34);}
.sv-ecp-go:disabled{opacity:.45;cursor:not-allowed;box-shadow:none;}
.sv-ecp-go:focus-visible{outline:2px solid var(--e-primary-700);outline-offset:2px;}

/* --------------------------------------------------------------------------
   The console (One Map) skin. The whole chooser derives from the --e-* tokens
   above, so the ink variant is one redefinition. Reached two ways: on One Map
   itself body.om-page contains the lifted overlay (.om-page .sv-ecp); on a
   re-hosted chat the picker JS stamps om-page onto the overlay it lifts
   (.sv-ecp.om-page).
   -------------------------------------------------------------------------- */
.om-page .sv-ecp,
.sv-ecp.om-page{
  --e-text:#eef1f6; --e-body:#cbd3de; --e-sec:#aab3c2; --e-muted:#7d8896;
  --e-bg-2:#1b212b; --e-bg-3:#232a37; --e-white:#13171e;
  --e-stroke:#2a333e; --e-stroke-2:#2a333e; --e-stroke-3:#303b49; --e-stroke-4:#232a37;
  --e-err:#ffb9a2;
  --e-primary-50:rgba(255,103,37,.10); --e-primary-100:rgba(255,103,37,.16);
  --e-primary-700:#ff8e52;
  background:rgba(10,13,18,.6);
}
.om-page .sv-ecp .sv-ecp-panel,
.sv-ecp.om-page .sv-ecp-panel{
  border:1px solid #2a333e;
  box-shadow:0 24px 60px rgba(0,0,0,.55),0 2px 8px rgba(0,0,0,.3);
}
/* the select chevron is a data-URI with a light-host grey stroke */
.om-page .sv-ecp .sv-ecp-f select,
.sv-ecp.om-page .sv-ecp-f select{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23aab3c2' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
}

/* ---------- tablet / mobile ---------- */
@media (max-width:860px){
  .sv-ecp{padding:0;align-items:flex-end;}
  .sv-ecp-panel{width:100%;max-width:none;max-height:94dvh;border-radius:20px 20px 0 0;}
  .sv-ecp-body{grid-template-columns:minmax(0,1fr);}
  .sv-ecp-rail{
    flex-direction:row;gap:8px;padding:11px 14px;overflow-x:auto;overflow-y:hidden;
    border-right:none;border-bottom:1px solid var(--e-stroke-4);
    scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;scrollbar-width:none;
  }
  .sv-ecp-rail::-webkit-scrollbar{display:none;}
  .sv-ecp-rail-lbl{display:none;}
  .sv-ecp-mode{width:auto;flex:none;scroll-snap-align:start;padding:8px 12px 8px 9px;background:var(--e-white);border-color:var(--e-stroke-4);}
  .sv-ecp-mode-t span{display:none;}
  .sv-ecp-mode-t b{white-space:nowrap;}
}
@media (max-width:560px){
  .sv-ecp-head{padding:14px 15px 12px;}
  .sv-ecp-title{font-size:16px;}
  .sv-ecp-pane{padding:14px 15px;}
  .sv-ecp-row.c3{grid-template-columns:1fr 1fr;}
  .sv-ecp-row.c3 .sv-ecp-f:only-child{grid-column:1/-1;}
  .sv-ecp-foot{padding:12px 15px calc(12px + env(safe-area-inset-bottom));gap:10px;}
  .sv-ecp-read{flex:1 1 100%;order:1;}
  .sv-ecp-go{order:2;width:100%;justify-content:center;}
  .sv-ecp-pick{flex-direction:column;align-items:stretch;gap:10px;}
  .sv-ecp-pin{width:100%;justify-content:center;}
}
@media (max-width:400px){
  .sv-ecp-row.c2,.sv-ecp-row.c3{grid-template-columns:minmax(0,1fr);}
}
@media (prefers-reduced-motion:reduce){
  .sv-ecp,.sv-ecp-panel{animation:none;}
  .sv-ecp-go:hover:not(:disabled){transform:none;}
  .sv-ecp-dot{animation:none;opacity:1;}
}
