:root{--ink:#151515;--gold:#c6a35c;--cream:#f7f5ef;--purple:#6734d3;--blue:#1559cc;--line:#e5e3de}*{box-sizing:border-box}body{margin:0;font:15px/1.55 system-ui,-apple-system,Arial;color:var(--ink);background:#f3f4f6}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}button{cursor:pointer}button:disabled{opacity:.55;cursor:not-allowed}.wrap{width:min(1260px,94%);margin:auto}.top{background:#111;color:#f8e7bf;text-align:center;font-size:11px;letter-spacing:.6px;padding:8px}.top span{color:#aaa;margin-left:14px}header{background:white;position:sticky;top:0;z-index:20;box-shadow:0 1px 8px #0001}.header{display:flex;gap:25px;align-items:center;padding:14px 0}.logo{font-weight:900;letter-spacing:1px;font-size:22px;white-space:nowrap}.logo span{color:var(--gold)}.logo small{display:block;letter-spacing:3px;font-size:9px;margin-top:-8px}.header form{display:flex;flex:1;max-width:650px}.header input{width:100%;padding:12px;border:1px solid #ddd;background:#f8f8f8;min-width:0}.header form button,.btn{border:0;background:#111;color:white;padding:12px 20px;font-weight:700}.header nav{display:flex;gap:17px;white-space:nowrap;font-weight:700}.header nav a:hover{color:#a78036}.header b{background:var(--gold);border-radius:30px;padding:2px 7px}.navstrip{background:white;border-top:1px solid var(--line);overflow:auto}.navstrip .wrap{display:flex;gap:26px;padding:12px 0;white-space:nowrap;font-size:13px;font-weight:700}.navstrip a:hover{color:var(--purple)}main{min-height:65vh;padding:18px 0 45px}.hero{border-radius:12px;overflow:hidden;background:linear-gradient(120deg,#30118c,#833be9 60%,#b75de6);color:white;display:grid;grid-template-columns:1.5fr 1fr;min-height:300px;align-items:center;padding:34px 6%;position:relative}.hero h1{font-size:clamp(34px,5vw,70px);line-height:1.04;margin:10px 0}.hero p{font-size:18px}.hero .symbol{font-size:125px;text-align:center;filter:drop-shadow(0 12px 18px #0004)}.tag{background:#ffd34c;color:#20123d;padding:7px 12px;font-size:12px;font-weight:900;border-radius:4px}.whitebtn{display:inline-block;background:white;color:#391f8c;padding:12px 25px;border-radius:5px;font-weight:800;margin-top:15px}.mini-banners{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:16px 0}.mini{padding:22px;border-radius:10px;color:white;background:linear-gradient(110deg,#161616,#4d4d4d);min-height:110px}.mini:nth-child(2){background:linear-gradient(110deg,#5130bd,#9a45dd)}.mini:nth-child(3){background:linear-gradient(110deg,#004bb7,#38a2ff)}.mini strong{font-size:22px;display:block}.section{background:white;border-radius:9px;margin:18px 0;padding:20px}.section h2{font-size:24px;margin:0 0 16px}.sectionhead{display:flex;justify-content:space-between;align-items:center;gap:10px}.sectionhead a{color:var(--blue);font-weight:700}.cats{display:grid;grid-template-columns:repeat(7,1fr);gap:12px}.cat{border:1px solid var(--line);padding:16px 8px;text-align:center;border-radius:8px;font-weight:700}.cat span{display:block;font-size:40px}.cat:hover,.product:hover{box-shadow:0 6px 20px #0002}.purple{background:linear-gradient(100deg,#5e2cce,#ac46e9);padding:20px;color:white;border-radius:9px;margin:20px 0}.purple h2{margin:0;font-size:27px}.products{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px}.product{background:white;border:1px solid var(--line);border-radius:9px;overflow:hidden;transition:box-shadow .2s}.photo{height:215px;display:grid;place-items:center;background:linear-gradient(135deg,#f4f1f9,#e8e9f5);font-size:85px;position:relative}.photo img{width:100%;height:100%;object-fit:cover}.photo .badge{position:absolute;top:10px;left:10px;background:#6035ce;color:white;padding:3px 8px;font-size:11px}.info{padding:14px}.info h3{font-size:15px;margin:5px 0;min-height:45px}.price{font-weight:900;font-size:19px}.muted{color:#666;font-size:13px}.actions{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap}.actions .btn{flex:1;padding:10px;font-size:13px}.outline{background:white;color:#111;border:1px solid #bbb}.gold{background:var(--gold);color:#111}.page{background:white;border-radius:10px;padding:26px;max-width:1080px;margin:18px auto}.page h1{margin:0 0 18px}.form{max-width:450px;margin:auto}.form label{display:block;font-weight:700;margin:14px 0 5px}.form input,.form textarea,.form select,.edit input,.edit textarea{width:100%;padding:12px;border:1px solid #d2d2d2;border-radius:5px;background:white}.form button{margin-top:18px;width:100%}.error{color:#aa2323}.detail{display:grid;grid-template-columns:45% 55%;gap:30px}.detail .photo{height:440px;font-size:160px}.detail h1{font-size:32px}.spec{background:var(--cream);padding:16px;margin:18px 0}.related{margin-top:35px}.cartrow{display:grid;grid-template-columns:80px 1fr auto auto;align-items:center;gap:15px;border-bottom:1px solid var(--line);padding:14px 0}.cartrow .photo{height:80px;font-size:36px}.cartrow input{width:65px;padding:8px}.summary{padding:20px;background:var(--cream);margin-top:18px;text-align:right}.order{border:1px solid var(--line);border-radius:8px;padding:18px;margin:12px 0}.pill{padding:3px 10px;border-radius:20px;background:#eee;font-size:12px;font-weight:800}.admin-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.edit{border:1px solid var(--line);padding:15px;border-radius:8px}.edit label{font-size:12px;font-weight:700;display:block;margin:6px 0}.edit textarea{height:90px}footer{background:#151515;color:#eee;padding:38px 0}.foot{display:grid;grid-template-columns:2fr 1fr 1fr;gap:25px}.foot a{display:block;margin:8px 0;color:#e6d4ad}.foot p{color:#bbb;font-size:13px}#toast{position:fixed;bottom:25px;right:25px;background:#171717;color:white;padding:13px 20px;border-radius:8px;display:none;z-index:100}.note{padding:12px;background:#fff5d7;border-left:4px solid var(--gold);font-size:13px;margin:14px 0}@media(max-width:850px){.header{flex-wrap:wrap}.header form{order:3;flex-basis:100%;max-width:none}.cats{grid-template-columns:repeat(4,1fr)}.products{grid-template-columns:repeat(3,1fr)}.admin-grid{grid-template-columns:1fr 1fr}}@media(max-width:600px){.hero{grid-template-columns:1fr;min-height:0}.hero .symbol{display:none}.mini-banners{grid-template-columns:1fr}.cats{grid-template-columns:repeat(3,1fr)}.products{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.photo{height:155px;font-size:60px}.info{padding:10px}.info h3{font-size:13px}.detail{grid-template-columns:1fr}.detail .photo{height:300px}.cartrow{grid-template-columns:65px 1fr auto}.cartrow .price{grid-column:2}.foot{grid-template-columns:1fr}.admin-grid{grid-template-columns:1fr}.page{padding:16px}.top span{display:block}}
.photo{isolation:isolate}.photo img{position:absolute;inset:0;z-index:1}.photo .badge{z-index:2}

/* VIP product imagery: full product card visual */
.photo{background:#f7f5f1;overflow:hidden}.photo img{display:block;width:100%;height:100%;object-fit:cover}.photo:has(img)>span:not(.badge){display:none}.edit input[type=file]{width:100%;padding:10px;background:#fff;border:1px solid #ddd}.edit button[data-upload]{margin:8px 0 12px}

/* Secure customer profile */
.profile-top{display:flex;align-items:center;gap:18px;border-bottom:1px solid var(--line);padding-bottom:20px;margin-bottom:22px}.profile-avatar{width:72px;height:72px;display:grid;place-items:center;border-radius:50%;background:#151515;color:var(--gold);font-size:30px;font-weight:900}.profile-top h1{margin:0}.profile-grid{display:grid;grid-template-columns:1.25fr 1fr;gap:22px}.profile-panel{padding:22px;border:1px solid var(--line);border-radius:10px}.profile-panel h2{margin-top:0}.profile-panel label{display:block;margin:14px 0 5px;font-weight:700}.profile-panel input{width:100%;padding:12px;border:1px solid #ccc;border-radius:5px}.profile-panel input[readonly]{background:#f4f4f4;color:#555}.profile-panel button{margin-top:14px}.profile-action{display:block;padding:13px 0;border-bottom:1px solid var(--line);font-weight:700}@media(max-width:650px){.profile-grid{grid-template-columns:1fr}.profile-panel{padding:16px}}

/* Gentle product-image movement without altering page layout */
.product .photo img{transition:transform .45s ease;object-fit:cover}
.product:hover .photo img{transform:scale(1.045)}
@media(prefers-reduced-motion:reduce){.product .photo img{transition:none}.product:hover .photo img{transform:none}}

/* ZEBEX premium visual update: additive styles only */
.premium-logo{display:flex;align-items:center;gap:10px;letter-spacing:0;font-size:19px;line-height:1.15}
.premium-logo img{width:62px;height:55px;object-fit:contain;border-radius:7px;background:#fff}
.premium-brand{display:block;color:#112f50}.premium-brand small{display:block;font-size:9px;letter-spacing:1.7px;margin:4px 0 0}
.navstrip{background:#142c4c;border-top:2px solid #d2ac60;color:#fff}
.navstrip .wrap{gap:8px;padding:9px 0;align-items:center}
.navstrip a{display:inline-block;padding:9px 13px;border-radius:6px;transition:background .2s,color .2s,transform .2s}
.navstrip a:hover,.navstrip a:focus-visible{background:#d2ac60;color:#122b4b;transform:translateY(-1px)}
.ticker{background:#f8eed8;color:#18314f;overflow:hidden;white-space:nowrap;border-bottom:1px solid #e3d2ac;font-size:12px;font-weight:750;letter-spacing:1px;padding:8px 0}
.ticker-track{display:inline-block;min-width:max-content;animation:zebexTicker 26s linear infinite}
@keyframes zebexTicker{from{transform:translateX(10vw)}to{transform:translateX(-55%)}}
.hero-visual{position:relative;min-height:240px;display:flex;align-items:center;justify-content:center}
.hero-halo{position:absolute;width:75%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,#f5d19e99 0%,#edc9fd55 40%,transparent 72%);filter:blur(10px)}
.hero-bag{position:relative;z-index:1;width:min(76%,320px);aspect-ratio:1;object-fit:cover;border-radius:26px;box-shadow:0 18px 48px #15043b77;border:4px solid #ffffff88;animation:zebexFloat 4.5s ease-in-out infinite}
.hero-spark{position:absolute;color:#ffd76d;font-size:48px;z-index:2;filter:drop-shadow(0 5px 8px #0004);animation:zebexTwinkle 2.5s ease-in-out infinite alternate}
.hero-spark-one{right:4%;top:12%}.hero-spark-two{left:3%;bottom:14%;animation-delay:1s}
@keyframes zebexFloat{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-12px) rotate(1deg)}}
@keyframes zebexTwinkle{from{opacity:.5;transform:scale(.8)}to{opacity:1;transform:scale(1.2)}}
.hero-extra{font-weight:700;color:#ffe5a1;font-size:15px!important;margin:5px 0 0}
.whitebtn{transition:transform .2s,box-shadow .2s}.whitebtn:hover{transform:translateY(-3px);box-shadow:0 10px 25px #0004}
.cats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.cat.premium-cat{padding:0 0 14px;border:1px solid #e9e7e3;background:#fff;overflow:hidden;border-radius:15px;display:block;transition:transform .25s,box-shadow .25s}
.premium-cat img{display:block;width:100%;aspect-ratio:1.15;object-fit:cover;transition:transform .45s ease}
.premium-cat:hover{transform:translateY(-5px);box-shadow:0 15px 28px #0002}
.premium-cat:hover img{transform:scale(1.07)}
.premium-cat .cat-label{display:block;font-size:16px;padding:12px 6px 0;font-weight:800;color:#172c4a}
.footer-logo{display:block;width:125px;max-height:100px;object-fit:contain;background:#fff;border-radius:8px;padding:4px;margin-bottom:10px}
@media(max-width:850px){.cats{grid-template-columns:repeat(3,minmax(0,1fr))}.premium-logo img{width:48px;height:45px}.premium-brand{font-size:15px}}
@media(max-width:560px){.cats{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.hero-visual{min-height:170px}.hero-bag{width:70%;border-radius:16px}.premium-cat .cat-label{font-size:14px}.premium-brand{font-size:13px}}
@media(prefers-reduced-motion:reduce){.ticker-track,.hero-bag,.hero-spark{animation:none!important}.premium-cat img,.premium-cat,.whitebtn{transition:none!important}}

/* Mobile-only responsive improvements; desktop and store logic unchanged */
.mobile-menu-toggle{display:none}
.category-links{display:flex;align-items:center;gap:8px;white-space:nowrap}
@media(max-width:600px){
  .header{gap:9px;padding:9px 0;justify-content:space-between}
  .premium-logo{gap:6px;min-width:0}
  .premium-logo img{width:44px;height:42px}
  .premium-brand{font-size:12px;line-height:1.1}
  .premium-brand small{font-size:7px;letter-spacing:1px;margin-top:3px}
  .header nav{gap:12px;font-size:13px;align-items:center}
  .header form{order:3;flex-basis:100%;margin-top:2px}
  .header input{padding:10px;min-width:0}
  .header form button{padding:10px 14px}
  .navstrip{overflow:visible}
  .navstrip .mobile-nav-wrap{display:block;padding:8px 0}
  .mobile-menu-toggle{display:flex;align-items:center;gap:9px;width:100%;border:1px solid #c7a65e;background:#203d60;color:#fff;border-radius:7px;padding:10px 14px;font-weight:750;text-align:left}
  .mobile-menu-toggle span{font-size:20px;line-height:1}
  .category-links{display:none;white-space:normal;flex-direction:column;align-items:stretch;gap:3px;padding:8px 0 2px}
  .category-links.is-open{display:flex}
  .navstrip .category-links a{display:block;padding:10px 13px}
  .hero{padding:24px 6% 20px;gap:6px}
  .hero h1{font-size:clamp(30px,8vw,42px);margin:8px 0}
  .hero p{font-size:15px;margin:9px 0}
  .hero-extra{font-size:13px!important}
  .whitebtn{margin-top:8px;padding:10px 16px}
  .hero-visual{min-height:140px}
  .hero-bag{width:min(46%,180px);border-radius:13px;border-width:3px}
  .hero-spark{font-size:30px}
  .hero-spark-one{right:20%;top:12%}.hero-spark-two{left:19%;bottom:10%}
}
@media(max-width:380px){.premium-logo img{width:36px;height:36px}.premium-brand{font-size:11px}.header nav{gap:8px;font-size:12px}}
@media(prefers-reduced-motion:reduce){.category-links,.mobile-menu-toggle{transition:none}}

/* ZEBEX Premium Customer Login */
body:has(#authForm) {
  background: linear-gradient(135deg,#f7f4ed,#ffffff 55%,#f4ead7);
}

body:has(#authForm) .page.form {
  width: min(440px,calc(100% - 32px));
  max-width: 440px;
  margin: 65px auto 85px;
  padding: 42px 36px;
  background: #ffffff;
  border: 1px solid #e8d9bb;
  border-radius: 22px;
  box-shadow: 0 24px 70px rgba(10,28,52,.12);
}

body:has(#authForm) .page.form h1 {
  color: #10243c;
  font-size: clamp(27px,4vw,35px);
  font-weight: 800;
  letter-spacing: -.7px;
  text-align: center;
}

body:has(#authForm) .page.form > p {
  text-align: center;
  color: #777;
}

body:has(#authForm) #authForm input {
  width: 100%;
  padding: 15px;
  border: 1px solid #d9dce2;
  border-radius: 11px;
  background: #fbfcfe;
  transition: border-color .2s,box-shadow .2s;
}

body:has(#authForm) #authForm input:focus {
  outline: none;
  border-color: #bd9444;
  box-shadow: 0 0 0 4px rgba(189,148,68,.12);
}

body:has(#authForm) #authForm button[type="submit"] {
  width: 100%;
  min-height: 48px;
  border-radius: 11px;
  background: linear-gradient(110deg,#ae812c,#e1bd73,#ae812c);
  color: #15253a;
  font-weight: 800;
  border: 0;
  cursor: pointer;
  box-shadow: 0 8px 20px rgba(174,129,44,.2);
}

body:has(#authForm) .page.form a {
  color: #a57a2c;
  font-weight: 600;
}

@media(max-width:480px) {
  body:has(#authForm) .page.form {
    margin: 30px auto 50px;
    padding: 28px 22px;
  }
}

/* ZEBEX Premium Gold Login Button */
body:has(#authForm) #authForm .btn,
body:has(#authForm) #authForm button[type="submit"] {
  background: linear-gradient(110deg,#a77a28,#e7c77d,#b48632) !important;
  color: #10243c !important;
  border: none !important;
  border-radius: 11px !important;
  font-weight: 800 !important;
  min-height: 48px;
  box-shadow: 0 8px 22px rgba(174,129,44,.22);
}

body:has(#authForm) #authForm .btn:hover {
  filter: brightness(1.06);
  transform: translateY(-1px);
}

/* ZEBEX Premium Admin Login */
.zebex-admin-login {
  min-height: 75vh;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 50px 20px;
  background: radial-gradient(circle at top, #193554, #061323 75%);
}

.zebex-admin-card {
  width: 100%;
  max-width: 440px;
  padding: 45px 35px;
  background: linear-gradient(145deg, #11263e, #091726);
  border: 1px solid #b9944d;
  border-radius: 20px;
  box-shadow: 0 20px 60px rgba(0,0,0,.35);
  color: #fff;
  text-align: center;
}

.zebex-admin-card h1 {
  color: #d8b66c;
  font-size: 28px;
  margin-bottom: 12px;
}

.zebex-admin-card p {
  color: #b7c4d4;
  margin-bottom: 28px;
}

.zebex-admin-card label {
  display: block;
  text-align: left;
  margin: 16px 0 8px;
  color: #e7d3a1;
}

.zebex-admin-card input {
  width: 100%;
  padding: 14px;
  border: 1px solid #486079;
  border-radius: 9px;
  background: #fff;
  color: #172338;
  box-sizing: border-box;
}

.zebex-admin-card button {
  width: 100%;
  margin-top: 24px;
  padding: 15px;
  border: none;
  border-radius: 10px;
  background: linear-gradient(110deg,#a77a28,#e7c77d,#b48632);
  color: #10243c;
  font-weight: 800;
  cursor: pointer;
}

.zebex-admin-card a {
  color: #e7c77d;
}


/* ZEBEX Premium Customer Login Background */
body:has(#authForm) .page.form {
    background: linear-gradient(135deg, #061326, #092a50, #020b19) !important;
    border: 1px solid #c7a65e !important;
    border-radius: 18px !important;
    box-shadow: 0 20px 55px rgba(0,0,0,0.25) !important;
    padding: 42px 38px !important;
    color: #ffffff !important;
}

body:has(#authForm) .page.form h1,
body:has(#authForm) .page.form h2,
body:has(#authForm) .page.form h3 {
    color: #e7bd59 !important;
}

body:has(#authForm) .page.form label {
    color: #f5e6c6 !important;
}

body:has(#authForm) .page.form .muted,
body:has(#authForm) .page.form p {
    color: #d5dce8;
}

body:has(#authForm) .page.form a {
    color: #e7bd59 !important;
}

body:has(#authForm) .page.form input {
    background: #ffffff !important;
    color: #172338 !important;
    border-radius: 9px !important;
}


/* ZEBEX Full Navy Background - Customer Login */
body:has(#authForm) {
    background: #061326 !important;
}

body:has(#authForm) main,
body:has(#authForm) #app {
    background: linear-gradient(
        135deg,
        #020817 0%,
        #08254b 50%,
        #031126 100%
    ) !important;
}

body:has(#authForm) .page.form {
    position: relative;
    z-index: 1;
    border: 1px solid #d4af62 !important;
    box-shadow: 0 20px 60px rgba(0,0,0,0.4) !important;
}


/* ZEBEX Header Branding - Black & Extra Bold */
.premium-brand,
.premium-brand span,
.premium-brand strong,
.premium-run-brand {
    color: #000000 !important;
    font-weight: 900 !important;
}

/* Moving Announcement Text - White Background */
.ticker-track,
.ticker-wrap,
.ticker,
.announcement-bar,
.marquee {
    background: #ffffff !important;
    color: #000000 !important;
    font-weight: 900 !important;
}

/* Make moving text dark and bold */
.ticker-track *,
.ticker-wrap *,
.ticker *,
.announcement-bar *,
.marquee * {
    color: #000000 !important;
    font-weight: 900 !important;
}


/* ZEBEX GLOBAL IMPORTS - Clear Bold Branding */
.premium-brand {
    color: #000000 !important;
    font-weight: 900 !important;
}

.premium-brand small,
.premium-brand span,
.premium-brand strong {
    color: #000000 !important;
    font-weight: 900 !important;
    letter-spacing: 0.5px !important;
}

.premium-run-brand {
    color: #000000 !important;
    font-weight: 900 !important;
    letter-spacing: 0.5px !important;
}



/* ZEBEX LOCAL CLOCK */
.top:has(#zebex-live-clock) {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}

#zebex-live-clock {
  margin-left: auto;
  text-align: right;
  color: white;
  font-size: 12px;
  line-height: 1.5;
}

#zebex-clock-time {
  display: block;
  font-weight: 700;
}

#zebex-clock-date {
  display: block;
  font-size: 11px;
}


/* ZEBEX PREMIUM CLOCK DESIGN V1 */

.top:has(#zebex-live-clock) {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex-wrap: wrap;
  gap: 10px;
}

#zebex-live-clock {
  margin-left: auto !important;
  flex-shrink: 0;
  display: flex !important;
  flex-direction: column;
  align-items: flex-end;
  justify-content: center;

  background: #000000 !important;
  color: #ffffff !important;

  padding: 9px 16px;
  border: 1px solid #555555;
  border-radius: 10px;

  text-align: right;
  line-height: 1.4;
  font-family: Arial, sans-serif;
  font-variant-numeric: tabular-nums;

  box-shadow: 0 3px 10px rgba(0,0,0,.25);
}

#zebex-clock-time {
  display: block;
  color: #ffffff !important;
  font-size: 21px !important;
  font-weight: 900 !important;
  letter-spacing: 1px;
  white-space: nowrap;

  text-shadow: 1px 2px 2px #555555;
}

#zebex-clock-time::before {
  content: "◷ ";
  color: #ffffff;
  font-size: 21px;
}

#zebex-clock-date {
  display: block;
  color: #ffffff !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  letter-spacing: .3px;
  white-space: nowrap;

  text-shadow: 1px 1px 1px #444444;
}

@media (max-width: 600px) {
  #zebex-live-clock {
    padding: 6px 10px;
    border-radius: 8px;
    max-width: 100%;
  }

  #zebex-clock-time {
    font-size: 16px !important;
  }

  #zebex-clock-date {
    font-size: 10px !important;
    white-space: normal;
  }
}


/* ZEBEX WHITE HEADER CLOCK V2 */

.header #zebex-live-clock {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  padding: 4px 0 4px 12px !important;
  color: #111111 !important;
  align-items: flex-end;
  margin-left: auto !important;
}

.header #zebex-clock-time {
  color: #111111 !important;
  font-size: 22px !important;
  font-weight: 900 !important;
  text-shadow: none !important;
  letter-spacing: .3px;
}

.header #zebex-clock-time::before {
  content: "◷ ";
  color: #111111 !important;
  font-size: 27px !important;
}

.header #zebex-clock-date {
  color: #111111 !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  text-shadow: none !important;
}

@media (max-width: 600px) {
  .header #zebex-clock-time {
    font-size: 16px !important;
  }
  .header #zebex-clock-time::before {
    font-size: 20px !important;
  }
  .header #zebex-clock-date {
    font-size: 10px !important;
  }
}


/* ZEBEX SMALL MOBILE SEARCH FIX V1 */
@media (max-width: 380px) {
  .header form {
    display: flex;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    gap: 6px;
    box-sizing: border-box;
  }

  .header form input {
    flex: 1 1 0;
    width: 0;
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
    font-size: 13px;
    padding: 10px 8px;
  }

  .header form button {
    flex: 0 0 auto;
    white-space: nowrap;
    padding: 10px 12px;
    font-size: 13px;
  }
}

/* ZEBEX PREMIUM HERO SLIDER */
.hero-visual {
  position: relative;
  overflow: hidden;
  min-height: 380px;
  isolation: isolate;
}

#zebexHeroLink {
  position: relative;
  display: block;
  width: min(88%, 430px);
  margin: auto;
  text-decoration: none;
  border-radius: 24px;
  z-index: 3;
  filter: drop-shadow(0 22px 28px rgba(0,0,0,.3));
}

#zebexHeroImage {
  display: block;
  width: 100%;
  aspect-ratio: 1;
  object-fit: cover;
  border: 5px solid #fff;
  border-radius: 24px;
  box-shadow: 0 20px 50px rgba(0,0,0,.35);
  animation: none;
}

#zebexHeroLabel {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: #fff !important;
  color: #111 !important;
  border: 3px solid #111;
  border-radius: 12px;
  padding: 12px 28px !important;
  font-size: clamp(23px, 3vw, 36px);
  font-weight: 900 !important;
  text-align: center;
  white-space: nowrap;
  box-shadow: 0 8px 22px rgba(0,0,0,.25);
  z-index: 5;
}

#zebexHeroLink.zebex-slide-out {
  animation: zebexSlideOut .65s ease-in forwards;
}

#zebexHeroLink.zebex-slide-in {
  animation: zebexSlideIn .65s ease-out both;
}

@keyframes zebexSlideOut {
  from { transform: translateX(0); opacity: 1; }
  to { transform: translateX(-110%); opacity: 0; }
}

@keyframes zebexSlideIn {
  from { transform: translateX(110%); opacity: 0; }
  to { transform: translateX(0); opacity: 1; }
}

@media (max-width: 600px) {
  .hero-visual { min-height: 270px; }
  #zebexHeroLink { width: min(92%, 320px); }
  #zebexHeroLabel {
    font-size: 24px;
    padding: 10px 20px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  #zebexHeroLink.zebex-slide-out,
  #zebexHeroLink.zebex-slide-in {
    animation: none;
  }
}

/* ZEBEX PREMIUM HERO DESIGN */
.hero-visual {
  position: relative;
  overflow: visible;
}

#zebexHeroLink {
  display: flex !important;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  position: relative;
}

#zebexHeroImage {
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  border-radius: 18px;
  width: min(82%, 350px);
  object-fit: cover;
  transition: transform .6s ease, opacity .6s ease;
}

#zebexHeroLabel {
  position: static !important;
  display: block;
  margin-top: 18px !important;
  padding: 12px 30px !important;
  background: #ffffff !important;
  color: #111111 !important;
  border: 2px solid #111111;
  border-radius: 12px;
  font-size: 24px;
  font-weight: 800;
  text-align: center;
  box-shadow: 0 5px 16px rgba(0,0,0,.15);
}

#zebexHeroLink:hover #zebexHeroImage {
  transform: scale(1.05);
}


/* ZEBEX HERO IMAGE BLEND FIX */

#zebexHeroLink {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  overflow: visible !important;
  gap: 0 !important;
}

#zebexHeroImage {
  display: block !important;
  position: relative !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;

  -webkit-mask-image: radial-gradient(
    ellipse 72% 72% at center,
    black 58%,
    transparent 100%
  );
  mask-image: radial-gradient(
    ellipse 72% 72% at center,
    black 58%,
    transparent 100%
  );
}

#zebexHeroLabel {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  transform: none !important;

  margin-top: 35px !important;
  padding: 12px 28px !important;
  background: #ffffff !important;
  color: #111111 !important;
  border: 2px solid #111111 !important;
  border-radius: 10px !important;
  font-size: 24px !important;
  font-weight: 800 !important;
  text-align: center !important;
  z-index: 5 !important;
}


