/**********************************************************************************************************************/
/*                                                     [CATALOG]                                                      */
/**********************************************************************************************************************/
.text-shop-card {
  color: var(--text-shop-card);
}
/**********************************************************************************************************************/
/*                                                  [MODAL SETTING]                                                   */
/**********************************************************************************************************************/
.setting-modal-content {
  border-radius: var(--radius-modal-content);
  padding: var(--padding-modal-content);
}
.bg-modal-header {
  border-top-left-radius: var(--radius-modal-header);
  border-top-right-radius: var(--radius-modal-header);
  background-color: var(--bg-modal-header);
}
.text-modal-title {
  color: var(--color-modal-title);
}
.btn-close-theme {
  background: var(--btn-close-theme);
}
.color-modal-logo {
  color: var(--color-modal-logo);
}
.text-modal-content {
  color: var(--color-modal-content);
}
.modal-footer .btn-modal-close,
.modal-footer .btn-modal-submit {
  border-radius: var(--radius-modal-btn);
}
.btn-modal-close {
  color: var(--color-white) !important;
  border: 1px solid var(--btn-modal-close) !important;
  background-color: var(--btn-modal-close) !important;
}
.btn-modal-close:hover {
  color: var(--btn-modal-close) !important;
  border: 1px solid var(--btn-modal-close) !important;
  background-color: var(--color-white) !important;
}
.btn-modal-submit {
  color: var(--color-white) !important;
  border: 1px solid var(--btn-modal-submit) !important;
  background-color: var(--btn-modal-submit) !important;
}
.btn-modal-submit:hover {
  color: var(--btn-modal-submit) !important;
  border: 1px solid var(--btn-modal-submit) !important;
  background-color: var(--color-white) !important;
}
/**********************************************************************************************************************/
/*                                                  [SUPPORT SETTING]                                                 */
/**********************************************************************************************************************/
.text-support {
  color: var(--text-support) !important;
}
.bg-support {
  background-color: var(--bg-support) !important;
}
.bg-support-light {
  background-color: var(--bg-support-light) !important;
}
.border-support {
  border: 1px solid var(--border-support) !important;
}
.btn-support {
  color: var(--color-white) !important;
  border: 1px solid var(--border-support) !important;
  background-color: var(--bg-support) !important;
}
.btn-support:hover {
  color: var(--text-support-hover) !important;
  border: 1px solid var(--border-support) !important;
  background-color: var(--color-white) !important;
}
.link-support {
  color: var(--link-support) !important;
}
.link-support:hover {
  color: var(--link-support-hover) !important;
}
/**********************************************************************************************************************/
/*                                                  [BACKGROUND COLOR]                                                */
/**********************************************************************************************************************/
.bg-white {
  background-color: var(--color-white) !important;
}
.bg-blue {
  background-color: var(--color-blue) !important;
}
.bg-blue-light {
  background-color: var(--color-blue-light) !important;
}
.bg-blue-ultra-light {
  background-color: var(--color-blue-ultra-light) !important;
}
.bg-blue-10 {
  background-color: var(--color-blue-10) !important;
}
.bg-grey {
  background-color: var(--color-grey) !important;
}
.bg-grey-light {
  background-color: var(--color-grey-light) !important;
}
.bg-purple {
  background-color: var(--color-purple) !important;
}
/**********************************************************************************************************************/
/*                                                     [TEXT COLOR]                                                   */
/**********************************************************************************************************************/
.text-blue {
  color: var(--color-blue) !important;
}
.text-blue-light {
  color: var(--color-blue-light) !important;
}
.text-blue-ultra-light {
  color: var(--color-blue-ultra-light) !important;
}
.text-green {
  color: var(--color-green) !important;
}
.text-grey {
  color: var(--color-grey) !important;
}
.text-grey-light {
  color: var(--color-grey-light) !important;
}
.text-purple {
  color: var(--color-purple) !important;
}
.text-purple-light {
  color: var(--color-purple-light) !important;
}
/**********************************************************************************************************************/
/*                                                   [TEXT SETTING]                                                   */
/**********************************************************************************************************************/
.text-justify {
  text-align: justify !important;
}
.fw-700 {
  font-weight: 900 !important;
}
.ls-1 {
  letter-spacing: .15rem;
}
.ls-2 {
  letter-spacing: .50rem;
}
.fs-7 {
  font-size: .90rem;
}
.fs-8 {
  font-size: .80rem;
}
.fs-9 {
  font-size: .70rem;
}
/**********************************************************************************************************************/
/*                                                      [LINK COLOR]                                                  */
/**********************************************************************************************************************/
.link-blue {
  color: var(--color-blue);
}
.link-blue:hover {
  color: var(--color-blue-dark);
}
.link-purple {
  color: var(--color-purple);
}
.link-purple-underline {
  color: var(--color-purple);
  text-decoration: underline;
}
/**********************************************************************************************************************/
/*                                                        [BUTTON]                                                    */
/**********************************************************************************************************************/
.btn-blue {
  color: var(--color-white) !important;
  border: 1px solid var(--color-blue) !important;
  background-color: var(--color-blue) !important;
}
.btn-blue:hover {
  color: var(--color-blue) !important;
  border: 1px solid var(--color-blue) !important;
  background-color: var(--color-white) !important;
}

