:root {
  --bs-blue: #0d6efd;
  --bs-indigo: #6610f2;
  --bs-purple: #6f42c1;
  --bs-pink: #d63384;
  --bs-red: #dc3545;
  --bs-orange: #fd7e14;
  --bs-yellow: #ffc107;
  --bs-green: #198754;
  --bs-teal: #20c997;
  --bs-cyan: #0dcaf0;
  --bs-black: #000;
  --bs-white: #fff;
  --bs-gray: #6c757d;
  --bs-gray-dark: #343a40;
  --bs-gray-100: #f8f9fa;
  --bs-gray-200: #e9ecef;
  --bs-gray-300: #dee2e6;
  --bs-gray-400: #ced4da;
  --bs-gray-500: #adb5bd;
  --bs-gray-600: #6c757d;
  --bs-gray-700: #495057;
  --bs-gray-800: #343a40;
  --bs-gray-900: #212529;
  --bs-primary: #0d6efd;
  --bs-secondary: #6c757d;
  --bs-success: #198754;
  --bs-info: #0dcaf0;
  --bs-warning: #ffc107;
  --bs-danger: #dc3545;
  --bs-light: #f8f9fa;
  --bs-dark: #212529;
  --bs-primary-rgb: 13, 110, 253;
  --bs-secondary-rgb: 108, 117, 125;
  --bs-success-rgb: 25, 135, 84;
  --bs-info-rgb: 13, 202, 240;
  --bs-warning-rgb: 255, 193, 7;
  --bs-danger-rgb: 220, 53, 69;
  --bs-light-rgb: 248, 249, 250;
  --bs-dark-rgb: 33, 37, 41;
  --bs-white-rgb: 255, 255, 255;
  --bs-black-rgb: 0, 0, 0;
  --bs-body-color-rgb: 33, 37, 41;
  --bs-body-bg-rgb: 255, 255, 255;
  --bs-font-sans-serif: system-ui, -apple-system, "Segoe UI", Roboto,
    "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif,
    "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  --bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas,
    "Liberation Mono", "Courier New", monospace;
  --bs-gradient: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.15),
    rgba(255, 255, 255, 0)
  );
  --bs-body-font-family: var(--bs-font-sans-serif);
  --bs-body-font-size: 1rem;
  --bs-body-font-weight: 400;
  --bs-body-line-height: 1.5;
  --bs-body-color: #212529;
  --bs-body-bg: #fff;
  --bs-border-width: 1px;
  --bs-border-style: solid;
  --bs-border-color: #dee2e6;
  --bs-border-color-translucent: rgba(0, 0, 0, 0.175);
  --bs-border-radius: 0.375rem;
  --bs-border-radius-sm: 0.25rem;
  --bs-border-radius-lg: 0.5rem;
  --bs-border-radius-xl: 1rem;
  --bs-border-radius-2xl: 2rem;
  --bs-border-radius-pill: 50rem;
  --bs-link-color: #0d6efd;
  --bs-link-hover-color: #0a58ca;
  --bs-code-color: #d63384;
  --bs-highlight-bg: #fff3cd;
}

/* Sembunyikan dengan class */
.logged-in .hide-on-logged-in {
  display: none !important;
}
.logged-in .show-on-logged-in {
  display: block !important;
}
.hide-on-logged-out,
.hide-on-guest,
.hide-for-guest {
  display: none !important;
}

/* Sembunyikan Menu di My Account */
.woocommerce-MyAccount-navigation {
  display: none;
}
.woocommerce-MyAccount-navigation ul {
  padding: 0 !important;
}
.woocommerce .woocommerce-MyAccount-content,
woocommerce-MyAccount-content {
  display: block;
  width: 100% !important;
}
/* ORDER NUMBER */
.woocommerce-MyAccount-content .order-number {
  font-weight: bold;
  font-size: 1.5rem;
  color: var(--ast-global-color-0);
}

