/* ===================================================
   Bretzel Custom Stylesheet
   Author: Marco (because who else makes Bretzels this good?)
   Last Updated: 2025-05-08
   Description: Global custom styles for forms, layout, and tweaks

   ──────────────────────────────────────────────
   INDEX
   ──────────────────────────────────────────────
   1. Bretzel Emoji Utility Classes
   2. Contact Page Form (cf7-bretzel-contact-form)
   3. Buttons & Submit Styles
   4. Responsive Adjustments
   5. Checkbox Styling Fixes
   6. Utility: Spacing + Label/Input tweaks
   ──────────────────────────────────────────────
=================================================== */

/* =======================================
   🍞 Custom Menu Icons – Bretzel Navigation
   Scoped to <a class="ct-menu-link"> items only
   ======================================= */

/* =======================================
   🍞 Custom Menu Icons – Bretzel Navigation
   Works with Blocksy Mega Menu structure
   ======================================= */

/* Shared icon styling */
.menu-item[class*="icon-bretzel"] > a::before {
  margin-right: 0.4em;
  vertical-align: middle;
  font-size: 1em;
  display: inline-block;
}

/* Icon 1: 🏆 Bestseller / Featured */
.menu-item.icon-bretzel1 > a::before {
  content: "🏆";
}

/* Icon 2: 🏃 Fast-moving Product */
.menu-item.icon-bretzel2 > a::before {
  content: "🏃";
}

/* Icon 3: 🥨 Pretzels Category */
.menu-item.icon-bretzel3 > a::before {
  content: "🥨";
}

/* Icon 4: ⭐ Highlight / Customer Favorite */
.menu-item.icon-bretzel4 > a::before {
  content: "⭐";
}

/* Icon 5: 🍞 Bread Category */
.menu-item.icon-bretzel5 > a::before {
  content: "🍞";
}

/* Icon 6: 🎁 Gift / Promo Products */
.menu-item.icon-bretzel6 > a::before {
  content: "🎁";
}

/* Icon 7: 🏠 Shop & Info Hub (subheading or regular) */
.menu-item.icon-bretzel7 > a::before {
  content: "🏠";
  margin-right: 0.4em;
  vertical-align: middle;
  font-size: 1em;
}

/* Icon 8: 📈 Trending Now (top-level item) */
.menu-item.icon-bretzel8 > a::before {
  content: "📈";
  margin-right: 0.4em;
  vertical-align: middle;
  font-size: 1em;
}

/* Extra layout fix for top-level items like Trending Now */
.menu-item.icon-bretzel8 > a {
  display: inline-flex;
  align-items: center;
  gap: 0.3em;
}


/* Icon 9: 📦 Categories Label */
.menu-item.icon-bretzel9 > a::before {
  content: "📦";
}

/* Icon 10: ℹ️ Information Section */
.menu-item.icon-bretzel10 > a::before {
  content: "ℹ️";
}

/* Icon 11: 🌩️ Seasonal Products */
.menu-item.icon-bretzel11 > a::before {
  content: "🌩️";
}

/* Icon 12: 🧺 Markets */
.menu-item.icon-bretzel12 > a::before {
  content: "🧺";
}

/* Icon 13: 📅 Events */
.menu-item.icon-bretzel13 > a::before {
  content: "📅";
}

/* Icon 14: 📁 Categories */
.menu-item.icon-bretzel14 > a::before {
  content: "📁";
}

/* =======================================
   🎨 Bretzel Emoji Utility Classes
   Reusable across content and blocks
   
   Example:
   <span class="emoji-bread">Collect 999 Breadcrumbs!</span>
   <h3 class="emoji-trending">Trending Now</h3>
   <p class="emoji-info">Check out our latest info page</p>

   
   =======================================*/

.emoji-trophy::before    { content: "🏆"; }
.emoji-runner::before    { content: "🏃"; }
.emoji-pretzel::before   { content: "🥨"; }
.emoji-star::before      { content: "⭐"; }
.emoji-bread::before     { content: "🍞"; }
.emoji-gift::before      { content: "🎁"; }
.emoji-house::before     { content: "🏠"; }
.emoji-trending::before  { content: "📈"; }
.emoji-box::before       { content: "📦"; }
.emoji-info::before      { content: "ℹ️"; }
.emoji-seasonal::before  { content: "🌸"; }
.emoji-market::before    { content: "🧺"; }
.emoji-event::before     { content: "📅"; }


/*styling of the emojiis*/
.emoji-trophy::before,
.emoji-runner::before,
.emoji-pretzel::before,
.emoji-star::before,
.emoji-bread::before,
.emoji-gift::before,
.emoji-house::before,
.emoji-trending::before,
.emoji-box::before,
.emoji-info::before,
.emoji-seasonal::before,
.emoji-market::before,
.emoji-event::before {
  margin-right: 0.4em;
  vertical-align: middle;
}


/* =======================================
   🧁 Product Page Styling – Loyalty, Return, Wallet, Text
   ======================================= */

/* Breadcrumb Loyalty Points Message */
span.wlr-product-message {
  display: inline-block;
  background-color: #622005; /* Bretzel Brown */
  color: white;
  padding: 6px 12px;
  margin-bottom: 20px;
  border-radius: 6px;
  font-size: 0.95rem;
  font-weight: 600;
  line-height: 1.4;
}

/* Optional: bread emoji badge before text */
span.wlr-product-message::before {
  content: "🍞 ";
  margin-right: 4px;
  vertical-align: middle;
}


/* Return to Category Button on Product Page */
.back-to-category {
  margin-top: 20px;
  margin-bottom: 20px;
  padding: 20px;
  line-height: 20px;
  text-align: center;
  border-radius: 7px;
  background-color: #622005;
  color: white;
  /* Optional border style:
  border: 1px solid;
  border-color: #b2ff02; */
}

/* Link inside Return Button */
.product_meta .back-to-category a {
  color: #ffffff;
  text-transform: uppercase;
}


/* Square Digital Wallet (Apple Pay / Google Pay) */
#wc-square-digital-wallet {
  max-width: 99%;
  margin-bottom: 15px;
  margin-top: 15px;
}


/* Product Tab Description Typography */
.bretzel {
  font-size: 20px;
}