.btn-outline-blue {
  color: var(--color-blue) !important;
  border: 1px solid transparent !important;
  background-color: transparent !important;
}
.btn-outline-blue:hover {
  color: var(--color-blue-dark) !important;
  border: 1px solid transparent !important;
  background-color: transparent !important;
}

.btn-purple {
  color: var(--color-white) !important;
  border: 1px solid var(--color-white) !important;
  background-color: var(--color-purple) !important;
}
.btn-purple:hover {
  color: var(--color-purple) !important;
  border: 1px solid var(--color-purple) !important;
  background-color: var(--color-white) !important;
}

.btn-outline-purple {
  color: var(--color-purple) !important;
  border: 1px solid transparent !important;
  background-color: transparent !important;
}
.btn-outline-purple:hover {
  color: var(--color-purple-light) !important;
  border: 1px solid transparent !important;
  background-color: transparent !important;
}
/**********************************************************************************************************************/
/*                                                       [BORDER]                                                     */
/**********************************************************************************************************************/
.border-blue {
  border: var(--border-blue) !important;
}
.border-green {
  border-bottom: 1px solid var(--color-green) !important;
}
.border-dark {
  border: 1px solid var(--bs-dark);
}
.vr-green {
  border-bottom: 1px solid var(--color-green) !important;
}
.dr-green {
  border: 1px solid var(--color-green) !important;
}
/**********************************************************************************************************************/
/*                                                    [POSITIONING]                                                   */
/**********************************************************************************************************************/
.start-25 {
  left: 25% !important;
}
.start-75 {
  left: 75% !important;
}
.end-25 {
  right: 25% !important;
}
.end-75 {
  right: 75% !important;
}
.top-n100 {
  top: -100%;
}
.z-index-n1 {
  z-index: -1 !important;
}
.z-index-1100 {
  z-index: 1100 !important;
}
.z-index-1099 {
  z-index: 1099 !important;
}
.z-index-1098 {
  z-index: 1098 !important;
}
.z-index-1097 {
  z-index: 1097 !important;
}
/**********************************************************************************************************************/
/*                                                       [IMAGE]                                                      */
/**********************************************************************************************************************/
.img-cover {
  max-width: 100% !important;
  min-height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
}
.img-cover-without-min-max {
  justify-content: center !important;
  object-fit: cover !important;
  object-position: center !important;
}
.img-contain {
  object-fit: contain !important;
}
/**********************************************************************************************************************/
/*                                                     [ERROR TOAST]                                                  */
/**********************************************************************************************************************/
.toast-container {
  z-index: var(--z-index-1100) !important;
  flex-direction: column;
  bottom: 15px;
  right: 15px;
}
.toast {
  width: 350px !important;
  margin: auto 10px 10px auto;
}
/* WIDTH */
.w-max {
  width: max-content !important;
}
.w-05{width:05%!important;}.w-10{width:10%!important;}.w-15{width:15%!important;}.w-20{width:20%!important;}
.w-30{width:30%!important;}.w-33{width:33.3333%!important;}.w-35{width:35%!important;}.w-40{width:40%!important;}
.w-45{width:45%!important;}.w-55{width:55%!important;}.w-60{width:60%!important;}.w-65{width:65%!important;}
.w-66{width:66.6666%!important;}.w-70{width:70%!important;}.w-80{width:80%!important;}.w-85{width:85%!important;}
.w-90{width:90%!important;}.w-95{width:95%!important;}
/* HEIGHT */
.h-max {
  height: max-content !important;
}
.h-05{height:05%!important;}.h-10{height:10%!important;}.h-15{height:15%!important;}.h-20{height:20%!important;}
.h-30{height:30%!important;}.h-33{width:33.3333%!important;}.h-35{width:35%!important;}.h-40{height:40%!important;}
.h-45{height:45%!important;}.h-55{height:55%!important;}.h-60{height:60%!important;}.h-65{height:65%!important;}
.h-66{height:66.6666%!important;}.h-70{height:70%!important;}.h-80{height:80%!important;}.h-85{height:85%!important;}
.h-90{height:90%!important;}.h-95{height:95%!important;}

