﻿/* Login page. Colours and fonts come from style.css */
.auth{min-height:100vh;min-height:100dvh;display:grid;place-items:center;padding:16px;background:radial-gradient(70% 60% at 15% 10%,#d9f3ea,transparent),radial-gradient(60% 60% at 90% 90%,#cdeee9,transparent),#eef9f5}
.auth-card{width:min(1060px,100%);min-height:min(640px,calc(100dvh - 32px));display:grid;grid-template-columns:1fr 1.08fr;gap:12px;padding:12px;background:#fff;border-radius:30px;box-shadow:0 40px 90px -40px rgba(10,47,44,.45);animation:cardIn .9s var(--ease) both}
@keyframes cardIn{from{opacity:0;transform:translateY(26px) scale(.98)}}

/* left panel */
.auth-art{position:relative;overflow:hidden;border-radius:22px;background:var(--dark);color:#fff;padding:26px 30px 34px;display:flex;flex-direction:column;justify-content:space-between;gap:40px;isolation:isolate}
.auth-art .b1{width:72%;aspect-ratio:1;right:-22%;top:-12%;background:var(--brand);animation:driftA 13s ease-in-out infinite alternate}
.auth-art .b2{width:56%;aspect-ratio:1;right:-14%;top:34%;background:var(--brand-2);animation:driftB 16s ease-in-out infinite alternate}
.auth-art .b3{width:30%;aspect-ratio:1;right:6%;top:14%;background:#d6f5e9;opacity:.75;animation:driftC 11s ease-in-out infinite alternate}
.auth-art::after{content:"";position:absolute;z-index:-1;inset:45% 0 0;background:linear-gradient(0deg,rgba(10,47,44,.92),transparent)}
.auth-logo{width:max-content;transition:transform .4s var(--ease)}
.auth-logo:hover{transform:scale(1.04)}
.auth-logo img{display:block;width:auto;height:128px;margin-left:-10px;background:none;object-fit:contain}
.auth-copy p{font-size:15px;font-weight:500;margin-bottom:12px;color:rgba(255,255,255,.88)}
.auth-copy h2{font-size:clamp(26px,3vw,36px);line-height:1.16;letter-spacing:-.03em}

/* right panel */
.auth-main{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:10px 24px}
.auth-form{width:min(380px,100%);display:grid;gap:11px}
.auth-mark{position:relative;display:block;width:48px;height:48px;border-radius:50%;background:var(--dark);overflow:hidden}
.auth-mark img{position:absolute;width:96px;height:auto;max-width:none;left:-23.600px;top:.400px;background:none}
.auth-form h1{font-size:34px;letter-spacing:-.035em;line-height:1.1;margin-top:4px}
.auth-sub{color:#5b6764;font-size:15px;line-height:1.5;margin-bottom:6px}
.auth-form>label{display:grid;gap:7px;font-size:15px;font-weight:600}
.auth-form input[type=password],.auth-form input[type=text]{width:100%;font:inherit;font-size:16px;font-weight:400;padding:13px 16px;border:1.5px solid #d5e0dc;border-radius:13px;outline:0;background:#fff;transition:border-color .25s,box-shadow .25s}
.auth-form input:focus{border-color:var(--brand);box-shadow:0 0 0 4px rgba(29,170,158,.18)}
.pw{position:relative;display:block}
.pw input{padding-right:52px!important}
.pw button{position:absolute;right:5px;top:50%;transform:translateY(-50%);width:42px;height:42px;border:0;background:none;cursor:pointer;display:grid;place-items:center;border-radius:10px}
.pw svg{width:20px;height:20px;fill:none;stroke:#5b6764;stroke-width:1.700;stroke-linecap:round;stroke-linejoin:round}
.pw button[aria-pressed=true] .slash{display:none}
.auth-row{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:14px}
.auth-row[hidden]{display:none}
.remember{display:flex;align-items:center;gap:8px;cursor:pointer}
.remember input{width:17px;height:17px;accent-color:var(--brand)}
.link{border:0;background:none;font:inherit;font-weight:600;color:#0d7a70;cursor:pointer;padding:4px 0}
.link:hover{text-decoration:underline}
.auth-go{font:inherit;font-weight:700;font-size:15px;color:var(--on);background:var(--grad);border:0;border-radius:13px;padding:15px;margin-top:4px;cursor:pointer;box-shadow:0 14px 26px -12px rgba(29,170,158,.8);transition:transform .35s var(--ease),box-shadow .35s}
.auth-go:hover{transform:translateY(-2px);box-shadow:0 18px 30px -12px rgba(29,170,158,.95)}
.auth-go:active{transform:none}
.auth-msg{font-size:14px;line-height:1.45;color:#0a5f57;background:#e9f7f2;border-radius:12px;padding:0 14px;max-height:0;overflow:hidden;opacity:0;margin-top:-11px;transition:max-height .4s var(--ease),opacity .3s,padding .3s,margin .3s}
.auth-msg.show{max-height:90px;opacity:1;padding:11px 14px;margin-top:0}
.auth-switch{text-align:center;font-size:14px;color:#5b6764}
.auth-back{font-size:14px;font-weight:500;color:#5b6764;padding:4px}
.auth-back:hover{color:var(--ink)}

@media(max-width:820px){
 .auth{padding:12px;display:block}
 .auth-card{grid-template-columns:1fr;min-height:0;border-radius:24px;padding:8px}
 .auth-art{min-height:210px;padding:16px 20px 22px;gap:14px;border-radius:18px}
 .auth-logo img{height:96px;margin-left:-8px}
 .auth-copy p{font-size:13px;margin-bottom:6px}.auth-copy h2{font-size:22px}
 .auth-main{padding:22px 12px 12px}
 .auth-form h1{font-size:29px}
}
@media(prefers-reduced-motion:reduce){.blob{animation:none}}

.auth-go:disabled{opacity:.7;cursor:default;transform:none}.auth-switch a{font-weight:600;color:#0d7a70}.auth-switch a:hover{text-decoration:underline}

/* ===== Sign-up ===== */
.auth-form select{width:100%;font:inherit;font-size:16px;font-weight:400;padding:13px 16px;border:1.5px solid #d5e0dc;border-radius:13px;outline:0;background:#fff}
.auth-form select:focus,.auth-form input[type=tel]:focus,.auth-form input[type=email]:focus{border-color:var(--brand);box-shadow:0 0 0 4px rgba(29,170,158,.18)}
.auth-form input[type=tel],.auth-form input[type=email]{width:100%;font:inherit;font-size:16px;font-weight:400;padding:13px 16px;border:1.5px solid #d5e0dc;border-radius:13px;outline:0;background:#fff}
.auth-grid{display:grid;grid-template-columns:1fr 1fr;gap:11px}
.auth-grid[hidden],#idRow[hidden],#confirmRow[hidden],.auth-form[hidden],.auth-done[hidden]{display:none}
.auth-grid label{display:grid;gap:7px;font-size:15px;font-weight:600;min-width:0}
.auth-done{width:min(380px,100%);text-align:center;display:grid;gap:12px}
.auth-done h1{font-size:30px;letter-spacing:-.03em}
.auth-done p{color:#44504d;line-height:1.5}
.auth-id{font-size:34px;font-weight:800;letter-spacing:.04em;color:var(--ink)!important;background:#eef9f5;border-radius:14px;padding:14px;user-select:all}
@media(max-width:480px){.auth-grid{grid-template-columns:1fr}}
