/*
  JuiceIN Premium — Menu Page Styles
  Scoped to .jx-mn to reduce conflicts with WordPress themes/plugins.
  Palette: deep purple base + lime + gold accents (no pink/cream).
*/

:root{
  --jx-bg:#0b0a15;
  --jx-surface:rgba(255,255,255,.06);
  --jx-surface2:rgba(255,255,255,.085);
  --jx-card:rgba(18,16,42,.62);
  --jx-card2:rgba(18,16,42,.78);
  --jx-border:rgba(255,255,255,.12);
  --jx-text:rgba(245,246,255,.95);
  --jx-muted:rgba(206,210,232,.88);
  --jx-faint:rgba(206,210,232,.72);
  --jx-lime:#b7ff3c;
  --jx-gold:#f5c84b;
  --jx-purple:#7b61ff;
  --jx-radius:20px;
  --jx-radius-sm:14px;
  --jx-shadow:0 20px 70px rgba(0,0,0,.52);
  --jx-max:1200px;
  --jx-pad:clamp(18px,4vw,56px);
}


/* Hard reset inside menu section (prevents theme overrides from breaking layout) */
.jx-mn, .jx-mn *{box-sizing:border-box;}
.jx-mn img{max-width:100%;height:auto;}
.jx-mn :where(h1,h2,h3,h4,p,ul,ol,li,figure){margin:0;}
.jx-mn :where(ul,ol){padding-left:1.15rem;}
.jx-mn a{color:inherit;text-decoration:none;}

/* Full-bleed section even inside constrained theme wrappers */
.jx-mn{
  width:100vw;
  margin-left:calc(50% - 50vw);
  margin-right:calc(50% - 50vw);
  position:relative;
  padding:var(--jx-pad);
  padding-bottom:clamp(56px,6vw,96px);
  background:
    radial-gradient(1200px 800px at 12% 14%, rgba(123,97,255,.18), transparent 60%),
    radial-gradient(1100px 760px at 78% 14%, rgba(245,200,75,.07), transparent 62%),
    radial-gradient(1000px 700px at 90% 70%, rgba(183,255,60,.10), transparent 60%),
    transparent;
  color:var(--jx-text);
  overflow:hidden;
}

/* Embedded mode (inside Elementor/sections): avoid 100vw bleed and horizontal scroll */
.jx-mn--embed{
  width:100%;
  margin-left:0;
  margin-right:0;
  border-radius:var(--jx-radius);
  padding:clamp(16px,3.2vw,34px);
  border:1px solid rgba(255,255,255,.10);
  box-shadow:var(--jx-shadow);
}


.jx-mn--embed .jx-mn__container{max-width:var(--jx-max);}


.jx-mn__bg{position:absolute;inset:0;pointer-events:none;overflow:hidden;}
.jx-mn__glow{position:absolute;filter:blur(54px);opacity:.85;}
.jx-mn__glow--left{width:560px;height:560px;left:-180px;top:120px;background:radial-gradient(circle at 30% 30%, rgba(123,97,255,.55), transparent 58%);}
.jx-mn__glow--right{width:620px;height:620px;right:-220px;top:260px;background:radial-gradient(circle at 40% 40%, rgba(183,255,60,.24), transparent 62%);}
.jx-mn__grain{position:absolute;inset:-40px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)' opacity='.12'/%3E%3C/svg%3E");opacity:.33;mix-blend-mode:overlay;}

.jx-mn__container{max-width:var(--jx-max);margin:0 auto;position:relative;}

.jx-mn__header{padding:6px 0 12px;}
.jx-mn__eyebrow{color:var(--jx-faint);font-weight:700;letter-spacing:.02em;}
.jx-mn__title{margin-top:10px;font-size:clamp(2.1rem,4.6vw,3.3rem);line-height:1.04;letter-spacing:-.035em;}
.jx-mn__lead{margin-top:12px;max-width:64ch;color:var(--jx-muted);font-size:clamp(1rem,1.1vw,1.06rem);line-height:1.65;}