/* ZEBEX PREMIUM 3D ZOOM ANIMATION */

@keyframes zebexPremiumZoom {
  0% {
    transform: scale(0.94) translateZ(0);
  }

  45% {
    transform: scale(1.08) translateZ(0);
  }

  80% {
    transform: scale(1.14) translateZ(0);
  }

  100% {
    transform: scale(1.04) translateZ(0);
  }
}

#zebexHeroImage {
  animation: zebexPremiumZoom 10s ease-in-out infinite !important;
  transform-origin: center center !important;
  will-change: transform;
}

/* CATEGORY NAME — WHITE TEXT ONLY */

#zebexHeroLabel {
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;

  color: #ffffff !important;
  font-size: 30px !important;
  font-weight: 900 !important;
  letter-spacing: 0.5px !important;

  padding: 0 !important;
  margin-top: 32px !important;

  text-shadow: 0 3px 12px rgba(0,0,0,0.55) !important;
}

/* ACCESSIBILITY */

@media (prefers-reduced-motion: reduce) {
  #zebexHeroImage {
    animation: none !important;
  }
}


/* ZEBEX DEEP SLOW ZOOM */

@keyframes zebexDeepSlowZoom {
  0% {
    transform: scale(1);
  }

  35% {
    transform: scale(1.10);
  }

  70% {
    transform: scale(1.22);
  }

  100% {
    transform: scale(1.25);
  }
}

#zebexHeroImage {
  animation: zebexDeepSlowZoom 10s linear infinite !important;
  transform-origin: center center !important;
}

@media (prefers-reduced-motion: reduce) {
  #zebexHeroImage {
    animation: none !important;
  }
}



/* ZEBEX CLEAN SINGLE-TIMELINE HERO CAROUSEL */
#zebexHeroLink { display:flex !important; flex-direction:column; align-items:center; overflow:visible !important; }
.zebex-image-slot { position:relative; width:min(82%,350px); aspect-ratio:1; flex:none; isolation:isolate; }
.zebex-image-slot .zebex-carousel-photo {
  position:absolute !important; inset:0 !important; display:block !important;
  width:100% !important; height:100% !important; object-fit:cover;
  border:0 !important; outline:0 !important; box-shadow:none !important;
  border-radius:0 !important; animation:none !important;
  transition:none !important; transform-origin:center center;
  -webkit-mask-image:radial-gradient(ellipse 72% 72% at center,black 58%,transparent 100%);
  mask-image:radial-gradient(ellipse 72% 72% at center,black 58%,transparent 100%);
}
#zebexHeroLabel { position:relative !important; color:#fff !important; background:transparent !important;
  border:0 !important; box-shadow:none !important; font-size:30px !important;
  font-weight:900 !important; margin-top:32px !important; padding:0 !important; }
#zebexHeroLink:hover .zebex-carousel-photo { animation:none !important; }
.hero-visual { position:relative; }
.zebex-hero-arrow {
  position:absolute; top:43%; transform:translateY(-50%); z-index:20;
  display:flex; align-items:center; justify-content:center;
  width:44px; height:44px; padding:0; border:1px solid rgba(255,255,255,.65);
  border-radius:50%; background:rgba(35,13,80,.48); color:#fff;
  font-size:26px; font-weight:700; line-height:1; cursor:pointer;
  box-shadow:0 4px 16px rgba(0,0,0,.15);
}
.zebex-hero-prev { left:0; }
.zebex-hero-next { right:0; }
.zebex-hero-arrow:hover { background:rgba(35,13,80,.85); }
.zebex-hero-arrow:focus-visible { outline:3px solid #fff; outline-offset:3px; }
@media (max-width:520px) {
  .zebex-hero-arrow { width:36px; height:36px; font-size:22px; }
}
@media (prefers-reduced-motion:reduce) {
  .zebex-image-slot .zebex-carousel-photo { animation:none !important; }
}


/* ZEBEX CLEAN WHITE ARROWS V1 */

/* Keep arrow controls outside the zooming image */
.hero-visual {
  position: relative !important;
}

#zebexHeroLink {
  position: relative !important;
}

