/* utility */
.only-desktop { display: none; }
.only-mobile  { display: flex; }

/* กำหนด breakpoint ที่ต้องการ (1024px = Desktop ขึ้นไป) */
@media (min-width: 1024px) {
  .only-desktop { display: inline-flex; }  /* โชว์ปุ่มกระเป๋าที่ header */
  .only-mobile  { display: none; }         /* ซ่อน element mobile-only */
  .ecu-bottom-nav { display: none !important; } /* ซ่อนแถบล่างบน Desktop */
}

/* สไตล์ปุ่มกระเป๋าบน header เบื้องต้น */
.ecu-header-cart {
  align-items: center; gap: 8px;
  color: black:
  border: 0px solid var(--ecu-border, #e5e7eb);
  background: transparent; padding: 8px 12px; border-radius: 999px;
  cursor: pointer;
}
.ecu-header-cart svg{ width:36px; height:36px; }
.ecu-header-cart .edd-cart-count {
  min-width: 18px; height: 18px; padding: 0 4px;
}
/* Badge (shared กับ edd-cart-count) */
.header__badge,
.edd-cart-count{
  display:none; min-width:18px; height:18px; padding:0 5px;
  align-items:center; justify-content:center; border-radius:999px;
  background:#ef4444; color:#fff; font-size:11px; font-weight:700;
  position:absolute; top:2px; right:18px;
}
.edd-cart-count.is-empty{ display:none; }
.header__badge[data-count]:not([data-count="0"]){ display:flex; }
/*
.header__badge{
  position:absolute; top:14px; right:5px;
  min-width:18px; height:18px; padding:0 5px; border-radius:999px;
  background:#ef4444; color:#fff; font-size:11px; font-weight:700;
  display:none; align-items:center; justify-content:center;
}
.header__badge[data-count]:not([data-count="0"]){ display:flex; }
/* ===== Auth Card – กันล้น + ระบุกรอบ ===== */
*/
.ecu-auth-card,
.edd_form {
  position: relative;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 16px;
  padding: 16px;
  box-shadow: 0 8px 24px rgba(2,6,23,.04);
  max-width: 560px;       /* ปลอดภัยบนมือถือ & desktop แคบ */
  margin: 0 auto;
  overflow: hidden;       /* กันเล็ดล้นกรณีพิเศษ */
}

/* ใช้ border-box ทั้งการ์ดเพื่อตัดปัญหา width+padding ล้น */
.ecu-auth-card *,
.edd_form *,
.nsl-container * {
  box-sizing: border-box !important;
}

/* แต่ละแถวของฟอร์ม */
.edd_form fieldset,
.edd_form .form-row {
  margin: 0 0 12px;
  padding: 0;
  border: 0;
}

/* ช่องกรอก—ให้เต็มการ์ดแต่ไม่ล้น */
.edd_form input[type="text"],
.edd_form input[type="email"],
.edd_form input[type="password"],
.edd_form input[type="url"],
.edd_form input[type="number"],
.edd_form select,
.edd_form textarea {
  width: 100%;
  max-width: 100%;
  height: 46px;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  background: #fff;
  padding: 10px 12px;
  font-size: 15px;
  color: #0f172a;
  outline: none;
  transition: box-shadow .18s, border-color .18s;
}
.edd_form textarea { height: auto; min-height: 100px; }
.edd_form input:focus,
.edd_form select:focus,
.edd_form textarea:focus {
  border-color: #2563eb;
  box-shadow: 0 0 0 4px rgba(37,99,235,.15);
}

/* ปุ่มหลัก */
.edd_form input[type="submit"],
.edd-submit,
.edd-submit.button {
  width: 100%;
  max-width: 100%;
  height: 46px;
  border-radius: 12px;
  background: #2563eb;
  border: 1px solid #2563eb;
  color: #fff;
  font-weight: 700;
  cursor: pointer;
  transition: background .18s, border-color .18s, transform .06s;
}
.edd_form input[type="submit"]:hover { background:#1d4ed8; border-color:#1d4ed8; }
.edd_form input[type="submit"]:active { transform: translateY(1px); }

/* Nextend Social – ให้เต็มการ์ดและไม่ดันขอบ */
.nsl-container .nsl-button {
  width: 100% !important;
  max-width: 100% !important;
  height: 46px;
  border-radius: 12px !important;
  margin: 10px 0 0 !important;
  overflow: hidden; /* กันไอคอนยื่น */
}

/* Cloudflare Turnstile / reCAPTCHA – ไม่ให้ดันการ์ด */
.cf-turnstile,
.g-recaptcha,
.turnstile-wrapper,
.edd_form .edd-honeypot-wrap {
  max-width: 100%;
  overflow: hidden;
}
.turnstile-wrapper { margin-top: 10px; }

/* กัน global margin ของธีม/บล็อกที่เคยดัน content */
.is-layout-flow > * { margin-block: 0; }        /* ลบ margin แนวตั้งแถวๆ การ์ดในเพจนี้ */
.entry-content .edd_form p { margin: 0; }

/* ป้องกัน bottom-nav ทับฟอร์มในมือถือ */
@media (max-width: 768px){
  .page .entry-content, .site-main { padding-bottom: 72px; }
}
/* กล่องหลัก */
.duo-fade-banner{
  position: relative;
  overflow: hidden;
  aspect-ratio: 16/9; /* ปรับได้ */
}
.duo-fade-banner .wp-block-image{ margin:0 !important; }

/* วางซ้อน 3 รูปเต็มกรอบ */
.duo-fade-banner .wp-block-image:nth-child(1),
.duo-fade-banner .wp-block-image:nth-child(2),
.duo-fade-banner .wp-block-image:nth-child(3){
  position:absolute; inset:0;
  width:100%; height:100%;
  display:block;
}
.duo-fade-banner img{ width:100%; height:100%; object-fit:cover; }

/* ใช้คีย์เฟรมเดียว + phase shift ด้วย negative delay */
.duo-fade-banner .wp-block-image:nth-child(1){
  z-index:3;
  animation: crossfade 18s ease-in-out infinite;
  animation-delay: 0s;           /* รูป1 เริ่มเฟสแรก */
}
.duo-fade-banner .wp-block-image:nth-child(2){
  z-index:2;
  animation: crossfade 18s ease-in-out infinite;
  animation-delay: -6s;          /* ขยับมาที่รูป2 */
}
.duo-fade-banner .wp-block-image:nth-child(3){
  z-index:1;
  animation: crossfade 18s ease-in-out infinite;
  animation-delay: -12s;         /* ขยับมาที่รูป3 */
}

/* คีย์เฟรม: โชว์ ~24% ของรอบ แล้วค่อยเฟด/เลื่อนจาง */
@keyframes crossfade{
  0%, 24%   { opacity:1; transform:translateX(0%); }
  30%, 100% { opacity:0; transform:translateX(-2%); }
}

/* ลด motion เมื่อผู้ใช้ตั้งค่าไว้ */
@media (prefers-reduced-motion: reduce){
  .duo-fade-banner .wp-block-image:nth-child(1),
  .duo-fade-banner .wp-block-image:nth-child(2),
  .duo-fade-banner .wp-block-image:nth-child(3){
    animation: none !important;
  }
}

.edd-login .edd-form .edd-login-username,
.edd-login .edd-form .edd-login-password,
.edd-login .edd-form .edd-login-remember,
.edd-login .edd-form .edd-submit,
.edd-login .edd-form .edd-lost-password { display:none !important; }
.ecu-wallet { max-width: 900px; margin: 24px auto; padding: 0 16px; }
.ecu-wallet-card { background: #fff; border: 1px solid #e5e7eb; border-radius: 16px; padding: 16px 18px; margin-bottom: 16px; box-shadow: 0 1px 2px rgba(0,0,0,.03); }
.ecu-wallet-head { display: grid; grid-template-columns: 1fr auto; gap: 16px; align-items: center; }
.ecu-wallet-balance .label { color:#6b7280; font-size: 13px; }
.ecu-wallet-balance .value { font-size: 32px; font-weight: 700; line-height: 1.1; }
.ecu-wallet-balance .unit { font-size: 16px; font-weight: 500; color:#6b7280; margin-left: 6px; }
.ecu-wallet-balance .hint { color:#9ca3af; font-size: 12px; margin-top: 6px; }
.ecu-wallet-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.ecu-btn, .ecu-btn-primary { display:inline-block; padding:10px 14px; border-radius:12px; border:1px solid #d1d5db; color:#111827; background:#fff; text-decoration:none; font-weight:600; font-size:14px; }
.ecu-btn:hover { background:#f9fafb; }
.ecu-btn-primary { background:#2563eb; border-color:#2563eb; color:#fff; }
.ecu-btn-primary:hover { filter: brightness(0.98); }
.card-title { margin: 0 0 8px; font-size: 16px; font-weight: 700; }
.ecu-wallet-list { list-style:none; padding:0; margin:0; }
.ecu-wallet-item { display:grid; grid-template-columns: 120px 1fr auto auto; gap:12px; padding:10px 0; border-top:1px solid #f3f4f6; align-items:center; }
.ecu-wallet-item:first-child { border-top:0; }
.i-type { font-size:13px; font-weight:700; }
.i-type.topup { color:#059669; } /* เขียว */
.i-type.spend { color:#dc2626; } /* แดง */
.i-amount { font-weight:600; }
.i-date { color:#6b7280; font-size:12.5px; }
.i-link { font-size:12.5px; color:#2563eb; text-decoration:none; }
.i-link:hover { text-decoration:underline; }
.ecu-wallet-note { color:#374151; font-size:13px; }
.muted { color:#9ca3af; font-size: 14px; }
@media (max-width: 640px) {
  .ecu-wallet-head { grid-template-columns: 1fr; }
  .ecu-wallet-item { grid-template-columns: 110px 1fr auto; }
  .i-link { display:none; }
}
/* ---- WPML Language Switcher (Header): enlarge active flag ---- */

/* กำหนดพื้นที่กด เพื่อไม่ให้เลย์เอาต์กระเด้งตอน scale */
.lang-switcher--header .wpml-ls-link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:36px;           /* ปรับได้ */
  height:36px;
  border-radius:999px;
}

/* ธงปกติ */
.lang-switcher--header .wpml-ls-flag,
.lang-switcher--header .wpml-ls-flag img{
  width:22px;           /* ขนาดฐานของธง */
  height:auto;
  transform:scale(.95);
  transform-origin:center;
  transition:transform .18s ease, filter .18s ease;
  filter:grayscale(.2) opacity(.9);
}

/* ธงของภาษาปัจจุบัน (active) – ขยายให้เด่น */
.lang-switcher--header .wpml-ls-current-language .wpml-ls-flag,
.lang-switcher--header .wpml-ls-current-language .wpml-ls-flag img{
  transform:scale(1.25) !important;  /* ปรับ 1.1–1.35 ตามชอบ */
  filter:none !important;
}

/* (ทางเลือก) เอฟเฟกต์ตอน hover */
.lang-switcher--header .wpml-ls-link:hover .wpml-ls-flag,
.lang-switcher--header .wpml-ls-link:hover .wpml-ls-flag img{
  transform:scale(1.15);
}
/* WPML Flag Circle */
.wpml-ls .wpml-ls-flag {
  border-radius: 50% !important;
  overflow: hidden;
  width: 22px;   /* กำหนดขนาดเท่ากัน */
  height: 22px;
  object-fit: cover;
  display: inline-block;
  box-shadow: 0 0 2px rgba(0,0,0,0.2);
}