/* Info blocks */
.jx-mn__bottom{margin-top:22px;display:grid;gap:clamp(14px,2.2vw,20px);grid-template-columns:1fr;}
@media (min-width:920px){.jx-mn__bottom{grid-template-columns:1fr 1fr;}}

.jx-mn__info-card{
  padding:clamp(16px,2.2vw,22px);
  border:1px solid var(--jx-border);
  border-radius:var(--jx-radius);
  background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.05));
  box-shadow:var(--jx-shadow);
}
.jx-mn__info-card h3{font-size:1.05rem;letter-spacing:-.01em;margin-bottom:10px;}
.jx-mn__info-card :where(ul,ol){color:var(--jx-muted);line-height:1.6;}
.jx-mn__info-card li{margin:7px 0;}

.jx-mn__info-actions{margin-top:12px;display:flex;gap:10px;flex-wrap:wrap;}

/* Buttons */
.jx-btn{
  display:inline-flex;align-items:center;justify-content:center;
  padding:11px 14px;border-radius:14px;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.06);
  color:rgba(255,255,255,.92);
  font-weight:700;
  transition:transform .12s ease, background .12s ease, border-color .12s ease, box-shadow .12s ease;
}
.jx-btn:hover{transform:translateY(-1px);background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.18);box-shadow:0 12px 26px rgba(0,0,0,.24);}
.jx-btn--gold{background:rgba(245,200,75,.18);border-color:rgba(245,200,75,.42);}
.jx-btn--gold:hover{background:rgba(245,200,75,.22);border-color:rgba(245,200,75,.55);}
.jx-btn--ghost{background:rgba(255,255,255,.05);}

/* Promo */
.jx-mn__promo{
  margin-top:18px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:var(--jx-radius);
  padding:clamp(16px,2.2vw,22px);
  background:
    radial-gradient(900px 420px at 12% 10%, rgba(183,255,60,.10), transparent 58%),
    linear-gradient(135deg, rgba(123,97,255,.28), rgba(245,200,75,.14));
  box-shadow:var(--jx-shadow);
  display:flex;align-items:center;justify-content:space-between;gap:14px;
}
.jx-mn__promo-tag{
  display:inline-flex;align-items:center;gap:8px;
  padding:6px 10px;border-radius:999px;
  background:rgba(0,0,0,.30);
  border:1px solid rgba(255,255,255,.14);
  color:rgba(255,255,255,.90);
  font-size:.82rem;
}
.jx-mn__promo h2{margin-top:8px;font-size:clamp(1.05rem,2.2vw,1.35rem);letter-spacing:-.02em;}
.jx-mn__promo p{margin-top:6px;color:var(--jx-muted);}

/* Controls */
.jx-mn__controls{
  margin-top:22px;
  border:1px solid var(--jx-border);
  border-radius:var(--jx-radius);
  padding:clamp(14px,2vw,18px);
  background:rgba(0,0,0,.34);
  backdrop-filter:blur(10px);
  box-shadow:0 18px 55px rgba(0,0,0,.34);
  display:flex;
  flex-direction:column;
  gap:12px;
}


.jx-mn__chips{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:0;}
.jx-chip{
  appearance:none;
  border:1px solid var(--jx-border);
  background:rgba(255,255,255,.06);
  color:rgba(255,255,255,.92);
  border-radius:999px;
  padding:9px 13px;
  font-size:.92rem;
  line-height:1;
  cursor:pointer;
  transition:transform .12s ease, background .12s ease, border-color .12s ease, box-shadow .12s ease;
}
.jx-chip:hover{transform:translateY(-1px);background:rgba(255,255,255,.095);border-color:rgba(255,255,255,.18);box-shadow:0 10px 26px rgba(0,0,0,.24);}
.jx-chip.is-active{background:rgba(183,255,60,.18);border-color:rgba(183,255,60,.44);}
.jx-chip--sugarcane{border-color:rgba(245,200,75,.40);background:rgba(245,200,75,.10);}

