/* 
 Theme Name:     Med Advice
 Author:         Med Advice
 Author URI:     http://www.medadvice.gr 
 Template:       storefront
 Version:        1.0 
*/

/* ----------- PUT YOUR CUSTOM CSS BELOW THIS LINE -- DO NOT EDIT ABOVE THIS LINE --------------------------- */

:root {
  --global-base-font: "Manrope", sans-serif;
  --global-alt-font: "Manrope", sans-serif;
  --font-awesome: "Font Awesome 5 Free";
  --black: black;
  --white: white;
  --grey: #e9e9e9;
  /* --purrple: #4f12b5; */
  --purrple: #fe621d;
  --pink: #f514d4;
  --orange: #fe621d;
  --colorfull1: linear-gradient(
    90deg,
    rgba(254, 98, 29, 1) 0%,
    rgba(238, 83, 29, 1) 41%,
    rgba(211, 57, 29, 1) 73%,
    rgba(154, 3, 30, 1) 100%
  );
  --colorfull2: linear-gradient(
    90deg,
    rgba(254, 98, 29, 1) 0%,
    rgba(238, 83, 29, 1) 41%,
    rgba(211, 57, 29, 1) 73%,
    rgba(154, 3, 30, 1) 100%
  );
}

:root:lang(en-US) {
  --base-font: "Manrope", sans-serif;
  --alt-font: "Manrope", sans-serif;
}

:root:lang(el) {
  --base-font: "Manrope", sans-serif;
  --alt-font: "Manrope", sans-serif;
}

h1,
h2,
h3,
h4,
h5,
h6,
p,
a,
span,
li,
label {
  font-family: var(--base-font);
  color: black;
}

a {
  color: black;
}

@media screen and (min-width: 768px) {
  .hide-desktop {
    display: none !important;
  }
}

@media screen and (max-width: 767px) {
  .hide-mobile {
    display: block !important;
  }
}

/* Disable the default outline of storefront */

a:focus,
button:focus,
.button.alt:focus,
input:focus,
textarea:focus,
input[type="button"]:focus,
input[type="reset"]:focus,
input[type="submit"]:focus,
input[type="email"]:focus,
input[type="tel"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus {
  outline: none !important;
}

.wc-block-components-button,
.single_add_to_cart_button,
.wc-forward {
  background-image: var(--colorfull1);
  background-size: 100% auto;
  transition: background-size 1s ease;
}

.wc-block-components-button:hover,
.single_add_to_cart_button:hover,
.wc-forward:hover {
  background-size: 150% auto;
}

.site-main {
  padding: 0 !important;
}

.col-full {
  max-width: 90em;
}

.entry-header {
  margin-top: 2rem !important;
}

.entry-title {
  font-family: var(--alt-font);
  font-weight: 900;
}

.med-coupon {
  display: block;
  width: 100%;
  max-width: 450px;
  margin: 0 auto;
  text-align: center;
  background-color: black;
  color: white;
  font-family: var(--alt-font);
  font-size: 2.5rem;
  letter-spacing: 1px;
}

.med-coupon::before,
.med-coupon::after {
  content: " # ";
}

/* flex items */

.med-flex-loop {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

.med-flex-loop .med-flex-loop-item {
  flex-basis: 150px;
}

/* Woo messages */

.woocommerce-message,
.is-message,
.woocommerce-info,
.is-info,
.woocommerce-error,
.is-error {
  margin-bottom: 10px;
  background-color: #f9f9f9 !important;
  color: black !important;
  border: none !important;
}

.wc-block-components-notice-banner svg {
  max-height: 25px !important;
}

.is-message svg {
  background-color: black !important;
}

.is-info svg {
  background-color: black !important;
}

.is-error svg {
  background-color: red !important;
}

.woocommerce-message .close-button,
.woocommerce-info .close-button {
  position: absolute;
  right: 15px;
  width: 40px;
  height: 40px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-weight: bold;
  top: 50%;
  transform: translateY(-50%);
}

.woocommerce-message .close-button:hover,
.woocommerce-info .close-button:hover {
  cursor: pointer;
}

.woocommerce-error {
  background-color: #f9f9f9 !important;
  color: black !important;
}

.woocommerce-error li {
  color: black !important;
}

.woocommerce-message a,
.woocommerce-error a,
.woocommerce-info a {
  background-color: transparent !important;
  color: black !important;
}

.woocommerce-message::before,
.woocommerce-info::before {
  content: "ℹ";
  color: black;
}

.woocommerce-error::before {
  content: "🗴";
  color: red;
}

@media screen and (min-width: 768px) {
  :not(.as-sidebar) .med-cart-messages {
    display: flex;
    gap: 15px;
  }
}

.med-notice-img {
  float: right;
  max-width: 75px;
}

/* forms */

input[type="text"],
input[type="number"],
input[type="email"],
input[type="tel"],
input[type="url"],
input[type="password"],
input[type="search"],
textarea,
.input-text {
  background: transparent;
  box-shadow: none;
  border: 1px solid black;
}

/* My account login page */

#customer_login {
  display: flex;
  flex-direction: column;
  align-items: center;
}

#login-options-container {
  text-align: center;
}

