/* หน้าเข้าสู่ระบบ (login.php / login-editor.php / login-reviewer.php / login-otp.php) — แยกออกมาจาก login.php */
.login-template{--primary:#4c57a9;--primary-dark:#39428c;--ink:#15233a;--muted:#6b7686;--line:#e7ebf1;--soft:#f7f8fa;min-height:100vh;background:var(--soft);color:#1a2433;font-family:"IBM Plex Sans Thai", -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}.login-template *{box-sizing:border-box}.login-template a{color:inherit;text-decoration:none}.login-shell{max-width:1120px;margin:0 auto;padding-left:40px;padding-right:40px}.login-header{position:relative;z-index:40;background:#fff;border-bottom:1px solid var(--line)}.login-header__inner{min-height:82px;display:flex;align-items:center;justify-content:space-between;gap:24px}.login-header .login-shell{max-width:1200px}.login-template nav{margin:0;padding:0;background:transparent;border:0;box-shadow:none}.login-template nav:after{content:none}.login-template nav a{display:inline-flex;align-items:center;padding:0;background:transparent;color:inherit;font-size:inherit;line-height:1.35}.login-template nav a:hover{background:transparent}.login-brand{display:flex;align-items:center;gap:14px;flex-shrink:0}.login-brand img{width:auto;height:44px;display:block}.login-nav{display:flex;align-items:center;gap:20px;color:#3b4860;font-size:14.5px;font-weight:500;white-space:nowrap}.login-nav a:hover,.login-nav .active{color:var(--primary)}.login-actions{display:flex;gap:10px;flex-shrink:0}.login-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid #cdd8e6;border-radius:8px;padding:9px 16px;color:var(--primary);font:inherit;font-size:14px;font-weight:600;min-height:40px;background:#fff}.login-btn--primary{border-color:var(--primary);background:var(--primary);color:#fff}.login-main{display:grid;grid-template-columns:minmax(0,1fr) minmax(430px,1fr);min-height:680px;background:#fff}.login-hero{position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;padding:56px 50px;color:#fff;background:linear-gradient(140deg,#4c57a9 0%,#39428c 52%,#253262 100%)}.login-hero:before{content:"";position:absolute;inset:0;background:url("images/slider/bg-top.png") center/cover no-repeat;opacity:.12;mix-blend-mode:luminosity}.login-hero:after{content:"";position:absolute;inset:0;background:radial-gradient(95% 100% at 10% 0%,rgba(255,255,255,.20) 0%,rgba(255,255,255,0) 46%),radial-gradient(90% 120% at 102% 112%,rgba(171,186,255,.24) 0%,rgba(171,186,255,0) 55%);pointer-events:none}.login-hero__content,.login-hero__foot{position:relative;z-index:1}.login-logo-tile{width:74px;height:74px;display:flex;align-items:center;justify-content:center;border-radius:18px;background:#fff;margin-bottom:34px;padding:8px;box-shadow:0 20px 42px rgba(20,28,73,.20)}.login-logo-tile img{max-width:100%;max-height:100%}.login-kicker{margin-bottom:14px;color:rgba(255,255,255,.75);font-size:14px;font-weight:600;letter-spacing:.02em}.login-hero h1{margin:0;color:#fff;font-family:"Anuphan",sans-serif;font-size:42px;font-weight:700;line-height:1.28;letter-spacing:0}.login-hero p{max-width:500px;margin:18px 0 0;color:rgba(255,255,255,.82);font-size:16px;line-height:1.8}.login-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:38px}.login-stat{padding:16px 14px;border:1px solid rgba(255,255,255,.18);border-radius:14px;background:rgba(255,255,255,.08);backdrop-filter:blur(5px)}.login-stat strong{display:block;color:#fff;font-size:23px;line-height:1.1}.login-stat span{display:block;margin-top:7px;color:rgba(255,255,255,.75);font-size:12.5px}.login-hero__foot{color:rgba(255,255,255,.66);font-size:13px}.login-panel{display:flex;align-items:center;justify-content:center;background:#fff;padding:56px 50px}.login-card{width:100%;max-width:470px}.login-tabs{display:flex;gap:8px;margin-bottom:36px}.login-tab{display:inline-flex;align-items:center;justify-content:center;min-height:42px;border-radius:10px;padding:0 18px;color:#7c8899;font-size:14px;font-weight:700;background:#f4f6fa;border:1px solid transparent}.login-tab.is-active{background:#eef0fb;color:var(--primary);border-color:#dfe4f6}.login-card h2{margin:0;color:var(--ink);font-family:"Anuphan",sans-serif;font-size:32px;font-weight:700;letter-spacing:0}.login-card__lead{margin:10px 0 30px;color:#7d8999;font-size:15px;line-height:1.65}.login-form{display:flex;flex-direction:column;gap:18px}.login-field label,.login-role-label{display:block;margin-bottom:9px;color:#27374e;font-size:13.5px;font-weight:700}.login-input-wrap{position:relative;display:flex;align-items:center;border:1px solid #dbe3ee;border-radius:12px;background:#fff;transition:border-color .18s ease,box-shadow .18s ease}.login-input-wrap:focus-within{border-color:var(--primary);box-shadow:0 0 0 3px rgba(76,87,169,.12)}.login-input-wrap i{width:48px;text-align:center;color:#9aa6b6;font-size:18px;flex-shrink:0}.login-input{width:100%;height:50px;border:0;background:transparent;color:#1a2433;font:inherit;font-size:15px;outline:0;padding:0 15px 0 0}.login-password-toggle{width:46px;height:46px;border:0;background:transparent;color:#8b96a7;display:flex;align-items:center;justify-content:center;cursor:pointer}.login-password-toggle i{width:auto}.login-roles{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.login-role{position:relative;margin:0}.login-role input{position:absolute;inset:0;opacity:0}.login-role span{display:flex;align-items:center;justify-content:center;min-height:44px;border:1px solid #dbe3ee;border-radius:11px;color:#57657a;background:#fff;font-size:13.5px;font-weight:700;cursor:pointer;text-align:center;padding:0 10px;transition:background .18s ease,border-color .18s ease,color .18s ease}.login-role input:checked+span{border-color:#dfe4f6;background:#eef0fb;color:var(--primary)}.login-row{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:2px;color:#6d7889;font-size:13.5px}.login-check{display:flex;align-items:center;gap:9px;cursor:pointer}.login-check input{width:18px;height:18px;accent-color:var(--primary)}.login-forgot{color:var(--primary);font-weight:700}.login-submit{display:flex;align-items:center;justify-content:center;gap:9px;width:100%;height:52px;border:0;border-radius:12px;background:var(--primary);color:#fff;font:inherit;font-size:16px;font-weight:700;cursor:pointer}.login-submit:hover{background:#3f4895}.login-divider{display:flex;align-items:center;gap:13px;margin:8px 0;color:#a0aaba;font-size:13px}.login-divider:before,.login-divider:after{content:"";height:1px;background:#e8edf4;flex:1}.login-register-note{text-align:center;color:#7d8999;font-size:14px}.login-register-note a{color:var(--primary);font-weight:700}.login-footer{position:relative;overflow:hidden;background:linear-gradient(120deg,#3f4895,#333c7e);color:#9fb1c9;padding:48px 40px 28px}.login-footer:before{content:"";position:absolute;inset:0;background:radial-gradient(120% 150% at 8% -40%,rgba(255,255,255,.14) 0%,rgba(255,255,255,0) 44%),radial-gradient(80% 120% at 104% 150%,rgba(170,186,255,.20) 0%,rgba(170,186,255,0) 54%);pointer-events:none}.login-footer__inner{position:relative;max-width:1120px;margin:0 auto}.login-footer__top{display:flex;justify-content:space-between;gap:48px;flex-wrap:wrap;padding-bottom:30px;border-bottom:1px solid rgba(255,255,255,.1)}.login-footer__brand{max-width:440px}.login-footer__logo{display:flex;align-items:center;gap:12px;margin-bottom:16px}.login-footer__mark{width:46px;height:46px;display:flex;align-items:center;justify-content:center;padding:4px;border-radius:10px;background:#fff}.login-footer__mark img{max-width:100%;max-height:100%}.login-footer__title,.login-footer__heading{color:#fff;font-weight:700}.login-footer__title{font-size:15px}.login-footer p{margin:0;font-size:13.5px;line-height:1.7}.login-footer__menus{display:flex;gap:64px}.login-footer__heading{margin-bottom:14px;font-size:13px;letter-spacing:.03em}.login-footer__links{display:flex;flex-direction:column;gap:10px;font-size:13.5px}.login-footer__copy{padding-top:22px;color:#6f83a0;font-size:12.5px}@media(max-width:1024px){.login-shell{padding-left:24px;padding-right:24px}.login-header__inner{align-items:flex-start;flex-direction:column;padding-top:16px;padding-bottom:16px}.login-nav{width:100%;flex-wrap:wrap;gap:14px 22px}.login-actions{width:100%}.login-main{grid-template-columns:1fr}.login-hero{min-height:520px}.login-panel{padding:46px 40px 56px}}@media(max-width:760px){.login-header__inner,.login-nav,.login-actions,.login-footer__top,.login-footer__menus{flex-direction:column;align-items:stretch}.login-nav{align-items:flex-start}.login-main{display:block}.login-hero,.login-panel{padding:34px 24px}.login-hero{min-height:auto}.login-hero h1{font-size:30px}.login-stats,.login-roles{grid-template-columns:1fr}.login-row{align-items:flex-start;flex-direction:column}.login-tabs{margin-bottom:26px}.login-card h2{font-size:26px}.login-footer{padding-left:24px;padding-right:24px}}
.login-captcha{display:flex;align-items:center;gap:12px;margin-top:10px;flex-wrap:wrap}.login-captcha img{height:44px;width:auto;display:block;border:1px solid #dbe3ee;border-radius:8px;background:#fff}.login-captcha__reload{display:inline-flex;align-items:center;gap:6px;border:1px solid #dbe3ee;border-radius:9px;background:#fff;color:#57657a;font:inherit;font-size:13px;font-weight:600;padding:8px 12px;cursor:pointer}.login-captcha__reload:hover{border-color:var(--primary);color:var(--primary)}

/* ---- แยกหน้า login ตามบทบาท + OTP ---- */
.login-flash{margin-bottom:22px;padding:13px 16px;border-radius:10px;font-size:14px;line-height:1.6}
.login-flash--ok{background:#e8f6ee;border:1px solid #bfe3cd;color:#1e7a45}
.login-flash--error{background:#fdecea;border:1px solid #f5c6cb;color:#a12a2a}
.login-otp-hint{display:flex;gap:8px;align-items:flex-start;padding:11px 14px;border-radius:10px;background:#f4f6fb;color:#57657a;font-size:13px;line-height:1.6}
.login-otp-hint i{color:var(--primary);margin-top:1px}
.login-role-links{display:flex;justify-content:center;gap:18px;flex-wrap:wrap;margin-top:6px;font-size:13.5px}
.login-role-links a{color:var(--primary);font-weight:600}
.login-otp-code{width:100%;height:62px;border:1px solid #dbe3ee;border-radius:12px;text-align:center;font:inherit;font-size:30px;font-weight:700;letter-spacing:12px;color:var(--ink);font-family:Consolas,Menlo,monospace}
.login-otp-code:focus{outline:0;border-color:var(--primary);box-shadow:0 0 0 3px rgba(76,87,169,.12)}
.login-otp-actions{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;font-size:13.5px}
.login-link-btn{border:0;background:none;padding:0;color:var(--primary);font:inherit;font-weight:700;cursor:pointer}
.login-link-btn:disabled{color:#a0aaba;cursor:not-allowed}
.login-otp-email{color:var(--ink);font-weight:700}