.jx-mn__tag,.jx-mn__search{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0;color:var(--jx-faint);font-size:.92rem;width:100%;}
.jx-mn__tag span,.jx-mn__search span{font-weight:700;color:rgba(255,255,255,.82);}
.jx-mn__tag select,
.jx-mn__search input{
  width:100%;
  background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.14);
  color:rgba(255,255,255,.94);
  padding:10px 42px 10px 12px;
  border-radius:12px;
  min-height:42px;
  outline:none;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
}
.jx-mn__search input{padding-right:12px;}
.jx-mn__search input::placeholder{color:rgba(206,210,232,.60);}
.jx-mn__tag select{
  appearance:none;
  -webkit-appearance:none;
  -moz-appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 20 20'%3E%3Cpath fill='%23cfd3f0' d='M5.6 7.4a1 1 0 0 1 1.4 0L10 10.4l3-3a1 1 0 1 1 1.4 1.4l-3.7 3.7a1 1 0 0 1-1.4 0L5.6 8.8a1 1 0 0 1 0-1.4Z'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 14px center;
}
.jx-mn__search input:disabled{opacity:.65;cursor:not-allowed;}

.jx-mn__search[aria-disabled="true"]{opacity:.65;}
@media (min-width:720px){
  .jx-mn__tag,.jx-mn__search{width:auto;min-width:260px;}
}


.jx-mn__status{margin-top:8px;color:var(--jx-muted);font-size:.95rem;}

/* Discounts banner */
.jx-mn__discounts{
  margin-top:12px;
  padding:12px 14px;
  border-radius:16px;
  border:1px solid rgba(245,200,75,.35);
  background:rgba(245,200,75,.08);
  display:flex;align-items:center;justify-content:space-between;gap:12px;
}

/* Grid */
.jx-mn__catalog{margin-top:18px;}
.jx-mn__grid{display:grid;gap:clamp(14px,2.2vw,18px);grid-template-columns:repeat(1,minmax(0,1fr));}
@media (min-width:720px){.jx-mn__grid{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media (min-width:1024px){.jx-mn__grid{grid-template-columns:repeat(3,minmax(0,1fr));}}

.jx-mn-card{
  position:relative;
  background:var(--jx-card);
  border:1px solid rgba(255,255,255,.14);
  border-radius:var(--jx-radius);
  overflow:hidden;
  box-shadow:var(--jx-shadow);
  display:flex;
  flex-direction:column;
  min-height:100%;
  transition:transform .16s ease, border-color .16s ease, background .16s ease, box-shadow .16s ease;
}
.jx-mn-card:hover{
  transform:translateY(-2px);
  border-color:rgba(183,255,60,.20);
  background:rgba(18,16,42,.74);
  box-shadow:0 26px 80px rgba(0,0,0,.58);
}
@media (prefers-reduced-motion: reduce){
  .jx-mn-card{transition:none;}
  .jx-mn-card:hover{transform:none;}
}


.jx-mn-card__media{position:relative;aspect-ratio:16/11;background:rgba(255,255,255,.04);}
.jx-mn-card__media::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(7,6,18,.05) 0%, rgba(7,6,18,.55) 92%);
  pointer-events:none;
}

.jx-mn-card__media img{
  width:100%;
  height:100%;
  object-fit:cover;
  filter:saturate(1.08) contrast(1.05);
  transform:scale(1.01);
  transition:transform .25s ease, filter .25s ease;
}
.jx-mn-card:hover .jx-mn-card__media img{
  transform:scale(1.04);
  filter:saturate(1.14) contrast(1.08);
}
@media (prefers-reduced-motion: reduce){
  .jx-mn-card__media img{transition:none;transform:none;}
  .jx-mn-card:hover .jx-mn-card__media img{transform:none;}
}

.jx-mn-card__badge{
  position:absolute;top:12px;left:12px;
  background:rgba(10,9,20,.58);
  border:1px solid rgba(255,255,255,.16);
  color:rgba(255,255,255,.92);
  padding:6px 10px;
  border-radius:999px;
  font-size:.82rem;
  font-weight:800;
  letter-spacing:.01em;
  backdrop-filter:blur(10px);
}
.jx-mn-card__badge--discount{left:auto;right:12px;background:rgba(183,255,60,.18);border-color:rgba(183,255,60,.40);}