/**********************************************************************************************************************/
/*                                              == [ BREAKPOINT SM ]==                                                */
/**********************************************************************************************************************/
@media only screen and (min-width: 576px) {
  /* WIDTH */
  .w-sm-max {
    width: max-content !important;
  }
  .w-sm-05{width:05%!important;}.w-sm-10{width:10%!important;}.w-sm-15{width:15%!important;}.w-sm-20{width:20%!important;}.w-sm-25{width:25%!important;}
  .w-sm-30{width:30%!important;}.w-sm-33{width:33.3333%!important;}.w-sm-35{width:35%!important;}.w-sm-40{width:40%!important;}.w-sm-45{width:45%!important;}
  .w-sm-50{width:50%!important;}.w-sm-55{width:55%!important;}.w-sm-60{width:60%!important;}.w-sm-65{width:65%!important;}.w-sm-66{width:66.6666%!important;}
  .w-sm-70{width:70%!important;}.w-sm-75{width:75%!important;}.w-sm-80{width:80%!important;}.w-sm-85{width:85%!important;}.w-sm-90{width:90%!important;}
  .w-sm-95{width:95%!important;}.w-sm-100{width:100%!important;}
  /* HEIGHT */
  .h-sm-max {
    height: max-content !important;
  }
  .h-sm-05{height:05%!important;}.h-sm-10{height:10%!important;}.h-sm-15{height:15%!important;}.h-sm-20{height:20%!important;}
  .h-sm-25{height:25%!important;}.h-sm-30{height:30%!important;}.h-sm-33{width:33.3333%!important;}.h-sm-35{width:35%!important;}
  .h-sm-40{height:40%!important;}.h-sm-45{height:45%!important;}.h-sm-50{height:50%!important;}.h-sm-55{height:55%!important;}
  .h-sm-60{height:60%!important;}.h-sm-65{height:65%!important;}.h-sm-66{height:66.6666%!important;}.h-sm-70{height:70%!important;}
  .h-sm-75{height:75%!important;}.h-sm-80{height:80%!important;}.h-sm-85{height:85%!important;}.h-sm-90{height:90%!important;}
  .h-sm-95{height:95%!important;}.h-sm-100{height:100%!important;}
  /********************************************************************************************************************/
  /*                                                 [POSITIONING]                                                    */
  /********************************************************************************************************************/
  .position-sm-fixed {
    position: fixed !important;
  }
  /********************************************************************************************************************/
  /*                                                   [ROUNDED]                                                      */
  /********************************************************************************************************************/
  .rounded-sm-start {
    border-top-left-radius: var(--bs-border-radius) !important;
    border-bottom-left-radius: var(--bs-border-radius) !important;
  }
  .rounded-sm-end {
    border-top-right-radius: var(--bs-border-radius) !important;
    border-bottom-right-radius: var(--bs-border-radius) !important;
  }
}

