/** Shopify CDN: Minification failed

Line 740:0 Expected "}" to go with "{"

**/
/* =========================================================
   VINGA360 - FACEBOOK STYLE MOBILE MENU
   STEP 2
   ========================================================= */

#vinga-fb-menu {
  --vinga-orange: #f28c28;
  --vinga-black: #111111;
  --vinga-overlay: rgba(0, 0, 0, 0.55);

  position: fixed;
  inset: 0;
  width: 100%;
  height: 100dvh;
  z-index: 999999;

  visibility: hidden;
  pointer-events: none;

  /* Important for mobile */
  overflow: hidden;
}


/* =========================================================
   OVERLAY — 25%
   ========================================================= */

#vinga-fb-menu .vinga-fb-overlay {
  position: absolute;
  top: 0;
  right: 0;

  width: 25%;
  height: 100%;

  background: var(--vinga-overlay);

  opacity: 0;

  transition:
    opacity 0.35s ease;

  cursor: pointer;
}


/* =========================================================
   DRAWER — 75%
   ========================================================= */

#vinga-fb-menu .vinga-fb-drawer {
  position: absolute;

  top: 0;
  left: 0;

  width: 75%;
  height: 100dvh;

  background: #ffffff;

  transform: translate3d(-100%, 0, 0);

  transition:
    transform 0.35s cubic-bezier(0.22, 1, 0.36, 1);

  overflow: visible;

  box-sizing: border-box;

  box-shadow:
    8px 0 30px rgba(0, 0, 0, 0.08);
}


/* =========================================================
   OPEN STATE
   ========================================================= */

#vinga-fb-menu.is-open {
  visibility: visible;
  pointer-events: auto;
}

#vinga-fb-menu.is-open .vinga-fb-drawer {
  transform: translate3d(0, 0, 0);
}

#vinga-fb-menu.is-open .vinga-fb-overlay {
  opacity: 1;
}


/* =========================================================
   CLOSE X
   IMPORTANT:
   X IS OUTSIDE THE WHITE MENU
   ========================================================= */

#vinga-fb-menu .vinga-fb-close {
  position: absolute;

  /*
     X is positioned outside the 75% drawer
     and inside the 25% overlay area.
  */
  top: 20px;
  left: calc(100% + 12px);

  width: 42px;
  height: 42px;

  display: flex;
  align-items: center;
  justify-content: center;

  padding: 0;

  border: 0;
  border-radius: 50%;

  background: var(--vinga-orange);
  color: #ffffff;

  font-size: 30px;
  font-weight: 300;
  line-height: 1;

  cursor: pointer;

  z-index: 20;

  box-shadow:
    0 5px 15px rgba(0, 0, 0, 0.20);

  transform: scale(0.85);
  opacity: 0;

  transition:
    opacity 0.25s ease 0.10s,
    transform 0.25s ease 0.10s;
}

#vinga-fb-menu.is-open .vinga-fb-close {
  opacity: 1;
  transform: scale(1);
}


/* =========================================================
   CONTENT
   ========================================================= */

#vinga-fb-menu .vinga-fb-content {
  position: relative;

  width: 100%;
  height: 100%;

  padding:
    22px
    20px
    30px;

  box-sizing: border-box;

  overflow-y: auto;
  overflow-x: hidden;

  -webkit-overflow-scrolling: touch;

  scrollbar-width: none;
}

#vinga-fb-menu .vinga-fb-content::-webkit-scrollbar {
  display: none;
}


/* =========================================================
   LOGO
   ========================================================= */

#vinga-fb-menu .vinga-fb-logo {
  width: 100%;

  display: flex;
  align-items: center;

  margin-bottom: 22px;
}

#vinga-fb-menu .vinga-fb-logo a {
  display: block;
}

#vinga-fb-menu .vinga-fb-logo img {
  display: block;

  max-width: 150px;
  width: auto;
  height: auto;

  object-fit: contain;
}


/* =========================================================
   PROMOTIONS HORIZONTAL SCROLL
   ========================================================= */

#vinga-fb-menu .vinga-fb-promotions {
  display: flex;

  width: 100%;

  gap: 16px;

  overflow-x: auto;
  overflow-y: hidden;

  padding:
    4px
    2px
    10px;

  scroll-behavior: smooth;

  scrollbar-width: none;

  -webkit-overflow-scrolling: touch;
}