/* Style the existing arrow buttons */
.hero-visual button[class*="arrow"],
.hero-visual button[class*="Arrow"],
.hero-visual button[class*="prev"],
.hero-visual button[class*="next"] {
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
  outline: none !important;
  color: #ffffff !important;
  font-size: 38px !important;
  font-weight: 700 !important;
  padding: 8px !important;
  border-radius: 0 !important;
  z-index: 30 !important;
  cursor: pointer;
}



/* ZEBEX HERO RIGHT POSITION V2 */
.hero-visual {
  left: 60px !important;
}



/* ZEBEX FOOTER POLICY UPDATE V1 */
/* Transparent footer mark, with no white square and no change to header logo */
.footer-logo{display:block!important;width:150px!important;max-height:none!important;height:auto!important;object-fit:contain!important;background:transparent!important;padding:0!important;border:0!important;border-radius:0!important;box-shadow:none!important;margin:0 0 12px!important}
/* Ornamental gold line directly under each product image */
.zebex-priority{display:flex;align-items:center;justify-content:center;gap:7px;min-height:31px;padding:5px 6px;background:linear-gradient(110deg,#15120d,#2c2414,#15120d);color:#f4d486;border-top:1px solid #d5a74f;border-bottom:1px solid #d5a74f;white-space:nowrap;text-align:center}
.zebex-priority strong{font-size:clamp(9px,1.05vw,13px);letter-spacing:.7px;font-weight:850}
.zebex-priority span{font-family:Georgia,serif;font-size:19px;line-height:1;color:#e4b65d}
.zebex-priority span:last-child{transform:scaleX(-1)}
@media(max-width:600px){.zebex-priority{gap:4px;padding:5px 2px}.zebex-priority strong{font-size:9px;letter-spacing:.1px}.zebex-priority span{font-size:14px}}
.zebex-policy-page{max-width:900px;line-height:1.8}.zebex-policy-page h1{color:#142c4c}.zebex-policy-page h2{font-size:19px;color:#142c4c;margin:24px 0 6px}.zebex-policy-page p{margin:8px 0 14px}.zebex-policy-page a{color:#9a7127;text-decoration:underline}.zebex-policy-draft{background:#fff4d9;border-left:4px solid #c6a35c;padding:12px;font-weight:700}.zebex-policy-contact{border-top:1px solid #ddd;padding-top:16px;margin-top:28px!important}.zebex-policy-note{font-size:12px!important;color:#d7b873!important}


/* ZEBEX SUPER ADMIN BUTTON DESIGN */
a[href="#zebex-admin-management"].btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 68px;
    padding: 18px 30px;
    border: 1px solid #d6ae61;
    border-radius: 14px;
    background: linear-gradient(135deg, #102744, #1b3b60);
    color: #f7d78e;
    font-size: 18px;
    font-weight: 700;
    letter-spacing: .3px;
    text-decoration: none;
    box-shadow: 0 8px 24px rgba(12, 31, 55, .16);
    transition: transform .2s, box-shadow .2s;
}
a[href="#zebex-admin-management"].btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 28px rgba(12, 31, 55, .24);
}
a[href="#zebex-admin-management"].btn:focus-visible {
    outline: 3px solid #d6ae61;
    outline-offset: 3px;
}
@media (max-width: 600px) {
    a[href="#zebex-admin-management"].btn {
        width: 100%;
        box-sizing: border-box;
        font-size: 15px;
        text-align: center;
    }
}


/* ZEBEX LUXURY ADMIN HEADER */
.zebex-admin-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    width: 100%;
    box-sizing: border-box;
    padding: 24px 28px;
    margin-bottom: 22px;
    background: linear-gradient(110deg, #102840, #193A60);
    border: 1px solid #C9A15B;
    border-radius: 14px;
}

.zebex-admin-heading h1 {
    color: #FFFFFF !important;
    margin: 0 !important;
    font-weight: 800;
}

.zebex-admin-heading .zebex-admin-compact-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 13px 20px;
    background: #193A60;
    color: #F2CE8C !important;
    border: 1px solid #C9A15B;
    border-radius: 9px;
    font-weight: 700;
    text-decoration: none;
    white-space: nowrap;
    transition: background .2s ease;
}

.zebex-admin-heading .zebex-admin-compact-btn:hover {
    background: #254B73;
}

@media (max-width: 600px) {
    .zebex-admin-heading {
        flex-direction: column;
        align-items: stretch;
        padding: 20px;
    }
    .zebex-admin-heading .zebex-admin-compact-btn {
        width: 100%;
        box-sizing: border-box;
    }
}


/* ZEBEX ACCOUNT HELP LUXURY */
.zebex-account-help {
    width: 100%;
    box-sizing: border-box;
}

.zebex-help-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 22px;
    margin-top: 28px;
}

.zebex-help-card {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 14px;
    padding: 30px 25px;
    background: linear-gradient(145deg, #102840, #193A60);
    border: 1px solid #C9A15B;
    border-radius: 16px;
    color: #FFFFFF !important;
    text-decoration: none !important;
    box-shadow: 0 10px 28px rgba(0,0,0,.12);
    transition: transform .2s ease, box-shadow .2s ease;
}

.zebex-help-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 15px 32px rgba(0,0,0,.20);
}

.zebex-help-card > span {
    font-size: 34px;
}

.zebex-help-card h2 {
    color: #F2CE8C !important;
    font-size: 23px;
    font-weight: 800;
    margin: 0;
}

.zebex-help-card p {
    color: #E4EAF2 !important;
    line-height: 1.7;
    margin: 0;
    flex: 1;
}

.zebex-help-card strong {
    color: #F2CE8C;
    font-weight: 800;
}

@media (max-width: 800px) {
    .zebex-help-grid {
        grid-template-columns: 1fr;
    }
}


/* ZEBEX CUSTOMER MANAGEMENT TABLE */
#customerDashboardContent table {
    width: 100%;
    min-width: 850px;
    border-collapse: separate !important;
    border-spacing: 0;
    table-layout: auto;
}

#customerDashboardContent > div:has(table) {
    overflow-x: auto;
    max-width: 100%;
}

#customerDashboardContent th {
    background: #142d4b;
    color: #e8c47b;
    padding: 15px 18px !important;
    text-align: left;
    white-space: nowrap;
    font-weight: 700;
}

#customerDashboardContent td {
    padding: 15px 18px !important;
    border-bottom: 1px solid #e7e0d4;
    vertical-align: middle;
    white-space: nowrap;
}

#customerDashboardContent tbody tr:nth-child(even) {
    background: #f8f5ef;
}

#customerDashboardContent tbody tr:hover {
    background: #fff3d7;
}

#customerDashboardContent th:nth-child(2),
#customerDashboardContent td:nth-child(2) {
    min-width: 230px;
}


/* ZEBEX PREMIUM CUSTOMER TABLE V2 */
.zebex-customer-section-title {
    background: linear-gradient(110deg,#102947,#193d61);
    color: #f4d594;
    padding: 19px 24px;
    border-radius: 12px 12px 0 0;
    margin: 22px 0 0;
    font-size: 23px;
    border-bottom: 3px solid #d6ab58;
}

.zebex-customer-table-wrap {
    overflow-x: auto;
    background: #ffffff;
    border: 1px solid #e3d9c5;
    border-radius: 0 0 12px 12px;
    box-shadow: 0 8px 25px rgba(16,41,71,.09);
    padding: 8px 12px 14px;
}

#customerDashboardContent .zebex-customer-table {
    width: 100%;
    min-width: 900px;
    border-collapse: separate !important;
    border-spacing: 0 8px;
    font-size: 15px;
}

#customerDashboardContent .zebex-customer-table th {
    background: #f1e9d8;
    color: #173654;
    padding: 17px 20px !important;
    font-size: 16px;
    font-weight: 750;
    white-space: nowrap;
}

#customerDashboardContent .zebex-customer-table td {
    background: #f8fafc;
    color: #24384d;
    padding: 17px 20px !important;
    border-top: 1px solid #e3e9ef;
    border-bottom: 1px solid #e3e9ef;
    white-space: nowrap;
    vertical-align: middle;
}

#customerDashboardContent .zebex-customer-table tbody tr:nth-child(even) td {
    background: #f1f5f9;
}

#customerDashboardContent .zebex-customer-table tbody tr:hover td {
    background: #fff5df;
}

#customerDashboardContent .zebex-customer-table td:first-child {
    border-left: 1px solid #e3e9ef;
    border-radius: 9px 0 0 9px;
}

#customerDashboardContent .zebex-customer-table td:last-child {
    border-right: 1px solid #e3e9ef;
    border-radius: 0 9px 9px 0;
}

.zebex-customer-name {
    display: flex;
    align-items: center;
    gap: 12px;
}

.zebex-customer-avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    flex-shrink: 0;
    border-radius: 50%;
    background: #173654;
    color: #f1cf88;
    font-weight: 800;
    font-size: 17px;
}

.zebex-order-count,
.zebex-product-count {
    display: inline-block;
    min-width: 38px;
    text-align: center;
    padding: 7px 11px;
    border-radius: 8px;
    font-weight: 800;
}

.zebex-order-count {
    background: #e7edf5;
    color: #173654;
}

.zebex-product-count {
    background: #f7e9c5;
    color: #745015;
}

@media(max-width:700px) {
    .zebex-customer-section-title {
        font-size: 19px;
        padding: 16px;
    }
}


/* ZEBEX PREMIUM ANALYTICS CARDS V1 */

#customerDashboardContent .zebex-analytics-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
    margin: 22px 0;
}

#customerDashboardContent .zebex-analytics-card {
    background: linear-gradient(145deg, #142e49, #1d4263);
    color: #fff;
    border: 1px solid #caa45e;
    border-radius: 16px;
    padding: 25px;
    box-shadow: 0 8px 24px rgba(16, 38, 61, .15);
    min-width: 0;
}

#customerDashboardContent .zebex-analytics-card-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    color: #f1d69c;
    font-size: 14px;
    font-weight: 700;
}

#customerDashboardContent .zebex-analytics-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 12px;
    background: rgba(236, 197, 119, .13);
    border: 1px solid rgba(236, 197, 119, .35);
    color: #f1d69c;
    font-size: 23px;
}

#customerDashboardContent .zebex-analytics-value {
    margin-top: 20px;
    color: #f4d38e;
    font-size: clamp(34px, 4vw, 48px);
    line-height: 1.15;
    font-weight: 800;
    letter-spacing: -1px;
}

#customerDashboardContent .zebex-analytics-caption {
    margin-top: 8px;
    color: #fff;
    font-size: 15px;
    font-weight: 600;
}

#customerDashboardContent .zebex-analytics-period {
    margin-top: 20px;
    padding-top: 13px;
    border-top: 1px solid rgba(244, 211, 142, .25);
    color: #c7d5e3;
    font-size: 12px;
}

#customerDashboardContent .zebex-analytics-info {
    margin-top: 20px;
    padding: 17px 20px;
    border: 1px solid #e9d8b3;
    border-left: 4px solid #c79c50;
    border-radius: 12px;
    background: #fffaf0;
    color: #5b4b31;
    line-height: 1.7;
    font-size: 13px;
}

@media (max-width: 800px) {
    #customerDashboardContent .zebex-analytics-grid {
        grid-template-columns: 1fr;
    }

    #customerDashboardContent .zebex-analytics-card {
        padding: 22px;
    }
}


/* ZEBEX PREMIUM ONLINE CUSTOMERS V1 */

#customerDashboardContent .zebex-online-grid {
    grid-template-columns: minmax(0, 1fr);
    max-width: 420px;
    margin-bottom: 28px;
}

#customerDashboardContent .zebex-online-grid .zebex-analytics-card {
    position: relative;
    overflow: hidden;
    border: 1px solid #d3ac65;
    box-shadow: 0 12px 28px rgba(18, 43, 67, .18);
}

#customerDashboardContent .zebex-online-grid .zebex-analytics-value {
    font-size: clamp(44px, 6vw, 64px);
    color: #f5d48e;
}

#customerDashboardContent .zebex-online-empty {
    padding: 25px;
    margin: 15px 0 22px;
    border: 1px solid #e6d8bc;
    border-radius: 12px;
    background: #fffaf0;
    color: #6b5735;
    font-weight: 600;
    text-align: center;
}

#customerDashboardContent .zebex-online-grid + .zebex-customer-section-title {
    margin-top: 28px;
}

@media (max-width: 700px) {
    #customerDashboardContent .zebex-online-grid {
        max-width: 100%;
    }

    #customerDashboardContent .zebex-online-empty {
        padding: 20px 14px;
    }
}



/* ZEBEX VISITOR ANALYTICS WHITE PREMIUM V1 */
#customerDashboardContent .zebex-visitor-premium {
    width: 100%;
}

#customerDashboardContent .zebex-visitor-premium .zebex-analytics-grid {
    gap: 22px;
    margin: 24px 0;
}

#customerDashboardContent .zebex-visitor-premium .zebex-analytics-card {
    background: linear-gradient(145deg, #ffffff, #fffdf8);
    color: #173653;
    border: 1px solid #e7d6b7;
    border-radius: 18px;
    padding: 27px 25px;
    box-shadow: 0 10px 28px rgba(22, 45, 69, .09);
}

#customerDashboardContent .zebex-visitor-premium .zebex-analytics-card-top {
    color: #173653;
    font-size: 15px;
    font-weight: 800;
}

#customerDashboardContent .zebex-visitor-premium .zebex-analytics-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 46px;
    height: 46px;
    min-width: 46px;
    border-radius: 50%;
    background: #edf3f9;
    border: 1px solid #d7e3ef;
    color: #285a89;
    font-size: 24px;
}

#customerDashboardContent .zebex-visitor-premium .zebex-analytics-card:nth-child(2) .zebex-analytics-icon {
    background: #fff5df;
    border-color: #f1deb1;
    color: #b78931;
}

#customerDashboardContent .zebex-visitor-premium .zebex-analytics-card:nth-child(3) .zebex-analytics-icon {
    background: #edf3f9;
    color: #173653;
}

#customerDashboardContent .zebex-visitor-premium .zebex-analytics-value {
    color: #bf9346;
    font-size: clamp(38px, 4vw, 52px);
    font-weight: 800;
    margin-top: 19px;
}

#customerDashboardContent .zebex-visitor-premium .zebex-analytics-caption {
    color: #40556a;
    font-size: 14px;
}

#customerDashboardContent .zebex-visitor-premium .zebex-analytics-period {
    color: #7b8490;
    border-top: 1px solid #eee5d7;
    margin-top: 22px;
    padding-top: 14px;
}

#customerDashboardContent .zebex-visitor-premium .zebex-analytics-info {
    background: #fff9ec;
    border: 1px solid #ecd8ac;
    border-left: 4px solid #c49a4e;
    color: #655237;
    margin: 22px 0 30px;
}

#customerDashboardContent .zebex-visitor-premium .zebex-customer-table-wrap {
    overflow-x: auto;
    background: #fff;
    border: 1px solid #e8dcc6;
    border-radius: 15px;
    box-shadow: 0 7px 22px rgba(20, 43, 66, .06);
}

#customerDashboardContent .zebex-visitor-activity-table {
    width: 100%;
    border-collapse: collapse;
    min-width: 650px;
    font-size: 13px;
}

#customerDashboardContent .zebex-visitor-activity-table th {
    background: #173653;
    color: #f6dfad;
    padding: 15px 14px;
    text-align: left;
    font-weight: 700;
}

#customerDashboardContent .zebex-visitor-activity-table td {
    padding: 14px;
    color: #34495c;
    border-bottom: 1px solid #f0ece5;
}

#customerDashboardContent .zebex-visitor-activity-table tbody tr:nth-child(even) {
    background: #fcfaf6;
}

#customerDashboardContent .zebex-visitor-activity-table tbody tr:hover {
    background: #fff6e7;
}

#customerDashboardContent .zebex-visitor-status {
    display: inline-block;
    padding: 5px 11px;
    border-radius: 20px;
    background: #eaf5ed;
    color: #287243;
    font-size: 12px;
    font-weight: 700;
}

