/* Khaydee 8.2.17: icon regression + modern auth UI; all rules scoped. */
/* The site font rule uses !important on i elements; it overrides Font Awesome's glyph font.
   Restore the icon font and its variants. */
i.fa-solid, i.fas, .fa-solid, .fas,
i.fa-regular, i.far, .fa-regular, .far,
i.fa-brands, i.fab, .fa-brands, .fab {
  font-family: 'Font Awesome 6 Free' !important;
  font-style: normal !important;
  font-variant: normal !important;
  text-rendering: auto;
  line-height: 1;
}
i.fa-solid, i.fas, .fa-solid, .fas{font-weight:900!important}
i.fa-regular, i.far, .fa-regular, .far{font-weight:400!important}
i.fa-brands, i.fab, .fa-brands, .fab{font-family:'Font Awesome 6 Brands'!important;font-weight:400!important}
/* Keep readable product card location icons, even if a network font fails. */
.kd68-product-card .kd68-meta i.fa-solid,.kd69-home-card .kd68-meta i.fa-solid{font-size:.8rem!important;margin-inline-end:3px}

body.kd817-auth-login,body.kd817-auth-register{
  --kd817-navy:#13213d;--kd817-orange:#ff7725;--kd817-muted:#667389;
  --kd817-border:#e9edf4; background:#f7f9fc!important;
  font-family:'IBM Plex Sans Thai','Noto Sans Thai',system-ui,sans-serif!important;
}
body.kd817-auth-login .kd-main,body.kd817-auth-register .kd-main{min-height:70vh;
 background:radial-gradient(circle at 80% 5%,rgba(255,119,37,.08),transparent 35%),linear-gradient(#f8fafc,#f4f7fb);
 padding-block:clamp(25px,4vw,65px)!important;
}
/* The legacy login/register processors remain responsible for validating credentials,
   CSRF, LINE OAuth, error messages, and account creation. */
.kd817-auth-shell{max-width:1070px;width:min(100%,1070px);margin:0 auto 20px;display:grid;grid-template-columns:minmax(280px,0.86fr) minmax(320px,1fr);background:#fff;box-shadow:0 26px 75px rgba(27,42,68,.075);border:1px solid #e9edf4;border-radius:26px;overflow:hidden}
.kd817-auth-promo{background:linear-gradient(155deg,#102a53,#12213e 65%,#0c1729);padding:clamp(28px,4vw,54px);color:#fff;display:flex;flex-direction:column;justify-content:space-between;gap:45px;min-height:410px;position:relative;isolation:isolate}
.kd817-auth-promo::after{content:'';position:absolute;z-index:-1;inset:auto -20% -44% 12%;height:260px;background:radial-gradient(ellipse,rgba(255,119,37,.45),transparent 65%)}
.kd817-auth-brand{display:flex;align-items:center;gap:10px;font-size:1rem;font-weight:600}
.kd817-auth-mark{width:42px;height:42px;display:grid;place-items:center;border-radius:13px;background:#ff7426;color:#fff}
.kd817-auth-promo h2{font-size:clamp(1.7rem,3vw,2.45rem);line-height:1.42;letter-spacing:-.04em;font-weight:600;margin:0 0 15px}
.kd817-auth-promo p{color:#d9e3f3;line-height:1.8;font-size:.97rem;margin:0}
.kd817-auth-points{display:flex;gap:12px;flex-wrap:wrap}
.kd817-auth-points span{border:1px solid rgba(255,255,255,.17);background:rgba(255,255,255,.06);border-radius:999px;padding:9px 12px;color:#ecf4ff;font-size:.83rem}
.kd817-auth-fields{min-width:0;padding:clamp(26px,4vw,54px);display:flex;flex-direction:column;justify-content:center}
.kd817-auth-fields h1,.kd817-auth-fields h2{font-family:'IBM Plex Sans Thai','Noto Sans Thai',system-ui,sans-serif!important;font-size:clamp(1.45rem,2.3vw,1.95rem)!important;line-height:1.35!important;font-weight:600!important;color:#14223d!important;margin:0 0 14px!important}
.kd817-auth-fields form{width:100%;max-width:none!important;border:0!important;box-shadow:none!important;background:transparent!important;padding:0!important;margin:0!important}
.kd817-auth-fields label{font-weight:500!important;font-size:.9rem!important;color:#35425b!important;margin:8px 0 6px!important}
.kd817-auth-fields :is(input:not([type=checkbox]):not([type=radio]):not([type=hidden]),select){border-radius:12px!important;border:1px solid #dce3ed!important;background:#fff!important;min-height:47px;padding:10px 14px!important;color:#182541!important;box-shadow:none!important;max-width:100%;width:100%}
.kd817-auth-fields input:focus,.kd817-auth-fields select:focus{outline:3px solid rgba(255,119,37,.15)!important;border-color:#f58b56!important}
.kd817-auth-fields button[type=submit],.kd817-auth-fields input[type=submit]{border-radius:12px!important;background:#f97316!important;border-color:#f97316!important;color:#fff!important;min-height:48px;font-weight:600!important;box-shadow:0 10px 20px rgba(249,115,22,.16)!important}
.kd817-auth-fields a{color:#db641c;text-decoration:none}
.kd817-auth-fields a:hover{text-decoration:underline}
.kd817-auth-fields :is(.btn,.button){border-radius:12px}
.kd817-auth-fields input[type=checkbox]{accent-color:#f97316}
.kd817-auth-fields .kd817-password-wrap{position:relative}
.kd817-auth-fields .kd817-password-wrap input{padding-right:57px!important}
.kd817-auth-fields .kd817-pass-toggle{position:absolute;right:6px;top:50%;transform:translateY(-50%);border:0;background:transparent;color:#65758b;padding:8px;border-radius:8px;min-width:38px;min-height:36px;cursor:pointer}
.kd817-auth-fields .kd817-pass-toggle:focus-visible{outline:2px solid #f97316}
.kd817-auth-fields .kd817-security-line{font-size:.79rem;line-height:1.6;color:#748297;margin-top:17px}
@media(max-width:720px){.kd817-auth-shell{display:block;border-radius:18px}.kd817-auth-promo{min-height:0;padding:24px;gap:15px}.kd817-auth-promo h2{font-size:1.5rem}.kd817-auth-points{display:none}.kd817-auth-fields{padding:24px}}
@media(prefers-reduced-motion:reduce){.kd817-auth-shell *{transition:none!important}}