#vinga-fb-menu .vinga-fb-promotions::-webkit-scrollbar {
  display: none;
}


/* =========================================================
   PROMOTION ITEM
   ========================================================= */

#vinga-fb-menu .vinga-fb-promo {
  flex: 0 0 auto;

  width: 68px;

  display: flex;
  flex-direction: column;
  align-items: center;

  gap: 7px;

  text-decoration: none;

  color: var(--vinga-black);

  font-size: 10px;
  font-weight: 500;

  text-align: center;
}

#vinga-fb-menu .vinga-fb-promo-image {
  width: 58px;
  height: 58px;

  display: flex;
  align-items: center;
  justify-content: center;

  border-radius: 18px;

  background: #f2f2f2;

  color: var(--vinga-orange);

  font-size: 22px;

  overflow: hidden;
}

#vinga-fb-menu .vinga-fb-promo span {
  white-space: nowrap;
}


/* =========================================================
   SEPARATOR
   ========================================================= */

#vinga-fb-menu .vinga-fb-separator {
  width: 100%;
  height: 1px;

  margin:
    12px
    0
    18px;

  background: #eeeeee;
}


/* =========================================================
   CATEGORIES
   ========================================================= */

#vinga-fb-menu .vinga-fb-categories {
  width: 100%;

  display: flex;
  flex-direction: column;

  gap: 4px;
}


/* =========================================================
   CATEGORY BUTTON
   ========================================================= */

#vinga-fb-menu .vinga-fb-category {
  position: relative;

  width: 100%;

  min-height: 76px;

  display: flex;
  align-items: center;

  gap: 12px;

  padding: 8px 4px;

  border: 0;
  background: transparent;

  text-align: left;

  cursor: pointer;

  color: var(--vinga-black);

  border-radius: 12px;

  transition:
    background 0.2s ease;
}

#vinga-fb-menu .vinga-fb-category:active {
  background: #f7f7f7;
}


/* =========================================================
   CATEGORY IMAGE
   ========================================================= */

#vinga-fb-menu .vinga-fb-category-image {
  flex: 0 0 auto;

  width: 58px;
  height: 58px;

  border-radius: 50%;

  background: #f2f2f2;

  overflow: hidden;
}


/* =========================================================
   CATEGORY TEXT
   ========================================================= */

#vinga-fb-menu .vinga-fb-category-text {
  min-width: 0;

  flex: 1;

  display: flex;
  flex-direction: column;

  gap: 4px;
}

#vinga-fb-menu .vinga-fb-category-text strong {
  font-size: 15px;
  font-weight: 600;

  line-height: 1.2;
}

#vinga-fb-menu .vinga-fb-category-text span {
  font-size: 11px;

  color: #777777;

  line-height: 1.3;

  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}


/* =========================================================
   ARROW
   ========================================================= */

#vinga-fb-menu .vinga-fb-arrow {
  flex: 0 0 auto;

  font-size: 28px;
  line-height: 1;

  color: #999999;

  margin-right: 4px;
}


/* =========================================================
   SOCIAL
   ========================================================= */

#vinga-fb-menu .vinga-fb-social {
  display: flex;
  align-items: center;

  gap: 12px;

  margin-top: 20px;
}

#vinga-fb-menu .vinga-fb-social a {
  width: 36px;
  height: 36px;

  display: flex;
  align-items: center;
  justify-content: center;

  border-radius: 50%;

  background: #f4f4f4;

  color: #111111;

  text-decoration: none;

  font-size: 16px;
}


/* =========================================================
   BOTTOM BUTTONS
   ========================================================= */

#vinga-fb-menu .vinga-fb-bottom {
  display: flex;
  flex-direction: column;

  gap: 8px;

  margin-top: 20px;
}

#vinga-fb-menu .vinga-fb-bottom-button {
  width: 100%;

  min-height: 44px;

  display: flex;
  align-items: center;
  justify-content: space-between;

  padding: 0 12px;

  border: 1px solid #eeeeee;
  border-radius: 10px;

  background: #ffffff;

  color: #111111;

  text-decoration: none;

  font-size: 13px;
}


/* =========================================================
   MOBILE ONLY
   ========================================================= */

@media screen and (min-width: 750px) {

  #vinga-fb-menu {
    display: none !important;
  }

}


/* =========================================================
   SMALL PHONES
   ========================================================= */