#customerDashboardContent .zebex-visitor-footnote {
    margin-top: 13px;
    color: #748090;
    font-size: 12px;
}

@media (max-width: 800px) {
    #customerDashboardContent .zebex-visitor-premium .zebex-analytics-grid {
        grid-template-columns: 1fr;
    }
}


/* ZEBEX PREMIUM ORDERS DASHBOARD V1 */
#customerDashboardContent .zebex-orders-dashboard {
    width: 100%;
}

#customerDashboardContent .zebex-order-stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
    margin: 24px 0;
}

#customerDashboardContent .zebex-order-stat {
    display: flex;
    flex-direction: column;
    gap: 15px;
    padding: 24px 20px;
    background: linear-gradient(145deg, #fff, #fffdf8);
    border: 1px solid #e8d7b8;
    border-radius: 16px;
    box-shadow: 0 8px 24px rgba(20, 43, 66, .08);
}

#customerDashboardContent .zebex-order-stat span {
    color: #173653;
    font-size: 14px;
    font-weight: 700;
}

#customerDashboardContent .zebex-order-stat strong {
    color: #bc9044;
    font-size: clamp(25px, 3vw, 36px);
    font-weight: 800;
    overflow-wrap: anywhere;
}

#customerDashboardContent .zebex-order-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 24px 0 18px;
}

#customerDashboardContent .zebex-orders-dashboard .zebex-customer-table-wrap {
    overflow-x: auto;
    border: 1px solid #e8dcc6;
    border-radius: 15px;
    background: #fff;
    box-shadow: 0 7px 22px rgba(20, 43, 66, .06);
}

#customerDashboardContent .zebex-orders-dashboard .zebex-customer-table {
    width: 100%;
    min-width: 850px;
    border-collapse: collapse;
}

#customerDashboardContent .zebex-orders-dashboard .zebex-customer-table th {
    background: #173653;
    color: #f6dfad;
    padding: 15px 13px;
    text-align: left;
    font-size: 13px;
}

#customerDashboardContent .zebex-orders-dashboard .zebex-customer-table td {
    padding: 14px 13px;
    border-bottom: 1px solid #eee9df;
    vertical-align: top;
    color: #354a5f;
    font-size: 13px;
}

#customerDashboardContent .zebex-orders-dashboard .zebex-customer-table tbody tr:nth-child(even) {
    background: #fcfaf6;
}

#customerDashboardContent .zebex-orders-dashboard .zebex-customer-table tbody tr:hover {
    background: #fff6e8;
}

#customerDashboardContent .zebex-order-secondary {
    color: #82909d;
    font-size: 12px;
    margin-top: 5px;
}

#customerDashboardContent .zebex-order-product {
    margin-bottom: 5px;
    line-height: 1.5;
}

#customerDashboardContent .zebex-order-status {
    display: inline-block;
    padding: 6px 12px;
    border-radius: 20px;
    background: #eaf1f8;
    color: #24537e;
    font-size: 12px;
    font-weight: 700;
    text-transform: capitalize;
}

@media (max-width: 900px) {
    #customerDashboardContent .zebex-order-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 480px) {
    #customerDashboardContent .zebex-order-stats {
        grid-template-columns: 1fr;
    }
}


/* ZEBEX Abandoned Cart Recovery — Premium Dashboard */
#customerDashboardContent .zebex-abandoned-stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
    margin: 22px 0;
}

#customerDashboardContent .zebex-abandoned-stats .note {
    margin: 0;
    min-width: 0;
    padding: 22px 18px;
    border: 1px solid #e8d9b9;
    border-top: 4px solid #c6a35c;
    border-radius: 12px;
    background: linear-gradient(145deg, #fff9e9, #ffffff);
    box-shadow: 0 4px 14px rgba(18, 45, 76, .06);
}

#customerDashboardContent .zebex-abandoned-stats .note strong {
    display: block;
    color: #173554;
    font-size: 13px;
}

#customerDashboardContent .zebex-abandoned-stats .note h2 {
    margin: 12px 0 0;
    color: #152f4d;
    font-size: clamp(22px, 2.4vw, 30px);
    overflow-wrap: anywhere;
}

#customerDashboardContent .zebex-abandoned-dashboard .zebex-customer-table-wrap {
    overflow-x: auto;
}

#customerDashboardContent .zebex-abandoned-dashboard .zebex-customer-table {
    min-width: 850px;
}

@media (max-width: 900px) {
    #customerDashboardContent .zebex-abandoned-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 480px) {
    #customerDashboardContent .zebex-abandoned-stats {
        grid-template-columns: 1fr;
    }
}


/* ZEBEX Premium Cart Recovery Email Reminder */
.zebex-reminder-premium{
  grid-column:1/-1;
  padding:30px;
  border:1px solid #d6b36a;
  border-radius:18px;
  background:linear-gradient(135deg,#fff 0%,#fffdf7 100%);
  box-shadow:0 8px 28px rgba(17,35,55,.06);
}
.zebex-reminder-heading{
  display:flex;
  align-items:center;
  gap:16px;
}
.zebex-reminder-icon{
  display:flex;
  align-items:center;
  justify-content:center;
  width:58px;
  height:58px;
  flex-shrink:0;
  border-radius:15px;
  background:#152c48;
  color:#d9b86e;
  font-size:30px;
}
.zebex-reminder-title{flex:1;min-width:0}
.zebex-reminder-eyebrow{
  display:block;
  color:#a27c37;
  font-size:11px;
  font-weight:800;
  letter-spacing:1.5px;
}
.zebex-reminder-title h2{
  margin:5px 0 0;
  color:#152c48;
  font-size:clamp(20px,2.2vw,28px);
  line-height:1.25;
}
.zebex-reminder-badge{
  padding:8px 12px;
  border-radius:30px;
  background:#f5ecd8;
  color:#8b682c;
  font-size:11px;
  font-weight:800;
  letter-spacing:1px;
}
.zebex-reminder-description{
  margin:22px 0;
  color:#606975;
  font-size:15px;
  line-height:1.7;
}
.zebex-reminder-control{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  padding:20px 0;
  border-top:1px solid #eee5d5;
}
.zebex-reminder-control-copy{
  display:flex;
  flex-direction:column;
  gap:6px;
}
.zebex-reminder-control-copy strong{
  color:#152c48;
  font-size:17px;
}
.zebex-reminder-control-copy span{
  color:#737b85;
  font-size:13px;
}
.zebex-reminder-switch{
  position:relative;
  display:inline-block;
  width:60px;
  height:34px;
  flex-shrink:0;
  cursor:pointer;
}
.zebex-reminder-switch input{
  position:absolute;
  opacity:0;
  width:100%;
  height:100%;
  margin:0;
  cursor:pointer;
}
.zebex-reminder-slider{
  position:absolute;
  inset:0;
  border-radius:34px;
  background:#b9c0c8;
  transition:background .2s;
  pointer-events:none;
}
.zebex-reminder-slider:before{
  content:"";
  position:absolute;
  width:26px;
  height:26px;
  left:4px;
  top:4px;
  border-radius:50%;
  background:#fff;
  box-shadow:0 2px 5px rgba(0,0,0,.15);
  transition:transform .2s;
}
.zebex-reminder-switch input:checked + .zebex-reminder-slider{
  background:#b9974f;
}
.zebex-reminder-switch input:checked + .zebex-reminder-slider:before{
  transform:translateX(26px);
}
.zebex-reminder-switch input:focus-visible + .zebex-reminder-slider{
  outline:3px solid #152c48;
  outline-offset:3px;
}
.zebex-reminder-switch input:disabled + .zebex-reminder-slider{
  opacity:.5;
  cursor:wait;
}
.zebex-reminder-status{
  margin:0;
  color:#647080;
  font-size:13px;
}
@media(max-width:600px){
  .zebex-reminder-premium{padding:20px}
  .zebex-reminder-heading{flex-wrap:wrap;gap:12px}
  .zebex-reminder-icon{width:48px;height:48px;font-size:24px}
  .zebex-reminder-badge{margin-left:60px}
  .zebex-reminder-description{font-size:14px}
}


/* ZEBEX PREMIUM CART EMAIL PREVIEW */
.zebex-cart-email-preview {
    max-width: 820px;
    margin: 28px auto 12px;
    background: #fff;
    border: 1px solid #e4d6b4;
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 14px 38px rgba(14, 35, 62, .12);
}

.zebex-email-preview-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 18px;
    padding: 28px;
    background: linear-gradient(135deg, #101e36, #203b5d);
    color: #fff;
    border-bottom: 3px solid #c5a05a;
}

.zebex-email-preview-label {
    display: inline-block;
    margin-bottom: 12px;
    padding: 6px 11px;
    border: 1px solid #d8b875;
    border-radius: 30px;
    color: #f0d59c;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1.2px;
}

.zebex-email-preview-header h2 {
    margin: 0 0 8px;
    color: #f1d99d;
    font-size: 24px;
    letter-spacing: 1px;
}

.zebex-email-preview-header p {
    margin: 0;
    color: #e2e8f0;
}

.zebex-email-preview-header .btn {
    flex-shrink: 0;
    border-color: #d7b36b;
    color: #f6e4bd;
    background: transparent;
}

.zebex-email-preview-body {
    padding: 30px;
    color: #1a2c43;
    line-height: 1.7;
}

.zebex-email-preview-body h3 {
    color: #172c49;
    margin: 22px 0 12px;
}

.zebex-email-preview-body hr {
    border: 0;
    border-top: 1px solid #e7e9ed;
    margin: 22px 0;
}

.zebex-email-preview-products {
    margin: 24px 0 12px;
    border: 1px solid #e7e9ed;
    border-radius: 12px;
    overflow: hidden;
}

.zebex-email-preview-product {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 14px 18px;
    border-bottom: 1px solid #edf0f3;
}

.zebex-email-preview-product:last-child {
    border-bottom: 0;
}

.zebex-email-preview-product strong {
    white-space: nowrap;
}

.zebex-email-preview-total {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    margin: 18px 0 24px;
    padding: 17px 20px;
    border-radius: 10px;
    background: #f7f1e4;
    color: #142d4a;
    font-size: 17px;
}

.zebex-preview-email-btn {
    white-space: nowrap;
    font-size: 12px;
}

@media (max-width: 600px) {
    .zebex-email-preview-header {
        flex-direction: column;
        padding: 22px;
    }

    .zebex-email-preview-header h2 {
        font-size: 20px;
    }

    .zebex-email-preview-body {
        padding: 20px;
    }

    .zebex-email-preview-product {
        align-items: flex-start;
        font-size: 13px;
    }

    .zebex-email-preview-total {
        font-size: 15px;
    }
}


/* ZEBEX UNIFIED DASHBOARD CARD BORDERS V1 */
/* Match the Abandoned Cart Recovery statistic cards. */
#customerDashboardContent .zebex-visitor-premium .zebex-analytics-card,
#customerDashboardContent .zebex-orders-dashboard .zebex-order-stat {
    border: 1px solid #e8d9b9;
    border-top: 4px solid #c6a35c;
    border-radius: 12px;
    background: linear-gradient(145deg, #fff9e9, #ffffff);
    box-shadow: 0 4px 14px rgba(18, 45, 76, .06);
}


/* ZEBEX PREMIUM ORDER CARDS V1 */

.page .order {
  position: relative;
  overflow: hidden;
  background: #fff;
  border: 1px solid #e7dfcf;
  border-radius: 18px;
  padding: 26px;
  margin: 22px 0;
  box-shadow: 0 6px 24px rgba(24, 24, 24, .045);
  transition: border-color .2s ease, box-shadow .2s ease;
}

.page .order::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: linear-gradient(90deg, #9b7939, #d8bb78, #9b7939);
}

.page .order:hover {
  border-color: #cbb27a;
  box-shadow: 0 10px 32px rgba(24, 24, 24, .075);
}

.page .order > .sectionhead {
  padding-bottom: 16px;
  border-bottom: 1px solid #eee9df;
  align-items: center;
}

.page .order > .sectionhead b {
  font-size: 19px;
  font-weight: 800;
  letter-spacing: -.3px;
}

.page .order > .muted {
  margin-top: 12px;
  line-height: 1.7;
  overflow-wrap: anywhere;
}

.page .order > p {
  background: #faf9f6;
  border: 1px solid #f0eade;
  border-radius: 12px;
  padding: 14px 16px;
  line-height: 1.8;
  margin: 17px 0;
  overflow-wrap: anywhere;
}

.page .order > ul {
  list-style: none;
  padding: 0;
  margin: 18px 0;
  border: 1px solid #eee9df;
  border-radius: 12px;
  overflow: hidden;
}

.page .order > ul > li {
  padding: 15px 17px;
  margin: 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
  border-bottom: 1px solid #f0ede7;
  line-height: 1.65;
  background: #fff;
}

.page .order > ul > li:nth-child(even) {
  background: #fdfcf9;
}

.page .order > ul > li:last-child {
  border-bottom: 0;
}

.page .order > ul > li > span {
  flex: 1 1 220px;
  min-width: 0;
  overflow-wrap: anywhere;
}

.page .order > ul > li > strong {
  display: inline-flex;
  align-items: center;
  padding: 5px 11px;
  border-radius: 999px;
  border: 1px solid #ead6d6;
  background: #fff2f2;
  color: #9a3c3c;
  font-size: 12px;
  font-weight: 800;
}

.page .order > ul > li > .btn {
  flex: 0 0 auto;
  border-radius: 8px;
  padding: 8px 13px;
  font-size: 12px;
  cursor: pointer;
}

.page .order > .pill,
.page .order .sectionhead .pill {
  border: 1px solid #e7d9b7;
  background: #fbf5e8;
  color: #765a27;
  padding: 7px 13px;
  border-radius: 999px;
  text-transform: capitalize;
  letter-spacing: .2px;
}

.page .order > b {
  display: block;
  text-align: right;
  font-size: 19px;
  font-weight: 800;
  padding: 15px 2px 3px;
}

.page .order > .actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 18px;
  padding-top: 18px;
  border-top: 1px solid #eee9df;
}

.page .order > .actions select {
  width: auto;
  min-width: 155px;
  max-width: 100%;
  flex: 0 1 auto;
  border: 1px solid #d8d2c5;
  border-radius: 9px;
  background: #fff;
  padding: 11px 14px;
}

.page .order > .actions .btn {
  flex: 0 0 auto;
  width: auto;
  min-width: 150px;
  max-width: 100%;
  border-radius: 9px;
  padding: 12px 19px;
  cursor: pointer;
}

@media (max-width: 640px) {
  .page .order {
    padding: 17px;
    border-radius: 14px;
    margin: 16px 0;
  }

  .page .order > .sectionhead b {
    font-size: 17px;
  }

  .page .order > ul > li {
    padding: 13px;
    gap: 9px;
  }

  .page .order > ul > li > span {
    flex-basis: 100%;
  }

  .page .order > .actions {
    justify-content: stretch;
  }

  .page .order > .actions select,
  .page .order > .actions .btn {
    flex: 1 1 140px;
    min-width: 0;
  }

  .page .order > b {
    font-size: 17px;
  }
}


/* ZEBEX PREMIUM ORDER TYPOGRAPHY V2 */

.page .order {
  padding: 30px 32px;
  margin: 26px 0;
}

.page .order > .sectionhead {
  padding-bottom: 20px;
}

.page .order > .sectionhead b {
  font-size: 22px;
  line-height: 1.4;
  letter-spacing: -.35px;
}

.page .order .sectionhead .pill {
  font-size: 13px;
  padding: 9px 16px;
  line-height: 1.3;
}

.page .order > .muted {
  margin-top: 18px;
  font-size: 15px;
  line-height: 1.8;
}

.page .order > p {
  margin: 21px 0 23px;
  padding: 19px 21px;
  font-size: 16px;
  line-height: 2;
}

.page .order > ul {
  margin: 23px 0;
}

.page .order > ul > li {
  padding: 20px 22px;
  gap: 16px;
  font-size: 16.5px;
  line-height: 1.85;
}

.page .order > ul > li > span {
  font-size: inherit;
  line-height: inherit;
}