.jx-mn-card__body{padding:clamp(14px,2vw,18px);display:flex;flex-direction:column;gap:10px;}
.jx-mn-card__name-row{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;}
.jx-mn-card__name{font-size:1.07rem;letter-spacing:-.012em;}
.jx-mn-card__price{font-weight:800;color:var(--jx-gold);font-size:1rem;}
.jx-price__old{color:rgba(255,255,255,.55);text-decoration:line-through;margin-right:6px;font-weight:700;}

.jx-mn-card__size{color:rgba(255,255,255,.70);font-size:.9rem;}

/* Keep cards readable: clamp long copy; details live in modal */
.jx-mn-card__desc{color:var(--jx-muted);line-height:1.62;font-size:.96rem;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;}
.jx-mn-card__line{color:rgba(255,255,255,.82);font-size:.92rem;}
.jx-mn-card__facts-title{font-weight:800;color:rgba(255,255,255,.90);font-size:.92rem;}
.jx-mn-card__benefits{color:var(--jx-muted);font-size:.92rem;line-height:1.58;}
.jx-mn-card__benefits li{margin:6px 0;}
.jx-mn-card__wellness{color:var(--jx-faint);font-size:.92rem;line-height:1.58;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;}

.jx-mn-card__footer{margin-top:auto;padding-top:12px;border-top:1px solid rgba(255,255,255,.09);display:grid;gap:10px;}
.jx-mn-card__stock{color:rgba(255,255,255,.70);font-size:.9rem;}
.jx-mn-card__actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;}

.jx-mn-card__btn,.jx-mn-card__order{
  border-radius:12px;
  padding:10px 12px;
  font-size:.92rem;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.06);
  color:rgba(255,255,255,.92);
  cursor:pointer;
  text-align:center;
  transition:transform .12s ease, background .12s ease, border-color .12s ease, box-shadow .12s ease;
}
.jx-mn-card__btn:hover{transform:translateY(-1px);background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.18);box-shadow:0 12px 26px rgba(0,0,0,.24);}
.jx-mn-card__order:hover{transform:translateY(-1px);filter:saturate(1.05) brightness(1.02);box-shadow:0 14px 30px rgba(0,0,0,.28);}
.jx-mn-card__order{
  grid-column:1/-1;
  background:linear-gradient(135deg, rgba(245,200,75,.92), rgba(183,255,60,.74));
  border-color:rgba(245,200,75,.44);
  color:#13121b;
  font-weight:950;
  letter-spacing:.01em;
}

/* Pagination */
.jx-mn__pagination{margin-top:18px;display:flex;align-items:center;justify-content:center;gap:10px;}
.jx-page-btn{border-radius:12px;padding:10px 12px;font-size:.92rem;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.06);color:rgba(255,255,255,.92);cursor:pointer;}
.jx-page-btn:hover{background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.18);}
.jx-mn__page-numbers{display:flex;gap:8px;}
.jx-page-number{width:34px;height:34px;display:inline-flex;align-items:center;justify-content:center;border-radius:12px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.06);color:rgba(255,255,255,.92);cursor:pointer;}
.jx-page-number:hover{background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.18);}
.jx-page-number.is-active{background:rgba(123,97,255,.22);border-color:rgba(123,97,255,.44);}

/* Empty state */
.jx-mn__empty{
  grid-column:1/-1;
  padding:clamp(18px,2.4vw,26px);
  border-radius:var(--jx-radius);
  border:1px dashed rgba(183,255,60,.22);
  background:rgba(0,0,0,.26);
  text-align:center;
}
.jx-mn__empty-title{font-size:1.1rem;letter-spacing:-.01em;}
.jx-mn__empty-text{margin-top:8px;color:var(--jx-muted);line-height:1.65;}
.jx-mn__empty-actions{margin-top:14px;display:flex;gap:10px;justify-content:center;flex-wrap:wrap;}