#customer_login > div {
  width: 100% !important;
  max-width: 800px !important;
  margin: 1rem 0 !important;
}

#customer_login h2 {
  display: none;
}

.login-option-title.active-login-option,
.login-option-title:hover {
  display: inline-block;
  animation: 100ms linear ease-in-out;
  cursor: pointer;
}

#customer_login label {
  color: black;
}

#customer_login input.woocommerce-Input--text {
  width: 100%;
}

#customer_login .col-2 {
  display: none;
}

#customer_login .button {
  background-color: black;
  color: white;
}

#customer_login .woocommerce-form-login__rememberme {
  margin: 1rem 0;
}

/* breadcrumb */

.storefront-breadcrumb {
  margin-bottom: 1em !important;
}

.storefront-breadcrumb,
.storefront-breadcrumb a {
  color: black !important;
}

/* mobile bottom bar */

.storefront-handheld-footer-bar {
  z-index: 699;
  bottom: -80px;
  transition: all 0.4s ease-in-out;
}

.storefront-handheld-footer-bar.visible {
  bottom: 0;
}

.storefront-handheld-footer-bar .site-search {
  z-index: 899;
}

.storefront-handheld-footer-bar li {
  margin-bottom: 0 !important;
}

.storefront-handheld-footer-bar a {
  background-color: white !important;
}

.storefront-handheld-footer-bar .count {
  background-color: black !important;
}

/* Mobile handheld menu */

.storefront-handheld-footer-bar ul li > a::before {
  display: none !important;
}

.storefront-handheld-footer-bar ul li > a {
  background-repeat: no-repeat !important;
  background-size: 50px !important;
  background-position: center !important;
}

