
/* TERM-FIN V10.14.2 — Auth Modal for existing index-v1019 theme only */
.tf-auth-trigger{
  font:inherit;cursor:pointer;border:0;appearance:none;
}
.top-actions .tf-auth-trigger,
.account-actions .tf-auth-trigger{display:inline-flex;align-items:center;justify-content:center;gap:.45rem}
.tf-auth-modal[hidden]{display:none!important}
.tf-auth-modal{
  position:fixed;inset:0;z-index:99999;display:grid;place-items:center;padding:20px;
  opacity:0;visibility:hidden;transition:opacity .25s ease,visibility .25s ease;
}
.tf-auth-modal.open{opacity:1;visibility:visible}
.tf-auth-backdrop{
  position:absolute;inset:0;background:
    radial-gradient(circle at 50% 20%,rgba(237,177,50,.20),transparent 34%),
    rgba(13,13,18,.72);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
}
.tf-auth-dialog{
  --auth-gold:#e8ad2b;--auth-gold2:#ffd96a;--auth-ink:#17130b;
  position:relative;width:min(520px,calc(100vw - 28px));max-height:min(92vh,820px);overflow:auto;
  border:1px solid rgba(219,164,43,.58);border-radius:30px;padding:26px;
  background:
    radial-gradient(circle at 12% 0%,rgba(255,218,111,.25),transparent 26%),
    linear-gradient(145deg,rgba(255,255,255,.985),rgba(255,250,235,.97));
  box-shadow:0 30px 90px rgba(20,14,4,.38),0 0 0 1px rgba(255,255,255,.7) inset,0 0 38px rgba(231,171,41,.16);
  transform:translateY(24px) scale(.96);transition:transform .3s cubic-bezier(.2,.85,.2,1);
  isolation:isolate;
}
.tf-auth-modal.open .tf-auth-dialog{transform:none}
.tf-auth-dialog::before{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:-1;
  background:linear-gradient(120deg,transparent 20%,rgba(255,255,255,.9) 40%,transparent 56%);
  transform:translateX(-140%);animation:tfAuthFrameShine 6.5s ease-in-out infinite 1.2s
}
@keyframes tfAuthFrameShine{0%,72%,100%{transform:translateX(-140%)}84%{transform:translateX(140%)}}
.tf-auth-shimmer{position:absolute;height:2px;left:10%;right:10%;top:0;background:linear-gradient(90deg,transparent,#ffe69a,var(--auth-gold),#fff1b7,transparent);filter:drop-shadow(0 0 8px var(--auth-gold));animation:tfAuthPulse 2.3s ease-in-out infinite}
@keyframes tfAuthPulse{50%{opacity:.45;transform:scaleX(.82)}}
.tf-auth-orbit{position:absolute;border-radius:999px;border:1px solid rgba(229,169,42,.18);pointer-events:none;z-index:-1}
.tf-auth-orbit--one{width:180px;height:180px;right:-92px;top:90px;animation:tfOrbit 13s linear infinite}
.tf-auth-orbit--two{width:110px;height:110px;left:-58px;bottom:110px;animation:tfOrbit 10s linear infinite reverse}
@keyframes tfOrbit{to{transform:rotate(360deg)}}
.tf-auth-close{
  position:absolute;right:16px;top:16px;width:40px;height:40px;border-radius:50%;border:1px solid rgba(194,142,31,.28);
  background:#fffaf0;color:#6c4a06;display:grid;place-items:center;cursor:pointer;transition:.2s
}
.tf-auth-close:hover{transform:rotate(8deg) scale(1.07);background:#fff2c4;box-shadow:0 8px 24px rgba(204,143,18,.18)}
.tf-auth-head{display:flex;align-items:center;gap:13px;padding-right:45px;margin-bottom:18px}
.tf-auth-mark{width:52px;height:52px;flex:0 0 auto;border-radius:17px;display:grid;place-items:center;color:#3c2904;font-size:22px;background:linear-gradient(145deg,#fff3b7,#e3a51f);box-shadow:0 10px 30px rgba(211,145,18,.25),inset 0 1px #fff}
.tf-auth-head strong{display:block;font:800 18px/1.15 Kanit,Prompt,sans-serif;letter-spacing:.08em;color:#211805}
.tf-auth-head small{display:block;margin-top:4px;color:#8b7957;font-size:12px}
.tf-auth-tabs{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:5px;border:1px solid #ead8ad;border-radius:16px;background:#fff8e7;margin-bottom:16px}
.tf-auth-tabs button{border:0;border-radius:12px;padding:11px 8px;background:transparent;font:700 13px Kanit,Prompt,sans-serif;color:#8a6d31;cursor:pointer;transition:.22s}
.tf-auth-tabs button.active{color:#2a1d04;background:linear-gradient(135deg,#ffe99c,#e5aa2a);box-shadow:0 8px 20px rgba(209,145,20,.2),inset 0 1px #fff}
.tf-auth-alert{padding:11px 13px;border-radius:12px;margin:0 0 13px;font-size:12.5px;font-weight:600}
.tf-auth-alert.is-error{background:#fff0ef;border:1px solid #efaaa4;color:#a22d22}
.tf-auth-alert.is-success{background:#ecfbf1;border:1px solid #9dd9ae;color:#20723b}
.tf-auth-panel{display:none}
.tf-auth-panel.active{display:block;animation:tfAuthPanel .26s ease}
@keyframes tfAuthPanel{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.tf-auth-field{display:block;margin:0 0 12px}
.tf-auth-field>span{display:block;font:600 12px Kanit,Prompt,sans-serif;color:#6e5a31;margin:0 0 6px}
.tf-auth-field input{
  width:100%;height:48px;border:1px solid #e3d2a8;border-radius:13px;background:rgba(255,255,255,.88);outline:0;
  padding:0 14px;font:500 14px Prompt,Kanit,sans-serif;color:#251a06;transition:border-color .2s,box-shadow .2s,transform .2s
}
.tf-auth-field input:focus{border-color:#e0a422;box-shadow:0 0 0 4px rgba(229,170,44,.12);transform:translateY(-1px)}
.tf-auth-password{position:relative}
.tf-auth-password input{padding-right:52px}
.tf-auth-password button{position:absolute;right:5px;top:5px;width:38px;height:38px;border:0;border-radius:10px;background:#fff5d6;color:#8d620b;cursor:pointer}
.tf-auth-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:2px 0 14px}
.tf-auth-remember{font-size:12px;color:#766b57;display:flex;gap:6px;align-items:center}
.tf-auth-link,.tf-auth-bottom button{border:0;background:none;padding:0;color:#b77900;font:700 12px Kanit,Prompt,sans-serif;cursor:pointer}
.tf-auth-link:hover,.tf-auth-bottom button:hover{text-decoration:underline}
.tf-auth-submit{
  width:100%;height:50px;border:0;border-radius:14px;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:9px;
  color:#241803;font:800 14px Kanit,Prompt,sans-serif;background:linear-gradient(105deg,#ffea96,#e4a522,#ffd867);
  box-shadow:0 10px 24px rgba(202,137,12,.24),inset 0 1px #fff;position:relative;overflow:hidden;transition:transform .2s,box-shadow .2s
}
.tf-auth-submit::after{content:"";position:absolute;top:-60%;left:-35%;width:25%;height:220%;background:rgba(255,255,255,.55);transform:rotate(24deg);transition:left .5s ease}
.tf-auth-submit:hover{transform:translateY(-2px);box-shadow:0 15px 30px rgba(202,137,12,.32)}
.tf-auth-submit:hover::after{left:120%}
.tf-auth-submit:active{transform:translateY(0) scale(.99)}
.tf-auth-separator{display:flex;align-items:center;gap:10px;margin:18px 0 13px;color:#a5936f;font-size:11px}
.tf-auth-separator::before,.tf-auth-separator::after{content:"";height:1px;background:#eadfc8;flex:1}
.tf-social-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.tf-social{height:44px;border:1px solid #e5d7b7;border-radius:12px;text-decoration:none;display:flex;align-items:center;justify-content:center;gap:7px;font:700 12px Kanit,Prompt,sans-serif;background:#fff;color:#2c261c;transition:.2s}
.tf-social:hover{transform:translateY(-2px);box-shadow:0 9px 22px rgba(42,31,10,.12)}
.tf-google b{font:900 18px Arial;color:#4285f4}.tf-facebook{color:#1769d2}.tf-facebook i{font-size:17px}.tf-line{color:#078a27}.tf-line b{font:900 10px Arial;background:#06c755;color:white;border-radius:6px;padding:4px}
.tf-auth-bottom{text-align:center;color:#8b7a5e;font-size:12px;margin:15px 0 0}
.tf-auth-code-row{display:grid;grid-template-columns:1fr 112px;gap:8px;align-items:end}
.tf-auth-code-row .tf-auth-field{margin-bottom:12px}
.tf-auth-code-btn{height:48px;margin-bottom:12px;border:1px solid #deb34c;border-radius:13px;background:#fff8df;color:#916000;font:700 12px Kanit,Prompt,sans-serif;cursor:pointer;transition:.2s}
.tf-auth-code-btn:hover{background:#ffedb0;transform:translateY(-1px)}
.tf-auth-code-btn:disabled{opacity:.55;cursor:not-allowed;transform:none}
.tf-auth-terms{display:flex;align-items:flex-start;gap:8px;font-size:11px;color:#77694e;margin:2px 0 14px}
.tf-auth-terms a{color:#a76b00}
.tf-auth-forgot-head{display:flex;align-items:flex-start;gap:12px;margin:0 0 15px}
.tf-auth-forgot-head button{width:38px;height:38px;border:1px solid #e4d3ab;border-radius:11px;background:#fff7e1;color:#875a00;cursor:pointer}
.tf-auth-forgot-head h3{margin:0;color:#231906;font-size:20px}.tf-auth-forgot-head p{margin:3px 0 0;color:#8b7b5e;font-size:12px}
.tf-auth-foot{display:flex;align-items:center;justify-content:center;gap:7px;border-top:1px solid #eadfc8;margin-top:18px;padding-top:13px;color:#9a896b;font-size:10.5px}
.tf-auth-foot i{color:#d49b20}
.tf-auth-busy{opacity:.7;pointer-events:none}
.tf-auth-toast{position:fixed;left:50%;top:24px;z-index:100005;transform:translate(-50%,-14px);opacity:0;padding:12px 18px;border-radius:999px;background:#1d1b17;color:white;font:600 13px Kanit,Prompt,sans-serif;box-shadow:0 16px 45px rgba(0,0,0,.24);transition:.25s}
.tf-auth-toast.show{opacity:1;transform:translate(-50%,0)}.tf-auth-toast.success{background:#176c38}.tf-auth-toast.error{background:#9d3027}
.tf-auth-lock{overflow:hidden}
@media(max-width:640px){
  .tf-auth-modal{padding:10px;align-items:end}
  .tf-auth-dialog{width:100%;max-height:94dvh;border-radius:25px 25px 16px 16px;padding:20px 16px calc(18px + env(safe-area-inset-bottom))}
  .tf-auth-head small{font-size:10px}.tf-social span{display:none}.tf-social{font-size:18px}
  .tf-auth-code-row{grid-template-columns:1fr 100px}
  .tf-auth-tabs button{font-size:12px}
}
@media(prefers-reduced-motion:reduce){
  .tf-auth-dialog,.tf-auth-modal,.tf-auth-dialog::before,.tf-auth-orbit,.tf-auth-shimmer,.tf-auth-panel{animation:none!important;transition:none!important}
}


/* =========================================================
   V10.14.3 HOTFIX — ปิด Horizontal Scroll ใน Auth Popup
   ========================================================= */
.tf-auth-modal,
.tf-auth-modal * {
  box-sizing: border-box;
}

.tf-auth-modal {
  width: 100%;
  max-width: 100%;
  overflow: hidden;
}

.tf-auth-dialog {
  width: min(520px, 100%);
  max-width: 520px;
  overflow-y: auto;
  overflow-x: hidden;
  overscroll-behavior: contain;
}

.tf-auth-dialog form,
.tf-auth-panel,
.tf-auth-field,
.tf-auth-password,
.tf-auth-code-row,
.tf-social-grid {
  min-width: 0;
  max-width: 100%;
}

.tf-auth-code-row {
  grid-template-columns: minmax(0, 1fr) 112px;
}

.tf-auth-code-row > *,
.tf-social-grid > * {
  min-width: 0;
}

.tf-auth-field input,
.tf-auth-password input {
  min-width: 0;
  max-width: 100%;
}

@media (max-width: 640px) {
  .tf-auth-modal {
    padding-left: 8px;
    padding-right: 8px;
  }

  .tf-auth-dialog {
    width: 100%;
    max-width: 100%;
    margin: 0;
  }

  .tf-auth-code-row {
    grid-template-columns: minmax(0, 1fr) 100px;
  }
}

@media (max-width: 390px) {
  .tf-auth-code-row {
    grid-template-columns: 1fr;
    gap: 0;
  }

  .tf-auth-code-btn {
    width: 100%;
  }

  .tf-social-grid {
    gap: 6px;
  }
}


/* =========================================================
   V10.14.5 — Hide Facebook Login
   ========================================================= */
.tf-social-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.tf-social.tf-facebook {
  display: none !important;
}

@media (max-width: 640px) {
  .tf-social-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .tf-social span {
    display: inline;
  }
}