/* Steps list */
.jx-steps{counter-reset:step;list-style:none;padding:0;margin:0;display:grid;gap:10px;}
.jx-steps li{display:flex;gap:10px;align-items:flex-start;color:var(--jx-muted);line-height:1.55;}
.jx-steps li::before{
  counter-increment:step;
  content:counter(step);
  width:28px;height:28px;
  border-radius:999px;
  display:inline-flex;align-items:center;justify-content:center;
  font-weight:950;
  color:#12111a;
  background:linear-gradient(135deg, rgba(245,200,75,.92), rgba(183,255,60,.74));
  box-shadow:0 10px 24px rgba(0,0,0,.26);
  flex:0 0 auto;
}

/* Modal */
.jx-modal{position:fixed;inset:0;background:rgba(0,0,0,.62);display:none;align-items:center;justify-content:center;padding:18px;z-index:9999;}
.jx-modal.is-open{display:flex;}
.jx-modal__panel{width:min(980px,100%);max-height:88vh;overflow:auto;background:rgba(10,9,20,.92);border:1px solid rgba(255,255,255,.14);border-radius:var(--jx-radius);box-shadow:var(--jx-shadow);}
.jx-modal__head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;border-bottom:1px solid rgba(255,255,255,.10);}
.jx-modal__title{font-size:1.08rem;letter-spacing:-.01em;}
.jx-modal__close{border-radius:12px;padding:10px 12px;font-size:.92rem;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.06);color:rgba(255,255,255,.92);cursor:pointer;}
.jx-modal__close:hover{background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.18);}

.jx-modal__body{padding:16px;}
.jx-modal__grid{display:grid;grid-template-columns:1fr;gap:16px;}
@media (min-width:840px){.jx-modal__grid{grid-template-columns:1.1fr .9fr;align-items:start;}}

.jx-modal__media{border-radius:var(--jx-radius);overflow:hidden;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.04);}
.jx-modal__media img{width:100%;height:100%;object-fit:cover;display:block;}

.jx-modal__row{display:flex;align-items:baseline;justify-content:space-between;gap:10px;}
.jx-modal__price{font-weight:900;color:var(--jx-gold);font-size:1.05rem;}
.jx-modal__desc{color:var(--jx-muted);line-height:1.65;margin-top:10px;}
.jx-modal__line{color:rgba(255,255,255,.84);margin-top:10px;}
.jx-modal__facts-title{font-weight:900;color:rgba(255,255,255,.92);margin-top:12px;}
.jx-modal__note{margin-top:14px;color:rgba(255,255,255,.62);font-size:.9rem;line-height:1.55;}
.jx-modal__actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px;}

/* Footer */
.jx-mn__footer{margin-top:26px;color:rgba(255,255,255,.64);font-size:.92rem;border-top:1px solid rgba(255,255,255,.10);padding-top:16px;}
.jx-mn__footer a{color:rgba(183,255,60,.92);}
.jx-mn__footer a:hover{color:rgba(245,200,75,.95);}

/* Toast */
.jx-toast{position:fixed;left:18px;bottom:18px;max-width:min(520px,calc(100% - 36px));padding:12px 14px;border-radius:16px;border:1px solid rgba(255,255,255,.14);background:rgba(10,9,20,.86);color:rgba(255,255,255,.92);box-shadow:var(--jx-shadow);display:none;z-index:10000;}
.jx-toast.is-show{display:block;}

/* Accessible focus */
.jx-mn :where(a,button,select,input){outline:none;}
.jx-mn :where(a,button,select,input):focus-visible{box-shadow:0 0 0 3px rgba(123,97,255,.42), 0 0 0 6px rgba(183,255,60,.18);}

/* Small screens: keep everything breathable */
@media (max-width:420px){
  .jx-mn__info-actions{flex-direction:column;align-items:stretch;}
  .jx-mn-card__actions{grid-template-columns:1fr;}
}

/* Menu category tabs (code-driven menu pages) */
.jx-menu-tabs{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px;align-items:center;}
.jx-menu-tabs .jx-chip{text-decoration:none;}