/**********************************************************************************************************************/
/*                                              == [ BREAKPOINT MD ]==                                                */
/**********************************************************************************************************************/
@media only screen and (min-width: 768px) {
  /* WIDTH */
  .w-md-max {
    width: max-content !important;
  }
  .w-md-05{width:05%!important;}.w-md-10{width:10%!important;}.w-md-15{width:15%!important;}.w-md-20{width:20%!important;}
  .w-md-25{width:25%!important;}.w-md-30{width:30%!important;}.w-md-33{width:33.3333%!important;}.w-md-35{width:35%!important;}
  .w-md-40{width:40%!important;}.w-md-45{width:45%!important;}.w-md-50{width:50%!important;}.w-md-55{width:55%!important;}
  .w-md-60{width:60%!important;}.w-md-65{width:65%!important;}.w-md-66{width:66.6666%!important;}.w-md-70{width:70%!important;}
  .w-md-75{width:75%!important;}.w-md-80{width:80%!important;}.w-md-85{width:85%!important;}.w-md-90{width:90%!important;}
  .w-md-95{width:95%!important;}.w-md-100{width:100%!important;}
  /* HEIGHT */
  .h-md-max {
    height: max-content !important;
  }
  .h-md-05{height:05%!important;}.h-md-10{height:10%!important;}.h-md-15{height:15%!important;}.h-md-20{height:20%!important;}
  .h-md-25{height:25%!important;}.h-md-30{height:30%!important;}.h-md-33{width:33.3333%!important;}.h-md-35{width:35%!important;}
  .h-md-40{height:40%!important;}.h-md-45{height:45%!important;}.h-md-50{height:50%!important;}.h-md-55{height:55%!important;}
  .h-md-60{height:60%!important;}.h-md-65{height:65%!important;}.h-md-66{height:66.6666%!important;}.h-md-70{height:70%!important;}
  .h-md-75{height:75%!important;}.h-md-80{height:80%!important;}.h-md-85{height:85%!important;}.h-md-90{height:90%!important;}
  .h-md-95{height:95%!important;}.h-md-100{height:100%!important;}
  /********************************************************************************************************************/
  /*                                                 [POSITIONING]                                                    */
  /********************************************************************************************************************/
  .position-md-fixed {
    position: fixed !important;
  }
  /********************************************************************************************************************/
  /*                                                   [ROUNDED]                                                      */
  /********************************************************************************************************************/
  .rounded-bottom-md-0 {
    border-bottom-left-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
  }
  .rounded-md-start {
    border-top-left-radius: var(--bs-border-radius) !important;
    border-top-right-radius: 0 !important;
    border-bottom-left-radius: var(--bs-border-radius) !important;
    border-bottom-right-radius: 0 !important;
  }
  .rounded-md-end {
    border-top-right-radius: var(--bs-border-radius) !important;
    border-top-left-radius: 0 !important;
    border-bottom-right-radius: var(--bs-border-radius) !important;
    border-bottom-left-radius: 0 !important;
  }
  /********************************************************************************************************************/
  /*                                                    [BORDER]                                                      */
  /********************************************************************************************************************/
  .border-bottom-md-0 {
    border-bottom: 1px solid transparent !important;
  }
}

