/* MAKMEESHOP v13.1.20 - Global Layout / Overlap / Responsive Fix
   Purpose: fix text overlap, card overlap, button collision and horizontal overflow across user + admin pages.
   Loaded last from app/layout.php so it safely overrides previous CSS without deleting existing design. */

/* 1) Global safe sizing --------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }
html, body { max-width: 100%; overflow-x: hidden; }
body { text-rendering: geometricPrecision; }
img, svg, video, canvas, iframe { max-width: 100%; }
img, video, canvas { height: auto; }
a, button, input, select, textarea { max-width: 100%; }
button, .btn, .btn-mini, .mini-link, .copy-btn { flex-shrink: 0; }

:where(.container,.site-header,.pro-header,.glass,.panel,.otp-market-card,.orders-panel,.otp-order-card,
.market-card,.topup-premium-card,.topup-history-premium,.topup-form-card,.topup-steps-card,
.admin-tab-panel,.admin-side-panel,.admin-grid,.admin-form-grid,.mp-card,.quote-card,.drawer-panel,
.drawer-link,.stat-card,.catalog-filter-row,.price-list-admin,.simple-table,.table-wrap) {
  min-width: 0;
}

:where(p,small,span,strong,b,em,label,th,td,li,h1,h2,h3,h4,h5,h6,.badge,.btn,.mini-link,.copy-btn,
.market-card-head,.orders-panel-head,.drawer-link,.topup-premium-card,.otp-order-card) {
  overflow-wrap: anywhere;
  word-break: normal;
}

:where(h1,h2,h3,h4,h5,h6) {
  line-height: 1.12 !important;
  letter-spacing: -0.035em;
}

:where(p,small,label,td,th,.muted,.drawer-panel-desc) { line-height: 1.55; }

/* 2) Header/logo safety --------------------------------------------------- */
.site-header.pro-header {
  width: min(100% - 24px, 1480px);
  margin-left: auto;
  margin-right: auto;
  gap: 14px;
  min-width: 0;
}
.site-header .brand,
.site-header .brand-copy,
.site-header .brand-line { min-width: 0; max-width: 100%; }
.site-header .brand-line { white-space: nowrap; }
.header-primary-nav,
.pro-header-actions { min-width: 0; }
.wallet-mini { min-width: 0; }
.wallet-mini strong,
.wallet-mini small { white-space: nowrap; }

