/* ============================================================================
   Sign-in screen (owner's pick C: the form beside two sample proposals). shared.js mountLogin()
   renders the markup into #authGate; everything is namespaced .spl-* so no page CSS reaches it.
   Light/dark follows the app's sd_theme (<html data-theme>) and, when none is chosen, the OS.
   ============================================================================ */
#authGate.spl-host{padding:0!important;background:var(--spl-bg,#fff)!important;align-items:stretch!important;justify-content:flex-start!important;overflow-y:auto!important}
.spl,#authGate.spl-host{
  --spl-ink:#14161C; --spl-muted:#565A63; --spl-bg:#FFFFFF; --spl-line:#D7DAE0; --spl-btn:#FFFFFF;
  --spl-amber:#F59E0B; --spl-err-bg:#FDECEA; --spl-err:#9A2A14; --spl-navy:#0F172A;
}
[data-theme="dark"] .spl,[data-theme="dark"] #authGate.spl-host{
  --spl-ink:#F1F2F4; --spl-muted:#A6AAB3; --spl-bg:#0F1115; --spl-line:rgba(255,255,255,.2); --spl-btn:#1A1D23;
  --spl-err-bg:rgba(255,105,80,.14); --spl-err:#FFB4A6;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) .spl,:root:not([data-theme="light"]) #authGate.spl-host{
    --spl-ink:#F1F2F4; --spl-muted:#A6AAB3; --spl-bg:#0F1115; --spl-line:rgba(255,255,255,.2); --spl-btn:#1A1D23;
    --spl-err-bg:rgba(255,105,80,.14); --spl-err:#FFB4A6;
  }
}
.spl{flex:1;width:100%;min-height:100%;display:grid;grid-template-columns:minmax(0,.77fr) minmax(0,1fr);font:400 16px/1.5 'Plus Jakarta Sans',system-ui,sans-serif;color:var(--spl-ink);background:var(--spl-bg);text-align:left;-webkit-font-smoothing:antialiased}
:where(.spl) *,:where(.spl) *::before,:where(.spl) *::after{box-sizing:border-box}
:where(.spl) :where(h1,h3,p){margin:0}
:where(.spl) :where(button){font:inherit;color:inherit}
.spl :focus-visible{outline:2px solid var(--spl-amber);outline-offset:2px}

