/* ===========================
   COZEO Login / Auth page
   依存: cozeo-common.css (header/footer/breadcrumb/menu)
   =========================== */

/* AUTH SPLIT LAYOUT */
.auth-page{min-height:calc(100vh - 64px - 45px);min-height:calc(100dvh - 64px - 45px);display:grid;grid-template-columns:1fr 1fr;background:#fff;}

/* LEFT: visual panel */
.auth-visual{background:var(--bg);color:var(--navy);padding:56px 48px;display:flex;flex-direction:column;justify-content:space-between;border-right:1px solid var(--line);}
.auth-visual .en{font-family:var(--font-en);font-size:11px;font-weight:700;color:var(--blue);letter-spacing:.3em;display:inline-flex;align-items:center;gap:12px;margin-bottom:14px;}
.auth-visual .en::before{content:"";width:30px;height:1px;background:var(--blue);}
.auth-visual h2{font-size:28px;font-weight:900;color:var(--navy);letter-spacing:-.01em;line-height:1.4;margin-bottom:12px;}
.auth-visual h2 .accent{color:var(--blue);}
.auth-visual .lead{font-size:13px;color:var(--text-sub);line-height:1.85;max-width:440px;margin-bottom:28px;}

.benefits{display:flex;flex-direction:column;gap:10px;}
.benefit{display:flex;align-items:flex-start;gap:12px;padding:14px 16px;background:#fff;border:1px solid var(--line);border-radius:12px;}
.benefit .ico{width:36px;height:36px;border-radius:10px;background:rgba(245,184,31,.12);color:var(--gold-deep);display:grid;place-items:center;flex-shrink:0;border:1px solid rgba(245,184,31,.25);}
.benefit .ico svg{width:18px;height:18px;}
.benefit .text h4{font-size:13px;font-weight:800;color:var(--navy);margin-bottom:3px;}
.benefit .text p{font-size:11.5px;color:var(--text-sub);line-height:1.55;}

.auth-visual .footer-mini{display:flex;align-items:center;gap:10px;padding-top:20px;margin-top:24px;border-top:1px solid var(--line);font-size:11px;color:var(--text-mute);letter-spacing:.04em;}
.auth-visual .footer-mini svg{width:14px;height:14px;color:var(--green);}

/* RIGHT: form panel */
.auth-form-panel{padding:64px 56px;display:flex;flex-direction:column;justify-content:center;background:#fff;}
.auth-form-inner{max-width:420px;width:100%;margin:0 auto;}
.auth-form-inner > .en{font-family:var(--font-en);font-size:11px;font-weight:700;color:var(--blue);letter-spacing:.3em;margin-bottom:10px;display:block;}
.auth-form-inner h1{font-size:28px;font-weight:900;color:var(--navy);letter-spacing:-.01em;margin-bottom:8px;}
.auth-form-inner .sub{font-size:13px;color:var(--text-sub);margin-bottom:28px;}

/* FIELD */
.field{display:flex;flex-direction:column;gap:6px;margin-bottom:14px;}
.field label{font-size:12px;font-weight:700;color:var(--text-sub);letter-spacing:.04em;display:flex;align-items:center;gap:8px;}
.field label .en{font-family:var(--font-en);font-size:9.5px;font-weight:700;color:var(--text-mute);letter-spacing:.2em;}
.input-wrap{position:relative;}
.input-wrap > svg.lead{position:absolute;left:14px;top:50%;transform:translateY(-50%);width:16px;height:16px;color:var(--text-mute);pointer-events:none;z-index:1;}
.field input[type="email"],
.field input[type="password"],
.field input[type="text"]{width:100%;padding:13px 14px 13px 40px;border:1.5px solid var(--line);border-radius:10px;font-size:13.5px;color:var(--navy);outline:none;transition:border-color .2s, box-shadow .2s;background:#fff;font-family:inherit;}
.field input:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(25,118,237,.12);}
.field input::placeholder{color:var(--text-mute);}
.toggle-pass{position:absolute;right:10px;top:50%;transform:translateY(-50%);width:34px;height:34px;display:grid;place-items:center;color:var(--text-mute);transition:color .15s;background:transparent;border:none;cursor:pointer;}
.toggle-pass:hover{color:var(--navy);}
.toggle-pass svg{width:17px;height:17px;}

.form-row{display:flex;justify-content:space-between;align-items:center;font-size:12px;margin-bottom:18px;gap:14px;flex-wrap:wrap;}
.form-row .check{display:inline-flex;align-items:center;gap:7px;color:var(--text-sub);cursor:pointer;}
.form-row .check .form-check{display:inline-flex;align-items:center;margin:0;padding:0;min-height:0;}
.form-row .check input{accent-color:var(--blue);width:14px;height:14px;margin:0;float:none;}
.form-row a{color:var(--blue);font-weight:600;transition:color .15s;}
.form-row a:hover{color:var(--navy);text-decoration:underline;}

/* ERROR MESSAGE */
.auth-error{margin-bottom:14px;padding:11px 14px;border:1px solid #f5c2c7;background:#fdecec;color:#842029;border-radius:10px;font-size:12.5px;line-height:1.55;}
.auth-flash{margin-bottom:14px;padding:11px 14px;border:1px solid #cde2c5;background:#eaf6e3;color:#205d2a;border-radius:10px;font-size:12.5px;line-height:1.55;}

/* BUTTONS */
.auth-form-panel .btn-primary{width:100%;display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:16px 24px;background:linear-gradient(135deg, var(--navy-deep) 0%, var(--navy) 100%);color:#fff;font-size:14.5px;font-weight:800;border-radius:12px;letter-spacing:.04em;position:relative;overflow:hidden;transition:transform .2s, box-shadow .2s;border:none;cursor:pointer;font-family:inherit;}
.auth-form-panel .btn-primary::before{content:"";position:absolute;top:0;left:-80%;width:60%;height:100%;background:linear-gradient(120deg, transparent 30%, rgba(255,255,255,.18), transparent 70%);transition:left .6s;}
.auth-form-panel .btn-primary:hover{transform:translateY(-2px);box-shadow:0 12px 24px rgba(20,29,58,.3);}
.auth-form-panel .btn-primary:hover::before{left:120%;}
.auth-form-panel .btn-primary svg{width:16px;height:16px;}

.btn-outline{width:100%;display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:16px 24px;background:#fff;border:1.5px solid var(--line);color:var(--navy);font-size:14.5px;font-weight:700;border-radius:12px;transition:all .2s;cursor:pointer;font-family:inherit;}
.btn-outline:hover{border-color:var(--navy);background:var(--bg);transform:translateY(-2px);box-shadow:0 8px 18px rgba(30,42,82,.08);}
.btn-outline svg{width:16px;height:16px;}

.divider-or{display:flex;align-items:center;gap:14px;margin:22px 0;color:var(--text-mute);font-family:var(--font-en);font-size:10px;font-weight:700;letter-spacing:.3em;}
.divider-or::before, .divider-or::after{content:"";flex:1;height:1px;background:var(--line);}

/* MINI FOOTER (login page only) */
.auth-footer-bottom{background:#fff;border-top:1px solid var(--line);padding:14px 24px;font-size:11px;color:var(--text-mute);text-align:center;letter-spacing:.04em;}

@media (max-width: 980px){
  .auth-page{grid-template-columns:1fr;}
  .auth-visual{padding:40px 28px;}
  .auth-visual h2{font-size:24px;}
  .benefits{display:none;}
  .auth-visual .footer-mini{display:none;}
  .auth-form-panel{padding:40px 24px;}
}
@media (max-width: 760px){
  .auth-visual{padding:32px 20px;}
  .auth-visual h2{font-size:22px;}
  .auth-visual .lead{font-size:12px;}
  .auth-form-panel{padding:32px 20px;}
  .auth-form-inner h1{font-size:22px;}
}
