/* Add custom CSS styles below */ 





/*=====================
  HEADER
======================*/
header.store-header
.sub-menu {
    background-color: #1d1f1f;
}
@media(max-width: 992px){
header.store-header
 {
    background-color: #000;
}
}

    @media (min-width: 1024px) {
       header.store-header
          .main-menu {     
            justify-content: center;
        }
    }




a[data-selia="header-menu-item-desktop-link"],
a[data-selia="header-menu-item-desktop-link"] span {
    color: #fff !important;
}

a[data-selia="header-menu-item-desktop-link"]:hover,
a[data-selia="header-menu-item-desktop-link"]:hover span {
    color: #fff !important;
}

/* Parent link */
.main-menu__desktop-item:has(.sub-menu):hover > a,
.main-menu__desktop-item:has(.sub-menu):hover > a span {
    color: #fff !important;
}

/* Submenu links */
.main-menu__desktop-item .sub-menu a:hover,
.main-menu__desktop-item .sub-menu a:hover span {
    color: #fff !important;
}
 


/*=====================
  HERO
======================*/

@media(max-width: 992px){
  section.advanced-slider.advanced-slider--0.auto-height {
    margin-top: 10rem;
}
}


/*=====================
  FEAT
======================*/
section.s-block.s-block--rectangular-links
.group:hover .group-hover\:scale-110 {
    --tw-scale-x: .9;
    --tw-scale-y: .9;
}

/*=====================
  CAT
======================*/
section.s-block.s-block--square-links
.grid{
  column-gap: 0;
}
@media(max-width: 768px){
section.s-block.s-block--square-links
.grid>li:last-child{
   grid-column:  -1/1;
  width: 48%;
  justify-self: center;
  
}
}




/*=====================
  TIMER
======================*/
.s-block--offer-countdown.s-block--has-media
.offer-countdown-bg-wrapper
.offer-countdown-bg-media{
  object-fit: contain;
  background-size: contain;
}




/*=====================
  faq
======================*/
section.s-block.relative.s-block--faq
.single-faq{
    background-color: #000;
}

section.s-block.relative.s-block--faq
p.faq__question{
  color: #fff;
}

section.s-block.relative.s-block--faq
p.faq__answer{
  color: #fff;
}

@media (min-width: 768px) {
  section.s-block.relative.s-block--faq
    .md\:grid-cols-2 {
        grid-template-columns: repeat(1, minmax(0, 1fr));
    }
}


/* =========================================
   OFFER COUNTDOWN - FULL BANNER
========================================= */

section[component-id="2044229261"] {
    position: relative !important;

    width: 100% !important;
    max-width: none !important;

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

    overflow: hidden !important;
}


/* =========================================
   BANNER HEIGHT
   Original image: 1674 × 549
========================================= */

section[component-id="2044229261"]::before {
    content: "";
    display: block;

    width: 100%;

    aspect-ratio: 1674 / 549;
}


/* =========================================
   BACKGROUND
========================================= */

section[component-id="2044229261"] .offer-countdown-bg-wrapper {
    position: absolute !important;

    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;

    width: 100% !important;
    height: 100% !important;
}

section[component-id="2044229261"] .offer-countdown-bg-media {
    width: 100% !important;
    height: 100% !important;

    /*
       Use contain so the FULL banner is visible
       without cropping.
    */
    background-size: 100% 100% !important;

    background-position: center !important;
    background-repeat: no-repeat !important;
}


/* =========================================
   CONTENT - TOP RIGHT
========================================= */

section[component-id="2044229261"] .offer-countdown-container {
    position: absolute !important;

    top: 0 !important;
    right: 0 !important;

    width: auto !important;
    height: auto !important;

    padding: 35px 60px 0 20px !important;

    z-index: 2 !important;
}


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

section[component-id="2044229261"] .offer-countdown-content {
    position: relative !important;

    display: flex !important;

    flex-direction: column !important;

    align-items: flex-start !important;
    justify-content: flex-start !important;

    text-align: right !important;

    width: 420px !important;
}


/* =========================================
   TITLE
========================================= */

section[component-id="2044229261"] .offer-countdown-title {
    margin: 0 0 20px !important;

    font-size: 0 !important;

    text-align: right !important;
}


/* =========================================
   TITLE - 3 LINES
========================================= */

section[component-id="2044229261"] .offer-countdown-title::after {
    content:
        "عرض خاص\A"
        "لفترة محدودة\A"
        "خصومات تصل ل";

    display: block;

    white-space: pre-line;

    font-size: 60px !important;
    line-height: 1.3 !important;

    font-weight: 700 !important;

    text-align: right !important;
}

/* =========================================
   MOBILE - SMALLER CONTENT & COUNTDOWN
========================================= */

@media (max-width: 767px) {

    /* Content position */
    section[component-id="2044229261"] .offer-countdown-container {
        top: 0 !important;
        right: 0 !important;

        padding: 12px 12px 0 5px !important;
    }

    /* Content width */
    section[component-id="2044229261"] .offer-countdown-content {
        width: 125px !important;
        max-width: 125px !important;
      gap: 0.25rem;
    }

    /* Title */
    section[component-id="2044229261"] .offer-countdown-title {
        margin-bottom: 6px !important;
    }

    section[component-id="2044229261"] .offer-countdown-title::after {
        font-size: 16px !important;
        line-height: 1.25 !important;
    }

    /* Countdown */
    section[component-id="2044229261"] .offer-countdown-timer {
        transform: scale(0.55) !important;
        transform-origin: top right !important;

        width: 180% !important;
    }

    /* Countdown list */
    section[component-id="2044229261"] .s-count-down-list {
        gap: 4px !important;
    }

    /* Countdown boxes */
    section[component-id="2044229261"] .s-count-down-item {
        min-width: 38px !important;
        width: 38px !important;
        padding: 4px !important;
    }

    /* Countdown numbers */
    section[component-id="2044229261"] .s-count-down-item-value {
        font-size: 14px !important;
        line-height: 1.2 !important;
    }

    /* Countdown labels */
    section[component-id="2044229261"] .s-count-down-item-label {
        font-size: 8px !important;
        line-height: 1.2 !important;
    }
}


/* =========================================
   VERY SMALL MOBILE
========================================= */

@media (max-width: 480px) {

    section[component-id="2044229261"] .offer-countdown-container {
        padding: 12px 12px 0 3px !important;
    }

    section[component-id="2044229261"] .offer-countdown-content {
        width: 105px !important;
        max-width: 105px !important;
    }

    section[component-id="2044229261"] .offer-countdown-title::after {
        font-size: 14px !important;
    }

    section[component-id="2044229261"] .offer-countdown-timer {
        transform: scale(0.45) !important;
        transform-origin: top right !important;
    }

}



section.s-block.s-block--square-links
li.square-links__item
a img{
  aspect-ratio: unset;
}



/* =========================================
  FOOTER
========================================= */

footer.store-footer{
  background-image: url(https://i.ibb.co/kVBhZ9T5/Frame-205.webp);
  background-size: 100% 100%;
  background-position: top center;
  background-repeat: no-repeat;
  background-color: transparent ;
}
@media (max-width: 768px) {
  footer.store-footer{

      background-size: cover;
  }
}


.store-footer__inner,
.store-footer__contacts-row{
  background-color: transparent !important;
}

.store-footer__curve{
  display: none;
}