/* ---- the sign-in half ---- */
.spl-side{display:grid;place-items:center;padding:48px 56px}
.spl-inner{width:100%;max-width:400px}
.spl-mark{display:flex;align-items:center;gap:10px;font:800 19px 'Plus Jakarta Sans',sans-serif;letter-spacing:-.01em;margin-bottom:40px}
.spl-mark svg{width:36px;height:36px;flex:none}
.spl-mark b{color:var(--spl-amber);font-weight:800}
.spl-h{font:800 30px/1.15 'Plus Jakarta Sans',sans-serif;letter-spacing:-.02em;text-wrap:balance}
.spl-p{margin-top:10px;color:var(--spl-muted);font-size:16px}
.spl-btn{position:relative;margin-top:30px;width:100%;height:54px;border-radius:12px;border:1px solid var(--spl-line);background:var(--spl-btn);display:flex;align-items:center;justify-content:center;gap:12px;font:700 16px 'Plus Jakarta Sans',sans-serif!important;color:var(--spl-ink)!important;cursor:pointer;box-shadow:0 1px 2px rgba(20,22,28,.06);transition:background .15s,box-shadow .15s,transform .1s}
.spl-btn svg{width:22px;height:22px;flex:none}
.spl-btn:hover{box-shadow:0 4px 14px rgba(20,22,28,.1)}
.spl-btn:active{transform:scale(.99)}
.spl-btn:disabled{cursor:default;opacity:.75}
.spl-btn.busy>svg,.spl-btn.busy>span{visibility:hidden}
.spl-spin{display:none;position:absolute;width:22px;height:22px;border-radius:50%;border:2.5px solid var(--spl-line);border-top-color:var(--spl-amber);animation:splSpin .8s linear infinite}
.spl-btn.busy .spl-spin{display:block}
@keyframes splSpin{to{transform:rotate(360deg)}}
.spl-err{margin-top:14px;padding:11px 14px;border-radius:10px;background:var(--spl-err-bg);color:var(--spl-err);font:600 14px/1.45 'Plus Jakarta Sans',sans-serif}
.spl-err[hidden]{display:none}
.spl-email[hidden]{display:none}
.spl-or{display:flex;align-items:center;gap:12px;margin:22px 0 4px;color:var(--spl-muted);font-size:13px}
.spl-or::before,.spl-or::after{content:"";flex:1;height:1px;background:var(--spl-line)}
.spl-form{display:flex;flex-direction:column;gap:10px;margin-top:12px}
.spl-in{height:48px;border:1px solid var(--spl-line);border-radius:12px;padding:0 14px;background:var(--spl-btn);color:var(--spl-ink);font:500 15px 'Plus Jakarta Sans',sans-serif;outline:0}
.spl-in[hidden]{display:none}
.spl-in:focus{border-color:var(--spl-ink)}
.spl-sub{height:50px;border:0;border-radius:12px;background:var(--spl-ink);color:var(--spl-bg)!important;font:700 15px 'Plus Jakarta Sans',sans-serif!important;cursor:pointer}
.spl-sub:disabled{opacity:.6;cursor:default}
.spl-links{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap}
.spl-lnk{border:0;background:none;padding:4px 0;color:var(--spl-ink);font:600 13.5px 'Plus Jakarta Sans',sans-serif!important;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.spl-msg{margin-top:14px;padding:11px 14px;border-radius:10px;background:rgba(21,128,61,.1);color:#15803D;font:600 14px/1.45 'Plus Jakarta Sans',sans-serif}
.spl-msg[hidden]{display:none}
.spl-fine{margin-top:18px;color:var(--spl-muted);font-size:14px}

/* ---- the showcase half: two sample proposals on navy ---- */
.spl-show{background:var(--spl-navy);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px;overflow:hidden}
.spl-stack{position:relative;width:420px;height:470px}
.spl-card{position:absolute;background:#fff;border-radius:12px;overflow:hidden;box-shadow:0 22px 55px rgba(0,0,0,.35);color:#14161C}
.spl-c1{width:290px;height:400px;left:-48px;top:52px;transform:rotate(-6deg);opacity:.86}
.spl-c2{width:310px;height:430px;right:0;top:10px;transform:rotate(3deg)}
.spl-cv{height:46%;padding:20px;color:#fff;display:flex;flex-direction:column;justify-content:space-between;background:linear-gradient(135deg,#0F766E,#14B8A6)}
.spl-c1 .spl-cv{background:linear-gradient(135deg,#1D4ED8,#60A5FA)}
.spl-cv b{font:800 13px 'Plus Jakarta Sans',sans-serif;letter-spacing:.02em}
.spl-cv h3{font:800 22px/1.15 'Plus Jakarta Sans',sans-serif}
.spl-bd{padding:16px 20px}
.spl-bd>i{display:block;height:8px;border-radius:4px;background:#E5E7EB;margin:8px 0}
.spl-kp{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:14px}
.spl-kp div{background:#F3F4F6;border-radius:8px;padding:8px}
.spl-kp b{display:block;font:800 15px 'Plus Jakarta Sans',sans-serif}
.spl-kp span{font-size:11.5px;color:#6B7280}
.spl-cap{margin-top:34px;color:#CBD5E1;font:600 16px 'Plus Jakarta Sans',sans-serif}
.spl-cap b{color:#FCD34D}

/* ---- phones and small tablets: the sign-in only, no showcase ---- */
@media (max-width:880px){
  .spl{grid-template-columns:1fr}
  .spl-show{display:none}
  .spl-side{place-items:start center;padding:56px 22px 40px}
  .spl-h{font-size:28px}
}
@media (prefers-reduced-motion:reduce){
  .spl *,.spl *::before,.spl *::after{animation:none!important;transition:none!important}
}

/* ===== shared by the designs, proposals and leads lists ===== */
/* Edit / View buttons (owner's pick A) */
.two-btn{height:40px;padding:0 12px;border-radius:var(--r-ctl,10px);border:1px solid var(--border,#D1D5DB);background:var(--card,#fff);color:var(--txt,#111);display:flex;align-items:center;justify-content:center;gap:7px;font:700 13.5px 'Plus Jakarta Sans',sans-serif;cursor:pointer;white-space:nowrap;min-width:0}
.two-btn.dk{background:#111;border-color:#111;color:#fff}
.two-btn:hover{filter:brightness(.96)}.two-btn.dk:hover{filter:brightness(1.25)}
.two-btn:focus-visible{outline:2px solid var(--accent,#111);outline-offset:2px}
/* Grid / List switch and the list (owner's pick 2A): a table on a computer, small cards on a phone */
.vw-tog{display:inline-flex;border:1px solid var(--border,#D1D5DB);border-radius:10px;overflow:hidden;background:var(--card,#fff);flex:none;vertical-align:middle}
.vw-tog button{width:36px;height:34px;border:0;background:none;color:var(--muted,#6B7280);display:grid;place-items:center;cursor:pointer}
.vw-tog button.on{background:var(--txt,#111);color:var(--card,#fff)}
.lt{background:var(--card,#fff);border:1px solid var(--border,#E5E7EB);border-radius:14px;overflow:hidden}
.lt-h,.lt-r{display:grid;grid-template-columns:var(--lt-cols) var(--lt-act,252px);align-items:center;gap:14px;padding:10px 14px}
.lt-h{font:700 11px 'Plus Jakarta Sans',sans-serif;letter-spacing:.06em;text-transform:uppercase;color:var(--muted,#6B7280);background:var(--card2,#F9FAFB);border-bottom:1px solid var(--border,#E5E7EB)}
.lt-r{border-bottom:1px solid var(--border,#EEF0F2);font:500 14px 'Plus Jakarta Sans',sans-serif;cursor:pointer}
.lt-r:last-child{border-bottom:0}.lt-r:hover{background:var(--card2,#F9FAFB)}
.lt-c{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--muted,#6B7280)}.lt-1{color:var(--txt,#111);font-weight:700}
.lt-a{display:flex;gap:6px;align-items:center;justify-content:flex-end}.lt-a .two-btn{height:34px}
@media(max-width:640px){
  .lt{background:none;border:0;display:grid;gap:8px;overflow:visible}.lt-h{display:none}
  .lt-r{display:flex;flex-wrap:wrap;align-items:center;gap:3px 0;background:var(--card,#fff);border:1px solid var(--border,#E5E7EB);border-radius:12px;padding:12px}
  .lt-c{font-size:12.5px}.lt-1{flex:1 1 100%;font-size:15px}.lt-e{display:none}
  .lt-c+.lt-c:not(:nth-child(2))::before{content:'·';margin:0 6px;color:var(--muted,#9CA3AF)}
  .lt-a{flex:1 1 100%;display:grid;grid-template-columns:1fr 1fr;grid-auto-flow:column;grid-auto-columns:auto;margin-top:9px}.lt-a .two-btn{height:38px}
}
