/*Scroll Bar*/
.cx-sidebar-wrapper ::-webkit-scrollbar-track {border-radius:5px !important;}
.cx-sidebar-wrapper ::-webkit-scrollbar {width:5px !important;}


/*sidebar style*/
#cx-sidebar-right .cx-sidebar-wrapper {padding: 30px 25px;overflow-y:auto;display: flex;height: 100%;width: 100%;max-height: 100%;}
#cx-sidebar-right .inner-content {width: 100%;padding: 0px;box-sizing: border-box;}
#cx-sidebar-right .content-loading {
    background-image : url("/wp-content/plugins/cx_zico/asset/imgs/loading.gif");
    background-repeat: no-repeat;
    background-position: 50%;
    background-size: 80%;
    max-width: 120px;
    margin: 0 auto;
}
#cx-sidebar-right .cx-sidebar-content{display: flex;height: 100%;width: 100%; }
#cx-sidebar-right .cx-sidebar-title {
    /*text-align: center;background-color: var(--e-brand);
    color: var( --e-text-primary );position: relative;*/
}
#cx-sidebar-right .title-container {
  display: flex;
  gap:13px;
  align-items: center;
  cursor: pointer; 
  /*justify-content: space-between;*/
}

#cx-sidebar-right .cx-sidebar-title h4 { 
    font-family: Inter;
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
    color: #333333;
    text-transform: capitalize;
    margin: 0;
}

#cx-sidebar-right .cx-sidebar-title i {font-size: 1.1em;}

#cx-sidebar-right .cx-sidebar-title .sidebar-title-icon i {font-size: 1.1em;}
/*#cx-sidebar-right span.sidebar-close-btn {order:2; /*position: absolute;left: 0;cursor: pointer;padding: 10px;border-radius: 5px;font-weight: 600;*/}*/

/*#cx-sidebar-right .cx-sidebar-render-content {padding: 20px;}*/

/* 
- cx wc user btn
*/
.cx_cx_user_btn a.login-btn {cursor: pointer;}

/* 
- styling for both sidebar menus
- wc user sidebar
- hamburger site menu
*/

.cx_shortcode.cx_nav_menu ul.user-details-sidebar {padding-left: 0;list-style: none;}
.cx_shortcode.cx_nav_menu ul.user-details-sidebar li i {color: var(--e-heading);}
.cx_shortcode.cx_nav_menu ul.user-details-sidebar li.customer-menu-item a {display: block;padding: 12px 8px;text-decoration: none;color: var(--e-text-primary);border-bottom: 1px solid #bdbdbd;}
.cx_shortcode.cx_nav_menu ul.user-details-sidebar li.customer-menu-item i {width: 25px;color: var(--e-primary);}


/*terms and condition label */
.cx-site-signup-form ul.checkbox-container li{display: inline !important;}
.cx-site-signup-form ul.checkbox-container > li >label { margin-left:8px;}

/* removing menu icon */
div#cx-sidebar-right .sidebar-title-icon{ display:none;}

 /* till line 1.07 dont remove important  */
 /*for menu right sidebar */
#cx-sidebar-right .cx-sidebar-wrapper.sidebar-wrapper {
  padding: 0px;
  padding-bottom: 30px;
  overflow-y: auto;
  display: flex;
  height: 100%;
  width: 100%;
  max-height: 100%;
  background-color: white !important;
}
#cx-sidebar-right .inner-content {
  width: 100%;
/*  padding: 25px;*/
  box-sizing: border-box;
}
#cx-sidebar-right .cx-sidebar-content.content-loading {
  background-image: url("/wp-content/plugins/cx_zico/asset/imgs/loading.gif");
  background-repeat: no-repeat;
  background-position: 50%;
  background-size: 100px;
  max-width: 100%;
  margin: 0 auto;
}
#cx-sidebar-right .cx-sidebar-content {
  display: flex;
  height: 100%;
  width: 100%;
}
#cx-sidebar-right .cx-sidebar-title {
  position: relative;
  padding: 25px 16px;

}

#cx-sidebar-right .header-post-text {
  font-size: 16px;
  /*color: var(--cx-text-dark);*/
}
#cx-sidebar-right .header-if-tab {
  font-size: 36px;
}

#cx-sidebar-right .cx-sidebar-title h3 {
  text-align: left;
  font-size: 0.875em;
  margin-left: 10px;
}
/*#cx-sidebar-right .cx-sidebar-title i {
  font-size: 24px;
}*/
#cx-sidebar-right .cx-sidebar-title img.sidebar-title-img {
  max-width: 25px;
}
/*#cx-sidebar-right span.sidebar-close-btn {position: absolute;right: 20px;cursor: pointer;font-weight: 600;}*/
#cx-sidebar-right .current-item-collection-container {
  margin-bottom: 50px;
}
#cx-sidebar-right .current-item-collection-container .card_item_icon {
  width: 100%;
  height: 75%;
  margin: auto;
}

/*//*/
#cx-sidebar-right .cx-sidebar-infobox-wraper {
  color: black;
  background-color: var(--e-primary);
  background: linear-gradient(90deg, var(--e-primary-dark), var(--e-primary));
  padding: 20px 15px;
  border-radius: var(--cx-radius-md);
  margin-bottom: 25px;
}
#cx-sidebar-right .cx-sidebar-infobox-item {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 15px;
  justify-content: space-between;
}
#cx-sidebar-right .cx-sidebar-infobox-item:last-child {
  margin-bottom: 0;
}

/* cx-custom-currency gems coins */
#cx-sidebar-right .cx-sidebar-infobox-wraper .cx-custom-currency i {
  display: none;
}
#cx-sidebar-right .history-item {
  padding: 0;
  margin-bottom: 25px;
}
#cx-sidebar-right .history-item p {
  font-size: 0.7rem;
}
div#cx-sidebar-right
  .cx_shortcode.cx_collection_item_pt_event
  .column
  a.cx_btn {
  width: 100%;
}