.page .order > ul > li > strong {
  font-size: 13px;
  padding: 7px 13px;
  line-height: 1.4;
}

.page .order > ul > li > .btn {
  font-size: 13px;
  padding: 10px 15px;
}

.page .order > b {
  font-size: 22px;
  line-height: 1.5;
  padding: 23px 2px 8px;
}

.page .order > .actions {
  margin-top: 22px;
  padding-top: 22px;
  gap: 13px;
}

.page .order > .actions select,
.page .order > .actions .btn {
  font-size: 14px;
  line-height: 1.4;
}

@media (max-width: 640px) {
  .page .order {
    padding: 20px 17px;
    margin: 19px 0;
  }

  .page .order > .sectionhead {
    padding-bottom: 16px;
  }

  .page .order > .sectionhead b {
    font-size: 19px;
  }

  .page .order .sectionhead .pill {
    font-size: 12px;
    padding: 7px 11px;
  }

  .page .order > .muted {
    font-size: 13px;
    margin-top: 14px;
  }

  .page .order > p {
    font-size: 15px;
    padding: 15px;
    line-height: 1.85;
    margin: 17px 0;
  }

  .page .order > ul {
    margin: 18px 0;
  }

  .page .order > ul > li {
    padding: 17px 14px;
    font-size: 15px;
    line-height: 1.75;
    gap: 11px;
  }

  .page .order > ul > li > strong {
    font-size: 12px;
  }

  .page .order > b {
    font-size: 19px;
    padding-top: 18px;
  }
}


/* ZEBEX ORDER PRODUCT ROWS V3 */

.page .order > ul > li.zebex-order-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 22px 24px;
  opacity: 1 !important;
}

.zebex-order-product {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 7px;
  flex: 1 1 220px;
  min-width: 0;
}

.zebex-order-name {
  font-size: 17px;
  font-weight: 650;
  line-height: 1.5;
  overflow-wrap: anywhere;
}

.zebex-order-quantity {
  color: #737373;
  font-size: 14px;
  line-height: 1.5;
}

.zebex-order-side {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 12px;
  flex: 0 0 auto;
}

.zebex-order-price {
  font-size: 18px;
  font-weight: 800;
  white-space: nowrap;
}

.page .order .zebex-order-item.is-cancelled .zebex-order-name,
.page .order .zebex-order-item.is-cancelled .zebex-order-price {
  text-decoration: line-through;
  text-decoration-thickness: 1.5px;
  color: #858585;
}

.page .order .zebex-order-item .zebex-order-cancelled {
  display: inline-flex;
  border: 1px solid #f0d1d1;
  border-radius: 999px;
  background: #fff0f0;
  color: #a43535;
  padding: 5px 12px;
  font-size: 12px;
  font-weight: 800;
}

.page .order > .zebex-order-total {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
  padding: 24px 2px 10px;
  font-size: 18px;
  font-weight: 750;
}

.page .order > .zebex-order-total strong {
  font-size: 24px;
  font-weight: 850;
  white-space: nowrap;
}

@media (max-width: 640px) {
  .page .order > ul > li.zebex-order-item {
    padding: 17px 14px;
    gap: 12px;
    align-items: flex-start;
  }
  .zebex-order-name {font-size: 15px;}
  .zebex-order-quantity {font-size: 13px;}
  .zebex-order-price {font-size: 16px;}
  .zebex-order-side {max-width: 45%;}
  .page .order > .zebex-order-total {
    font-size: 15px;
    gap: 10px;
  }
  .page .order > .zebex-order-total strong {
    font-size: 19px;
  }
}


