/* ============ AUTH PAGES (Login / Register) ============ */
body.auth-body{
  min-height:100vh;display:flex;justify-content:center;padding:24px;
  background:var(--grey-100);
}

.auth-wrap{width:100%;max-width:1040px;min-height:640px;margin:auto 0;background:var(--white);border-radius:24px;box-shadow:0 30px 70px rgba(0,0,0,.12);overflow:hidden;display:grid;grid-template-columns:1fr 1fr;}

/* ---------- left promo panel ---------- */
.auth-promo{position:relative;background:linear-gradient(150deg,var(--orange) 0%,var(--orange-dark) 100%);color:var(--white);padding:48px 44px;display:flex;flex-direction:column;overflow:hidden;}
.auth-promo .deco{position:absolute;border-radius:50%;background:rgba(255,255,255,.10);}
.auth-promo .deco.d1{width:280px;height:280px;top:-90px;right:-90px;}
.auth-promo .deco.d2{width:180px;height:180px;bottom:-60px;left:-50px;background:rgba(255,255,255,.08);}
.auth-promo-logo{display:flex;align-items:center;gap:9px;position:relative;z-index:2;margin-bottom:56px;}
.auth-promo-logo img{height:34px;filter:brightness(0) invert(1);}
.auth-promo-body{position:relative;z-index:2;}
.auth-promo-body h1{font-family:var(--font-display);font-size:30px;font-weight:800;line-height:1.2;margin-bottom:14px;letter-spacing:-.5px;}
.auth-promo-body p{font-size:14.5px;opacity:.92;line-height:1.6;margin-bottom:28px;max-width:340px;}
.auth-perks{list-style:none;display:flex;flex-direction:column;gap:14px;position:relative;z-index:2;}
.auth-perks li{display:flex;align-items:center;gap:11px;font-size:13.5px;font-weight:600;}
.auth-perks li .ic{width:30px;height:30px;border-radius:50%;background:rgba(255,255,255,.18);display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.auth-perks li svg{width:15px;height:15px;stroke:var(--white);fill:none;stroke-width:2.4;}

/* ---------- right form panel ---------- */
.auth-form-side{padding:48px 44px;display:flex;flex-direction:column;}
.auth-tabs{display:flex;background:var(--grey-100);border-radius:26px;padding:4px;margin-bottom:32px;}
.auth-tab{flex:1;text-align:center;padding:11px 0;border-radius:22px;font-weight:700;font-size:13.5px;color:var(--grey-600);transition:.2s;}
.auth-tab.active{background:var(--black);color:var(--white);}

.auth-panel{display:none;}
.auth-panel.active{display:block;animation:authfadein .25s ease;}
@keyframes authfadein{from{opacity:0;transform:translateY(6px);}to{opacity:1;transform:translateY(0);}}

.auth-panel h2{font-family:var(--font-display);font-size:23px;font-weight:800;margin-bottom:6px;}
.auth-panel .sub{font-size:13px;color:var(--grey-600);margin-bottom:26px;}

.auth-panel .field{margin-bottom:16px;}
.auth-panel .field label{display:block;font-size:12.5px;font-weight:700;margin-bottom:6px;}
.auth-panel .field .input-wrap{position:relative;}
.auth-panel .field input{width:100%;height:46px;border:1.5px solid var(--grey-300);border-radius:10px;padding:0 14px;font-size:13.5px;font-family:inherit;outline:none;transition:border-color .15s,box-shadow .15s;background:var(--white);}
.auth-panel .field input:focus{border-color:var(--orange);box-shadow:0 0 0 4px var(--orange-light);}
.auth-panel .field input.error{border-color:#C0392B;}
.auth-panel .field-row{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.auth-panel .field-error{font-size:11.5px;color:#C0392B;margin-top:5px;display:none;}
.auth-panel .field-error.show{display:block;}

.pw-toggle{position:absolute;right:12px;top:50%;transform:translateY(-50%);width:22px;height:22px;display:flex;align-items:center;justify-content:center;color:var(--grey-600);}
.pw-toggle svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.8;}
.pw-toggle:hover{color:var(--orange);}

.pw-strength{display:flex;gap:4px;margin-top:8px;}
.pw-strength span{height:4px;flex:1;border-radius:3px;background:var(--grey-300);transition:.2s;}
.pw-strength-label{font-size:11px;color:var(--grey-600);margin-top:5px;}

.row-between{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px;font-size:12.5px;}
.checkbox-row{display:flex;align-items:flex-start;gap:8px;font-size:12.5px;color:var(--grey-600);}
.checkbox-row input{margin-top:2px;accent-color:var(--orange);width:15px;height:15px;flex-shrink:0;}
.checkbox-row a{color:var(--orange-dark);font-weight:600;}
.link-orange{color:var(--orange-dark);font-weight:700;}
.link-orange:hover{text-decoration:underline;}

.btn-submit{width:100%;height:48px;border-radius:24px;background:var(--black);color:var(--white);font-weight:800;font-size:14px;transition:.15s;margin-bottom:18px;}
.btn-submit:hover{background:var(--orange);}
.btn-submit:disabled{opacity:.6;cursor:default;}

.divider{display:flex;align-items:center;gap:12px;margin-bottom:18px;color:var(--grey-600);font-size:11.5px;font-weight:600;text-transform:uppercase;letter-spacing:.4px;}
.divider::before,.divider::after{content:"";flex:1;height:1px;background:var(--grey-300);}

.social-row{display:flex;gap:12px;margin-bottom:22px;}
.social-btn{flex:1;height:46px;border:1.5px solid var(--grey-300);border-radius:10px;display:flex;align-items:center;justify-content:center;gap:9px;font-size:13px;font-weight:700;color:var(--grey-900);transition:.15s;}
.social-btn:hover{border-color:var(--orange);color:var(--orange-dark);background:var(--orange-light);}
.social-btn svg{width:17px;height:17px;flex-shrink:0;}

.auth-switch{text-align:center;font-size:13px;color:var(--grey-600);margin-top:auto;padding-top:8px;}

.auth-toast{display:none;align-items:center;gap:9px;background:#E9F7EE;color:#227A45;border:1px solid #BEE8CC;font-size:13px;font-weight:600;padding:12px 16px;border-radius:10px;margin-bottom:18px;}
.auth-toast.show{display:flex;}
.auth-toast svg{width:16px;height:16px;stroke:#227A45;fill:none;stroke-width:2.4;flex-shrink:0;}

.guest-link{text-align:center;margin-top:14px;}
.guest-link a{font-size:12.5px;color:var(--grey-600);font-weight:600;}
.guest-link a:hover{color:var(--orange);}

/* ---------- responsive ---------- */
@media(max-width:860px){
  .auth-wrap{grid-template-columns:1fr;min-height:auto;}
  .auth-promo{display:none;}
  .auth-form-side{padding:36px 26px;}
}
@media(max-width:480px){
  body.auth-body{padding:0;}
  .auth-wrap{border-radius:0;min-height:100vh;}
  .auth-panel .field-row{grid-template-columns:1fr;}
  .social-row{flex-direction:column;}
}