#cx-sidebar-right
  .card-item-footer
  span.cx-custom-currency.cx-currency-render-container {
  display: none;
}
#cx-sidebar-right .cx-sidebar-infobox-wraper i {
  font-size: 20px;
  text-transform: capitalize !important;
}
#cx-sidebar-right
  .cx-sidebar-wrapper.sidebar-wrapper
  .sidebar-infobox-item-title {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 7px;
}

#cx-sidebar-right .cx-sidebar-render-content:not(:has(nav )){
    padding: 0 16px;
}

/*Nav style Start */



/*Nav style End */


/*user_info_sidebar*/

.user_info_sidebar .infobox-item-value {
  display: flex;
  flex-direction: row;
}
.user_info_sidebar .infobox-item-value span small span {
  font-size: 0.8rem !important;
}


/* for  all sidebar titles */
/*
.cx-sidebar-wrapper .title-container {color: var(--e-site-text-light);text-transform: capitalize;}*/



/* for sidebar loader  box with bounce animation */

.cx-sidebar-loader {
    display: flex;
    align-content: center;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    width: 100%;
}

:root{
    --box-loader-wall-size                  : 40px;
    --box-loader-wall-size-translateZ-neg   : -40px;
    --box-loader-wall-size-translateZ-pos   : 40px;
    --box-wall-border-color                 : #ae47cf;
/*    --transform-x-y-rotate  : 45px;*/
}

.scene {
    position: relative;
    z-index: 2;
    height: 100px;
    width: 100px;
    display: grid;
    place-items: center;
}

.cube-wrapper {
    transform-style: preserve-3d;
    animation: bouncing 2.7s infinite;
}

.cube {
    transform-style: preserve-3d;
    transform: rotateX(45deg) rotateZ(45deg);
    animation: rotation 2.7s infinite;
}

.cube-faces {
    transform-style: preserve-3d;
    height: var(--box-loader-wall-size);
    width: var(--box-loader-wall-size);
    position: relative;
    transform-origin: 0 0;
    transform: translateX(0) translateY(0) translateZ(var(--box-loader-wall-size-translateZ-neg));
}

.cube-face {
    position: absolute;
    inset: 0;
    background: var(--e-body-secondary-bg);
    border: solid 1px var(--box-wall-border-color);
}
.cube-face.shadow {
    transform: translateZ(var(--box-loader-wall-size-translateZ-neg));
    animation: bouncing-shadow 2s infinite;
}
.cube-face.top {
    transform: translateZ(var(--box-loader-wall-size-translateZ-pos));
}
.cube-face.front {
    transform-origin: 0 50%;
    transform: rotateY(-90deg);
}
.cube-face.back {
    transform-origin: 0 50%;
    transform: rotateY(-90deg) translateZ(var(--box-loader-wall-size-translateZ-neg));
}
.cube-face.right {
    transform-origin: 50% 0;
    transform: rotateX(-90deg) translateY(var(--box-loader-wall-size-translateZ-neg));
}
.cube-face.left {
    transform-origin: 50% 0;
    transform: rotateX(-90deg) translateY(var(--box-loader-wall-size-translateZ-neg)) translateZ(var(--box-loader-wall-size-translateZ-pos));
}

@keyframes rotation {
    0% {
        transform: rotateX(45deg) rotateY(0) rotateZ(45deg);
        animation-timing-function: cubic-bezier(0.17, 0.84, 0.44, 1);
    }
    50% {
        transform: rotateX(45deg) rotateY(0) rotateZ(225deg);
        animation-timing-function: cubic-bezier(0.76, 0.05, 0.86, 0.06);
    }
    100% {
        transform: rotateX(45deg) rotateY(0) rotateZ(405deg);
        animation-timing-function: cubic-bezier(0.17, 0.84, 0.44, 1);
    }
}
@keyframes bouncing {
    0% {
        transform: translateY(-40px);
        animation-timing-function: cubic-bezier(0.76, 0.05, 0.86, 0.06);
    }
    45% {
        transform: translateY(40px);
        animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
    }
    100% {
        transform: translateY(-40px);
        animation-timing-function: cubic-bezier(0.76, 0.05, 0.86, 0.06);
    }
}
@keyframes bouncing-shadow {
    0% {
        transform: translateZ(-var(--box-loader-wall-size)) scale(1.3);
        animation-timing-function: cubic-bezier(0.76, 0.05, 0.86, 0.06);
        opacity: 0.05;
    }
    45% {
        transform: translateZ(0);
        animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
        opacity: 0.3;
    }
    100% {
        transform: translateZ(-var(--box-loader-wall-size)) scale(1.3);
        animation-timing-function: cubic-bezier(0.76, 0.05, 0.86, 0.06);
        opacity: 0.05;
    }
}

.cx_btn.cx-remove-cart-item {
    text-align: right;
    display: flex !important;
    justify-content: flex-end !important;
    flex-direction: row;
    width: 100%;
}



/* slidebar custom loader */

.custom-loader {
  width: 12em;
  height: 12em;
}

.custom-loader path {
  stroke: #000;
  stroke-width: 0.6px;
  animation: dashArray 4s ease-in-out infinite,
    dashOffset 4s linear infinite;
}

@keyframes dashArray {
  0% {
    stroke-dasharray: 0 1 359 0;
  }

  50% {
    stroke-dasharray: 0 359 1 0;
  }

  100% {
    stroke-dasharray: 359 1 0 0;
  }
}

@keyframes dashOffset {
  0% {
    stroke-dashoffset: 365;
  }

  100% {
    stroke-dashoffset: 5;
  }
}