/* GENERAL */
.bold {
  font-weight: bold !important;
}
.bolder {
  font-weight: bolder !important;
}
.p-8 {
  padding: 8px !important;
}
.p-10 {
  padding: 10px !important;
}
.p-15 {
  padding: 15px !important;
}
.p-20 {
  padding: 20px !important;
}
.p-25 {
  padding: 25px !important;
}
.p-30 {
  padding: 30px !important;
}
.py-8 {
  padding: 8px auto !important;
}
.py-10 {
  padding: 10px auto !important;
}
.py-15 {
  padding: 15px auto !important;
}
.py-20 {
  padding: 20px auto !important;
}
.py-25 {
  padding: 25px auto !important;
}
.py-30 {
  padding: 30px auto !important;
}
.px-8 {
  padding: auto 8px !important;
}
.px-10 {
  padding: auto 10px !important;
}
.px-15 {
  padding: auto 15px !important;
}
.px-20 {
  padding: auto 20px !important;
}
.px-25 {
  padding: auto 25px !important;
}
.px-30 {
  padding: auto 30px !important;
}
/* MARGINS */
.m-8 {
  margin: 8px !important;
}
.m-10 {
  margin: 10px !important;
}
.m-15 {
  margin: 15px !important;
}
.m-20 {
  margin: 20px !important;
}
.m-25 {
  margin: 25px !important;
}
.m-30 {
  margin: 30px !important;
}
.my-8 {
  margin: 8px auto !important;
}
.my-10 {
  margin: 10px auto !important;
}
.my-15 {
  margin: 15px auto !important;
}
.my-20 {
  margin: 20px auto !important;
}
.my-25 {
  margin: 25px auto !important;
}
.my-30 {
  margin: 30px auto !important;
}
.mx-8 {
  margin: auto 8px !important;
}
.mx-10 {
  margin: auto 10px !important;
}
.mx-15 {
  margin: auto 15px !important;
}
.mx-20 {
  margin: auto 20px !important;
}
.mx-25 {
  margin: auto 25px !important;
}
.mx-30 {
  margin: auto 30px !important;
}

.flex {
  display: flex !important;
}
.content-between {
  display: flex;
  justify-content: space-between !important;
}
.content-evenly {
  display: flex;
  justify-content: space-evenly !important;
}
.content-evenly {
  display: flex;
  justify-content: space-around !important;
}
.items-center {
  display: flex;
  align-items: center !important;
}

/* FUNNELKIT FKCART */
.fkcart-remove-item.reset {
  display: block !important;
  position: relative !important;
  border-radius: 0 !important;
  width: auto !important;
  height: auto !important;
  background: red !important;
  color: #ffffff !important;
  font-weight: bolder !important;
}

/* MODAL */
/* The Modal (background) */
.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  padding-top: 100px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0, 0, 0); /* Fallback color */
  background-color: rgba(0, 0, 0, 0.4); /* Black w/ opacity */
}

/* Modal Content */
.modal-content {
  position: relative;
  background-color: #fefefe;
  margin: auto;
  padding: 0;
  border: 1px solid #888;
  width: 80%;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  -webkit-animation-name: animatetop;
  -webkit-animation-duration: 0.4s;
  animation-name: animatetop;
  animation-duration: 0.4s;
}

/* Add Animation */
@-webkit-keyframes animatetop {
  from {
    top: -300px;
    opacity: 0;
  }
  to {
    top: 0;
    opacity: 1;
  }
}

@keyframes animatetop {
  from {
    top: -300px;
    opacity: 0;
  }
  to {
    top: 0;
    opacity: 1;
  }
}

/* The Close Button */
.close {
  color: rgb(200, 0, 0);
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.close:hover,
.close:focus {
  color: rgb(226, 45, 45);
  text-decoration: none;
  cursor: pointer;
}

.modal-header {
  padding: 2px 16px;
  background-color: #ffffff;
}

.modal-body {
  padding: 2px 16px;
}

.modal-footer {
  padding: 2px 16px;
  background-color: #ffffff;
}

/* PRODUK */
/* li.product.outofstock.product-type-simple .eael-product-wrap .product-image-wrap .image-wrap a img,
li.product.outofstock.product-type-simple .eael-product-wrap .product-details-wrap,
*/
li.product.outofstock.product-type-simple
  .eael-product-wrap
  .product-image-wrap
  .image-wrap
  a
  img,
li.product.swiper-slide.outofstock
  .eael-product-carousel
  .product-image-wrap
  .image-wrap
  img {
  filter: grayscale(100%) !important;
}

.eael-onsale.outofstock.left,
.eael-onsale.outofstock.right {
  font-size: 16px;
  padding: 18px 20px !important;
  width: 80% !important;
  margin: 25% auto !important;
  box-shadow: 0px 0px 30px rgba(250, 0, 0, 0.7) !important;
}

span.outofstock {
  font-size: 16px !important;
}

.mx-auto {
  display: block;
  margin: 0 auto !important;
}
.text-center {
  text-align: center !important;
}

.bg-green {
  background: var(--bs-green) !important;
}
.bg-green:hover {
  background-color: var(--bs-teal) !important;
}