@media (max-width: 720px) {
  .site-header.pro-header {
    width: calc(100% - 14px);
    padding: 10px 12px !important;
    border-radius: 18px !important;
  }
  .site-header .brand-line { font-size: 14px !important; }
  .site-header .brand-copy small { font-size: 8px !important; letter-spacing: .18em !important; }
  .header-primary-nav { order: 3; width: 100%; display: flex; gap: 8px; flex-wrap: wrap; }
  .header-primary-nav a { flex: 1 1 120px; justify-content: center; min-height: 42px; }
  .pro-header-actions { margin-left: auto; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
  .wallet-mini { min-width: 126px; }
}

/* 3) Dashboard / OTP order cards: prevent status/button overlap ---------- */
.orders-panel { min-width: 0; overflow: hidden; }
.orders-panel-head {
  flex-wrap: wrap;
  min-width: 0;
}
.orders-panel-head > div { min-width: 0; }
.orders-panel-head h2 {
  max-width: 100%;
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
}
.otp-order-list { min-width: 0; }
.otp-order-card {
  display: grid !important;
  grid-template-columns: minmax(190px, 1.15fr) minmax(150px, .78fr) minmax(170px, .78fr) minmax(142px, auto) !important;
  gap: 14px !important;
  align-items: center !important;
  min-width: 0 !important;
  overflow: hidden !important;
}
.otp-order-card > * { min-width: 0; }
.otp-order-main { min-width: 0; }
.otp-order-main h3,
.otp-order-main p {
  min-width: 0;
  max-width: 100%;
}
.otp-order-main h3 {
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
  line-height: 1.25 !important;
}
.otp-order-number,
.otp-order-code {
  min-width: 0 !important;
  max-width: 100%;
}
.otp-order-number strong,
.otp-order-code strong,
.phone-number,
.otp-code {
  display: block;
  max-width: 100%;
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
  line-height: 1.22 !important;
  font-size: clamp(16px, 1.35vw, 22px) !important;
  overflow-wrap: anywhere;
}
.otp-order-code .otp-code {
  color: #ffd84a;
  text-shadow: 0 0 12px rgba(255,216,74,.16);
}
.otp-order-actions {
  grid-column: auto !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  justify-content: center !important;
  gap: 8px !important;
  padding-top: 0 !important;
  min-width: 138px !important;
  max-width: 190px !important;
  width: 100% !important;
}
.otp-order-actions .inline-form,
.otp-order-actions form { width: 100%; margin: 0; }
.otp-order-actions .btn,
.otp-order-actions .btn-mini,
.otp-order-actions button {
  width: 100% !important;
  min-height: 42px;
  padding: 9px 12px !important;
  white-space: normal !important;
  line-height: 1.2;
  text-align: center;
}
.otp-order-actions .badge.order-status,
.otp-order-actions .order-status {
  display: inline-flex;
  width: 100%;
  justify-content: center;
  align-items: center;
  min-height: 30px;
  padding: 6px 9px;
  white-space: normal;
  line-height: 1.2;
  text-align: center;
}

@media (max-width: 1180px) {
  .otp-order-card {
    grid-template-columns: minmax(180px, 1fr) minmax(150px, .9fr) minmax(160px, .9fr) !important;
  }
  .otp-order-actions {
    grid-column: 1 / -1 !important;
    max-width: none !important;
    min-width: 0 !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    justify-content: flex-start !important;
  }
  .otp-order-actions .badge.order-status { width: auto; min-width: 130px; }
  .otp-order-actions .inline-form,
  .otp-order-actions form { width: auto; flex: 1 1 150px; max-width: 220px; }
}

@media (max-width: 760px) {
  .otp-order-card {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
    padding: 14px !important;
  }
  .otp-order-main { align-items: flex-start !important; }
  .otp-order-icon { width: 42px; height: 42px; border-radius: 14px; }
  .otp-order-actions {
    grid-column: auto !important;
    flex-direction: column !important;
  }
  .otp-order-actions .inline-form,
  .otp-order-actions form,
  .otp-order-actions .badge.order-status { width: 100% !important; max-width: none; }
}

/* 4) Catalog / service-country cards ------------------------------------- */
.otp-market-grid,
.catalog-layout,
.simple-main .catalog-layout { min-width: 0; }
.market-card,
.catalog-picker,
.catalog-column,
.catalog-list,
.catalog-service-row,
.catalog-country-row,
.service-list-item,
.country-list-item,
.catalog-row,
.server-choice-btn {
  min-width: 0;
  max-width: 100%;
}
.catalog-service-row *,
.catalog-country-row *,
.service-list-item *,
.country-list-item * { min-width: 0; }
.catalog-service-row strong,
.catalog-country-row strong,
.service-list-item strong,
.country-list-item strong {
  white-space: normal !important;
  overflow-wrap: anywhere;
}

@media (max-width: 980px) {
  .otp-market-grid,
  .catalog-layout,
  .simple-main .catalog-layout {
    grid-template-columns: 1fr !important;
  }
  .orders-panel { min-height: 0 !important; }
}

/* 5) Forms, buttons and admin panels ------------------------------------- */
input, select, textarea {
  min-width: 0 !important;
  width: 100%;
}
textarea { resize: vertical; }
.inline-form { min-width: 0; }
.admin-grid,
.wallet-grid,
.payment-grid,
.price-edit-grid,
.mp-admin-grid {
  min-width: 0;
}
.admin-form-grid,
.form-grid,
.mp-filter-row,
.dashboard-topup-actions,
.card-head,
.panel-head,
.drawer-panel-actions {
  min-width: 0;
  flex-wrap: wrap;
}
.admin-form-grid {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr)) !important;
}
.admin-form-grid .span-2 { grid-column: 1 / -1; }
.mp-filter-row input,
.mp-filter-row select,
.price-list-admin input { max-width: 100%; }

@media (max-width: 800px) {
  .admin-grid,
  .wallet-grid,
  .payment-grid,
  .mp-admin-grid,
  .price-edit-grid {
    grid-template-columns: 1fr !important;
  }
  .upload-row,
  .mini-form,
  .order-builder {
    grid-template-columns: 1fr !important;
  }
  .card-head,
  .panel-head { align-items: stretch !important; }
  .card-head > *, .panel-head > * { min-width: 0; }
}