/**********************************************************************************************************************/
/*                                              == [ BREAKPOINT LG ]==                                                */
/**********************************************************************************************************************/
@media only screen and (min-width: 992px) {
  /* WIDTH */
  .w-lg-max {
    width: max-content !important;
  }
  .w-lg-05{width:05%!important;}.w-lg-10{width:10%!important;}.w-lg-15{width:15%!important;}.w-lg-20{width:20%!important;}
  .w-lg-25{width:25%!important;}.w-lg-30{width:30%!important;}.w-lg-33{width:33.3333%!important;}.w-lg-35{width:35%!important;}
  .w-lg-40{width:40%!important;}.w-lg-45{width:45%!important;}.w-lg-50{width:50%!important;}.w-lg-55{width:55%!important;}
  .w-lg-60{width:60%!important;}.w-lg-65{width:65%!important;}.w-lg-66{width:66.6666%!important;}.w-lg-70{width:70%!important;}
  .w-lg-75{width:75%!important;}.w-lg-80{width:80%!important;}.w-lg-85{width:85%!important;}.w-lg-90{width:90%!important;}
  .w-lg-95{width:95%!important;}.w-lg-100{width:100%!important;}
  /* HEIGHT */
  .h-lg-max {
    height: max-content !important;
  }
  .h-lg-05{height:05%!important;}.h-lg-10{height:10%!important;}.h-lg-15{height:15%!important;}.h-lg-20{height:20%!important;}
  .h-lg-25{height:25%!important;}.h-lg-30{height:30%!important;}.h-lg-33{width:33.3333%!important;}.h-lg-35{width:35%!important;}
  .h-lg-40{height:40%!important;}.h-lg-45{height:45%!important;}.h-lg-50{height:50%!important;}.h-lg-55{height:55%!important;}
  .h-lg-60{height:60%!important;}.h-lg-65{height:65%!important;}.h-lg-66{height:66.6666%!important;}.h-lg-70{height:70%!important;}
  .h-lg-75{height:75%!important;}.h-lg-80{height:80%!important;}.h-lg-85{height:85%!important;}.h-lg-90{height:90%!important;}
  .h-lg-95{height:95%!important;}.h-lg-100{height:100%!important;}
  /********************************************************************************************************************/
  /*                                                 [POSITIONING]                                                    */
  /********************************************************************************************************************/
  .position-lg-fixed {
    position: fixed !important;
  }
  /********************************************************************************************************************/
  /*                                                   [ROUNDED]                                                      */
  /********************************************************************************************************************/
  .rounded-lg-start {
    border-top-left-radius: var(--bs-border-radius) !important;
    border-bottom-left-radius: var(--bs-border-radius) !important;
  }
  .rounded-lg-end {
    border-top-right-radius: var(--bs-border-radius) !important;
    border-bottom-right-radius: var(--bs-border-radius) !important;
  }
}

/**********************************************************************************************************************/
/*                                              == [ BREAKPOINT XL ]==                                                */
/**********************************************************************************************************************/
@media only screen and (min-width: 1200px) {
  /* WIDTH */
  .w-xl-max {
    width: max-content !important;
  }
  .w-xl-05{width:05%!important;}.w-xl-10{width:10%!important;}.w-xl-15{width:15%!important;}.w-xl-20{width:20%!important;}
  .w-xl-25{width:25%!important;}.w-xl-30{width:30%!important;}.w-xl-33{width:33.3333%!important;}.w-xl-35{width:35%!important;}
  .w-xl-40{width:40%!important;}.w-xl-45{width:45%!important;}.w-xl-50{width:50%!important;}.w-xl-55{width:55%!important;}
  .w-xl-60{width:60%!important;}.w-xl-65{width:65%!important;}.w-xl-66{width:66.6666%!important;}.w-xl-70{width:70%!important;}
  .w-xl-75{width:75%!important;}.w-xl-80{width:80%!important;}.w-xl-85{width:85%!important;}.w-xl-90{width:90%!important;}
  .w-xl-95{width:95%!important;}.w-xl-100{width:100%!important;}
  /* HEIGHT */
  .h-xl-max {
    height: max-content !important;
  }
  .h-xl-05{height:05%!important;}.h-xl-10{height:10%!important;}.h-xl-15{height:15%!important;}.h-xl-20{height:20%!important;}
  .h-xl-25{height:25%!important;}.h-xl-30{height:30%!important;}.h-xl-33{width:33.3333%!important;}.h-xl-35{width:35%!important;}
  .h-xl-40{height:40%!important;}.h-xl-45{height:45%!important;}.h-xl-50{height:50%!important;}.h-xl-55{height:55%!important;}
  .h-xl-60{height:60%!important;}.h-xl-65{height:65%!important;}.h-xl-66{height:66.6666%!important;}.h-xl-70{height:70%!important;}
  .h-xl-75{height:75%!important;}.h-xl-80{height:80%!important;}.h-xl-85{height:85%!important;}.h-xl-90{height:90%!important;}
  .h-xl-95{height:95%!important;}.h-xl-100{height:100%!important;}
  /********************************************************************************************************************/
  /*                                                 [POSITIONING]                                                    */
  /********************************************************************************************************************/
  .position-xl-fixed {
    position: fixed !important;
  }
  .fixed-xl-bottom {
    position: fixed;
    bottom: 0;
  }
  /********************************************************************************************************************/
  /*                                                   [ROUNDED]                                                      */
  /********************************************************************************************************************/
  .rounded-xl-start {
    border-top-left-radius: var(--bs-border-radius) !important;
    border-bottom-left-radius: var(--bs-border-radius) !important;
  }
  .rounded-xl-end {
    border-top-right-radius: var(--bs-border-radius) !important;
    border-bottom-right-radius: var(--bs-border-radius) !important;
  }
}

