:root{
  --red:#dc2626;
  --red-dark:#b91c1c;
  --green:#16a34a;
  --green-dark:#15803d;
  --black:#050505;
  --ink:#111111;
  --muted:#626262;
  --line:#e7e7e7;
  --soft:#f7f7f7;
  --white:#ffffff;
  --shadow:0 12px 34px rgba(0,0,0,.07);
  --shadow-lg:0 24px 70px rgba(0,0,0,.20);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body.s4k-body{font-family:"Sarabun",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Tahoma,sans-serif;font-weight:600;background:#f5f5f5;color:var(--ink);min-height:100vh;font-size:14px}
a{text-decoration:none}.s4k-main{max-width:1680px;margin:0 auto}.s4k-alert{border-radius:14px;border:1px solid var(--line);max-width:1280px;margin:0 auto 16px}.alert-success{background:#ecfdf3;color:#111;border-color:var(--green)}.alert-danger{background:#fff1f1;color:#111;border-color:var(--red)}
/* topbar */
.s4k-topbar{background:#fff;border-bottom:1px solid var(--line);box-shadow:0 6px 20px rgba(0,0,0,.04)}.s4k-brand{font-weight:900;letter-spacing:-.03em;color:#111!important;display:flex;align-items:center;gap:10px}.s4k-brand-mark{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:var(--red);color:#fff;font-size:.78rem}.navbar .nav-link{font-weight:800;color:#333;border-radius:10px;padding:.48rem .7rem}.navbar .nav-link:hover{background:#f4f4f4;color:var(--red)}.s4k-user-chip{display:flex;align-items:center;gap:.45rem;padding:.38rem .7rem;border:1px solid var(--line);border-radius:999px;background:#fff;font-size:.85rem;font-weight:800;color:#222}
/* common controls */
.btn{border-radius:10px;font-weight:850}.btn-danger,.s4k-primary-btn{background:var(--red)!important;border-color:var(--red)!important;color:#fff!important}.btn-danger:hover,.s4k-primary-btn:hover{background:var(--red-dark)!important;border-color:var(--red-dark)!important}.btn-primary{background:#111!important;border-color:#111!important;color:#fff!important}.btn-success{background:var(--green)!important;border-color:var(--green)!important}.btn-outline-danger{border-color:var(--red)!important;color:var(--red)!important;background:#fff!important}.btn-outline-danger:hover{background:var(--red)!important;color:#fff!important}.btn-outline-primary{border-color:#111!important;color:#111!important}.btn-outline-primary:hover{background:#111!important;color:#fff!important}.btn-light{background:#fff;border-color:var(--line)!important}.form-label{font-weight:850;color:#1f1f1f;margin-bottom:.36rem}.form-control,.form-select,.input-group-text{border-radius:10px;border-color:#d9d9d9;background:#fff;color:#111}.form-control,.form-select{padding:.58rem .72rem;min-height:40px}.form-control-lg,.form-select-lg{font-size:.92rem;min-height:42px;padding:.6rem .78rem}.form-control:focus,.form-select:focus{border-color:var(--red);box-shadow:0 0 0 .18rem rgba(220,38,38,.12)}.form-text{font-size:.78rem}.card,.s4k-card{border:1px solid var(--line)!important;border-radius:16px!important;background:#fff!important;box-shadow:var(--shadow)!important}.card-body{padding:1rem!important}.border.rounded-3{border-color:var(--line)!important;border-radius:12px!important;background:#fafafa}.badge{font-weight:900;border-radius:999px;padding:.42em .65em}.text-bg-danger,.badge.bg-danger{background:var(--red)!important;color:#fff!important}.text-bg-success,.badge.bg-success{background:var(--green)!important;color:#fff!important}.text-bg-warning{background:#111!important;color:#fff!important}.text-bg-info{background:var(--green)!important;color:#fff!important}.text-bg-light{background:#f3f3f3!important;color:#111!important;border:1px solid #e4e4e4!important}.text-muted{color:#666!important}
/* login full black */
.s4k-guest-body{background:#000!important;color:#fff}.s4k-login-screen{min-height:100vh;background:#000;display:grid;place-items:center;padding:28px 16px;position:relative;overflow:hidden}.s4k-login-screen:before{content:"";position:absolute;inset:-20%;background:radial-gradient(circle at 50% 8%,rgba(220,38,38,.20),transparent 24%),radial-gradient(circle at 82% 70%,rgba(22,163,74,.10),transparent 26%),linear-gradient(180deg,#000,#050505 56%,#000);pointer-events:none}.s4k-login-shell{position:relative;width:min(100%,540px);margin:auto}.s4k-login-brand{text-align:center;margin-bottom:26px}.s4k-login-crown{display:grid;place-items:center;width:64px;height:64px;margin:0 auto 12px;border-radius:20px;background:linear-gradient(135deg,var(--red),#7f0000);color:#fff;box-shadow:0 16px 44px rgba(220,38,38,.18);font-size:1.55rem}.s4k-login-title{font-size:2rem;font-weight:950;letter-spacing:.16em;color:#f5f5f5}.s4k-login-subtitle{font-size:.82rem;letter-spacing:.55em;color:#cfcfcf;font-weight:800}.s4k-login-card{background:rgba(0,0,0,.80)!important;border:1px solid #2a2a2a!important;border-radius:20px!important;padding:30px 30px 28px;box-shadow:0 34px 90px rgba(0,0,0,.78)!important}.s4k-login-card h1{font-size:1.7rem;font-weight:950;color:#fff;margin:0 0 8px}.s4k-login-card p{color:#aaa;margin:0}.s4k-login-form .form-label{color:#f2f2f2;font-size:.9rem}.s4k-input-wrap{position:relative}.s4k-input-wrap i{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:#9c9c9c;font-size:1.05rem}.s4k-input-wrap .form-control{height:50px;background:#050505!important;border:1px solid #333!important;color:#fff!important;padding-left:46px;border-radius:12px}.s4k-input-wrap .form-control::placeholder{color:#777}.s4k-input-wrap .form-control:focus{border-color:#555!important;box-shadow:0 0 0 .18rem rgba(255,255,255,.06)!important}.s4k-login-options{font-size:.86rem;color:#d6d6d6}.s4k-login-options a{color:var(--green);font-weight:850}.s4k-login-submit{height:54px;border:0;border-radius:12px;background:var(--red);color:#fff;font-weight:950;letter-spacing:.24em;display:flex;align-items:center;justify-content:center;gap:14px}.s4k-login-submit:hover{background:var(--red-dark);color:#fff}.s4k-login-divider{display:flex;align-items:center;gap:14px;margin:24px 0 18px;color:#888;font-weight:850;font-size:.8rem}.s4k-login-divider span{height:1px;background:#2d2d2d;flex:1}.s4k-login-divider em{font-style:normal}.s4k-help-btn{height:52px;border:1px solid #2d2d2d;border-radius:12px;display:flex;align-items:center;gap:12px;color:#f4f4f4;background:#030303;padding:0 16px;font-weight:900}.s4k-help-btn:hover{border-color:var(--green);color:#fff}.s4k-help-btn .bi-chat-dots-fill{color:var(--green)}.s4k-login-foot{text-align:center;color:#aaa;font-size:.82rem;margin-top:20px}.s4k-login-foot i{color:var(--green);margin-right:6px}
/* admin shell */
.s4k-admin-body{background:#f6f6f6}.s4k-admin-shell{display:grid;grid-template-columns:242px minmax(0,1fr);gap:18px;align-items:start}.s4k-admin-sidebar{position:sticky;top:78px}.s4k-side-card{background:#070707;border:1px solid #1d1d1d;border-radius:16px;padding:12px;min-height:calc(100vh - 102px);box-shadow:var(--shadow-lg)}.s4k-side-brand{display:flex;align-items:center;gap:10px;padding:8px 8px 15px;border-bottom:1px solid #1f1f1f;margin-bottom:10px;color:#fff}.s4k-side-logo{width:38px;height:38px;border-radius:12px;background:var(--red);display:grid;place-items:center;color:#fff}.s4k-side-brand strong{display:block;letter-spacing:.12em;font-weight:950;font-size:.92rem}.s4k-side-brand small{display:block;color:#9c9c9c;font-weight:800;font-size:.66rem;letter-spacing:.18em}.s4k-side-title{color:#858585;text-transform:uppercase;letter-spacing:.14em;font-size:.68rem;font-weight:950;padding:6px 8px 8px}.s4k-side-list{display:flex;flex-direction:column;gap:4px}.s4k-side-link{display:flex;align-items:center;gap:10px;color:#e8e8e8;padding:9px 10px;border-radius:10px;font-weight:850;font-size:.9rem;border:1px solid transparent}.s4k-side-link i{width:20px;text-align:center;color:#c7c7c7}.s4k-side-link:hover{background:#171717;color:#fff;border-color:#242424}.s4k-side-link.active{background:var(--red);color:#fff}.s4k-side-link.active i{color:#fff}.s4k-side-link.danger{color:#fff;background:rgba(220,38,38,.12)}.s4k-admin-content{min-width:0}.s4k-page-head{display:flex;justify-content:space-between;align-items:flex-end;gap:1rem;margin-bottom:14px;padding:16px 18px;border:1px solid var(--line);border-radius:16px;background:#fff;box-shadow:var(--shadow)}.s4k-page-head h1{font-size:1.55rem;font-weight:950;letter-spacing:-.04em;margin:0}.s4k-page-head p{margin:.25rem 0 0;color:#666}.s4k-eyebrow{text-transform:uppercase;letter-spacing:.14em;font-size:.68rem;font-weight:950;color:var(--red);margin-bottom:3px}.s4k-stat-card{height:100%;display:flex;align-items:center;gap:12px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:14px;box-shadow:var(--shadow)}.s4k-stat-icon{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:#f4f4f4;color:var(--red);font-size:1.25rem}.s4k-stat-card .h2{font-size:1.8rem;letter-spacing:-.05em}.s4k-stat-card .small{font-weight:800}.table{--bs-table-bg:transparent;font-size:.84rem;margin-bottom:0}.table>thead th{font-size:.68rem;color:#111;text-transform:uppercase;letter-spacing:.06em;font-weight:950;background:#f4f4f4;border-bottom:1px solid var(--line);white-space:nowrap;padding:.62rem .7rem}.table>tbody td{vertical-align:middle;border-color:#eeeeee;padding:.58rem .7rem}.table-hover>tbody>tr:hover>*{background:#fafafa}.table-responsive{border-radius:12px}.pagination{gap:.25rem}.page-link{border-radius:9px!important;color:#111;border-color:#e5e5e5}.active>.page-link{background:var(--red);border-color:var(--red);color:#fff}
/* member dashboard and renewal v12 */
.s4k-member-body{background:#f6f6f6}.s4k-info-list{display:grid;gap:8px}.s4k-info-list>div{display:flex;justify-content:space-between;gap:12px;border-bottom:1px solid #eee;padding-bottom:8px}.s4k-info-list span{color:#666;font-weight:800}.s4k-info-list strong{text-align:right}.s4k-bank-box{border:1px solid var(--line);border-radius:12px;background:#fafafa;padding:12px}.s4k-package-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(155px,1fr));gap:8px}.s4k-package-card{position:relative;display:flex;flex-direction:column;gap:3px;border:1px solid #dedede;border-radius:12px;background:#fff;padding:10px 12px;cursor:pointer;transition:.12s ease;min-height:96px}.s4k-package-card:hover{border-color:var(--red);box-shadow:0 8px 18px rgba(0,0,0,.06)}.s4k-package-card.active{border-color:var(--red);background:#fff5f5;box-shadow:0 0 0 .16rem rgba(220,38,38,.10)}.s4k-package-check{position:absolute;right:8px;top:8px;width:22px;height:22px;border-radius:999px;display:grid;place-items:center;background:#eee;color:#777;font-size:.75rem}.s4k-package-card.active .s4k-package-check{background:var(--green);color:#fff}.s4k-package-name{font-weight:950;color:#111;padding-right:26px;line-height:1.18}.s4k-package-days{font-weight:850;color:var(--green);font-size:.86rem}.s4k-package-price{font-weight:950;color:var(--red);font-size:1rem}.s4k-selected-package{display:flex;flex-direction:column;justify-content:center;gap:2px;min-height:42px;border:1px solid #dedede;border-radius:10px;background:#fafafa;padding:.52rem .65rem;font-size:.82rem}.s4k-selected-package strong{color:#111;line-height:1.15}.s4k-selected-package span:not(.text-muted){color:#555;font-weight:800}.form-control:disabled,.form-select:disabled{background:#f2f2f2!important;color:#888!important;cursor:not-allowed}#submitRenewalBtn:disabled{background:#999!important;border-color:#999!important;cursor:not-allowed;opacity:.75}
/* forms dense */
.row.g-4{--bs-gutter-x:1rem;--bs-gutter-y:1rem}.row.g-3{--bs-gutter-x:.75rem;--bs-gutter-y:.75rem}.accordion-button:not(.collapsed){background:#f4f4f4;color:#111}.accordion-button:focus{box-shadow:0 0 0 .18rem rgba(220,38,38,.12);border-color:var(--red)}
@media(max-width:1199.98px){.s4k-admin-shell{grid-template-columns:1fr}.s4k-admin-sidebar{position:static}.s4k-side-card{min-height:auto}.s4k-side-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.s4k-side-brand{padding-bottom:10px}}
@media(max-width:767.98px){body.s4k-body{font-size:13px}.s4k-side-list{grid-template-columns:1fr}.s4k-page-head{align-items:flex-start;flex-direction:column;padding:14px}.s4k-page-head h1{font-size:1.28rem}.card-body{padding:.85rem!important}.s4k-login-card{padding:24px 18px}.s4k-login-title{font-size:1.55rem}.s4k-login-subtitle{letter-spacing:.28em}.s4k-package-grid{grid-template-columns:1fr}.table{font-size:.78rem}}


/* v12 package confirmation renewal flow */
.s4k-renew-flow{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid var(--line);border-radius:14px;background:#fafafa}
.s4k-flow-step{display:flex;align-items:center;gap:8px;color:#777;font-weight:950;font-size:.86rem;white-space:nowrap}
.s4k-flow-step span{display:grid;place-items:center;width:26px;height:26px;border-radius:999px;background:#e8e8e8;color:#555;font-weight:950}
.s4k-flow-step.active span,.s4k-flow-step.done span{background:var(--red);color:#fff}
.s4k-flow-step.done span{background:var(--green)}
.s4k-flow-step.active,.s4k-flow-step.done{color:#111}
.s4k-flow-line{height:2px;background:#e3e3e3;flex:1;border-radius:99px}
.s4k-package-card{appearance:none;text-align:left;border:1px solid #dedede}
.s4k-package-card .s4k-package-detail{font-weight:850;color:#333;font-size:.86rem}
.s4k-package-card .s4k-package-action{margin-top:auto;display:inline-flex;align-items:center;justify-content:center;height:28px;border-radius:8px;background:#111;color:#fff;font-weight:950;font-size:.78rem}
.s4k-package-card.active .s4k-package-action{background:var(--red)}
.s4k-confirm-box{display:flex;align-items:center;justify-content:space-between;gap:14px;border:1px solid var(--line);border-radius:14px;background:#fff;padding:12px 14px;box-shadow:0 8px 22px rgba(0,0,0,.04)}
.s4k-selected-package-text{font-weight:950;color:#111;line-height:1.25}.s4k-selected-package-text strong{color:var(--red)}
@media(max-width:767.98px){.s4k-renew-flow{align-items:flex-start}.s4k-flow-step{font-size:.78rem;white-space:normal}.s4k-confirm-box{align-items:stretch;flex-direction:column}.s4k-confirm-box .btn{width:100%}}

/* v13 compact member admin controls */
.s4k-compact-card .card-body{padding:1rem}.s4k-member-table{font-size:.875rem}.s4k-member-table th{font-size:.72rem;text-transform:uppercase;letter-spacing:.04em;color:#6b7280;background:#f8fafc;border-bottom:1px solid #e5e7eb}.s4k-member-table td{padding:.65rem .55rem}.s4k-info-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.45rem}.s4k-info-grid>div{border:1px solid #e5e7eb;background:#fff;border-radius:.75rem;padding:.45rem .55rem;min-width:0}.s4k-mini-label{display:block;font-size:.68rem;color:#6b7280;line-height:1.1;margin-bottom:.15rem}.s4k-info-grid strong{font-size:.82rem;line-height:1.2}.s4k-modal-stat{border:1px solid #e5e7eb;background:#f8fafc;border-radius:.9rem;padding:.65rem}.s4k-modal-stat span{display:block;font-size:.74rem;color:#6b7280}.s4k-modal-stat strong{font-size:1rem}.btn-group-sm>.btn,.btn-sm{border-radius:.55rem!important}@media(max-width:768px){.s4k-info-grid{grid-template-columns:1fr}.s4k-member-table{font-size:.82rem}.s4k-member-table td{padding:.55rem .4rem}}

/* v14 dense member list for large data sets */
.s4k-page-title-sm{font-size:1.25rem;letter-spacing:-.03em}.s4k-member-toolbar{display:flex;align-items:center;justify-content:space-between;gap:.6rem}.s4k-search-box{max-width:560px}.s4k-perpage{width:76px}.s4k-member-list-card{overflow:hidden}.s4k-member-table-dense{font-size:.78rem}.s4k-member-table-dense thead th{position:sticky;top:0;z-index:1;background:#f3f4f6!important;padding:.42rem .5rem!important;font-size:.62rem;letter-spacing:.05em;color:#111!important}.s4k-member-table-dense tbody td{padding:.34rem .5rem!important;line-height:1.18}.s4k-member-table-dense tbody tr{height:42px}.s4k-member-table-dense .s4k-col-user{min-width:190px}.s4k-member-table-dense .s4k-col-date{width:92px}.s4k-member-table-dense .s4k-col-days{width:72px}.s4k-member-table-dense .s4k-col-house{max-width:120px}.s4k-member-table-dense .s4k-col-head{min-width:180px;max-width:240px}.s4k-member-table-dense .s4k-col-status{width:86px}.s4k-member-table-dense .s4k-col-actions{width:130px}.s4k-avatar-sm{flex:0 0 auto;display:grid;place-items:center;width:26px;height:26px;border-radius:8px;background:#111;color:#fff;font-size:.62rem;font-weight:950}.s4k-one-line{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.min-w-0{min-width:0}.s4k-email-line{font-size:.72rem;max-width:210px}.s4k-head-mail{max-width:230px}.s4k-days-pill{display:inline-flex;align-items:center;justify-content:center;min-width:38px;height:22px;padding:0 .45rem;border-radius:999px;font-size:.72rem;font-weight:950}.s4k-days-pill.success{background:#eafaf0;color:#087b34;border:1px solid #bce8c9}.s4k-days-pill.danger{background:#fff0f0;color:#b91c1c;border:1px solid #ffd0d0}.s4k-status-badge{font-size:.66rem;padding:.34em .55em}.s4k-icon-btn{padding:.22rem .42rem!important;border-radius:.48rem!important;font-size:.74rem!important}.s4k-pagination-wrap .pagination{margin-bottom:0}.s4k-pagination-wrap .page-link{padding:.24rem .48rem;font-size:.76rem}.s4k-modal-stat.compact{padding:.45rem .55rem;border-radius:.7rem}.s4k-modal-stat.compact span{font-size:.66rem}.s4k-modal-stat.compact strong{font-size:.84rem}.modal-sm .form-control-sm{min-height:34px}.card-footer{border-top:1px solid #eee!important}
@media(max-width:991.98px){.s4k-member-toolbar{align-items:stretch;flex-direction:column}.s4k-search-box{max-width:none}.s4k-member-table-dense{font-size:.74rem}.s4k-member-table-dense tbody td{padding:.32rem .42rem!important}.s4k-email-line{max-width:170px}.s4k-head-mail{max-width:180px}}

/* v16 bank account copy + image */
.s4k-bank-image-wrap {
  width: 100%;
  border: 1px solid rgba(17,24,39,.1);
  background: #fff;
  border-radius: 16px;
  padding: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.s4k-bank-image {
  max-width: 100%;
  max-height: 220px;
  object-fit: contain;
  border-radius: 12px;
  display: block;
}
.s4k-account-copy-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  border: 1px solid rgba(220,38,38,.18);
  background: rgba(220,38,38,.04);
  border-radius: 14px;
  padding: 10px 12px;
}
.s4k-account-copy-row .h5 {
  font-size: 1.05rem;
  word-break: break-all;
}
.s4k-copy-btn {
  flex: 0 0 auto;
  white-space: nowrap;
}
.s4k-bank-preview-admin {
  min-height: 68px;
  border: 1px solid rgba(17,24,39,.1);
  background: #fff;
  border-radius: 14px;
  padding: 10px;
  display: flex;
  align-items: center;
  gap: 12px;
}
.s4k-bank-preview-admin img {
  width: 72px;
  height: 72px;
  object-fit: cover;
  border-radius: 12px;
  border: 1px solid rgba(17,24,39,.1);
}
.s4k-empty-image {
  width: 56px;
  height: 56px;
  border-radius: 12px;
  background: #111827;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.4rem;
  flex: 0 0 auto;
}
@media (max-width: 575.98px) {
  .s4k-account-copy-row { align-items: stretch; flex-direction: column; }
  .s4k-copy-btn { width: 100%; }
}

/* v17 popup image, slip preview, compact boxed member details */
.s4k-image-thumb-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:0;
  background:transparent;
  padding:0;
  margin:0;
  cursor:zoom-in;
  border-radius:12px;
  overflow:hidden;
}
.s4k-image-thumb-btn:focus-visible{outline:3px solid rgba(220,38,38,.28);outline-offset:2px}
.s4k-modal-image{max-width:100%;max-height:78vh;object-fit:contain;border-radius:12px;background:#111}
.s4k-bank-preview-admin .s4k-image-thumb-btn{width:72px;height:72px;flex:0 0 auto;border:1px solid rgba(17,24,39,.1);background:#fff}
.s4k-bank-preview-admin .s4k-image-thumb-btn img{width:72px;height:72px;object-fit:cover;border:0;border-radius:12px}
.s4k-bank-image-wrap .s4k-image-thumb-btn{background:#fff}
.s4k-slip-preview{border:1px solid var(--line);background:#fff;border-radius:14px;padding:10px;max-width:280px}
.s4k-slip-preview img{width:100%;max-height:190px;object-fit:contain;border-radius:10px;background:#f7f7f7;border:1px solid #eee}
.s4k-renewal-success-modal{box-shadow:0 24px 80px rgba(0,0,0,.28)}
.s4k-success-icon{width:64px;height:64px;border-radius:999px;background:var(--green);color:#fff;display:grid;place-items:center;font-size:2.1rem;box-shadow:0 14px 36px rgba(22,163,74,.25)}
.s4k-member-table-boxed .s4k-col-user{width:260px;min-width:220px}.s4k-member-table-boxed .s4k-col-details{min-width:380px}.s4k-member-table-boxed .s4k-col-status{width:100px}.s4k-member-table-boxed .s4k-col-actions{width:150px}.s4k-member-table-boxed tbody tr{height:auto}.s4k-member-table-boxed tbody td{padding:.42rem .5rem!important}.s4k-member-detail-box{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border:1px solid #e1e1e1;border-radius:10px;background:#fff;overflow:hidden;max-width:640px}.s4k-member-detail-box>div{display:flex;align-items:center;justify-content:space-between;gap:8px;min-width:0;padding:.28rem .48rem;border-right:1px solid #ededed;border-bottom:1px solid #ededed;line-height:1.15}.s4k-member-detail-box>div:nth-child(2n){border-right:0}.s4k-member-detail-box>div:nth-last-child(-n+2){border-bottom:0}.s4k-member-detail-box span{font-size:.66rem;color:#666;font-weight:900;white-space:nowrap}.s4k-member-detail-box strong{font-size:.74rem;color:#111;font-weight:900;min-width:0;text-align:right}.s4k-member-detail-box .s4k-days-pill{height:20px;font-size:.68rem;min-width:34px}.s4k-member-table-boxed .s4k-email-line{max-width:230px}
@media(max-width:991.98px){.s4k-member-table-boxed .s4k-col-details{min-width:300px}.s4k-member-detail-box{grid-template-columns:1fr}.s4k-member-detail-box>div{border-right:0}.s4k-member-detail-box>div:nth-last-child(-n+2){border-bottom:1px solid #ededed}.s4k-member-detail-box>div:last-child{border-bottom:0}.s4k-modal-image{max-height:72vh}}
@media(max-width:575.98px){.s4k-slip-preview{max-width:100%}.s4k-member-table-boxed .s4k-col-user{min-width:180px}.s4k-member-table-boxed .s4k-col-details{min-width:260px}.s4k-member-detail-box span{font-size:.62rem}.s4k-member-detail-box strong{font-size:.7rem}}

/* v18 renewal history management */
.s4k-renewal-stats .s4k-mini-stat{background:#fff;border:1px solid rgba(15,23,42,.08);border-radius:14px;padding:10px 12px;min-height:64px;box-shadow:0 8px 22px rgba(15,23,42,.04)}
.s4k-mini-stat span{display:block;font-size:12px;color:#64748b;font-weight:700;margin-bottom:3px}
.s4k-mini-stat strong{font-size:22px;line-height:1;color:#0f172a}
.s4k-mini-stat.danger{border-left:4px solid #dc2626}.s4k-mini-stat.success{border-left:4px solid #16a34a}.s4k-mini-stat.muted{border-left:4px solid #111827}
.s4k-renewal-table{font-size:12.5px}.s4k-renewal-table thead th{font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:#475569;background:#f8fafc;border-bottom:1px solid #e5e7eb;padding:8px 10px;white-space:nowrap}.s4k-renewal-table tbody td{padding:8px 10px;vertical-align:middle}.s4k-renewal-table .btn-sm{--bs-btn-padding-y:.18rem;--bs-btn-padding-x:.45rem;--bs-btn-font-size:.75rem}.s4k-renewal-table .badge{font-size:11px}.s4k-compact-card .form-control-sm,.s4k-compact-card .form-select-sm{font-size:12.5px}.s4k-compact-card .form-label{color:#334155}.s4k-pagination-wrap .pagination{margin-bottom:0}.s4k-pagination-wrap .page-link{padding:.22rem .5rem;font-size:12px}
@media(max-width:768px){.s4k-renewal-table{font-size:12px}.s4k-renewal-table thead th,.s4k-renewal-table tbody td{padding:7px 8px}.s4k-mini-stat strong{font-size:18px}}


/* v20 security/performance UX additions */
.s4k-toast { box-shadow: 0 18px 55px rgba(0,0,0,.25); border-radius: 14px; overflow: hidden; }
@media (max-width: 768px) {
  .s4k-col-hide-mobile { display: none !important; }
  .table-responsive .table td,
  .table-responsive .table th { white-space: nowrap; font-size: .84rem; }
}

/* v22 family group compact ordering + expiry UI */
.s4k-dense-table > :not(caption) > * > * {
    padding: .5rem .65rem;
    font-size: .9rem;
}
.s4k-info-box.compact {
    border: 1px solid rgba(15, 23, 42, .08);
    border-radius: 14px;
    background: #fff;
    padding: .45rem .65rem;
    line-height: 1.45;
    font-size: .86rem;
}
@media (max-width: 768px) {
    .s4k-dense-table > :not(caption) > * > * {
        white-space: nowrap;
        font-size: .82rem;
    }
}

/* v23 - created member copy message */
.s4k-created-message-panel{border:1px solid rgba(25,135,84,.18);background:linear-gradient(180deg,#f0fff6,#ffffff)!important;color:#0f2417!important;border-radius:18px!important;}
.s4k-member-message-card{background:#fff;border:1px solid rgba(0,0,0,.08);border-radius:16px;padding:14px;box-shadow:0 8px 22px rgba(0,0,0,.05);}
.s4k-member-message-card .s4k-copy-box{font-size:.88rem;line-height:1.55;background:#fafafa;border-color:#e7e7e7;color:#111;resize:vertical;}
.s4k-copy-done{background:#198754!important;border-color:#198754!important;color:#fff!important;}
.s4k-template-token-box{min-height:38px;border:1px dashed #ddd;border-radius:12px;padding:8px 10px;background:#fafafa;display:flex;flex-wrap:wrap;gap:6px;align-items:center;}
.s4k-template-token-box code{background:#111;color:#fff;border-radius:999px;padding:4px 8px;font-size:.8rem;}

/* v24 premium member dashboard UX/UI */
.s4k-member-premium-shell{max-width:1280px;margin:0 auto}.s4k-stack{display:flex;flex-direction:column}.s4k-member-hero{position:relative;overflow:hidden;border-radius:28px;background:#070707;color:#fff;box-shadow:0 26px 80px rgba(0,0,0,.22)}.s4k-member-hero-bg{position:absolute;inset:0;background:radial-gradient(circle at 18% 18%,rgba(220,38,38,.48),transparent 33%),radial-gradient(circle at 88% 0%,rgba(255,255,255,.13),transparent 32%),linear-gradient(135deg,#080808,#151515 52%,#3a0505)}.s4k-member-hero-content{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:24px;align-items:stretch;padding:28px}.s4k-eyebrow-light{color:#ffb4b4!important}.s4k-hero-left{display:flex;flex-direction:column;justify-content:center;min-height:245px}.s4k-hero-left h1{font-size:clamp(2rem,4vw,3.6rem);line-height:.95;font-weight:950;letter-spacing:-.075em;margin:0 0 .7rem}.s4k-hero-left p{max-width:620px;color:rgba(255,255,255,.74);font-size:1rem;margin:0}.s4k-hero-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}.s4k-hero-actions .btn{box-shadow:0 14px 32px rgba(0,0,0,.2)}.s4k-hero-cta{background:linear-gradient(135deg,#ef4444,#b91c1c)!important;border:0!important}.s4k-hero-status-card{display:flex;flex-direction:column;justify-content:space-between;border:1px solid rgba(255,255,255,.16);border-radius:24px;background:rgba(255,255,255,.1);backdrop-filter:blur(14px);padding:22px;box-shadow:inset 0 1px 0 rgba(255,255,255,.16)}.s4k-status-topline{display:flex;align-items:center;justify-content:space-between;gap:14px;color:rgba(255,255,255,.8);font-weight:900}.s4k-status-topline span{display:inline-flex;align-items:center;border:1px solid rgba(255,255,255,.14);border-radius:999px;padding:7px 10px;background:rgba(255,255,255,.08);font-size:.82rem}.s4k-status-topline strong{font-size:.9rem}.s4k-days-display strong{display:block;font-size:5.2rem;line-height:.85;font-weight:950;letter-spacing:-.08em}.s4k-days-display span{color:rgba(255,255,255,.7);font-weight:900}.s4k-status-progress{height:9px;border-radius:999px;background:rgba(255,255,255,.16);overflow:hidden;margin-top:18px}.s4k-status-progress span{display:block;height:100%;border-radius:inherit;background:#16a34a}.s4k-status-progress.warning span{background:#f59e0b}.s4k-status-progress.danger span{background:#ef4444}.s4k-status-note{margin-top:12px;color:rgba(255,255,255,.68);font-size:.86rem}.s4k-premium-card{border-radius:24px!important;box-shadow:0 18px 55px rgba(15,23,42,.08)!important}.s4k-section-title{display:flex;align-items:center;justify-content:space-between;gap:12px}.s4k-section-title span,.s4k-block-heading span{display:block;text-transform:uppercase;letter-spacing:.12em;font-size:.66rem;font-weight:950;color:var(--red)}.s4k-section-title h5,.s4k-renew-header h4{margin:0;font-weight:950;letter-spacing:-.035em}.s4k-section-title>i{display:grid;place-items:center;width:42px;height:42px;border-radius:14px;background:#111;color:#fff}.s4k-profile-block{display:flex;align-items:center;gap:12px;border:1px solid rgba(15,23,42,.08);border-radius:18px;background:linear-gradient(180deg,#fff,#fafafa);padding:12px}.s4k-profile-avatar{display:grid;place-items:center;width:48px;height:48px;border-radius:16px;background:#111;color:#fff;font-size:1.1rem;font-weight:950;text-transform:uppercase}.s4k-info-list-premium>div{border:0!important;background:#fafafa;border-radius:14px;padding:10px 12px!important}.s4k-info-list-premium strong{max-width:62%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.s4k-bank-box-premium{border-radius:20px!important;background:linear-gradient(180deg,#fafafa,#fff)!important;padding:14px!important}.s4k-bank-meta{display:grid;grid-template-columns:1fr;gap:8px}.s4k-bank-meta>div{display:flex;align-items:center;justify-content:space-between;gap:12px;border:1px solid rgba(15,23,42,.07);border-radius:14px;background:#fff;padding:10px 12px}.s4k-bank-meta span,.s4k-account-copy-row-premium span{font-size:.76rem;font-weight:900;color:#64748b}.s4k-account-copy-row-premium{border-radius:18px!important;background:#111!important;color:#fff!important;border:0!important;padding:13px!important}.s4k-account-copy-row-premium .h5{color:#fff;font-weight:950;letter-spacing:.02em}.s4k-quick-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.s4k-quick-action{display:flex;align-items:center;gap:14px;border:1px solid rgba(15,23,42,.08);border-radius:22px;background:#fff;padding:16px;color:#111;box-shadow:0 12px 35px rgba(15,23,42,.06);transition:.16s ease}.s4k-quick-action:hover{transform:translateY(-2px);box-shadow:0 20px 46px rgba(15,23,42,.1);color:#111}.s4k-quick-action i{display:grid;place-items:center;width:46px;height:46px;border-radius:16px;background:#111;color:#fff;font-size:1.25rem;flex:0 0 auto}.s4k-quick-action.primary{background:linear-gradient(135deg,#fff5f5,#fff)}.s4k-quick-action.primary i{background:var(--red)}.s4k-quick-action strong{display:block;font-weight:950}.s4k-quick-action span{display:block;color:#64748b;font-size:.82rem;font-weight:800}.s4k-renew-header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}.s4k-renew-header p{margin:.25rem 0 0;color:#64748b}.s4k-review-badge{display:inline-flex;align-items:center;white-space:nowrap;border-radius:999px;background:#111;color:#fff;font-weight:950;font-size:.78rem;padding:8px 11px}.s4k-renew-flow-premium{border-radius:20px!important;background:#111!important;border:0!important;padding:14px!important}.s4k-renew-flow-premium .s4k-flow-step{color:rgba(255,255,255,.48)}.s4k-renew-flow-premium .s4k-flow-step.active,.s4k-renew-flow-premium .s4k-flow-step.done{color:#fff}.s4k-renew-flow-premium .s4k-flow-step span{background:rgba(255,255,255,.13);color:#fff}.s4k-renew-flow-premium .s4k-flow-line{background:rgba(255,255,255,.15)}.s4k-form-block,.s4k-upload-panel,.s4k-order-summary{border:1px solid rgba(15,23,42,.08);border-radius:22px;background:#fafafa;padding:16px}.s4k-block-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.s4k-block-heading strong{display:block;font-size:1rem;font-weight:950;color:#111}.s4k-package-grid-premium{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px}.s4k-package-card-premium{min-height:150px;border-radius:20px!important;padding:16px!important;border:1px solid rgba(15,23,42,.08)!important;background:#fff!important;box-shadow:0 10px 26px rgba(15,23,42,.05)}.s4k-package-card-premium:hover{transform:translateY(-2px);border-color:rgba(220,38,38,.55)!important;box-shadow:0 18px 42px rgba(15,23,42,.1)}.s4k-package-card-premium.active{background:linear-gradient(180deg,#fff5f5,#fff)!important;border-color:var(--red)!important;box-shadow:0 0 0 .18rem rgba(220,38,38,.1),0 18px 42px rgba(220,38,38,.12)!important}.s4k-package-price-premium{font-size:1.8rem;line-height:1;font-weight:950;color:var(--red);letter-spacing:-.05em;margin:.35rem 0}.s4k-package-card-premium .s4k-package-action{height:34px;border-radius:12px}.s4k-confirm-box-premium{border-radius:22px!important;background:#fff!important;padding:16px!important}.s4k-confirm-box-premium .btn{white-space:nowrap}.s4k-upload-panel .form-control-lg{border-radius:16px;border-style:dashed;min-height:52px}.s4k-order-summary{background:#111;color:#fff}.s4k-order-summary .s4k-block-heading strong{color:#fff}.s4k-order-summary .s4k-selected-package{border:1px solid rgba(255,255,255,.13);background:rgba(255,255,255,.08);border-radius:18px;min-height:104px;padding:14px;color:#fff}.s4k-order-summary .s4k-selected-package strong{color:#fff;font-size:1.05rem}.s4k-order-summary .s4k-selected-package span:not(.text-muted){color:rgba(255,255,255,.72)}.s4k-order-summary .text-muted{color:rgba(255,255,255,.55)!important}.s4k-summary-note{display:flex;gap:9px;color:rgba(255,255,255,.7);font-size:.84rem;font-weight:750}.s4k-summary-note i{color:#ffb4b4}.s4k-history-table-wrap{border:1px solid rgba(15,23,42,.08);border-radius:18px;overflow:hidden}.s4k-history-table thead th{background:#111!important;color:#fff!important}.s4k-history-table tbody tr:hover>*{background:#fff5f5!important}.s4k-slip-preview{border-radius:18px!important}.s4k-slip-preview .s4k-image-thumb-btn{width:100%}.s4k-slip-preview img{max-height:240px!important}.s4k-primary-btn:not(:disabled){box-shadow:0 16px 34px rgba(220,38,38,.25)}
@media(max-width:991.98px){.s4k-member-hero-content{grid-template-columns:1fr}.s4k-hero-left{min-height:auto}.s4k-hero-status-card{min-height:220px}.s4k-days-display strong{font-size:4.4rem}.s4k-renew-header{flex-direction:column}.s4k-review-badge{align-self:flex-start}}
@media(max-width:767.98px){.s4k-member-hero{border-radius:22px}.s4k-member-hero-content{padding:18px}.s4k-hero-actions .btn{width:100%}.s4k-quick-grid{grid-template-columns:1fr}.s4k-renew-flow-premium{align-items:stretch;flex-direction:column}.s4k-renew-flow-premium .s4k-flow-line{width:2px;height:16px;flex:0 0 auto;margin-left:13px}.s4k-confirm-box-premium .btn{width:100%}.s4k-days-display strong{font-size:3.8rem}.s4k-bank-meta>div,.s4k-account-copy-row-premium{align-items:flex-start;flex-direction:column}.s4k-account-copy-row-premium .s4k-copy-btn{width:100%}.s4k-info-list-premium strong{max-width:100%;white-space:normal}.s4k-section-title>i{width:38px;height:38px}.s4k-package-grid-premium{grid-template-columns:1fr}.s4k-renew-header h4{font-size:1.25rem}}

/* V25: Cleaner member dashboard - remove heavy top hero feel */
.s4k-member-premium-shell{max-width:1160px}
.s4k-clean-status-card{background:linear-gradient(180deg,#fff,#fafafa)!important}
.s4k-clean-status-card h4{font-weight:950;letter-spacing:-.035em;color:#111}
.s4k-clean-status-card .badge{font-weight:950;font-size:.82rem}
.s4k-clean-progress{height:7px;border-radius:999px;background:#ececec;overflow:hidden}
.s4k-clean-progress span{display:block;height:100%;border-radius:inherit;background:#16a34a}
.s4k-clean-progress.warning span{background:#f59e0b}
.s4k-clean-progress.danger span{background:#ef4444}
.s4k-renew-header-clean{padding-bottom:12px;border-bottom:1px solid rgba(15,23,42,.08)}
.s4k-renew-header-clean p{font-size:.9rem}
.s4k-renew-flow-clean{background:#fafafa!important;border:1px solid rgba(15,23,42,.08)!important;padding:10px 12px!important}
.s4k-renew-flow-clean .s4k-flow-step{color:#64748b!important}
.s4k-renew-flow-clean .s4k-flow-step.active,.s4k-renew-flow-clean .s4k-flow-step.done{color:#111!important}
.s4k-renew-flow-clean .s4k-flow-step span{background:#111!important;color:#fff!important;width:26px;height:26px}
.s4k-renew-flow-clean .s4k-flow-line{background:#e5e7eb!important}
.s4k-form-block,.s4k-upload-panel,.s4k-order-summary{padding:14px!important}
.s4k-package-card-premium{min-height:132px!important;padding:14px!important}
.s4k-package-price-premium{font-size:1.55rem!important}
.s4k-confirm-box-premium{padding:12px 14px!important}
.s4k-order-summary .s4k-selected-package{min-height:86px!important}
@media(max-width:991.98px){.s4k-renew-header-clean{flex-direction:row;align-items:center}.s4k-member-premium-shell{max-width:100%}}
@media(max-width:767.98px){.s4k-renew-header-clean{align-items:flex-start;flex-direction:column}.s4k-clean-status-card .card-body{padding:1rem!important}.s4k-package-card-premium{min-height:118px!important}}


/* V26: Focus member status card on remaining days only */
.s4k-days-left-card{overflow:hidden}
.s4k-days-left-top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.s4k-days-left-top h4{font-weight:950;letter-spacing:-.035em;color:#111}
.s4k-days-left-top>i{display:grid;place-items:center;width:42px;height:42px;border-radius:14px;background:#111;color:#fff;font-size:1.15rem}
.s4k-days-left-display{display:flex;align-items:flex-end;gap:10px;margin:18px 0 14px;padding:16px;border-radius:22px;background:#111;color:#fff}
.s4k-days-left-display strong{display:block;font-size:clamp(3.4rem,7vw,5.25rem);line-height:.78;font-weight:950;letter-spacing:-.08em}
.s4k-days-left-display span{padding-bottom:.42rem;font-size:1.12rem;font-weight:950;color:rgba(255,255,255,.76)}
.s4k-days-left-display.warning{background:linear-gradient(135deg,#111,#7c2d12)}
.s4k-days-left-display.danger{background:linear-gradient(135deg,#111,#7f1d1d)}
.s4k-days-left-display.success{background:linear-gradient(135deg,#111,#052e16)}
.s4k-days-left-meta{display:flex;align-items:center;justify-content:space-between;gap:10px;border:1px solid rgba(15,23,42,.08);border-radius:14px;background:#fff;padding:10px 12px}
.s4k-days-left-meta span{font-size:.78rem;color:#64748b;font-weight:900}
.s4k-days-left-meta strong{font-size:.95rem;color:#111;font-weight:950}
@media(max-width:767.98px){.s4k-days-left-display{padding:14px}.s4k-days-left-display strong{font-size:3.7rem}}


/* V28: Cleaner member dashboard + Sarabun font across the site */
.s4k-days-account-strip{display:flex;align-items:center;gap:12px;margin-top:16px;border:1px solid rgba(15,23,42,.08);border-radius:18px;background:linear-gradient(180deg,#fff,#fafafa);padding:12px}
.s4k-days-account-avatar{display:grid;place-items:center;width:46px;height:46px;border-radius:16px;background:#111;color:#fff;font-size:1.05rem;font-weight:950;text-transform:uppercase;flex:0 0 auto}
.s4k-days-account-username{font-size:1rem;font-weight:950;color:#111;letter-spacing:-.02em}
.s4k-days-account-email{font-size:.82rem;font-weight:800;color:#64748b;margin-top:2px}
.s4k-days-left-display{margin-top:14px!important}
.s4k-member-premium-shell .s4k-stack.gap-3{gap:1rem!important}
@media(max-width:767.98px){.s4k-days-account-strip{padding:10px}.s4k-days-account-avatar{width:42px;height:42px;border-radius:14px}}

/* v33 admin sidebar closer to screen edge */
@media (min-width: 1200px) {
  body.s4k-admin-body .s4k-main {
    max-width: none;
    padding-left: .65rem !important;
    padding-right: 1.5rem !important;
  }

  .s4k-admin-shell {
    grid-template-columns: 224px minmax(0, 1fr);
    gap: 20px;
  }

  .s4k-admin-sidebar {
    top: 72px;
  }

  .s4k-side-card {
    border-radius: 14px;
    padding: 10px;
  }

  .s4k-side-link {
    padding: 8px 9px;
    gap: 9px;
    font-size: .86rem;
  }

  .s4k-admin-content {
    width: 100%;
    max-width: 1320px;
    margin-left: auto;
    margin-right: auto;
  }
}

@media (min-width: 1600px) {
  body.s4k-admin-body .s4k-main {
    padding-left: .75rem !important;
    padding-right: 2rem !important;
  }

  .s4k-admin-content {
    max-width: 1380px;
  }
}

/* v34: member expiry warning status */
.s4k-days-pill.warning{background:#fff3cd;color:#9a6700;border-color:#ffe69c;}
.s4k-days-pill.neutral{background:#f1f3f5;color:#495057;border-color:#dee2e6;}
.s4k-status-badge.text-bg-warning{color:#4a3200!important;}