.storefront-handheld-footer-bar ul li.my-account > a {
  background: url(https://esgym-clothing.gr/wp-content/themes/MedAdviceSF/assets/icons/account_icon.png);
}

.storefront-handheld-footer-bar ul li.m-search > a {
  background: url(https://esgym-clothing.gr/wp-content/themes/MedAdviceSF/assets/icons/search_icon.png);
}

.storefront-handheld-footer-bar ul li.cart > a {
  background: url(https://esgym-clothing.gr/wp-content/themes/MedAdviceSF/assets/icons/cart_icon.png);
}

/* Mobile search */

@media screen and (max-width: 767px) {
  .storefront-handheld-footer-bar
    .site-search
    .widget_product_search
    form::before {
    display: none !important;
  }

  .storefront-handheld-footer-bar
    .site-search
    .widget_product_search
    form
    input {
    text-align: center;
    color: black !important;
    font-size: 1.2rem;
    font-weight: 600;
  }

  .storefront-handheld-footer-bar
    .site-search
    .widget_product_search
    form
    input::placeholder {
    text-align: center;
    color: black;
  }

  .storefront-handheld-footer-bar ul li.search .site-search {
    padding: 0;
    font-family: var(--base-font);
  }
}

.remove::before {
  content: "" !important;
  color: black !important;
}

.products .product {
  background: #f1f1f1;
}

.products .product a.woocommerce-LoopProduct-link {
  background: #f1f1f1;
}

.products .product a.woocommerce-LoopProduct-link > img {
  mix-blend-mode: multiply;
}

.widget_my_account .woocommerce h2 {
  display: none;
}

.woocommerce-form-login .form-row:nth-child(3) {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

/* owl carousel */

.owl-nav {
  position: absolute;
  top: 50%;
  display: flex;
  justify-content: space-between;
  width: 100%;
  transform: translatey(-50%);
}

.owl-nav button {
  font-size: 3rem !important;
}

.owl-nav button span {
  color: var(--purrple) !important;
}

.owl-prev {
  transform: translateX(-25px);
}

.owl-next {
  transform: translateX(25px);
}

/* custom tabs */

/* Tabs */

.faq-cat-title {
  color: var(--purrple);
  font-weight: 900;
  margin-top: 25px;
}

.faq-title {
  font-size: 1.2rem;
  font-weight: 600;
}

.custom-tab-title {
  width: 100%;
  border-bottom: 1px solid var(--grey);
}

.custom-tab-title:hover {
  cursor: pointer;
}

.custom-tab-title::after {
  content: "▼";
  float: right;
}

.custom-tab-title.open::after {
  content: "▲";
}

.custom-tab-content {
  display: none;
}

/* mc popup */

.et_bloom_popup_container {
  background: transparent !important;
}

.et_bloom_popup_container .et_bloom .et_bloom_popup .et_bloom_form_container {
  max-width: 600px !important;
}

.et_bloom_popup_container .et_bloom_form_container_wrapper {
  border-radius: 10px !important;
}

.et_bloom_popup_container .et_bloom_form_container_wrapper * {
  color: black !important;
}

.et_bloom_popup_container .et_bloom_close_button {
  top: 5px !important;
  right: -30px !important;
}

@media screen and (max-width: 767px) {
  .et_bloom_popup_container .et_bloom_close_button {
    top: 0px !important;
    right: -15px !important;
  }
}
.et_bloom_popup_container .et_bloom_form_text {
  margin-top: -10px !important;
}

.et_bloom_popup_container .et_bloom_form_header {
  padding: 0 !important;
  margin: 0 !important;
  /* border-radius: 10px 10px 0 0 !important; */
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0) 25%,
    rgb(255, 255, 255) 35%,
    rgb(255, 255, 255) 100%
  ) !important;
}

@media screen and (max-width: 767px) {
  .et_bloom_popup_container .et_bloom_form_header {
    background: linear-gradient(
      180deg,
      rgba(255, 255, 255, 0) 0%,
      rgba(255, 255, 255, 0) 20%,
      rgb(255, 255, 255) 30%,
      rgb(255, 255, 255) 100%
    ) !important;
  }
}

.et_bloom_popup_container .et_bloom .et_bloom_form_header h2 {
  font-weight: 800 !important;
  font-size: 30px !important;
}

.et_bloom_popup_container .et_bloom_form_header .et_bloom_form_text h2 {
  font-weight: 800 !important;
}

.et_bloom_popup_container .et_bloom_image {
  padding: 0 !important;
  margin: 0 !important;
}

.et_bloom_popup_container .et_bloom_form_content form,
.et_bloom_popup_container .et_bloom_form_footer {
  max-width: 450px;
  margin: 0 auto !important;
  display: block;
  padding: 5px !important;
}

.et_bloom_popup_container .et_bloom_form_footer {
  padding-bottom: 1rem !important;
}

.et_bloom_popup_container .et_bloom_form_footer p,
.et_bloom_popup_container .et_bloom_form_footer span {
  font-weight: 400 !important;
  font-size: 10px !important;
  line-height: 16px !important;
}

.et_bloom_popup_container .et_bloom_form_content {
  margin-bottom: 5% !important;
  /* border-radius: 0 0 10px 10px !important; */
}

.et_bloom_popup_container .et_bloom_fields input {
  border: 1px solid #ebebeb !important;
}

.et_bloom_popup_container .et_bloom_fields button {
  background: var(--purrple) !important;
  background-image: var(--colorfull1) !important;
}

/* section global animations */

/* Common hidden class */
.animated {
  opacity: 0;
  transition: opacity 1s ease-out, transform 1s ease-out;
}

/* Slide up animation */
.slide-up-hidden {
  transform: translateY(25%);
}

.slide-up-show {
  opacity: 1;
  transform: translateY(0);
}

/* Slide left animation */
.slide-left-hidden {
  transform: translateX(100%);
}

.slide-left-show {
  opacity: 1;
  transform: translateX(0);
}

/* Slide right animation */
.slide-right-hidden {
  transform: translateX(-100%);
}

.slide-right-show {
  opacity: 1;
  transform: translateX(0);
}

/* Fade in animation */
.fade-in-hidden {
  /* Only opacity change, no transform */
}

.fade-in-show {
  opacity: 1;
}
