/* Shared: password toggle, theme switch, tech canvas, dark mode. Loaded after site.css / app.css. */
.pwwrap{position:relative;display:block}.pwwrap input{padding-right:2.9rem!important}
.pwtoggle{position:absolute;right:.35rem;top:50%;transform:translateY(-50%);width:2.3rem;height:2.3rem;border:0;background:transparent;color:#5b6785;border-radius:8px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center}
.pwtoggle:hover{background:rgba(34,197,94,.14);color:var(--green-2)}.pwtoggle:focus-visible{outline:3px solid rgba(34,197,94,.55)}
.theme-btn{width:2.5rem;height:2.5rem;border-radius:50%;border:1px solid var(--line);background:transparent;color:inherit;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:background .2s,transform .2s;padding:0;flex:none}
.theme-btn:hover{background:rgba(34,197,94,.14);transform:rotate(18deg)}.theme-btn:focus-visible{outline:3px solid rgba(34,197,94,.55)}
[data-tech]{position:relative;overflow:hidden}.techbg{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}
[data-tech]>*:not(.techbg){position:relative;z-index:1}
html{color-scheme:light}html[data-theme=dark]{color-scheme:dark}
html,body{transition:background-color .25s,color .25s}

/* ---------------- dark mode ---------------- */
html[data-theme=dark]{
  --bg:#0a1122;--card:#111c36;--alt:#0d172c;--ink:#e6ebf7;--muted:#9aa7c7;--line:#233356;--sky:#12233f;--sky-soft:#12233f;
  --green-soft:#0f2b1f;--red-soft:#3a1519;--amber-soft:#3a2d10;--shadow:0 1px 2px rgba(0,0,0,.4),0 12px 32px rgba(0,0,0,.35)}
html[data-theme=dark] body{background:var(--bg);color:var(--ink)}
html[data-theme=dark] h1,html[data-theme=dark] h2,html[data-theme=dark] h3,html[data-theme=dark] h4{color:#fff}
html[data-theme=dark] a{color:#7fb2ff}html[data-theme=dark] a.btn,html[data-theme=dark] .side a,html[data-theme=dark] .brand,html[data-theme=dark] .sf a,html[data-theme=dark] .marquee,html[data-theme=dark] .link{color:inherit}
html[data-theme=dark] .link{color:#7fb2ff}
html[data-theme=dark] input:not([type=checkbox]):not([type=radio]),html[data-theme=dark] select,html[data-theme=dark] textarea{background:#0c1630;color:var(--ink);border-color:#2d4170}
html[data-theme=dark] input::placeholder,html[data-theme=dark] textarea::placeholder{color:#6f7da1}
html[data-theme=dark] input.err,html[data-theme=dark] select.err,html[data-theme=dark] textarea.err{background:#2a1218}
html[data-theme=dark] .combo input.txt{background-color:#0c1630}
html[data-theme=dark] .sh{background:rgba(10,17,34,.9);border-color:var(--line)}
html[data-theme=dark] .sh nav a.l{color:#cfd8f0}html[data-theme=dark] .sh nav a.l.on,html[data-theme=dark] .sh nav a.l:hover{color:var(--green)}
html[data-theme=dark] .hero{background:linear-gradient(135deg,#0a1122 0%,#0d1c3d 60%,#0f2b2a 140%)}
html[data-theme=dark] .hero .img,html[data-theme=dark] .imgcard{border-color:#16264a;background:#111c36}
html[data-theme=dark] .sh ~ main .page-h{background:linear-gradient(135deg,#0d1c3d,#0a1122)}
html[data-theme=dark] .card,html[data-theme=dark] .stat,html[data-theme=dark] .cta{background:var(--card);border-color:var(--line);color:var(--ink)}
html[data-theme=dark] .alt,html[data-theme=dark] section.alt{background:var(--alt)}
html[data-theme=dark] .ico{background:#12301f}
html[data-theme=dark] .notice{background:#10223f;border-color:#244273;color:#d5e1ff}
html[data-theme=dark] .notice.warn{background:var(--amber-soft);border-color:#6b5217;color:#ffe9b3}
html[data-theme=dark] .notice.bad{background:var(--red-soft);border-color:#7a2a31;color:#ffd4d8}
html[data-theme=dark] table th{background:#0d172c;color:#b9c5e6}html[data-theme=dark] table td{border-color:var(--line)}html[data-theme=dark] tr:hover td{background:#0f1b36}
html[data-theme=dark] .tbl-wrap{border-color:var(--line);background:var(--card)}
html[data-theme=dark] .toast{background:#16244a;color:#fff}
html[data-theme=dark] .topbar{background:#08122b}
html[data-theme=dark] .auth-form{background:var(--bg)}
html[data-theme=dark] .progress{background:#1a2a4f}
html[data-theme=dark] .seg label{background:var(--card);color:var(--ink);border-color:#2d4170}
html[data-theme=dark] .seg input:checked + label{background:#0f2b1f}
html[data-theme=dark] .pwtoggle{color:#9aa7c7}
html[data-theme=dark] .btn:not(.green):not(.white):not(.line):not(.line-w){background:#16347f;color:#fff;border-color:#16347f}
html[data-theme=dark] .btn.ghost{background:transparent;color:#cfd8f0;border-color:#2d4170}
html[data-theme=dark] .btn.ghost:hover{background:#142347}
html[data-theme=dark] .btn.line{color:#fff;border-color:#4a5d93}
html[data-theme=dark] .muted,html[data-theme=dark] .hint{color:var(--muted)}
html[data-theme=dark] .badge{filter:brightness(.95)}
html[data-theme=dark] img[src*="logo"]{background:#fff;border-radius:10px}
html[data-theme=dark] .price b,html[data-theme=dark] .band h2{color:#fff}
@media(prefers-reduced-motion:reduce){.theme-btn:hover{transform:none}}

/* ---------------- form polish (portal + website) ---------------- */
.auth-form{position:relative}
form .field>label,.field>label{display:block;font-weight:600;font-size:.88rem;margin-bottom:.35rem;color:var(--ink)}
label.req::after{content:" *";color:var(--red)}
input:not([type]),input[type=text],input[type=email],input[type=password],input[type=tel],input[type=date],input[type=search],input[type=number],input[type=url],select,textarea{
  width:100%;padding:.8rem .95rem;border:1.5px solid #cdd5e6;border-radius:12px;font:inherit;transition:border-color .15s,box-shadow .15s,background .15s}
textarea{min-height:104px;resize:vertical;line-height:1.5}
input:hover,select:hover,textarea:hover{border-color:#a9b6d6}
input:focus,select:focus,textarea:focus{border-color:var(--green-2);box-shadow:0 0 0 4px rgba(34,197,94,.2)}
input[type=file]{width:100%;padding:.7rem;border:1.5px dashed #b6c3e2;border-radius:12px;background:rgba(34,197,94,.05);font:inherit;cursor:pointer}
input[type=file]::file-selector-button{margin-right:.8rem;border:0;border-radius:8px;background:var(--navy);color:#fff;padding:.5rem .9rem;font-weight:600;cursor:pointer}
.field .hint{font-size:.8rem;color:var(--muted);margin-top:.3rem}.field .err{font-size:.82rem;color:var(--red);margin-top:.3rem;font-weight:600}
.field.bad input,.field.bad select,.field.bad textarea{border-color:var(--red);background:var(--red-soft)}
.fgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 1.1rem}@media(max-width:620px){.fgrid{grid-template-columns:1fr}}
form .btn.block,.btn.lg{padding:.9rem 1.2rem;font-size:1rem}
.check{padding:.75rem .9rem;border:1.5px solid var(--line);border-radius:12px;background:rgba(34,197,94,.04)}
.card form>.btn[type=submit],.card form button.btn.green:last-child{margin-top:.4rem}
html[data-theme=dark] input,html[data-theme=dark] select,html[data-theme=dark] textarea{border-color:#2d4170}
html[data-theme=dark] input:hover,html[data-theme=dark] select:hover,html[data-theme=dark] textarea:hover{border-color:#456099}
html[data-theme=dark] input[type=file]{background:rgba(34,197,94,.07);border-color:#3a4f82}
html[data-theme=dark] .check{background:rgba(34,197,94,.06)}
html[data-theme=dark] form .field>label,html[data-theme=dark] .field>label{color:#dbe3f7}

/* auto: text that is navy in light mode becomes light in dark mode */
html[data-theme=dark] .burger,html[data-theme=dark] .combo .opt.other,html[data-theme=dark] .field label,html[data-theme=dark] .info b,html[data-theme=dark] .lbl,html[data-theme=dark] .link,html[data-theme=dark] .price b,html[data-theme=dark] .stat .n,html[data-theme=dark] .stepper .cur,html[data-theme=dark] .steps b,html[data-theme=dark] label{color:#e6ebf7}
html[data-theme=dark] .info{background:transparent;border:0}html[data-theme=dark] .info b{color:#fff}
html[data-theme=dark] .cgrid .social a{background:#16347f;border:1px solid #3a4f82}
html[data-theme=dark] .phone .cc{background:#16347f;color:#fff;border-color:#2d4170}

/* dark mode for the new website components */
html[data-theme=dark] .chip,html[data-theme=dark] .job-card,html[data-theme=dark] .faq details,html[data-theme=dark] .job-filter input,html[data-theme=dark] .job-filter select{background:var(--card,#101a33);color:inherit;border-color:rgba(255,255,255,.14)}
html[data-theme=dark] .chip,html[data-theme=dark] .faq summary,html[data-theme=dark] .job-doc .lead-p,html[data-theme=dark] .hero-stats b,html[data-theme=dark] .job-img .tag{color:#e8eeff}
html[data-theme=dark] .job-img .tag{background:rgba(16,26,51,.92)}
html[data-theme=dark] .sv-card .ico{border-color:var(--card,#101a33)}
html[data-theme=dark] .callout{background:rgba(34,197,94,.1)}