/* =========================================
   TMP CUSTOMER GALLERY
   ========================================= */

section[data-testid="store-home-square-banners"] {
    max-width: 1180px !important;
    margin: 45px auto !important;
    padding: 28px 24px !important;

    background: #FAF8F5 !important;

    border-radius: 22px !important;
}


/* GRID */

section[data-testid="store-home-square-banners"] > .grid {
    display: flex !important;
    flex-wrap: wrap !important;

    justify-content: center !important;

    gap: 16px !important;
}


/* =========================================
   CARD
   ========================================= */

section[data-testid="store-home-square-banners"] .banner-entry {
    width: calc(25% - 12px) !important;

    height: 320px !important;
    min-height: 320px !important;

    position: relative !important;
    overflow: hidden !important;

    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;

    background-color: #FFFFFF !important;

    border:
        1px solid rgba(34,45,54,0.12) !important;

    border-radius:
        18px 18px 18px 6px !important;

    box-shadow:
        0 4px 14px rgba(34,45,54,0.05) !important;

    transition:
        transform .25s ease,
        border-color .25s ease,
        box-shadow .25s ease !important;
}


/* Remove dark Salla overlay */

section[data-testid="store-home-square-banners"]
.banner-entry::before,
section[data-testid="store-home-square-banners"]
.banner-entry::after {
    background: transparent !important;
    opacity: 0 !important;
}


/* =========================================
   TEXT CARD
   ========================================= */

section[data-testid="store-home-square-banners"]
.banner-entry__text {
    position: absolute !important;

    top: auto !important;

    right: 8px !important;
    left: 8px !important;
    bottom: 8px !important;

    width: auto !important;
    height: auto !important;
    min-height: 0 !important;

    padding: 10px 11px !important;

    background:
        rgba(250,248,245,0.96) !important;

    border:
        1px solid rgba(34,45,54,0.08) !important;

    border-radius:
        12px 12px 12px 4px !important;

    text-align: center !important;

    backdrop-filter:
        blur(7px) !important;

    -webkit-backdrop-filter:
        blur(7px) !important;

    transform: none !important;
}


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

section[data-testid="store-home-square-banners"]
.banner__title {
    margin: 0 0 3px !important;

    color: #222D36 !important;

    font-family:
        "Alexandria",
        sans-serif !important;

    font-size: 13px !important;
    font-weight: 600 !important;

    line-height: 1.45 !important;
}


/* Red brand dot */

section[data-testid="store-home-square-banners"]
.banner__title::after {
    content: "";

    display: inline-block;

    width: 5px !important;
    height: 5px !important;

    margin-right: 6px !important;

    background: #E31B2D !important;

    border-radius: 50% !important;

    vertical-align: middle !important;
}


/* =========================================
   DESCRIPTION
   ========================================= */

section[data-testid="store-home-square-banners"]
.banner__description {
    margin: 0 !important;

    color:
        rgba(34,45,54,0.62) !important;

    font-family:
        "Alexandria",
        sans-serif !important;

    font-size: 10px !important;
    font-weight: 400 !important;

    line-height: 1.6 !important;
}


/* =========================================
   HOVER
   ========================================= */

section[data-testid="store-home-square-banners"]
.banner-entry:hover {
    transform:
        translateY(-5px)
        rotate(-0.3deg) !important;

    border-color:
        #E31B2D !important;

    box-shadow:
        0 12px 28px rgba(34,45,54,0.10),
        3px 3px 0 rgba(227,27,45,0.10) !important;
}


/* =========================================
   TABLET
   ========================================= */

@media (max-width: 900px) {

    section[data-testid="store-home-square-banners"]
    .banner-entry {
        width:
            calc(33.333% - 11px) !important;

        height: 280px !important;
        min-height: 280px !important;
    }
}


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

@media (max-width: 768px) {

    section[data-testid="store-home-square-banners"] {
        margin: 28px 10px !important;

        padding: 16px 10px !important;

        border-radius: 16px !important;
    }


    section[data-testid="store-home-square-banners"] > .grid {
        gap: 9px !important;
    }


    section[data-testid="store-home-square-banners"]
    .banner-entry {
        width:
            calc(50% - 5px) !important;

        height: 220px !important;
        min-height: 220px !important;

        border-radius:
            14px 14px 14px 5px !important;
    }


    section[data-testid="store-home-square-banners"]
    .banner-entry__text {
        right: 6px !important;
        left: 6px !important;
        bottom: 6px !important;

        padding: 7px 6px !important;

        border-radius:
            9px 9px 9px 3px !important;
    }


    section[data-testid="store-home-square-banners"]
    .banner__title {
        font-size: 10px !important;
        font-weight: 600 !important;
    }


    section[data-testid="store-home-square-banners"]
    .banner__title::after {
        width: 4px !important;
        height: 4px !important;

        margin-right: 4px !important;
    }


    section[data-testid="store-home-square-banners"]
    .banner__description {
        font-size: 8px !important;
    }
}
.tmp-previous-orders-title {
  width: 100% !important;
  margin: 0 0 18px !important;
  padding: 0 4px !important;

  color: #222D36 !important;

  font-size: 21px !important;
  font-weight: 600 !important;

  text-align: right !important;
  direction: rtl !important;
}

@media(max-width:768px) {
  .tmp-previous-orders-title {
    margin-bottom: 13px !important;
    font-size: 18px !important;
  }
}