/* CSS for Anada */

.hero .uk-background-norepeat {
  padding-top: 250px !important;
}
/* Shop */
.shopify-buy__btn {
  background-color: #db30ff !important;
}

.uk-navbar-dropdown-nav .uk-active {
  background: #e2c9b240;
}
/* toolbar */
.tm-toolbar-default {
  background: #f9f6f300 url("toolbar-texture.png") center / cover no-repeat;
  padding-top: 10px;
  padding-bottom: 10px;
  color: #1b1b1b;
  font-size: 12px;
}

.tm-toolbar-default a {
  color: #1b1b1b;
  font-weight: 400;
  transition: color 0.2s ease-in-out;
}

.tm-toolbar-default a:hover {
  color: #494948;
}

.tm-toolbar .uk-container {
  max-width: 1600px;
  height: 30px;
}

#module-137 .uk-width-3-5\@m {
  width: 170px;
}

#module-137 .uk-width-2-5\@m {
  width: 145px;
}

#module-138 {
  padding-left: 25px;
}

.tm-header-mobile {
  height: 0px;
}

.uk-navbar-toggle {
  display: none;
}

/* Navbar */

.uk-logo {
  position: relative;
  top: 28px;
}

/* Button Gradient */
.uk-button-default {
  position: relative;
  z-index: 1;
  border: none;

  overflow: hidden;
  /* Base gradient (100% visible by default) */
  background: linear-gradient(
    138deg,
    rgba(218, 155, 138, 1) 0%,
    rgba(237, 129, 100, 1) 100%
  );
}

/* Create the target hover gradient overlay */
.uk-button-default::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: -1;
  /* Target hover state gradient (70% opacity colors) */
  background: linear-gradient(
    138deg,
    rgb(237, 151, 128) 0%,
    rgb(237, 130, 100) 100%
  );
  opacity: 0;
  transition: opacity 0.3s ease;
}

/* On hover, smoothly fade in the target gradient */
.uk-button-default:hover::before {
  opacity: 1;
}

/* Gerneral */

/* Set repeating background image on the whole site */
body {
  /* 1. Top layer: image. 2. Bottom layer: solid color */
  background-image: url("bg-texture.png");
  background-color: #fdfbf7; /* Replace with your desired color (hex, rgb, etc.) */
  background-repeat: repeat;
  background-attachment: fixed; /* Optional: fixes background during scroll */
  background-position: top left;
}

.border-overlay {
  border: 1px solid #fff;
}

.orange {
  color: #da9b8a !important;
}

.small-overlay .uk-overlay {
  height: 170px;
}

.bg-column-padding {
  padding-top: 40px;
  padding-bottom: 40px;
}
/* 
.uk-list .el-item div:has(.el-content) {
  padding-left: 10px;
} */

.uk-section-primary {
  background: linear-gradient(
    207deg,
    rgba(63, 74, 66, 1) 0%,
    rgba(90, 102, 93, 1) 100%
  );
}

.uk-section-muted {
  background: linear-gradient(
    207deg,
    rgba(246, 238, 229, 1) 0%,
    rgba(255, 232, 224, 1) 100%
  );
}

.uk-section-secondary {
  background: linear-gradient(
    180deg,
    rgba(25, 18, 14, 1) 0%,
    rgba(51, 30, 21, 1) 100%
  );
}

.course-logo-slider .uk-slider-items {
  mix-blend-mode: darken;
}
/* footer */

.footer-subnav {
  font-weight: 500;
}

.footer a {
  color: #222222;
}

/* form */

.ba-form-submit-btn {
  margin-top: 15px;
}

.ba-form-acceptance-field .ba-form-acceptance-html p a:hover {
  opacity: 70%;
}

.contact-form .ba-form-acceptance-field .ba-form-acceptance-html p a {
  text-decoration: underline;
  color: #fff;
}

.ba-form-submit-btn {
  color: #1b1b1b !important;
  font-weight: 600 !important;
}

.ba-form-acceptance-field label.ba-form-checkbox > span {
  background: rgb(255, 255, 255) !important;
}

.ba-form-acceptance-field
  label.ba-form-checkbox
  input[type="checkbox"]:checked
  + span::before {
  color: #1b1b1b !important;
}

/* .checkbox .ba-input-wrapper .ba-field-container {
  box-shadow: 0px 0px 10px #ff5e0000;
}

.checkbox .ba-form-checkbox span {
  background: rgb(255, 255, 255) !important;
}

.checkbox .ba-form-checkbox span::before {
  color: #1b1b1b !important;
}

.dropdown {
  font-family: "Be Vietnam Pro", sans-serif !important;
} */

/*small desktop*/
@media all and (min-width: 960px) and (max-width: 1199px) {
  .uk-logo img {
    width: 150px;
    top: 25px;
    position: relative;
  }

  .bg-column-padding {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
  }
}

/*ipad*/
@media all and (min-width: 640px) and (max-width: 959px) {
  .bg-column-padding {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
  }
  .uk-logo img {
    width: 150px;
    top: 25px;
    position: relative;
  }

  .hero .uk-background-norepeat {
    padding-top: 100px !important;
  }
}

/*mobile*/
@media (max-width: 639px) {
  .bg-column-padding {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
  }
  .uk-logo img {
    width: 150px;
    top: 25px;
    position: relative;
  }

  .uk-h1 {
    font-size: 51px;
  }

  .hero .uk-background-norepeat {
    padding-top: 200px !important;
  }
}