@media screen and (max-width: 380px) {

  #vinga-fb-menu .vinga-fb-content {
    padding-left: 16px;
    padding-right: 16px;
  }

  #vinga-fb-menu .vinga-fb-promo {
    width: 62px;
  }

  #vinga-fb-menu .vinga-fb-promo-image {
    width: 52px;
    height: 52px;
  }

  #vinga-fb-menu .vinga-fb-category-image {
    width: 52px;
    height: 52px;
  }

}


/* =========================================================
   REDUCED MOTION
   ========================================================= */

@media (prefers-reduced-motion: reduce) {

  #vinga-fb-menu .vinga-fb-drawer,
  #vinga-fb-menu .vinga-fb-overlay,
  #vinga-fb-menu .vinga-fb-close {
    transition: none;
  }
  
}
/* =====================================================
   VINGA MOBILE SUBMENUS
   ===================================================== */

#vinga-fb-menu .vinga-fb-content {
  position: relative;
}


/* HIDE ALL SUBMENUS */
#vinga-fb-menu .vinga-fb-submenu {
  display: none !important;

  position: absolute;
  top: 0;
  left: 0;

  width: 100%;
  min-height: 100%;

  background: #ffffff;

  z-index: 999;

  box-sizing: border-box;
}


/* SHOW ONLY ACTIVE SUBMENU */
#vinga-fb-menu .vinga-fb-submenu.is-active {
  display: block !important;
}


/* HEADER */
#vinga-fb-menu .vinga-fb-submenu-header {
  display: flex;
  align-items: center;
  justify-content: space-between;

  padding: 16px 20px;

  border-bottom: 1px solid #eeeeee;
}


/* BACK */
#vinga-fb-menu .vinga-fb-back {
  border: 0;
  background: transparent;

  padding: 8px 0;

  font-size: 16px;
  cursor: pointer;
}


/* CLOSE */
#vinga-fb-menu .vinga-fb-submenu-close {
  border: 0;
  background: transparent;

  font-size: 28px;
  cursor: pointer;
}


/* TITLE */
#vinga-fb-menu .vinga-fb-submenu-title {
  display: flex;
  align-items: center;
  gap: 14px;

  padding: 20px;
}


/* SUBCATEGORIES */
#vinga-fb-menu .vinga-fb-subcategories {
  padding: 0 20px 30px;
}


#vinga-fb-menu .vinga-fb-subcategory {
  display: flex;
  align-items: center;
  gap: 14px;

  padding: 12px 0;

  color: #111111;
  text-decoration: none;

  border-bottom: 1px solid #eeeeee;
}
/* =====================================================
   VINGA — HIDE ANNOUNCEMENT BAR WHEN MOBILE MENU IS OPEN
   ===================================================== */

body.vinga-hide-announcement .shopify-section--announcement-bar {
  display: none !important;
}


/* =====================================================
   VINGA — CLOSE BUTTON CENTER
   ===================================================== */

.vinga-fb-close {
  position: absolute !important;

  width: 44px !important;
  height: 44px !important;

  padding: 0 !important;
  margin: 0 !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  top: 36px !important;
  right: -39px !important;

  border-radius: 50% !important;

  line-height: 1 !important;
  text-align: center !important;

  box-sizing: border-box !important;

  transform: none !important;
}

.vinga-fb-close::before,
.vinga-fb-close::after {
  display: none !important;
}
.vinga-fb-close {
  padding-bottom: 4px !important;
}
/* =====================================================
   VINGA — MENU LOGO SIZE
   ===================================================== */

.vinga-fb-logo {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 8px 20px 4px;
}

.vinga-fb-logo img {
  display: block;
  width: 80px;
  max-width: 110px;
  height: auto;
  object-fit: contain;
}
/* =====================================================
   VINGA — LOGO POSITION / MENU SPACING
   ===================================================== */

@media screen and (max-width: 749px) {

  /* Logo — طلّعو شوية للفوق */
  .vinga-fb-drawer img[src*="VINGA-logo"] {
    transform: translateY(-30px);
  }

  /* نقص المسافة تحت الـ Logo */
  .vinga-fb-drawer img[src*="VINGA-logo"] {
    margin-bottom: -50px !important;
  }
  @media screen and (max-width: 749px) {

  /* تقرّب الـCategories من بلوك Offers */
  .vinga-fb-drawer .vinga-fb-category:first-of-type {
    margin-top: -15px !important;
  }

}