/**********************************************************************************************************************/
/*                                              == [ BREAKPOINT XXL ]==                                               */
/**********************************************************************************************************************/
@media only screen and (min-width: 1400px) {
  /* WIDTH */
  .w-xxl-max {
    width: max-content !important;
  }
  .w-xxl-05{width:05%!important;}.w-xxl-10{width:10%!important;}.w-xxl-15{width:15%!important;}.w-xxl-20{width:20%!important;}
  .w-xxl-25{width:25%!important;}.w-xxl-30{width:30%!important;}.w-xxl-33{width:33.3333%!important;}.w-xxl-35{width:35%!important;}
  .w-xxl-40{width:40%!important;}.w-xxl-45{width:45%!important;}.w-xxl-50{width:50%!important;}.w-xxl-55{width:55%!important;}
  .w-xxl-60{width:60%!important;}.w-xxl-65{width:65%!important;}.w-xxl-66{width:66.6666%!important;}.w-xxl-70{width:70%!important;}
  .w-xxl-75{width:75%!important;}.w-xxl-80{width:80%!important;}.w-xxl-85{width:85%!important;}.w-xxl-90{width:90%!important;}
  .w-xxl-95{width:95%!important;}.w-xxl-100{width:100%!important;}
  /* HEIGHT */
  .h-xxl-max {
    height: max-content !important;
  }
  .h-xxl-05{height:05%!important;}.h-xxl-10{height:10%!important;}.h-xxl-15{height:15%!important;}.h-xxl-20{height:20%!important;}
  .h-xxl-25{height:25%!important;}.h-xxl-30{height:30%!important;}.h-xxl-33{width:33.3333%!important;}.h-xxl-35{width:35%!important;}
  .h-xxl-40{height:40%!important;}.h-xxl-45{height:45%!important;}.h-xxl-50{height:50%!important;}.h-xxl-55{height:55%!important;}
  .h-xxl-60{height:60%!important;}.h-xxl-65{height:65%!important;}.h-xxl-66{height:66.6666%!important;}.h-xxl-70{height:70%!important;}
  .h-xxl-75{height:75%!important;}.h-xxl-80{height:80%!important;}.h-xxl-85{height:85%!important;}.h-xxl-90{height:90%!important;}
  .h-xxl-95{height:95%!important;}.h-xxl-100{height:100%!important;}
  /********************************************************************************************************************/
  /*                                                 [POSITIONING]                                                    */
  /********************************************************************************************************************/
  .position-xxl-fixed {
    position: fixed !important;
  }
  /********************************************************************************************************************/
  /*                                                   [ROUNDED]                                                      */
  /********************************************************************************************************************/
  .rounded-xxl-start {
    border-top-left-radius: var(--bs-border-radius) !important;
    border-bottom-left-radius: var(--bs-border-radius) !important;
  }
  .rounded-xxl-end {
    border-top-right-radius: var(--bs-border-radius) !important;
    border-bottom-right-radius: var(--bs-border-radius) !important;
  }
}