/*
 Theme Name:   Wheatless Wonder
 Theme URI:    https://suska.co
 Description:  Child Theme of Hello Elementor
 Author:       Suska.Co
 Template:     hello-elementor
 Version:      1.0.0
 Text Domain:  hello-elementor-child
*/

/* ==== GLOBAL OVERRIDES ==== */

/* e.g. keep .price at theme default except on single-product pages */
.price { font-size: inherit; }

/* Main Menu Items */
.main-navigation ul.menu > li > a {
  font-family: 'Bree Serif', serif;
  font-weight: 400;
  font-size: 17px;
  color: #584d49;
}
/* Dropdown Menu Items */
.main-navigation ul.menu li ul.sub-menu a {
  font-family: 'Bree Serif', serif;
  font-weight: 400;
  font-size: 15px;
  background-color: #beaf9a;
  color: #584d49;
}
/* Dummy image style for recipes without images */
.cooked-recipe-card .cooked-recipe-image-empty {
    background-color: #F6E6B6;
    background-image: url('https://new.wheatlesswonder.com/wp-content/uploads/2020/08/logo.png');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 80px auto; /* adjust logo size */
    height: 250px; /* keep existing height */
    width: 100%;
}

/* === WooCommerce Notices Clean Layout === */

/* Contain notices inside Elementor container */
body.woocommerce .woocommerce-notices-wrapper {
  max-width: 1140px;   /* match your Elementor container width */
  margin: 20px auto;
  padding: 0 20px;
  box-sizing: border-box;
}

/* Notice box styling */
.woocommerce-message,
.woocommerce-error,
.woocommerce-info {
  position: relative;
  padding: 15px 20px 15px 2.5em; /* left padding for icon */
  margin: 20px auto;
  border-radius: 6px;
  box-sizing: border-box;
}

/* Icon spacing & alignment */
.woocommerce-message::before,
.woocommerce-error::before,
.woocommerce-info::before {
  position: absolute;
  left: 0.8em;
  top: 50%;
  transform: translateY(-50%);
  margin: 0;
}

/* Button alignment on desktop */
.woocommerce-message a.button,
.woocommerce-error a.button,
.woocommerce-info a.button {
  float: right;
  margin-left: 15px;
}

/* Mobile: button full width under text */
@media (max-width: 768px) {
  .woocommerce-message a.button,
  .woocommerce-error a.button,
  .woocommerce-info a.button {
    float: none !important;      /* stop floating right */
    display: block !important;   /* force block element */
    width: 100% !important;      /* span full width */
    margin: 12px 0 0 !important; /* spacing above */
    text-align: center !important;
  }

}