/* ZEBEX PREMIUM CHECKOUT V1 */
.zebex-checkout{max-width:1160px;margin:30px auto 65px}
.zebex-checkout-heading{margin-bottom:26px}
.zebex-checkout-heading>span{color:#a58236;font-size:12px;font-weight:800;letter-spacing:2px}
.zebex-checkout-heading h1{font-size:36px;margin:8px 0}
.zebex-checkout-heading p{color:#737373;margin:0}
.zebex-checkout-grid{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(300px,1fr);gap:24px;align-items:start}
.zebex-checkout-panel{background:#fff;border:1px solid #e9e4da;border-top:3px solid #c6a45d;border-radius:12px;padding:28px;box-shadow:0 6px 24px rgba(0,0,0,.035)}
.zebex-checkout-panel h2{font-size:21px;margin:0 0 7px}
.zebex-checkout-subtitle{font-size:13px;color:#777;margin:0 0 22px}
.zebex-checkout-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.zebex-checkout-field{min-width:0}
.zebex-checkout-field:nth-child(3){grid-column:1/-1}
.zebex-checkout-field label{display:block;font-size:13px;font-weight:700;margin-bottom:8px}
.zebex-checkout-field input{display:block;width:100%;min-width:0;padding:13px 14px;border:1px solid #dcdcdc;border-radius:7px;background:#fff;font:inherit}
.zebex-checkout-field input:focus{outline:2px solid #c6a45d;outline-offset:1px}
.zebex-checkout-submit{width:100%;margin-top:20px;padding:14px}
.zebex-checkout-submit:disabled{opacity:.6;cursor:wait}
.zebex-checkout-products{border-top:1px solid #eee}
.zebex-checkout-product{display:flex;justify-content:space-between;align-items:start;gap:16px;padding:16px 0;border-bottom:1px solid #eee}
.zebex-checkout-product>div{display:flex;flex-direction:column;gap:7px;min-width:0}
.zebex-checkout-product strong{font-size:14px;overflow-wrap:anywhere}
.zebex-checkout-product span{font-size:12px;color:#777}
.zebex-checkout-product>b{white-space:nowrap;font-size:14px}
.zebex-checkout-total{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:22px 0;font-size:17px}
.zebex-checkout-total strong{font-size:22px}
.zebex-checkout-notice{background:#faf7f0;border:1px solid #e9dfc9;border-radius:9px;padding:16px;font-size:13px;line-height:1.6}
.zebex-checkout-notice strong{display:block;margin-bottom:5px}
.zebex-checkout-notice p{margin:0;color:#666}
.zebex-checkout-success{max-width:700px;text-align:center;padding:55px 20px}
.zebex-checkout-success .btn{display:inline-block;margin-top:18px}
@media(max-width:760px){
  .zebex-checkout{margin-top:20px}
  .zebex-checkout-heading h1{font-size:29px}
  .zebex-checkout-grid{grid-template-columns:1fr;gap:18px}
  .zebex-checkout-panel{padding:20px}
}
@media(max-width:440px){
  .zebex-checkout-fields{grid-template-columns:1fr}
  .zebex-checkout-field:nth-child(3){grid-column:auto}
}


/* ZEBEX MOBILE CHECKOUT SUBMIT V2 */
.zebex-checkout-mobile-submit{display:none}
@media(max-width:760px){
  .zebex-checkout-desktop-submit{display:none}
  .zebex-checkout-mobile-submit{
    display:block;
    width:100%;
    padding:16px;
    margin:0;
    font-weight:700;
  }
  .zebex-checkout-mobile-submit:disabled{
    opacity:.6;
    cursor:wait;
  }
}


/* ZEBEX PREMIUM PAYMENT SELECTION V1 */
.zebex-payment-panel{grid-column:1/-1}
.zebex-payment-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.zebex-payment-option{display:flex;align-items:flex-start;gap:12px;padding:16px;border:1px solid #e4e0d8;border-radius:9px;cursor:pointer;background:#fff}
.zebex-payment-option:has(input:checked){border-color:#c6a45d;background:#fcf9f1}
.zebex-payment-option input{margin-top:4px;accent-color:#b4944e}
.zebex-payment-option span{display:flex;flex-direction:column;gap:5px}
.zebex-payment-option strong{font-size:14px}
.zebex-payment-option small{font-size:12px;color:#777;line-height:1.5}
.zebex-payment-message{font-size:13px;color:#6d6251;margin:18px 0 0}
.zebex-checkout button[hidden]{display:none!important}
@media(max-width:760px){
  .zebex-payment-panel{grid-column:auto}
  .zebex-payment-options{grid-template-columns:1fr}
}

/* ZEBEX Premium Customer Login Actions */
body:has(#authForm) .zebex-login-actions {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 18px;
  margin: 28px 0 24px;
}

body:has(#authForm) .zebex-login-register {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 8px;
  text-align: center;
  color: #dce6f5;
  font-size: 15px;
}

body:has(#authForm) .zebex-login-register a {
  color: #e8bc58 !important;
  font-weight: 700;
  text-decoration: none;
}

body:has(#authForm) .zebex-login-links {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  width: 100%;
}

body:has(#authForm) .zebex-login-links a {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 86px;
  padding: 12px 8px;
  border: 1px solid #b99754;
  border-radius: 12px;
  background: rgba(255,255,255,.035);
  color: #f0c66c !important;
  text-decoration: none;
  text-align: center;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.4;
  box-sizing: border-box;
}

body:has(#authForm) .zebex-login-links a:hover {
  background: rgba(212,175,98,.13);
  border-color: #e8bc58;
}

body:has(#authForm) .zebex-login-links a:focus-visible {
  outline: 3px solid #e8bc58;
  outline-offset: 3px;
}

@media (max-width: 380px) {
  body:has(#authForm) .zebex-login-links {
    grid-template-columns: 1fr;
  }
}

/* ZEBEX Premium Forgot Password Page */
.page.form.zebex-forgot-premium {
  width: min(440px, calc(100% - 32px));
  max-width: 440px;
  margin: 65px auto 85px;
  padding: 42px 36px;
  box-sizing: border-box;
  background: linear-gradient(145deg, #061326, #0b294c, #041021) !important;
  border: 1px solid #d4af62 !important;
  border-radius: 22px;
  box-shadow: 0 24px 70px rgba(0,0,0,.28);
  color: #f5f1e8;
}

.zebex-forgot-premium h1 {
  color: #e9bd59 !important;
  text-align: center;
  font-weight: 800;
  line-height: 1.2;
}

.zebex-forgot-premium > p,
.zebex-forgot-premium label {
  color: #e0e8f3 !important;
}

.zebex-forgot-premium > p {
  line-height: 1.7;
}

.zebex-forgot-premium label {
  display: block;
  margin: 18px 0 8px;
  font-weight: 700;
}

.zebex-forgot-premium input[type="email"] {
  display: block;
  width: 100%;
  min-height: 52px;
  box-sizing: border-box;
  padding: 12px 15px;
  border: 1px solid #b8c5d6;
  border-radius: 11px;
  background: #f2f6fc;
  color: #10243c;
  font: inherit;
}

.zebex-forgot-premium input[type="email"]:focus {
  outline: 2px solid #e9bd59;
  outline-offset: 2px;
}

.zebex-forgot-premium #forgotForm .btn {
  display: block;
  width: 100%;
  min-height: 52px;
  margin-top: 24px;
  border: 0;
  border-radius: 11px;
  background: linear-gradient(110deg, #a77a28, #e7c77d, #b48632) !important;
  color: #10243c !important;
  font-weight: 800;
  cursor: pointer;
}

.zebex-forgot-premium #forgotForm .btn:disabled {
  opacity: .65;
  cursor: wait;
}

.zebex-forgot-premium a {
  color: #e9bd59 !important;
  font-weight: 700;
  text-decoration: none;
}

.zebex-forgot-premium a:hover {
  text-decoration: underline;
}

.zebex-forgot-premium a:focus-visible {
  outline: 2px solid #e9bd59;
  outline-offset: 3px;
}

.zebex-forgot-premium #forgotMessage {
  color: #f0e4c5;
  overflow-wrap: anywhere;
}

@media (max-width: 480px) {
  .page.form.zebex-forgot-premium {
    margin: 30px auto 50px;
    padding: 28px 22px;
  }
}

/* ZEBEX VIP Checkout Two-Column Layout V2 */
.zebex-checkout-layout-v2 {
  display: grid;
  grid-template-columns: minmax(280px, 0.9fr) minmax(0, 1.7fr);
  gap: 24px;
  align-items: start;
}

.zebex-checkout-left,
.zebex-checkout-right {
  display: flex;
  flex-direction: column;
  gap: 20px;
  min-width: 0;
}

.zebex-checkout-layout-v2 .zebex-payment-panel {
  grid-column: auto;
}

.zebex-checkout-layout-v2 .zebex-checkout-panel {
  border-top-color: #c6a45d;
}

.zebex-checkout-layout-v2 .zebex-checkout-summary h2,
.zebex-checkout-layout-v2 .zebex-payment-panel h2 {
  color: #11294a;
}

@media (max-width: 850px) {
  .zebex-checkout-layout-v2 {
    grid-template-columns: 1fr;
  }

  .zebex-checkout-left {
    order: 1;
  }

  .zebex-checkout-right {
    order: 2;
  }
}

/* ZEBEX VIP Shopping Cart Summary V2 */
.zebex-checkout-layout-v2 .zebex-checkout-product {
  display: grid;
  grid-template-columns: 74px minmax(0,1fr) auto;
  align-items: center;
  gap: 13px;
  padding: 17px 0;
}

.zebex-checkout-layout-v2 .zebex-checkout-product-image {
  width: 74px;
  height: 80px;
  overflow: hidden;
  border: 1px solid #e8e1d3;
  border-radius: 9px;
  background: #f7f8fa;
}

.zebex-checkout-layout-v2 .zebex-checkout-product-image .photo {
  width: 100%;
  height: 100%;
  min-height: 0;
  margin: 0;
  border: 0;
  border-radius: 0;
}

.zebex-checkout-layout-v2 .zebex-checkout-product-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.zebex-checkout-layout-v2 .zebex-checkout-product-image .badge {
  display: none;
}

.zebex-checkout-layout-v2 .zebex-checkout-product-info {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
}

.zebex-checkout-layout-v2 .zebex-checkout-product-info strong {
  color: #11294a;
  font-size: 13px;
}

.zebex-checkout-layout-v2 .zebex-checkout-product-info span {
  color: #687588;
  font-size: 12px;
}

.zebex-checkout-layout-v2 .zebex-checkout-product > b {
  color: #11294a;
  font-size: 13px;
  white-space: nowrap;
}

.zebex-checkout-totals {
  padding-top: 14px;
}

.zebex-checkout-total-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 14px;
  padding: 12px 0;
  color: #4e5b6d;
  font-size: 14px;
}

.zebex-checkout-total-row strong {
  color: #11294a;
}

.zebex-checkout-grand-total {
  margin-top: 10px;
  padding-top: 19px;
  border-top: 2px solid #d2ac61;
  color: #11294a;
  font-size: 17px;
  font-weight: 800;
}

.zebex-checkout-grand-total strong {
  font-size: 22px;
}

.zebex-checkout-tax-note {
  margin: 4px 0 18px;
  color: #7b6d53;
  font-size: 12px;
  line-height: 1.6;
}

@media(max-width:440px) {
  .zebex-checkout-layout-v2 .zebex-checkout-product {
    grid-template-columns: 62px minmax(0,1fr);
  }

  .zebex-checkout-layout-v2 .zebex-checkout-product-image {
    width: 62px;
    height: 72px;
  }

  .zebex-checkout-layout-v2 .zebex-checkout-product > b {
    grid-column: 2;
  }
}

/* ZEBEX VIP PAYMENT DESIGN V1 */
.zebex-checkout-layout-v2 .zebex-payment-options {
  display: flex;
  flex-direction: column;
  gap: 11px;
}

.zebex-checkout-layout-v2 .zebex-payment-option {
  display: flex;
  align-items: center;
  gap: 14px;
  min-height: 75px;
  padding: 15px 17px;
  border: 1.5px solid #e2e7ee;
  border-radius: 12px;
  background: #fff;
  transition: border-color .2s, background .2s, box-shadow .2s;
}

.zebex-checkout-layout-v2 .zebex-payment-option:hover {
  border-color: #bda16c;
}

.zebex-checkout-layout-v2 .zebex-payment-option:has(input:checked) {
  border-color: #bd9952;
  background: #fffaf0;
  box-shadow: 0 0 0 2px rgba(189,153,82,.12);
}

.zebex-checkout-layout-v2 .zebex-payment-option input {
  flex: 0 0 auto;
  accent-color: #11294a;
  margin: 0;
}

.zebex-checkout-layout-v2 .zebex-payment-option > span:not(.zebex-payment-brand) {
  flex: 1;
  min-width: 0;
}

.zebex-checkout-layout-v2 .zebex-payment-option strong {
  color: #11294a;
  font-size: 14px;
}

.zebex-checkout-layout-v2 .zebex-payment-brand {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 65px;
  min-height: 34px;
  padding: 5px 9px;
  border: 1px solid #e5e8ef;
  border-radius: 7px;
  background: #fff;
  font-size: 12px;
  font-weight: 900;
  white-space: nowrap;
  letter-spacing: -.2px;
}

.zebex-brand-cod {
  color: #a58236;
}

.zebex-brand-card {
  color: #173d76;
  font-size: 10px !important;
}

.zebex-brand-paypal {
  color: #003087;
  font-style: italic;
}

.zebex-brand-apple {
  color: #111;
}

.zebex-brand-google {
  color: #4285f4;
}

.zebex-checkout-layout-v2 .zebex-checkout-submit,
.zebex-checkout-layout-v2 .zebex-checkout-mobile-submit {
  background: #11294a;
  color: #fff;
  border: 1px solid #bd9952;
  border-radius: 10px;
  font-size: 15px;
  font-weight: 800;
  min-height: 52px;
  box-shadow: 0 5px 15px rgba(17,41,74,.13);
}

.zebex-checkout-layout-v2 .zebex-checkout-submit:hover,
.zebex-checkout-layout-v2 .zebex-checkout-mobile-submit:hover {
  background: #1c3b63;
}

.zebex-checkout-layout-v2 .zebex-checkout-submit:disabled,
.zebex-checkout-layout-v2 .zebex-checkout-mobile-submit:disabled {
  opacity: .55;
  cursor: not-allowed;
}

@media(max-width:440px) {
  .zebex-checkout-layout-v2 .zebex-payment-option {
    padding: 13px 11px;
    gap: 9px;
  }

  .zebex-checkout-layout-v2 .zebex-payment-brand {
    min-width: 54px;
    font-size: 10px;
    padding: 4px 6px;
  }
}

/* ZEBEX REFERENCE CHECKOUT FOUNDATION V1 */
.zebex-checkout-layout-v2 .zebex-checkout-desktop-submit {
  width: 100%;
  margin: 0;
}
.zebex-checkout-layout-v2 .zebex-checkout-right {
  gap: 18px;
}
@media (max-width:760px) {
  .zebex-checkout-layout-v2 .zebex-checkout-desktop-submit {
    display: none;
  }
}

/* ZEBEX REFERENCE PAYMENT INTERACTIONS V2 */
.zebex-payment-preview:empty{display:none}
.zebex-payment-preview{margin-top:18px}
.zebex-reference-payment-tiles{
  display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:15px
}
.zebex-reference-tile{
  display:flex;flex-direction:column;gap:7px;
  padding:16px 18px;border:1px solid #d5dce5;
  border-radius:5px;background:#fafbfc;color:#647080
}
.zebex-reference-tile.selected{
  border:2px solid #11294a;background:#f4f6f9;color:#11294a
}
.zebex-reference-tile strong{font-size:16px}
.zebex-reference-tile span{font-size:13px;font-weight:700}
.zebex-reference-card-form label{
  display:block;margin:15px 0 7px;color:#11294a;font-weight:700
}
.zebex-reference-card-form input,
.zebex-reference-card-form select{
  width:100%;padding:13px;border:1px solid #cfd5dd;
  border-radius:5px;background:#f4f5f7;font:inherit;
  box-sizing:border-box
}
.zebex-reference-card-row{
  display:grid;grid-template-columns:1fr 1fr;gap:14px
}
.zebex-reference-demo-warning{
  color:#826a3c;font-size:12px;line-height:1.6
}
.zebex-reference-secure-message{
  display:flex;align-items:center;gap:16px;
  padding:21px;border:1px solid #d8dfe8;
  background:#fafbfc;color:#5e6a7a;
  font-size:13px;line-height:1.6
}
.zebex-reference-secure-message span{
  font-size:30px;color:#8893a1
}
.zebex-reference-pay-button{
  display:block;width:min(100%,440px);
  margin:25px 0 0;padding:15px;
  background:#727b8c;color:#fff;
  border:0;border-radius:5px;
  font-size:17px;font-weight:800
}
.zebex-reference-paypal-button{
  display:block;width:min(100%,440px);
  margin:10px 0;padding:15px;
  background:#ffc439;color:#11294a;
  border:0;border-radius:5px;font-size:18px
}
.zebex-reference-paypal-button strong{
  color:#003087;font-style:italic
}
.zebex-reference-pay-button:disabled,
.zebex-reference-paypal-button:disabled{
  cursor:not-allowed;opacity:.8
}
@media(max-width:440px){
  .zebex-reference-payment-tiles{gap:7px}
  .zebex-reference-tile{padding:12px}
  .zebex-reference-card-row{gap:9px}
}

/* ZEBEX REFERENCE PAYMENT BOX DESIGN V1 */

/* One connected payment selection container */
.zebex-checkout-layout-v2 .zebex-payment-options {
  display: flex;
  flex-direction: column;
  gap: 0;
  border: 1px solid #d5dce5;
  border-radius: 4px;
  overflow: hidden;
  background: #fff;
}

/* Reference-style horizontal payment rows */
.zebex-checkout-layout-v2 .zebex-payment-option {
  display: flex;
  flex-direction: row;
  align-items: center;
  min-height: 82px;
  gap: 18px;
  margin: 0;
  padding: 18px 20px;
  border: 0;
  border-bottom: 1px solid #d5dce5;
  border-radius: 0;
  background: #fff;
  box-shadow: none;
}

.zebex-checkout-layout-v2 .zebex-payment-option:last-child {
  border-bottom: 0;
}

.zebex-checkout-layout-v2 .zebex-payment-option:hover {
  background: #f7f9fc;
}

/* Selected row matches the reference's dark outline */
.zebex-checkout-layout-v2 .zebex-payment-option:has(input:checked) {
  position: relative;
  z-index: 1;
  background: #f0f3f8;
  outline: 2px solid #11294a;
  outline-offset: -2px;
  border-color: #d5dce5;
  box-shadow: none;
}

/* Radio buttons */
.zebex-checkout-layout-v2 .zebex-payment-option input {
  flex: 0 0 auto;
  width: 19px;
  height: 19px;
  margin: 0;
  accent-color: #11294a;
}

/* Payment title and description */
.zebex-checkout-layout-v2 .zebex-payment-option
> span:not(.zebex-payment-brand) {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  gap: 5px;
  min-width: 0;
}

.zebex-checkout-layout-v2 .zebex-payment-option strong {
  font-size: 15px;
  color: #11294a;
}

/* Existing branding stays visible until logo assets are added */
.zebex-checkout-layout-v2 .zebex-payment-brand {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  max-width: 45%;
  padding: 8px 12px;
  border: 1px solid #dce2eb;
  border-radius: 3px;
  background: #f7f9fc;
  font-size: 12px;
  white-space: nowrap;
}

/* Keep the payment preview visually connected */
.zebex-checkout-layout-v2 .zebex-payment-preview {
  margin-top: 16px;
}

/* Reference-style compact action buttons */
.zebex-checkout-layout-v2 .zebex-reference-pay-button,
.zebex-checkout-layout-v2 .zebex-reference-paypal-button {
  max-width: 440px;
  border-radius: 4px;
}

/* Mobile layout */
@media (max-width: 600px) {
  .zebex-checkout-layout-v2 .zebex-payment-option {
    min-height: 75px;
    padding: 14px 12px;
    gap: 10px;
  }

  .zebex-checkout-layout-v2 .zebex-payment-brand {
    max-width: 38%;
    padding: 7px;
    font-size: 10px;
    white-space: normal;
    text-align: center;
  }

  .zebex-checkout-layout-v2 .zebex-payment-option strong {
    font-size: 13px;
  }

  .zebex-checkout-layout-v2 .zebex-payment-option small {
    font-size: 11px;
  }
}

/* ZEBEX REFERENCE PAYMENT LOGOS V1 */
.zebex-checkout-layout-v2 .zebex-payment-logo-strip {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 7px;
  max-width: 53%;
  padding: 0;
  border: 0;
  background: transparent;
}

.zebex-checkout-layout-v2 .zebex-payment-logo-strip img {
  display: inline-block;
  width: auto;
  height: 21px;
  max-width: 48px;
  object-fit: contain;
}

.zebex-checkout-layout-v2 .zebex-payment-logo-strip img[alt="American Express"] {
  max-width: 31px;
}

.zebex-checkout-layout-v2 .zebex-cod-logo {
  padding: 6px 10px;
  border: 1px solid #d2b476;
  border-radius: 4px;
  color: #11294a;
  background: #fffaf0;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 1px;
}

.zebex-checkout-layout-v2 .zebex-tile-brand img {
  display: block;
  width: auto;
  max-width: 80px;
  height: 22px;
  object-fit: contain;
}

@media(max-width:600px) {
  .zebex-checkout-layout-v2 .zebex-payment-logo-strip {
    gap: 4px;
    max-width: 42%;
  }

  .zebex-checkout-layout-v2 .zebex-payment-logo-strip img {
    height: 16px;
    max-width: 33px;
  }
}

/* ZEBEX REFERENCE CARD FORM DESIGN V2 */

.zebex-checkout-layout-v2 .zebex-reference-card-number {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
}

.zebex-checkout-layout-v2 .zebex-reference-card-number input {
  width: 100%;
  min-height: 52px;
  padding-right: 125px;
  box-sizing: border-box;
}

.zebex-checkout-layout-v2 .zebex-reference-card-logos {
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 5px;
  pointer-events: none;
}

.zebex-checkout-layout-v2 .zebex-reference-card-logos img {
  display: block;
  width: 32px;
  height: 23px;
  object-fit: contain;
}

.zebex-checkout-layout-v2 .zebex-reference-card-row {
  display: grid;
  grid-template-columns: minmax(0,1fr) minmax(0,1fr);
  gap: 14px;
}

.zebex-checkout-layout-v2 .zebex-reference-card-row > div {
  min-width: 0;
}

.zebex-checkout-layout-v2 .zebex-reference-card-form input,
.zebex-checkout-layout-v2 .zebex-reference-card-form select {
  min-height: 52px;
  border: 1px solid #cfd5dd;
  border-radius: 4px;
  background: #f8f9fb;
  box-sizing: border-box;
}

.zebex-checkout-layout-v2 .zebex-reference-card-form input:disabled,
.zebex-checkout-layout-v2 .zebex-reference-card-form select:disabled {
  opacity: 1;
  cursor: not-allowed;
}

.zebex-checkout-layout-v2 .zebex-reference-payment-tiles {
  max-width: 620px;
}

.zebex-checkout-layout-v2 .zebex-reference-tile {
  cursor: pointer;
  text-align: left;
}

.zebex-checkout-layout-v2 .zebex-reference-tile:focus-visible {
  outline: 3px solid #c6a45d;
  outline-offset: 2px;
}

@media(max-width:440px) {
  .zebex-checkout-layout-v2 .zebex-reference-card-number input {
    padding-right: 100px;
  }

  .zebex-checkout-layout-v2 .zebex-reference-card-logos {
    right: 8px;
    gap: 3px;
  }

  .zebex-checkout-layout-v2 .zebex-reference-card-logos img {
    width: 27px;
    height: 20px;
  }
}

/* ZEBEX NAVY PAYMENT PANEL BORDER V1 */

/* Full navy outline around the white payment section */
.zebex-checkout-layout-v2 .zebex-payment-panel {
  background: #ffffff;
  border: 2px solid #11294a;
  border-top: 2px solid #11294a;
  border-radius: 16px;
  box-shadow: 0 5px 20px rgba(17, 41, 74, .06);
}

/* Keep the heading inside the navy-bordered section */
.zebex-checkout-layout-v2 .zebex-payment-panel h2 {
  color: #11294a;
}

@media (max-width: 600px) {
  .zebex-checkout-layout-v2 .zebex-payment-panel {
    border-width: 2px;
    border-radius: 12px;
  }
}

/* ZEBEX COMPACT PAYMENT ROWS AND LARGE LOGOS V1 */

/* Compact payment rows */
.zebex-checkout-layout-v2 .zebex-payment-option {
  min-height: 76px;
  padding: 12px 18px;
  gap: 13px;
}

.zebex-checkout-layout-v2 .zebex-payment-option
> span:not(.zebex-payment-brand) {
  gap: 3px;
}

.zebex-checkout-layout-v2 .zebex-payment-option strong {
  font-size: 15px;
}

.zebex-checkout-layout-v2 .zebex-payment-option small {
  font-size: 11px;
  line-height: 1.3;
}

/* Larger payment logos */
.zebex-checkout-layout-v2 .zebex-payment-logo-strip {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 7px;
  max-width: 62%;
}

.zebex-checkout-layout-v2 .zebex-payment-logo-strip img {
  width: auto;
  height: 33px;
  max-width: 67px;
  object-fit: contain;
}

.zebex-checkout-layout-v2
.zebex-payment-logo-strip img[alt="American Express"] {
  max-width: 49px;
}

/* Larger logos inside the card-number field */
.zebex-checkout-layout-v2 .zebex-reference-card-number input {
  min-height: 54px;
  padding-right: 174px;
}

.zebex-checkout-layout-v2 .zebex-reference-card-logos {
  gap: 6px;
  right: 12px;
}

.zebex-checkout-layout-v2 .zebex-reference-card-logos img {
  width: 48px;
  height: 30px;
  object-fit: contain;
}

/* Shorter Card and Google Pay selection tiles */
.zebex-checkout-layout-v2 .zebex-reference-tile {
  min-height: 74px;
  padding: 12px 16px;
  gap: 5px;
}

.zebex-checkout-layout-v2 .zebex-reference-payment-tiles {
  margin-bottom: 12px;
}

@media (max-width: 600px) {
  .zebex-checkout-layout-v2 .zebex-payment-option {
    min-height: 72px;
    padding: 11px 10px;
    gap: 9px;
  }

  .zebex-checkout-layout-v2 .zebex-payment-logo-strip {
    max-width: 53%;
    gap: 4px;
  }

  .zebex-checkout-layout-v2 .zebex-payment-logo-strip img {
    height: 23px;
    max-width: 43px;
  }

  .zebex-checkout-layout-v2 .zebex-reference-card-number input {
    padding-right: 125px;
  }

  .zebex-checkout-layout-v2 .zebex-reference-card-logos img {
    width: 34px;
    height: 24px;
  }
}

@media (max-width: 380px) {
  .zebex-checkout-layout-v2 .zebex-payment-logo-strip img {
    height: 19px;
    max-width: 36px;
  }

  .zebex-checkout-layout-v2 .zebex-reference-card-number input {
    padding-right: 112px;
  }

  .zebex-checkout-layout-v2 .zebex-reference-card-logos img {
    width: 30px;
    height: 21px;
  }
}

/* ZEBEX PAYPAL CHECKOUT LOGO V1 */

.zebex-checkout-layout-v2 .zebex-reference-paypal-button {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
  gap: 10px;
  width: min(100%, 440px);
  min-height: 56px;
  padding: 12px 18px;
  background: #ffcf62;
  color: #163c77;
  border-radius: 6px;
  font-size: 19px;
  font-weight: 600;
}

.zebex-checkout-layout-v2 .zebex-reference-paypal-logo {
  display: block;
  width: 94px;
  max-width: 38%;
  height: 30px;
  object-fit: contain;
  filter: invert(19%) sepia(66%) saturate(1481%)
          hue-rotate(191deg) brightness(91%) contrast(97%);
}

.zebex-checkout-layout-v2 .zebex-reference-paypal-button span {
  font-size: 19px;
  font-weight: 500;
}

@media(max-width:440px) {
  .zebex-checkout-layout-v2 .zebex-reference-paypal-logo {
    width: 80px;
    height: 27px;
  }

  .zebex-checkout-layout-v2 .zebex-reference-paypal-button span {
    font-size: 17px;
  }
}

/* ZEBEX PAYMENT BRAND LOGO CORRECTION V1 */

/* Complete PayPal branding inside the yellow preview button */
.zebex-checkout-layout-v2 .zebex-reference-paypal-button {
  gap: 9px;
  justify-content: center;
}

.zebex-checkout-layout-v2 .zebex-reference-paypal-logo {
  width: 39px;
  height: 39px;
  max-width: none;
  flex: 0 0 39px;
  object-fit: contain;
  filter: invert(19%) sepia(66%) saturate(1481%)
          hue-rotate(191deg) brightness(91%) contrast(97%);
}

.zebex-checkout-layout-v2
.zebex-reference-paypal-logo + span::before {
  content: "PayPal";
  display: inline;
  margin-right: 7px;
  color: #174c91;
  font-size: 23px;
  font-weight: 900;
  font-style: italic;
  letter-spacing: -0.8px;
}

.zebex-checkout-layout-v2
.zebex-reference-paypal-logo + span {
  color: #174c91;
  font-size: 20px;
  font-weight: 500;
}

/* Make Apple Pay and Google Pay row logos prominent */
.zebex-checkout-layout-v2
.zebex-payment-option:has(input[value="apple_pay"])
.zebex-payment-logo-strip img {
  width: 110px;
  max-width: none;
  height: 45px;
  object-fit: contain;
}

.zebex-checkout-layout-v2
.zebex-payment-option:has(input[value="google_pay"])
.zebex-payment-logo-strip img {
  width: 118px;
  max-width: none;
  height: 45px;
  object-fit: contain;
}

/* Allow enough space for full digital-wallet branding */
.zebex-checkout-layout-v2
.zebex-payment-option:has(input[value="apple_pay"])
.zebex-payment-logo-strip,
.zebex-checkout-layout-v2
.zebex-payment-option:has(input[value="google_pay"])
.zebex-payment-logo-strip {
  flex: 0 0 auto;
  max-width: 45%;
}

/* Enlarge Google Pay branding inside the selection tile */
.zebex-checkout-layout-v2 .zebex-tile-brand img {
  width: 85px;
  max-width: 100%;
  height: 31px;
  object-fit: contain;
}

@media(max-width:600px) {
  .zebex-checkout-layout-v2
  .zebex-payment-option:has(input[value="apple_pay"])
  .zebex-payment-logo-strip img {
    width: 85px;
    height: 36px;
  }

  .zebex-checkout-layout-v2
  .zebex-payment-option:has(input[value="google_pay"])
  .zebex-payment-logo-strip img {
    width: 90px;
    height: 36px;
  }

  .zebex-checkout-layout-v2
  .zebex-reference-paypal-logo + span::before {
    font-size: 20px;
  }

  .zebex-checkout-layout-v2
  .zebex-reference-paypal-logo + span {
    font-size: 17px;
  }
}

/* ZEBEX PROFESSIONAL PAYMENT BRANDING V1 */

/* PayPal's familiar two-tone brand presentation */
.zebex-checkout-layout-v2 .zebex-reference-paypal-logo {
  width: 46px;
  height: 46px;
  flex: 0 0 46px;
  max-width: none;
  object-fit: contain;
  filter: invert(15%) sepia(65%) saturate(2010%)
          hue-rotate(201deg) brightness(88%) contrast(105%);
}

.zebex-checkout-layout-v2
.zebex-reference-paypal-logo + span::before {
  content: "Pay";
  color: #003087;
  font-size: 26px;
  font-style: italic;
  font-weight: 900;
  letter-spacing: -1px;
  margin-right: 0;
}

.zebex-checkout-layout-v2
.zebex-reference-paypal-logo + span::after {
  content: "";
}

.zebex-checkout-layout-v2
.zebex-reference-paypal-logo + span {
  color: #003087;
  font-size: 21px;
  font-weight: 500;
}

/* Distinct light-blue PayPal brand lettering */
.zebex-checkout-layout-v2
.zebex-reference-paypal-logo + span::first-letter {
  color: #003087;
}

/* More prominent Apple Pay and Google Pay logos */
.zebex-checkout-layout-v2
.zebex-payment-option:has(input[value="apple_pay"])
.zebex-payment-logo-strip img {
  width: 145px;
  height: 58px;
  max-width: none;
}

.zebex-checkout-layout-v2
.zebex-payment-option:has(input[value="google_pay"])
.zebex-payment-logo-strip img {
  width: 155px;
  height: 58px;
  max-width: none;
}

/* Larger Google Pay artwork inside the payment tile */
.zebex-checkout-layout-v2 .zebex-tile-brand img {
  width: 120px;
  height: 42px;
  max-width: 100%;
  object-fit: contain;
}

/* Compact tiles despite larger logos */
.zebex-checkout-layout-v2 .zebex-reference-tile {
  min-height: 82px;
  padding: 12px 16px;
}

/* Mobile sizes */
@media(max-width:600px) {
  .zebex-checkout-layout-v2
  .zebex-payment-option:has(input[value="apple_pay"])
  .zebex-payment-logo-strip img {
    width: 105px;
    height: 45px;
  }

  .zebex-checkout-layout-v2
  .zebex-payment-option:has(input[value="google_pay"])
  .zebex-payment-logo-strip img {
    width: 115px;
    height: 45px;
  }

  .zebex-checkout-layout-v2 .zebex-tile-brand img {
    width: 95px;
    height: 34px;
  }

  .zebex-checkout-layout-v2 .zebex-reference-paypal-logo {
    width: 37px;
    height: 37px;
    flex-basis: 37px;
  }

  .zebex-checkout-layout-v2
  .zebex-reference-paypal-logo + span::before {
    font-size: 22px;
  }
}

/* ZEBEX TWO-TONE PAYPAL CHECKOUT V1 */

.zebex-checkout-layout-v2 .zebex-paypal-two-tone {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-height: 60px;
  background: #ffda80;
  border: 0;
  border-radius: 6px;
}

.zebex-checkout-layout-v2 .zebex-paypal-two-tone
.zebex-paypal-wordmark {
  display: inline-flex;
  align-items: baseline;
  flex-direction: row;
  gap: 0;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 29px;
  font-weight: 900;
  font-style: italic;
  letter-spacing: -1.5px;
  line-height: 1;
  white-space: nowrap;
}

.zebex-checkout-layout-v2 .zebex-paypal-two-tone
.zebex-paypal-word-pay {
  color: #003087;
}

.zebex-checkout-layout-v2 .zebex-paypal-two-tone
.zebex-paypal-word-pal {
  color: #009cde;
}

.zebex-checkout-layout-v2 .zebex-paypal-two-tone
.zebex-paypal-checkout-label {
  color: #003087;
  font-size: 23px;
  font-weight: 500;
  letter-spacing: -.4px;
  line-height: 1;
}

@media(max-width:440px) {
  .zebex-checkout-layout-v2 .zebex-paypal-two-tone
  .zebex-paypal-wordmark {
    font-size: 24px;
  }

  .zebex-checkout-layout-v2 .zebex-paypal-two-tone
  .zebex-paypal-checkout-label {
    font-size: 19px;
  }
}

/* ZEBEX PREMIUM CASH BADGE V1 */

.zebex-checkout-layout-v2
.zebex-payment-option:has(input[value="cod"])
.zebex-brand-cod {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
  flex: 0 0 auto;
  min-width: 104px;
  min-height: 53px;
  padding: 9px 16px;
  box-sizing: border-box;
  border: 1.5px solid #c6a45d;
  border-radius: 6px;
  background: #fffaf0;
  color: #11294a;
  font-size: 23px;
  font-weight: 900;
  line-height: 1;
  letter-spacing: 1.5px;
  white-space: nowrap;
}

@media(max-width:600px) {
  .zebex-checkout-layout-v2
  .zebex-payment-option:has(input[value="cod"])
  .zebex-brand-cod {
    min-width: 82px;
    min-height: 45px;
    padding: 8px 11px;
    font-size: 19px;
    letter-spacing: 1px;
  }
}

/* ZEBEX FINAL PAYMENT TILES V1 */

.zebex-checkout-layout-v2 .zebex-reference-tile {
  min-height: 86px;
  padding: 14px 16px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.zebex-checkout-layout-v2 .zebex-final-tile-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 9px;
  width: 100%;
}

.zebex-checkout-layout-v2 .zebex-final-tile-name {
  color: #11294a;
  font-size: 16px;
  font-weight: 800;
  line-height: 1.2;
}

.zebex-checkout-layout-v2 .zebex-final-card-logos {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 5px;
  width: 100%;
}

.zebex-checkout-layout-v2 .zebex-final-card-logos img {
  width: 47px;
  max-width: 23%;
  height: 32px;
  object-fit: contain;
}

.zebex-checkout-layout-v2 .zebex-final-google-brand {
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 4px;
  font-family: Arial, Helvetica, sans-serif;
  line-height: 1;
}

.zebex-checkout-layout-v2 .zebex-google-g {
  font-size: 38px;
  font-weight: 800;
  color: #4285f4;
}

.zebex-checkout-layout-v2 .zebex-google-pay {
  font-size: 30px;
  font-weight: 500;
  color: #202124;
}

@media(max-width:600px) {
  .zebex-checkout-layout-v2 .zebex-reference-tile {
    min-height: 78px;
    padding: 10px 8px;
  }

  .zebex-checkout-layout-v2 .zebex-final-card-logos {
    gap: 3px;
  }

  .zebex-checkout-layout-v2 .zebex-final-card-logos img {
    width: 35px;
    height: 25px;
  }

  .zebex-checkout-layout-v2 .zebex-google-g {
    font-size: 30px;
  }

  .zebex-checkout-layout-v2 .zebex-google-pay {
    font-size: 24px;
  }
}

/* ZEBEX PAYPAL CENTER AND CASH SIZE V1 */

/* Center the PayPal Checkout label inside its yellow button */
.zebex-checkout-layout-v2 .zebex-paypal-two-tone {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
  gap: 11px;
  width: min(100%, 440px);
  min-height: 64px;
  padding: 12px 18px;
  margin-left: auto;
  margin-right: auto;
  box-sizing: border-box;
  text-align: center;
}

/* Bigger, bolder PayPal lettering */
.zebex-checkout-layout-v2
.zebex-paypal-two-tone .zebex-paypal-wordmark {
  display: inline-flex;
  flex-direction: row;
  align-items: baseline;
  justify-content: center;
  flex: 0 0 auto;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 35px;
  font-weight: 900;
  font-style: italic;
  letter-spacing: -1.7px;
  line-height: 1;
  white-space: nowrap;
}

.zebex-checkout-layout-v2
.zebex-paypal-two-tone .zebex-paypal-word-pay {
  color: #002c80;
  font-weight: 900;
}

.zebex-checkout-layout-v2
.zebex-paypal-two-tone .zebex-paypal-word-pal {
  color: #0077b8;
  font-weight: 900;
}

.zebex-checkout-layout-v2
.zebex-paypal-two-tone .zebex-paypal-checkout-label {
  color: #002c80;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 29px;
  font-weight: 800;
  letter-spacing: -0.7px;
  line-height: 1;
  white-space: nowrap;
}

/* Larger CASH badge text */
.zebex-checkout-layout-v2
.zebex-payment-option:has(input[value="cod"])
.zebex-brand-cod {
  min-width: 115px;
  min-height: 57px;
  padding: 10px 17px;
  font-size: 27px;
  font-weight: 900;
  letter-spacing: 1.6px;
  color: #11294a;
}

/* Mobile adjustments */
@media(max-width:600px) {
  .zebex-checkout-layout-v2 .zebex-paypal-two-tone {
    gap: 7px;
    min-height: 58px;
    padding: 10px 8px;
  }

  .zebex-checkout-layout-v2
  .zebex-paypal-two-tone .zebex-paypal-wordmark {
    font-size: 27px;
    letter-spacing: -1.2px;
  }

  .zebex-checkout-layout-v2
  .zebex-paypal-two-tone .zebex-paypal-checkout-label {
    font-size: 22px;
  }

  .zebex-checkout-layout-v2
  .zebex-payment-option:has(input[value="cod"])
  .zebex-brand-cod {
    min-width: 90px;
    min-height: 47px;
    padding: 8px 12px;
    font-size: 21px;
    letter-spacing: 1px;
  }
}

@media(max-width:360px) {
  .zebex-checkout-layout-v2
  .zebex-paypal-two-tone .zebex-paypal-wordmark {
    font-size: 24px;
  }

  .zebex-checkout-layout-v2
  .zebex-paypal-two-tone .zebex-paypal-checkout-label {
    font-size: 19px;
  }
}

/* ZEBEX CASH BADGE AND PAYMENT BUTTON ALIGNMENT V1 */

/* Make CASH lettering visibly larger without affecting other brands */
.zebex-checkout-layout-v2
.zebex-payment-option:has(input[value="cod"])
.zebex-payment-brand.zebex-brand-cod {
  display: inline-flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 auto;
  width: auto;
  min-width: 132px;
  min-height: 62px;
  padding: 10px 18px;
  box-sizing: border-box;
  color: #11294a !important;
  font-size: 32px !important;
  font-weight: 900 !important;
  letter-spacing: 2px;
  line-height: 1 !important;
  white-space: nowrap;
}

/* Center non-PayPal payment preview buttons */
.zebex-checkout-layout-v2
.zebex-payment-preview .zebex-reference-pay-button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: min(100%, 440px);
  max-width: 440px;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center;
  box-sizing: border-box;
}

/* Keep PayPal's already approved appearance unchanged */

@media (max-width: 600px) {
  .zebex-checkout-layout-v2
  .zebex-payment-option:has(input[value="cod"])
  .zebex-payment-brand.zebex-brand-cod {
    min-width: 96px;
    min-height: 49px;
    padding: 8px 10px;
    font-size: 24px !important;
    letter-spacing: 1px;
  }

  .zebex-checkout-layout-v2
  .zebex-payment-preview .zebex-reference-pay-button {
    width: min(100%, 440px);
  }
}

/* ZEBEX CASH LOGO ACTUAL SELECTOR FIX V1 */

.zebex-checkout-layout-v2
.zebex-payment-option:has(input[value="cod"])
.zebex-cod-logo {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 32px !important;
    font-weight: 900 !important;
    line-height: 1.1 !important;
    letter-spacing: 2px !important;
    color: #11294a !important;
    white-space: nowrap !important;
}

@media (max-width: 600px) {
    .zebex-checkout-layout-v2
    .zebex-payment-option:has(input[value="cod"])
    .zebex-cod-logo {
        font-size: 24px !important;
        letter-spacing: 1px !important;
    }
}

/* ZEBEX PREMIUM COMPACT PAYMENT LAYOUT V2 */

/* Full-width navy outlined payment heading */
.zebex-checkout-layout-v2 .zebex-payment-header-frame {
    display: block;
    width: 100%;
    box-sizing: border-box;
    border: 2.5px solid #142e51;
    border-radius: 18px;
    padding: 18px 22px;
    margin-bottom: 20px;
    background: #ffffff;
}

.zebex-checkout-layout-v2 .zebex-payment-header-frame h2 {
    margin: 0 0 7px;
    color: #142e51;
}

.zebex-checkout-layout-v2
.zebex-payment-header-frame .zebex-checkout-subtitle {
    margin: 0;
}

/* Compact payment rows; preserve existing border styling */
.zebex-checkout-layout-v2
.zebex-payment-options .zebex-payment-option {
    min-height: 68px;
    padding-top: 9px;
    padding-bottom: 9px;
    box-sizing: border-box;
}

/* Mobile spacing */
@media (max-width: 600px) {
    .zebex-checkout-layout-v2 .zebex-payment-header-frame {
        padding: 15px 16px;
        border-radius: 15px;
        margin-bottom: 16px;
    }

    .zebex-checkout-layout-v2
    .zebex-payment-options .zebex-payment-option {
        min-height: 62px;
        padding-top: 8px;
        padding-bottom: 8px;
    }
}

/* ZEBEX ULTRA COMPACT PAYMENT ROWS V1 */

/* Reduce row height without touching borders */
.zebex-checkout-layout-v2
.zebex-payment-options .zebex-payment-option {
    min-height: 58px !important;
    padding-top: 5px !important;
    padding-bottom: 5px !important;
    gap: 10px !important;
}

/* Compact the payment logo container */
.zebex-checkout-layout-v2
.zebex-payment-options .zebex-payment-logo-strip {
    gap: 5px !important;
    padding: 3px 5px !important;
}

/* Slightly smaller card logos to avoid tall wrapping */
.zebex-checkout-layout-v2
.zebex-payment-options .zebex-payment-logo-strip img {
    height: 29px !important;
    max-width: 48px !important;
    width: auto;
    object-fit: contain;
}

/* Keep CASH typography, but reduce surrounding whitespace */
.zebex-checkout-layout-v2
.zebex-payment-option:has(input[value="cod"])
.zebex-payment-logo-strip {
    padding: 3px 7px !important;
}

/* Mobile compact layout */
@media (max-width: 600px) {
    .zebex-checkout-layout-v2
    .zebex-payment-options .zebex-payment-option {
        min-height: 54px !important;
        padding-top: 5px !important;
        padding-bottom: 5px !important;
        gap: 7px !important;
    }

    .zebex-checkout-layout-v2
    .zebex-payment-options .zebex-payment-logo-strip img {
        height: 23px !important;
        max-width: 39px !important;
    }
}

/* ZEBEX PAYMENT LOGO AND TILE SIZE FIX V1 */

/* Restore Apple Pay and Google Pay logo visibility */
.zebex-checkout-layout-v2
.zebex-payment-option:has(input[value="apple_pay"])
.zebex-payment-logo-strip img,
.zebex-checkout-layout-v2
.zebex-payment-option:has(input[value="google_pay"])
.zebex-payment-logo-strip img {
    height: 39px !important;
    max-width: 110px !important;
    width: auto !important;
    object-fit: contain;
}

/* Reduce the two large Card / Google Pay selection boxes */
.zebex-checkout-layout-v2 .zebex-reference-tile {
    min-height: 82px !important;
    padding: 9px 12px !important;
    box-sizing: border-box;
}

/* Compact only the logos inside those two selection boxes */
.zebex-checkout-layout-v2
.zebex-reference-tile img {
    max-height: 35px;
    object-fit: contain;
}

@media (max-width: 600px) {
    .zebex-checkout-layout-v2
    .zebex-payment-option:has(input[value="apple_pay"])
    .zebex-payment-logo-strip img,
    .zebex-checkout-layout-v2
    .zebex-payment-option:has(input[value="google_pay"])
    .zebex-payment-logo-strip img {
        height: 31px !important;
        max-width: 90px !important;
    }

    .zebex-checkout-layout-v2 .zebex-reference-tile {
        min-height: 72px !important;
        padding: 8px 10px !important;
    }
}

/* ZEBEX CHECKOUT PREMIUM FINISHING V1 */

/* Slim light-navy checkout heading */
.zebex-checkout .zebex-checkout-heading {
    box-sizing: border-box;
    width: 100%;
    padding: 18px 26px 20px !important;
    background: #eaf0f8;
    border-radius: 16px;
}

/* Reduce excess space above the gold heading */
.zebex-checkout .zebex-checkout-heading > span {
    display: block;
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Keep heading text comfortably spaced */
.zebex-checkout .zebex-checkout-heading h1 {
    margin-top: 8px !important;
}

.zebex-checkout .zebex-checkout-heading p {
    margin-bottom: 0 !important;
}

/* Soft golden shadow: Order Summary only */
.zebex-checkout-layout-v2
.zebex-checkout-summary {
    box-shadow:
        0 8px 24px rgba(173, 133, 57, 0.12),
        0 2px 8px rgba(17, 41, 74, 0.035);
}

/* Soft golden shadow: Delivery Information only */
.zebex-checkout-layout-v2
.zebex-checkout-right > .zebex-checkout-panel:first-child {
    box-shadow:
        0 8px 24px rgba(173, 133, 57, 0.12),
        0 2px 8px rgba(17, 41, 74, 0.035);
}

@media (max-width: 600px) {
    .zebex-checkout .zebex-checkout-heading {
        padding: 15px 17px 17px !important;
        border-radius: 12px;
    }
}

/* ZEBEX WALLET LOGO FIX V2 */

/* Apple Pay row logo only */
.zebex-checkout-layout-v2
.zebex-payment-option:has(input[value="apple_pay"])
.zebex-payment-logo-strip img {
    width: 125px !important;
    max-width: 125px !important;
    height: 46px !important;
    object-fit: contain !important;
}

/* Google Pay row logo only */
.zebex-checkout-layout-v2
.zebex-payment-option:has(input[value="google_pay"])
.zebex-payment-logo-strip img {
    width: 132px !important;
    max-width: 132px !important;
    height: 46px !important;
    object-fit: contain !important;
}

@media (max-width: 600px) {
    .zebex-checkout-layout-v2
    .zebex-payment-option:has(input[value="apple_pay"])
    .zebex-payment-logo-strip img {
        width: 92px !important;
        max-width: 92px !important;
        height: 34px !important;
    }

    .zebex-checkout-layout-v2
    .zebex-payment-option:has(input[value="google_pay"])
    .zebex-payment-logo-strip img {
        width: 98px !important;
        max-width: 98px !important;
        height: 34px !important;
    }
}

/* ZEBEX APPLE PAY LOGO SIZE FIX V1 */

/* Enlarge only the Apple Pay logo */
.zebex-checkout-layout-v2
.zebex-payment-option:has(input[value="apple_pay"])
.zebex-payment-logo-strip img {
    width: 155px !important;
    max-width: 155px !important;
    height: 56px !important;
    object-fit: contain !important;
}

/* Mobile: proportional Apple Pay logo */
@media (max-width: 600px) {
    .zebex-checkout-layout-v2
    .zebex-payment-option:has(input[value="apple_pay"])
    .zebex-payment-logo-strip img {
        width: 114px !important;
        max-width: 114px !important;
        height: 42px !important;
    }
}

/* ZEBEX APPLE PAY EXTRA LARGE LOGO V1 */

/* Apple Pay only: larger artwork, unchanged payment row */
.zebex-checkout-layout-v2
.zebex-payment-option:has(input[value="apple_pay"])
.zebex-payment-logo-strip img {
    width: 186px !important;
    max-width: 186px !important;
    height: 67px !important;
    object-fit: contain !important;
}

/* Mobile */
@media (max-width: 600px) {
    .zebex-checkout-layout-v2
    .zebex-payment-option:has(input[value="apple_pay"])
    .zebex-payment-logo-strip img {
        width: 137px !important;
        max-width: 137px !important;
        height: 50px !important;
    }
}

/* ZEBEX_PAYMENT_LOGO_BALANCE_V1 */
/* Visual alignment only; preserve payment design and behavior. */

.zebex-checkout-layout-v2
.zebex-payment-option:has(input[value="apple_pay"])
.zebex-payment-logo-strip,
.zebex-checkout-layout-v2
.zebex-payment-option:has(input[value="google_pay"])
.zebex-payment-logo-strip {
    margin-left: auto;
    justify-content: flex-end;
    align-items: center;
    flex-shrink: 0;
    max-width: 48%;
}

.zebex-checkout-layout-v2
.zebex-payment-option:has(input[value="apple_pay"])
.zebex-payment-logo-strip img {
    width: 148px !important;
    max-width: 100% !important;
    height: 50px !important;
    object-fit: contain !important;
}

.zebex-checkout-layout-v2
.zebex-payment-option:has(input[value="google_pay"])
.zebex-payment-logo-strip img {
    width: 140px !important;
    max-width: 100% !important;
    height: 48px !important;
    object-fit: contain !important;
}

.zebex-checkout-layout-v2 .zebex-final-card-logos {
    gap: 7px;
    justify-content: center;
    align-items: center;
}

.zebex-checkout-layout-v2 .zebex-final-card-logos img {
    object-fit: contain;
}

@media (max-width: 600px) {
    .zebex-checkout-layout-v2
    .zebex-payment-option:has(input[value="apple_pay"])
    .zebex-payment-logo-strip img {
        width: 108px !important;
        height: 38px !important;
    }

    .zebex-checkout-layout-v2
    .zebex-payment-option:has(input[value="google_pay"])
    .zebex-payment-logo-strip img {
        width: 105px !important;
        height: 37px !important;
    }

    .zebex-checkout-layout-v2 .zebex-final-card-logos {
        gap: 4px;
    }
}

/* ZEBEX_FINAL_LOGO_ONLY_PAYMENT_TILES_V1 */

.zebex-checkout-layout-v2 .zebex-reference-tile {
    min-height: 72px !important;
    padding: 8px 12px !important;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
}

.zebex-checkout-layout-v2 .zebex-final-tile-content {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0;
}

.zebex-checkout-layout-v2 .zebex-final-card-logos {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 7px;
}

.zebex-checkout-layout-v2 .zebex-final-google-brand {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.zebex-checkout-layout-v2 .zebex-final-google-logo {
    display: block;
    width: 132px;
    max-width: 85%;
    height: 43px;
    object-fit: contain;
}

@media (max-width: 600px) {
    .zebex-checkout-layout-v2 .zebex-reference-tile {
        min-height: 62px !important;
        padding: 7px 8px !important;
    }

    .zebex-checkout-layout-v2 .zebex-final-card-logos {
        gap: 4px;
    }

    .zebex-checkout-layout-v2 .zebex-final-google-logo {
        width: 108px;
        height: 36px;
    }
}

/* ZEBEX_FINAL_APPLE_GOOGLE_ALIGNMENT_V1 */
/* Final approved visual-only adjustments. */

/* Apple Pay: keep logo at the right edge of its payment row. */
.zebex-checkout-layout-v2
.zebex-payment-option:has(input[value="apple_pay"])
.zebex-payment-logo-strip {
    margin-left: auto !important;
    margin-right: 0 !important;
    justify-content: flex-end !important;
    align-items: center !important;
    flex-shrink: 0 !important;
    width: auto !important;
    max-width: 48% !important;
}

/* Google Pay: enlarge the vector logo inside the lower tile. */
.zebex-checkout-layout-v2
.zebex-reference-tile[data-zebex-tile-payment="google_pay"]
.zebex-final-google-brand {
    display: flex !important;
    width: 100% !important;
    align-items: center !important;
    justify-content: center !important;
}

.zebex-checkout-layout-v2
.zebex-reference-tile[data-zebex-tile-payment="google_pay"]
.zebex-final-google-logo {
    display: block !important;
    width: 175px !important;
    max-width: 92% !important;
    height: 54px !important;
    object-fit: contain !important;
    margin: 0 auto !important;
}

@media (max-width: 600px) {
    .zebex-checkout-layout-v2
    .zebex-reference-tile[data-zebex-tile-payment="google_pay"]
    .zebex-final-google-logo {
        width: 135px !important;
        max-width: 92% !important;
        height: 43px !important;
    }
}

/* ZEBEX_FINAL_PAYMENT_ALIGNMENT_V2 */
/* Only Apple Pay row alignment and lower Google Pay logo size. */

/* Override the older payment-brand flex behavior for Apple Pay only. */
.zebex-checkout-layout-v2
.zebex-payment-option:has(input[value="apple_pay"])
> .zebex-payment-brand.zebex-payment-logo-strip {
    flex: 0 0 auto !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-end !important;
    align-self: center !important;
    margin-left: auto !important;
    margin-right: 0 !important;
    width: auto !important;
    max-width: 48% !important;
}

/* Keep Apple Pay SVG crisp and proportional. */
.zebex-checkout-layout-v2
.zebex-payment-option:has(input[value="apple_pay"])
> .zebex-payment-brand.zebex-payment-logo-strip img {
    display: block !important;
    width: 148px !important;
    max-width: 100% !important;
    height: 50px !important;
    object-fit: contain !important;
}

/* Enlarge the lower Google Pay logo without changing its tile. */
.zebex-checkout-layout-v2
.zebex-reference-tile[data-zebex-tile-payment="google_pay"]
.zebex-final-google-logo {
    width: 220px !important;
    max-width: 94% !important;
    height: 66px !important;
    object-fit: contain !important;
    margin: 0 auto !important;
}

@media (max-width: 600px) {
    .zebex-checkout-layout-v2
    .zebex-payment-option:has(input[value="apple_pay"])
    > .zebex-payment-brand.zebex-payment-logo-strip img {
        width: 108px !important;
        height: 38px !important;
    }

    .zebex-checkout-layout-v2
    .zebex-reference-tile[data-zebex-tile-payment="google_pay"]
    .zebex-final-google-logo {
        width: 165px !important;
        max-width: 94% !important;
        height: 52px !important;
    }
}

/* ZEBEX_FINAL_REFERENCE_ALIGNMENT_V1 */

/* Align Apple Pay with the other right-edge payment logos. */
.zebex-checkout-layout-v2
.zebex-payment-option:has(input[value="apple_pay"]) {
    position: relative;
}

.zebex-checkout-layout-v2
.zebex-payment-option:has(input[value="apple_pay"])
> .zebex-payment-brand.zebex-payment-logo-strip {
    margin-left: auto !important;
    margin-right: -5px !important;
    padding-right: 0 !important;
    justify-content: flex-end !important;
    flex: 0 0 auto !important;
}

/* Match the approved lower Google Pay tile artwork size. */
.zebex-checkout-layout-v2
.zebex-reference-tile[data-zebex-tile-payment="google_pay"]
.zebex-final-google-logo {
    width: 235px !important;
    max-width: 100% !important;
    height: 76px !important;
    object-fit: contain !important;
    margin-inline: auto !important;
}

@media (max-width: 600px) {
    .zebex-checkout-layout-v2
    .zebex-reference-tile[data-zebex-tile-payment="google_pay"]
    .zebex-final-google-logo {
        width: 175px !important;
        max-width: 100% !important;
        height: 55px !important;
    }
}

/* ZEBEX_APPLE_PAY_SIZE_FINAL_V1 */
/* Apple Pay logo size only. */

.zebex-checkout-layout-v2
.zebex-payment-option:has(input[value="apple_pay"])
> .zebex-payment-brand.zebex-payment-logo-strip img {
    width: 170px !important;
    max-width: 100% !important;
    height: 60px !important;
    object-fit: contain !important;
}

@media (max-width: 600px) {
    .zebex-checkout-layout-v2
    .zebex-payment-option:has(input[value="apple_pay"])
    > .zebex-payment-brand.zebex-payment-logo-strip img {
        width: 125px !important;
        height: 44px !important;
    }
}

/* ZEBEX_APPLE_PAY_VISIBLE_SIZE_V2 */
/* Apple Pay image only; preserve row layout and right alignment. */

.zebex-checkout-layout-v2
.zebex-payment-option:has(input[value="apple_pay"])
> .zebex-payment-brand.zebex-payment-logo-strip {
    width: 185px !important;
    max-width: 50% !important;
    flex: 0 0 185px !important;
    justify-content: flex-end !important;
    margin-left: auto !important;
}

.zebex-checkout-layout-v2
.zebex-payment-option:has(input[value="apple_pay"])
> .zebex-payment-brand.zebex-payment-logo-strip img {
    width: 175px !important;
    max-width: none !important;
    height: 64px !important;
    object-fit: contain !important;
}

@media (max-width: 600px) {
    .zebex-checkout-layout-v2
    .zebex-payment-option:has(input[value="apple_pay"])
    > .zebex-payment-brand.zebex-payment-logo-strip {
        width: 130px !important;
        max-width: 48% !important;
        flex: 0 0 130px !important;
    }

    .zebex-checkout-layout-v2
    .zebex-payment-option:has(input[value="apple_pay"])
    > .zebex-payment-brand.zebex-payment-logo-strip img {
        width: 125px !important;
        height: 46px !important;
    }
}

/* ZEBEX_PAYMENT_LOGO_FINAL_APPROVED_V1 */

/* Preserve approved Apple Pay 25% zoom */
.zebex-payment-option:has(input[value="apple_pay"])
.zebex-payment-logo-strip img {
    transform: scale(1.25) !important;
    transform-origin: right center !important;
}

/* Add border around Google Pay logo only */
.zebex-payment-option:has(input[value="google_pay"])
.zebex-payment-logo-strip img {
    border: 2px solid #000000 !important;
    border-radius: 8px !important;
    box-sizing: border-box !important;
}