/* 6) Tables: contain overflow instead of breaking page ------------------- */
.table-wrap,
.simple-table,
.topup-table-wrap,
.topup-history-table,
.admin-table-wrap {
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
table { max-width: 100%; }
th, td { vertical-align: middle; }
td .btn, td button, td a { max-width: 100%; }

/* 7) Drawer / side menu panels ------------------------------------------ */
.simple-drawer,
.drawer-panel,
.drawer-links,
.drawer-link { min-width: 0; }
.drawer-link {
  gap: 10px;
  align-items: center;
}
.drawer-link > span:not(.drawer-link-icon),
.drawer-link strong,
.drawer-link b { min-width: 0; }
.drawer-panel input,
.drawer-panel select,
.drawer-panel textarea { width: 100%; }
.drawer-panel .btn { white-space: normal; }

/* 8) Topup page extra safety -------------------------------------------- */
.topup-premium-shell,
.topup-premium-grid,
.topup-payment-info,
.topup-payment-qr-wrap,
.topup-payment-qr,
.topup-channel-qr,
.topup-premium-table {
  min-width: 0;
  max-width: 100%;
}
.topup-payment-qr,
.topup-channel-qr,
.topup-payment-qr img,
.topup-channel-qr img {
  max-width: min(100%, 320px) !important;
  height: auto !important;
  margin-left: auto;
  margin-right: auto;
}
.topup-payment-address,
.topup-copy-value,
.wallet-address,
.bank-account-number {
  overflow-wrap: anywhere;
  word-break: break-word;
}

/* 9) Light mode readability --------------------------------------------- */
html[data-theme="light"] .otp-order-code .otp-code { color: #955500 !important; text-shadow: none; }
html[data-theme="light"] .otp-order-actions .badge.order-status { color: #10223b; }

/* =========================================================
   MAKMEESHOP v13.1.50 - All Pages QA Layout Safety Net
   Scope: frontend + admin pages. Prevents text/card/button overlap without touching business logic.
   ========================================================= */
*, *::before, *::after { box-sizing: border-box; }

:where(.panel,.glass,.card,.stat-card,.otp-market-card,.otp-order-card,.topup-card-premium,.topup-destination-card,.admin-pro-card,.admin-card,.table-wrap,.drawer-panel,.drawer-link) {
  min-width: 0 !important;
}

:where(.otp-order-card,.admin-pro-card,.topup-card-premium,.topup-destination-card,.drawer-panel,.table-wrap) :where(p,span,strong,small,em,b,code,td,th,a,button,label) {
  max-width: 100%;
  overflow-wrap: anywhere;
  word-break: break-word;
}

:where(.btn,.btn-mini,button,input,select,textarea,.drawer-link,.wallet-plus,.quick-buy-btn,.copy-btn,.lang-pill,.theme-pill,.nav-toggle) {
  max-width: 100%;
}

.otp-order-card {
  align-items: center !important;
}

.otp-order-code,
.otp-order-phone,
.otp-order-status,
.otp-order-actions {
  min-width: 0 !important;
}

.otp-order-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  align-items: center !important;
  justify-content: flex-end !important;
}

.otp-order-actions form,
.otp-order-actions .btn-mini,
.otp-order-actions button {
  flex: 0 1 auto !important;
  min-width: 118px !important;
}

@media (max-width: 1180px) {
  .otp-order-actions { justify-content: flex-start !important; }
}

@media (max-width: 760px) {
  .otp-order-card { grid-template-columns: 1fr !important; }
  .otp-order-actions { width: 100% !important; justify-content: stretch !important; }
  .otp-order-actions form,
  .otp-order-actions .btn-mini,
  .otp-order-actions button { width: 100% !important; flex: 1 1 100% !important; }
  .drawer-panel-actions { flex-wrap: wrap !important; }
  .drawer-panel-actions .btn { flex: 1 1 160px !important; }
}


/* V13.1 - Order card service logo fix
   Scope: show service logo inside OTP order cards only. */
.otp-order-icon.has-service-logo{
  background:rgba(255,255,255,.08)!important;
  border:1px solid rgba(141,178,255,.18)!important;
  color:inherit!important;
  overflow:hidden!important;
}
.otp-order-icon-img{
  display:block!important;
  width:72%!important;
  height:72%!important;
  object-fit:contain!important;
  object-position:center!important;
  border-radius:8px!important;
}
.otp-order-icon.has-service-logo:empty{
  background:linear-gradient(135deg,#ff7a18,#ffd24a)!important;
  color:#07111f!important;
}

/* =========================================================
   MAKMEESHOP v14 - Table / Button / Responsive QA Fix
   Scope: visual layout only. Prevents Thai text, numbers, status badges,
   and table headers from breaking into vertical letters on mobile/admin pages.
   ========================================================= */
.table-wrap,
.topup-table-wrap,
.admin-table-wrap,
.simple-table,
.topup-history-table,
.catalog-filter-box,
.price-list-admin{
  overflow-x:auto !important;
  overflow-y:visible;
  -webkit-overflow-scrolling:touch;
  max-width:100% !important;
}
.table-wrap table,
.topup-table-wrap table,
.admin-table-wrap table,
.simple-table table,
.topup-history-table table,
.topup-premium-table{
  width:100% !important;
  min-width:760px !important;
  table-layout:auto !important;
  border-collapse:collapse;
}
.table-wrap th,
.table-wrap td,
.topup-table-wrap th,
.topup-table-wrap td,
.admin-table-wrap th,
.admin-table-wrap td,
.simple-table th,
.simple-table td,
.topup-history-table th,
.topup-history-table td,
.topup-premium-table th,
.topup-premium-table td{
  white-space:nowrap !important;
  word-break:keep-all !important;
  overflow-wrap:normal !important;
  vertical-align:middle !important;
  line-height:1.55 !important;
}
.table-wrap td code,
.topup-table-wrap td code,
.admin-table-wrap td code,
.topup-premium-table td code,
.table-wrap td .muted,
.topup-table-wrap td .muted,
.admin-table-wrap td .muted{
  white-space:nowrap !important;
  word-break:keep-all !important;
  overflow-wrap:normal !important;
}
.table-wrap td .btn,
.table-wrap td button,
.table-wrap td a,
.topup-table-wrap td .btn,
.topup-table-wrap td button,
.topup-table-wrap td a,
.admin-table-wrap td .btn,
.admin-table-wrap td button,
.admin-table-wrap td a{
  white-space:nowrap !important;
  min-width:max-content;
}
.inline-form,
.wide-inline,
.bulk-actions,
.drawer-panel-actions,
.topup-action-row{
  flex-wrap:wrap !important;
  min-width:0 !important;
}
.inline-form input,
.wide-inline input,
.bulk-actions input,
.inline-form select,
.wide-inline select,
.bulk-actions select{
  min-width:160px;
}
@media (max-width:760px){
  .table-wrap table,
  .topup-table-wrap table,
  .admin-table-wrap table,
  .simple-table table,
  .topup-history-table table,
  .topup-premium-table{
    min-width:860px !important;
  }
  .table-wrap,
  .topup-table-wrap,
  .admin-table-wrap,
  .simple-table,
  .topup-history-table{
    border-radius:18px;
  }
  .table-wrap::after,
  .topup-table-wrap::after,
  .admin-table-wrap::after{
    content:'เลื่อนตารางซ้าย–ขวาเพื่อดูข้อมูลทั้งหมด';
    display:block;
    padding:10px 12px;
    color:var(--muted);
    font-size:12px;
    text-align:center;
  }
  html[lang="en"] .table-wrap::after,
  html[lang="en"] .topup-table-wrap::after,
  html[lang="en"] .admin-table-wrap::after{
    content:'Scroll left and right to view all columns';
  }
}


/* =========================================================
   MAKMEESHOP v14.1 - Mobile Header / User Navigation Polish
   Scope: UI only for mobile header, drawer balance card, bottom nav label.
   Does not modify app/layout.php, logo assets, credit logic, provider, OTP, OAuth, SMTP, DB.
   ========================================================= */
.mobile-header-balance{display:none;}
.drawer-balance-card{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:6px 12px;
  align-items:center;
  margin:14px 0 4px;
  padding:14px 16px;
  border-radius:18px;
  border:1px solid rgba(255,216,74,.28);
  background:linear-gradient(135deg,rgba(255,216,74,.13),rgba(53,167,255,.07));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
}
.drawer-balance-card span{color:#aebfd6;font-size:13px;font-weight:900;letter-spacing:.01em;}
.drawer-balance-card strong{grid-column:1;color:#fff;font-size:22px;font-weight:1000;line-height:1.05;white-space:nowrap;}
.drawer-balance-card a{grid-column:2;grid-row:1 / span 2;align-self:center;display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:0 14px;border-radius:13px;text-decoration:none;font-weight:1000;color:#07111f!important;background:linear-gradient(135deg,var(--mk-orange,#ff8a1f),var(--mk-yellow,#ffd84a));}
.webapp-bottom-nav a span{display:block;line-height:1.15;white-space:nowrap;}

@media (max-width:760px){
  .pro-header.site-header{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    grid-template-areas:"brand actions" "balance balance" "tabs tabs"!important;
    align-items:center!important;
    gap:10px 10px!important;
    width:calc(100% - 18px)!important;
    padding:14px!important;
    border-radius:22px!important;
  }
  .pro-header.site-header > .brand{
    grid-area:brand!important;
    min-width:0!important;
    justify-self:start!important;
    max-width:100%!important;
  }
  .pro-header.site-header .brand-with-wolf{max-width:100%!important;}
  .pro-header.site-header .brand-copy{min-width:0!important;}
  .pro-header.site-header .brand-line{white-space:nowrap!important;overflow:visible!important;}
  .pro-header.site-header .brand-copy small{display:none!important;}
  .pro-header.site-header .pro-header-actions{
    grid-area:actions!important;
    justify-self:end!important;
    display:grid!important;
    grid-template-columns:repeat(3,44px)!important;
    gap:8px!important;
    align-items:center!important;
    margin:0!important;
  }
  .pro-header.site-header .pro-header-actions .wallet-mini{display:none!important;}
  .pro-header.site-header .lang-pill,
  .pro-header.site-header .theme-pill,
  .pro-header.site-header .nav-toggle{
    width:44px!important;
    height:44px!important;
    min-width:44px!important;
    min-height:44px!important;
    padding:0!important;
    border-radius:16px!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
  }
  .pro-header.site-header .nav-toggle{display:grid!important;}
  .mobile-header-balance{
    grid-area:balance!important;
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:12px!important;
    width:100%!important;
    min-height:48px!important;
    padding:10px 13px!important;
    border-radius:16px!important;
    text-decoration:none!important;
    border:1px solid rgba(255,216,74,.28)!important;
    background:linear-gradient(135deg,rgba(255,216,74,.13),rgba(53,167,255,.08))!important;
    color:#fff!important;
  }
  .mobile-header-balance span{color:#b8c8dc!important;font-size:12px!important;font-weight:900!important;white-space:nowrap!important;}
  .mobile-header-balance strong{color:#fff!important;font-size:16px!important;font-weight:1000!important;white-space:nowrap!important;margin-left:auto!important;}
  .mobile-header-balance b{display:grid!important;place-items:center!important;width:28px!important;height:28px!important;border-radius:10px!important;background:linear-gradient(135deg,var(--mk-orange,#ff8a1f),var(--mk-yellow,#ffd84a))!important;color:#07111f!important;font-size:15px!important;line-height:1!important;}
  .header-primary-nav{
    grid-area:tabs!important;
    width:100%!important;
    min-height:0!important;
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:10px!important;
    margin:0!important;
    overflow:visible!important;
    padding-top:2px!important;
  }
  .header-primary-nav a{
    width:100%!important;
    min-width:0!important;
    min-height:44px!important;
    padding:0 12px!important;
    border-radius:16px!important;
    font-size:15px!important;
    justify-content:center!important;
    white-space:nowrap!important;
  }
  .pro-header .nav.unified-header-drawer.open,
  .pro-drawer{
    padding-bottom:calc(104px + env(safe-area-inset-bottom,0px))!important;
  }
  .pro-header .nav.unified-header-drawer.open a,
  .pro-drawer-links .drawer-link{
    min-height:56px!important;
  }
  .drawer-balance-card{margin:12px 0 6px!important;}
}

@media (max-width:420px){
  .pro-header.site-header{width:calc(100% - 14px)!important;padding:12px!important;gap:9px!important;}
  .pro-header.site-header .pro-header-actions{grid-template-columns:repeat(3,40px)!important;gap:7px!important;}
  .pro-header.site-header .lang-pill,
  .pro-header.site-header .theme-pill,
  .pro-header.site-header .nav-toggle{width:40px!important;height:40px!important;min-width:40px!important;min-height:40px!important;border-radius:14px!important;}
  .mobile-header-balance{min-height:46px!important;padding:9px 11px!important;}
  .mobile-header-balance strong{font-size:15px!important;}
  .header-primary-nav a{min-height:42px!important;font-size:14px!important;}
}

html[data-theme="light"] .mobile-header-balance,
html[data-theme="light"] .drawer-balance-card{
  background:linear-gradient(135deg,rgba(255,211,77,.20),rgba(38,118,255,.08))!important;
  border-color:rgba(36,93,184,.20)!important;
}
html[data-theme="light"] .mobile-header-balance strong,
html[data-theme="light"] .drawer-balance-card strong{color:#07111f!important;}
html[data-theme="light"] .mobile-header-balance span,
html[data-theme="light"] .drawer-balance-card span{color:#4b6280!important;}

/* Production responsive guard: all frontend/admin tables and forms */
:where(.container,.panel,.glass,.card,.stat-card,.feature-card,.home-service-card,.admin-main-card,.mm-page) *{box-sizing:border-box;min-width:0}
:where(input,select,textarea,button){max-width:100%}
:where(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),select,textarea){width:100%;min-width:0}
:where(input[type="checkbox"],input[type="radio"]){width:auto;max-width:none;min-width:0}
:where(.table-wrap,.mm-table-wrap,.table-responsive,.admin-table-wrap,.topup-table-wrap,.simple-table,.topup-history-table){width:100%;max-width:100%;overflow-x:auto!important;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior-inline:contain}
:where(.table-wrap,.mm-table-wrap,.table-responsive,.admin-table-wrap,.topup-table-wrap,.simple-table,.topup-history-table) table{width:100%;min-width:760px;table-layout:auto;border-collapse:collapse}
:where(.table-wrap,.mm-table-wrap,.table-responsive,.admin-table-wrap,.topup-table-wrap,.simple-table,.topup-history-table) th{white-space:nowrap!important;word-break:normal!important;overflow-wrap:normal!important}
:where(.table-wrap,.mm-table-wrap,.table-responsive,.admin-table-wrap,.topup-table-wrap,.simple-table,.topup-history-table) td{word-break:normal!important;overflow-wrap:normal!important;vertical-align:middle}
:where(.table-wrap,.mm-table-wrap,.table-responsive,.admin-table-wrap,.topup-table-wrap,.simple-table,.topup-history-table) code,:where(.table-wrap,.mm-table-wrap,.table-responsive,.admin-table-wrap,.topup-table-wrap,.simple-table,.topup-history-table) .nowrap{white-space:nowrap!important;word-break:normal!important;overflow-wrap:normal!important}
:where(.inline-form,.wide-inline){display:flex;flex-wrap:wrap;align-items:center;gap:8px;min-width:max-content}
:where(.inline-form,.wide-inline) :where(input,select,textarea,button){width:auto;min-width:130px}
:where(.inline-form,.wide-inline) button{min-width:max-content}
:where(.panel-head,.hero-actions,.home-hero-actions,.pro-header-actions,.mm-head-actions){flex-wrap:wrap}
:where(.panel-head)>*{min-width:0}
:where(.panel-head) :where(h1,h2,h3,p){overflow-wrap:anywhere}
:where(.admin-page,.mm-admin-page) .table-wrap table{min-width:920px}
.page-admin-stripe-topup .table-wrap table{min-width:1180px!important}
.page-admin-stripe-topup .table-wrap :where(th,td){white-space:nowrap!important;word-break:normal!important;overflow-wrap:normal!important}
.page-admin-stripe-topup .table-wrap :where(code,.mono,.monospace){display:inline-block;max-width:260px;overflow:hidden;text-overflow:ellipsis;vertical-align:middle}

@media(max-width:900px){
  :where(.table-wrap,.mm-table-wrap,.table-responsive,.admin-table-wrap,.topup-table-wrap,.simple-table,.topup-history-table) :where(th,td){white-space:nowrap!important;word-break:normal!important;overflow-wrap:normal!important}
  :where(.table-wrap,.mm-table-wrap,.table-responsive,.admin-table-wrap,.topup-table-wrap,.simple-table,.topup-history-table) td.mm-wrap-cell{white-space:normal!important;min-width:240px}
  :where(.inline-form,.wide-inline){display:grid;grid-template-columns:minmax(160px,1fr);min-width:260px}
  :where(.inline-form,.wide-inline) :where(input,select,textarea,button){width:100%;min-width:0}
  :where(.panel-head,.mm-panel-head){display:grid!important;grid-template-columns:1fr!important;align-items:stretch!important;gap:12px!important}
  :where(.panel-head,.mm-panel-head) .btn{width:100%;justify-content:center}
}
@media(max-width:640px){
  :where(.panel,.glass){max-width:100%}
  :where(.section-pad){padding-left:8px!important;padding-right:8px!important}
  :where(.btn){min-height:44px}
  :where(.modal,.dialog,[role="dialog"]){max-width:calc(100vw - 20px)!important;max-height:calc(100vh - 24px)!important;overflow:auto!important}
  :where(.toast-stack){left:10px!important;right:10px!important;width:auto!important}
}

/* MAKMEESHOP Digital Marketplace */
.mm-page{--mm-border:rgba(255,255,255,.11);--mm-soft:rgba(255,255,255,.055);--mm-accent:#ffad24;--mm-blue:#2187ff;max-width:1420px}
.mm-page .muted{color:var(--muted)}
.mm-hero,.mm-admin-hero{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(300px,.65fr);gap:22px;align-items:center;padding:clamp(22px,4vw,48px);border-radius:32px}
.mm-hero h1,.mm-admin-hero h1{font-size:clamp(30px,4vw,58px);line-height:1.04;margin:.25rem 0 1rem}
.mm-hero p,.mm-admin-hero p{max-width:900px}
.mm-hero-stats{display:grid;gap:10px}
.mm-hero-stats article{display:grid;gap:5px;padding:15px;border:1px solid var(--mm-border);border-radius:20px;background:var(--mm-soft)}
.mm-hero-stats span{color:var(--muted);font-size:.84rem}.mm-hero-stats strong{font-size:1.18rem}
.mm-filter-panel{margin-top:20px;padding:18px}.mm-filter-form{display:grid;grid-template-columns:minmax(220px,1.35fr) minmax(180px,.8fr) minmax(180px,.7fr) auto;gap:12px;align-items:end}
.mm-admin-form label,.mm-filter-form label,.mm-order-form label,.mm-claim-form label{display:grid;gap:7px;align-content:start}
.mm-admin-form label>span,.mm-filter-form label>span,.mm-order-form label>span,.mm-claim-form label>span{font-size:.84rem;font-weight:700;color:var(--muted)}
.mm-category-strip{display:flex;gap:10px;overflow-x:auto;padding:18px 2px 6px;scrollbar-width:thin}
.mm-category-chip{display:flex;align-items:center;gap:8px;min-width:max-content;padding:10px 14px;border:1px solid var(--mm-border);border-radius:999px;text-decoration:none;color:inherit;background:var(--mm-soft)}
.mm-category-chip.is-active,.mm-category-chip:hover{border-color:rgba(255,173,36,.55);background:rgba(255,173,36,.12)}
.mm-product-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin-top:18px}
.mm-product-card{position:relative;border-radius:26px;overflow:hidden;display:flex;flex-direction:column}
.mm-product-media{position:relative;display:grid;place-items:center;aspect-ratio:16/10;overflow:hidden;background:linear-gradient(145deg,rgba(33,135,255,.16),rgba(255,173,36,.11));text-decoration:none}
.mm-product-media img{width:100%;height:100%;object-fit:cover}.mm-product-placeholder,.mm-detail-placeholder{display:grid;place-items:center;width:90px;height:90px;border-radius:28px;background:linear-gradient(135deg,var(--mm-blue),var(--mm-accent));font-size:42px;font-weight:900;color:#fff}
.mm-card-badges,.mm-detail-badges{position:absolute;left:12px;top:12px;display:flex;flex-wrap:wrap;gap:6px}.mm-card-badges span,.mm-detail-badges span{padding:5px 8px;border-radius:999px;background:rgba(4,13,28,.82);border:1px solid rgba(255,255,255,.14);font-size:.72rem;color:#fff}
.mm-product-body{position:relative;display:flex;flex-direction:column;gap:10px;padding:17px;height:100%}.mm-product-body small{color:var(--muted)}.mm-product-body h2{font-size:1.08rem;line-height:1.3;margin:0}.mm-product-body h2 a{color:inherit;text-decoration:none}.mm-card-description{color:var(--muted);font-size:.9rem;line-height:1.55;margin:0;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.mm-product-meta,.mm-product-footer{display:flex;align-items:center;justify-content:space-between;gap:10px}.mm-product-meta{font-size:.76rem}.mm-product-meta span{padding:5px 8px;border-radius:999px;background:var(--mm-soft)}.mm-product-footer{margin-top:auto}.mm-product-footer strong{font-size:1.25rem;color:#ffd575}.is-ready{color:#7ff0b2!important}.is-empty{color:#ff9a9a!important}
.mm-favorite-form{position:absolute;right:12px;top:-46px}.mm-favorite-btn{width:38px;height:38px;border-radius:13px;border:1px solid var(--mm-border);background:rgba(4,13,28,.82);color:#9fb1c7;font-size:18px;cursor:pointer}.mm-favorite-btn.is-active{color:#ffd34e;border-color:#ffd34e}
.mm-empty{text-align:center;padding:28px}.mm-grid-empty{grid-column:1/-1}
.mm-breadcrumb{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:16px;color:var(--muted)}.mm-breadcrumb a{color:inherit;text-decoration:none}.mm-breadcrumb b{color:var(--text)}
.mm-detail-grid{display:grid;grid-template-columns:minmax(300px,.8fr) minmax(0,1.2fr);gap:20px}.mm-detail-media{position:relative;min-height:430px;display:grid;place-items:center;overflow:hidden;border-radius:30px}.mm-detail-media>img{width:100%;height:100%;object-fit:cover}.mm-detail-summary{padding:clamp(22px,4vw,42px)}.mm-detail-summary h1{font-size:clamp(30px,4vw,52px);line-height:1.08;margin:.3rem 0}.mm-detail-price{font-size:clamp(28px,4vw,46px);font-weight:900;color:#ffd575;margin:16px 0}.mm-long-text,.mm-rich-copy{white-space:pre-line;line-height:1.72;color:var(--muted)}
.mm-facts,.mm-order-facts,.mm-submitted-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:20px 0 0}.mm-facts div,.mm-order-facts div,.mm-submitted-fields div{padding:12px;border:1px solid var(--mm-border);border-radius:16px;background:var(--mm-soft)}.mm-facts dt,.mm-order-facts dt,.mm-submitted-fields dt{font-size:.78rem;color:var(--muted)}.mm-facts dd,.mm-order-facts dd,.mm-submitted-fields dd{margin:5px 0 0;font-weight:700;overflow-wrap:anywhere}
.mm-detail-content-grid,.mm-order-layout{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(320px,.8fr);gap:20px;margin-top:20px;align-items:start}.mm-detail-info,.mm-order-main,.mm-order-side{display:grid;gap:18px}.mm-order-card{position:sticky;top:96px}.mm-order-form,.mm-claim-form,.mm-admin-form{display:grid;gap:14px}.mm-choice-list{display:flex;flex-wrap:wrap;gap:8px}.mm-choice{display:flex!important;grid-template-columns:auto 1fr;align-items:center;gap:7px;padding:9px 11px;border:1px solid var(--mm-border);border-radius:14px}.mm-choice input,.mm-confirm-check input{width:auto}.mm-confirm-check{display:grid!important;grid-template-columns:auto minmax(0,1fr);align-items:start;gap:9px}.mm-order-total{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:15px;border-radius:18px;background:linear-gradient(135deg,rgba(255,173,36,.16),rgba(33,135,255,.1));border:1px solid rgba(255,173,36,.25)}.mm-order-total strong{font-size:1.35rem}.mm-security-note{font-size:.82rem;color:var(--muted);line-height:1.55}.btn-block{width:100%;justify-content:center}
.mm-panel-head{align-items:flex-start}.mm-head-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px}.mm-status{display:inline-flex;align-items:center;min-width:max-content;padding:7px 10px;border-radius:999px;background:rgba(122,153,190,.12);border:1px solid rgba(122,153,190,.22);font-size:.82rem;font-weight:800}.status-success{color:#78edac;background:rgba(31,186,111,.12);border-color:rgba(31,186,111,.25)}.status-failed,.status-cancelled,.status-expired{color:#ff9b9b;background:rgba(235,72,72,.12);border-color:rgba(235,72,72,.25)}.status-refunded{color:#a9c9ff;background:rgba(49,126,245,.12);border-color:rgba(49,126,245,.25)}.status-manual_review,.status-refund_pending{color:#ffd575;background:rgba(255,173,36,.12);border-color:rgba(255,173,36,.25)}
.mm-code,.mm-monospace{font-family:ui-monospace,SFMono-Regular,Consolas,monospace}.mm-code{display:inline-block;max-width:260px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:middle}.mm-secret-box{padding:16px;border:1px solid rgba(255,173,36,.24);border-radius:18px;background:rgba(0,0,0,.22)}.mm-secret-box pre{margin:0;white-space:pre-wrap;overflow-wrap:anywhere;color:#dff5ff}.mm-download-list,.mm-claim-list{display:grid;gap:10px}.mm-download-card{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:12px;padding:13px;border:1px solid var(--mm-border);border-radius:17px;text-decoration:none;color:inherit}.mm-download-card small,.mm-claim-list small{display:block;color:var(--muted)}.mm-claim-list>div{padding:12px;border:1px solid var(--mm-border);border-radius:15px}.mm-claim-list span{display:block;color:var(--muted)}
.mm-timeline{display:grid;gap:0}.mm-timeline>div{display:grid;grid-template-columns:18px minmax(0,1fr);gap:10px}.mm-timeline>div>span{position:relative}.mm-timeline>div>span:before{content:"";position:absolute;left:6px;top:8px;width:8px;height:8px;border-radius:50%;background:var(--mm-accent)}.mm-timeline>div>span:after{content:"";position:absolute;left:9px;top:18px;bottom:-8px;width:1px;background:var(--mm-border)}.mm-timeline>div:last-child>span:after{display:none}.mm-timeline section{padding:0 0 18px}.mm-timeline small{display:block;color:var(--muted);margin-top:3px}
.mm-warning-panel{border-color:rgba(255,173,36,.28)!important}
.mm-data-table{min-width:900px}.mm-data-table th,.mm-data-table td{padding:11px 12px;text-align:left}.mm-data-table tbody tr{border-top:1px solid var(--mm-border)}.mm-truncate{max-width:260px}.mm-truncate>span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mm-wrap-cell{white-space:normal!important;min-width:220px}
.mm-admin-hero{margin-bottom:18px}.mm-admin-stats{display:grid;grid-template-columns:repeat(8,minmax(130px,1fr));gap:10px;margin-bottom:18px;overflow-x:auto}.mm-admin-stats article{padding:14px;border-radius:18px;border:1px solid var(--mm-border);min-width:140px}.mm-admin-stats span{display:block;color:var(--muted);font-size:.77rem}.mm-admin-stats strong{display:block;margin-top:6px;font-size:1.25rem}
.mm-admin-shell{display:grid;grid-template-columns:230px minmax(0,1fr);gap:18px;align-items:start}.mm-admin-tabs{position:sticky;top:92px;display:grid;gap:6px;padding:10px;border-radius:24px}.mm-admin-tab{display:flex;align-items:center;gap:10px;width:100%;padding:10px 11px;border:0;border-radius:15px;background:transparent;color:inherit;text-align:left;cursor:pointer}.mm-admin-tab:hover,.mm-admin-tab.is-active{background:linear-gradient(135deg,rgba(255,173,36,.18),rgba(33,135,255,.1));box-shadow:inset 0 0 0 1px rgba(255,173,36,.22)}.mm-admin-tab span{display:grid;place-items:center;width:30px;height:30px;border-radius:10px;background:var(--mm-soft)}.mm-admin-panels{min-width:0}.mm-admin-panel{display:none}.mm-admin-panel.is-active{display:block}.mm-admin-panel h3{margin-top:24px}.mm-form-grid{grid-template-columns:repeat(4,minmax(0,1fr));align-items:start}.mm-span-2{grid-column:span 2}.mm-check-grid{display:flex;flex-wrap:wrap;gap:10px}.mm-check-grid label{display:flex;align-items:center;gap:7px;padding:9px 11px;border:1px solid var(--mm-border);border-radius:13px}.mm-check-grid input{width:auto}.mm-dashboard-grid,.mm-action-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.mm-dashboard-grid article,.mm-action-grid article{padding:15px;border:1px solid var(--mm-border);border-radius:18px;background:var(--mm-soft)}.mm-dashboard-grid code{display:block;margin-top:8px}.mm-action-grid article{display:grid;gap:8px}.mm-two-col{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.mm-row-actions{min-width:300px}.mm-row-actions summary{cursor:pointer}.mm-row-actions[open]{padding:10px;border:1px solid var(--mm-border);border-radius:15px;background:rgba(0,0,0,.12)}.mm-orders-table{min-width:1180px}

html[data-theme="light"] .mm-page{--mm-border:rgba(27,67,115,.14);--mm-soft:rgba(35,93,170,.055)}
html[data-theme="light"] .mm-card-badges span,html[data-theme="light"] .mm-favorite-btn{background:rgba(255,255,255,.88);color:#18324e}
html[data-theme="light"] .mm-secret-box{background:#eef5ff}html[data-theme="light"] .mm-secret-box pre{color:#14253c}

@media(max-width:1200px){.mm-product-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.mm-form-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.mm-dashboard-grid,.mm-action-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.mm-admin-stats{grid-template-columns:repeat(4,minmax(140px,1fr))}}
@media(max-width:980px){.mm-hero,.mm-admin-hero,.mm-detail-grid,.mm-detail-content-grid,.mm-order-layout,.mm-admin-shell{grid-template-columns:1fr}.mm-order-card,.mm-admin-tabs{position:relative;top:auto}.mm-admin-tabs{grid-template-columns:repeat(4,minmax(140px,1fr));overflow-x:auto}.mm-admin-tab{min-width:140px}.mm-product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.mm-filter-form,.mm-form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.mm-span-2{grid-column:1/-1}.mm-detail-media{min-height:340px}}
@media(max-width:680px){.mm-product-grid,.mm-filter-form,.mm-form-grid,.mm-dashboard-grid,.mm-action-grid,.mm-two-col,.mm-facts,.mm-order-facts,.mm-submitted-fields{grid-template-columns:1fr}.mm-hero,.mm-admin-hero{padding:20px;border-radius:24px}.mm-product-grid{gap:13px}.mm-admin-tabs{grid-template-columns:repeat(2,minmax(140px,1fr))}.mm-admin-stats{grid-template-columns:repeat(2,minmax(140px,1fr))}.mm-detail-media{min-height:280px}.mm-detail-summary{padding:20px}.mm-head-actions{justify-content:stretch}.mm-head-actions .btn{flex:1}.mm-download-card{grid-template-columns:auto minmax(0,1fr)}.mm-download-card>b{grid-column:2}.mm-category-chip{padding:9px 12px}.mm-code{max-width:180px}}

.mm-home-marketplace-promo{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:18px;align-items:center}
@media(max-width:680px){.mm-home-marketplace-promo{grid-template-columns:1fr}.mm-home-marketplace-promo .btn{width:100%;justify-content:center}}
.mm-order-admin-actions{display:flex;align-items:flex-start;gap:8px;min-width:max-content}
.mm-order-admin-actions>.btn{min-width:max-content}