/* Navigation & CTA */
.navigation-actions {
  display: flex;
  align-items: center;
  gap: 30px;
  margin-left: auto;
}

.cta-button {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 20px;
  background-color: #bc3116;
  color: white;
  text-decoration: none;
  border-radius: 25px;
  font-weight: 700;
  font-size: 14px;
  border: none;
  outline: none;
  box-shadow: 0 2px 8px rgba(188, 49, 22, 0.3);
  transition: all 0.3s ease;
  white-space: nowrap;
  cursor: pointer !important;
  position: relative;
  z-index: 100;
  pointer-events: auto;
}

.cta-button:hover {
  background-color: #9a2812;
  color: white;
  text-decoration: none;
  box-shadow: 0 4px 12px rgba(188, 49, 22, 0.4);
  cursor: pointer !important;
}

.cta-button svg {
  width: 16px;
  height: 16px;
  color: white;
  flex-shrink: 0;
}

.cta-button span {
  color: white;
  font-weight: 700;
}

.cta-text-desktop {
  display: inline;
}

.cta-text-mobile {
  display: none;
}

.navigation-actions .site-header-cart,
.header-actions .site-header-cart {
  margin: 0;
  position: relative;
}

.site-header-cart .mini-count {
  position: absolute;
  top: -8px;
  right: -8px;
  background-color: #e74c3c;
  color: white;
  border-radius: 50%;
  min-width: 18px;
  height: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 600;
  line-height: 1;
  z-index: 10;
}

.main-header .header-actions {
  display: none;
}

@media (max-width: 992px) {
  .col-full-nav .navigation-actions {
    display: none;
  }

  .main-header .header-actions {
    display: flex;
    align-items: center;
    gap: 30px;
    position: absolute;
    right: 15px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;
  }

  .header-actions .cta-button {
    padding: 10px 16px;
    font-size: 13px;
    border-radius: 20px;
  }

  .header-actions .cta-button svg {
    width: 14px;
    height: 14px;
  }

  .header-actions .site-header-cart {
    position: static;
    right: auto;
    margin: 0;
  }

  .header-actions .site-header-cart .shoptimizer-cart {
    font-size: 24px; /* Same as desktop */
  }

  .header-actions .site-header-cart .shoptimizer-cart-icon {
    position: relative;
    top: -4px;
    right: -8px;
  }
}

@media (max-width: 768px) {
  .header-actions .cta-button {
    padding: 8px 14px;
    font-size: 12px;
    border-radius: 18px;
  }

  .header-actions .cta-button svg {
    width: 12px;
    height: 12px;
  }

  .cta-text-desktop {
    display: none;
  }

  .cta-text-mobile {
    display: inline;
  }

  .header-actions .site-header-cart .shoptimizer-cart {
    font-size: 24px; /* Same as desktop */
  }

  .header-actions .site-header-cart .shoptimizer-cart-icon {
    position: relative;
    top: -4px;
    right: -8px;
  }

  .main-header .site-branding button.menu-toggle {
    width: 30px; /* Reduced from 60px to half */
    height: 30px;
    left: 15px;
    position: absolute;
    z-index: 10;
  }

  .main-header .site-branding .custom-logo-link {
    position: absolute;
    left: 48px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 5;
  }

  .main-header .site-branding .custom-logo-link img {
    max-height: 30px;
    width: auto;
  }

  .main-header .site-branding {
    position: relative;
    width: 100%;
    height: 60px;
    display: block;
  }

  .main-header .header-actions {
    flex-direction: row;
    flex-wrap: nowrap;
  }

  .main-header {
    display: flex;
    align-items: center;
    position: relative;
    min-height: 60px;
  }

  .main-header .site-branding {
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: auto;
    height: auto;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    text-align: left;
  }
}

.main-header .site-header-cart {
  position: static !important;
  right: auto !important;
}

.site-header-cart:not(.navigation-actions .site-header-cart):not(.header-actions .site-header-cart) {
  display: none !important;
}

/* Global Font Style Fix for Footer and Sidecart - Text Elements Only */
footer .widget-title,
footer .widget h1,
footer .widget h2,
footer .widget h3,
footer .widget h4,
footer .widget h5,
footer .widget h6,
footer .widget p,
footer .widget span,
footer .widget a,
footer .widget li,
footer .widget ul,
footer .widget ol,
.shoptimizer-mini-cart-wrap .widget_shopping_cart .widget-title,
.shoptimizer-mini-cart-wrap .widget_shopping_cart h1,
.shoptimizer-mini-cart-wrap .widget_shopping_cart h2,
.shoptimizer-mini-cart-wrap .widget_shopping_cart h3,
.shoptimizer-mini-cart-wrap .widget_shopping_cart h4,
.shoptimizer-mini-cart-wrap .widget_shopping_cart h5,
.shoptimizer-mini-cart-wrap .widget_shopping_cart h6,
.shoptimizer-mini-cart-wrap .widget_shopping_cart p,
.shoptimizer-mini-cart-wrap .widget_shopping_cart span,
.shoptimizer-mini-cart-wrap .widget_shopping_cart a,
.shoptimizer-mini-cart-wrap .widget_shopping_cart li,
.shoptimizer-mini-cart-wrap .widget_shopping_cart ul,
.shoptimizer-mini-cart-wrap .widget_shopping_cart ol,
.shoptimizer-mini-cart-wrap .widget_shopping_cart .woocommerce-mini-cart__total,
.shoptimizer-mini-cart-wrap .widget_shopping_cart .woocommerce-mini-cart__buttons,
.shoptimizer-mini-cart-wrap .widget_shopping_cart .woocommerce-mini-cart__shipping-notice {
  font-style: normal !important;
}

/* Override specific italic styles that should remain normal */
.shoptimizer-mini-cart-wrap .widget_shopping_cart .woocommerce-mini-cart__shipping-notice {
  font-style: normal !important;
}

/* Navigation Underline Styles - Global */
.menu-primary-menu-container > ul > li.current-menu-item > a span:before,
.menu-primary-menu-container > ul > li.current-menu-ancestor > a span:before,
.menu-primary-menu-container > ul > li.current_page_item > a span:before,
.menu-primary-menu-container > ul > li.current_page_ancestor > a span:before {
  transform: scale(1, 1) !important;
  transform-origin: left center !important;
  border-bottom: 2px solid #bc3116 !important;
}

.menu-primary-menu-container > ul > li > a span:before,
.menu-primary-menu-container > ul > li.nolink > span:before {
  border-bottom: 2px solid #bc3116 !important;
}

.menu-primary-menu-container > ul > li > a,
.menu-primary-menu-container > ul > li.nolink > span {
  text-transform: uppercase !important;
}

@media (min-width: 769px) and (max-width: 1024px) {
  body.mobile-toggled .main-navigation li,
  body.mobile-toggled .main-navigation li a,
  body.mobile-toggled .main-navigation li *:not(.zg-mega-menu):not(.zg-mega-menu *) {
    font-size: 14px !important;
    line-height: 1.4 !important;
  }

  body.mobile-toggled .main-navigation li::after,
  body.mobile-toggled .main-navigation li a::after,
  body.mobile-toggled .main-navigation li::before,
  body.mobile-toggled .main-navigation li a::before {
    display: none !important;
    content: none !important;
  }

  body.mobile-toggled .main-navigation li.current-menu-item,
  body.mobile-toggled .main-navigation li.current_page_item,
  body.mobile-toggled .main-navigation li.active {
    background-color: #bc3116 !important; /* Brand color */
    color: white !important;
  }

  body.mobile-toggled .main-navigation li.current-menu-item a,
  body.mobile-toggled .main-navigation li.current_page_item a,
  body.mobile-toggled .main-navigation li.active a {
    color: white !important;
    background-color: transparent !important;
  }

  body.mobile-toggled .main-navigation li.current-menu-item:hover,
  body.mobile-toggled .main-navigation li.current_page_item:hover,
  body.mobile-toggled .main-navigation li.active:hover {
    background-color: #9a2812 !important; /* Darker brand color on hover */
  }
}

@media (max-width: 768px) {
  body.mobile-toggled .main-navigation li,
  body.mobile-toggled .main-navigation li a,
  body.mobile-toggled .main-navigation li *:not(.zg-mega-menu):not(.zg-mega-menu *) {
    font-size: 12px !important;
    line-height: 1.4 !important;
  }

  body.mobile-toggled .main-navigation li::after,
  body.mobile-toggled .main-navigation li a::after,
  body.mobile-toggled .main-navigation li::before,
  body.mobile-toggled .main-navigation li a::before {
    display: none !important;
    content: none !important;
  }

  body.mobile-toggled .main-navigation li.current-menu-item,
  body.mobile-toggled .main-navigation li.current_page_item,
  body.mobile-toggled .main-navigation li.active {
    background-color: #bc3116 !important; /* Brand color */
    color: white !important;
  }

  body.mobile-toggled .main-navigation li.current-menu-item a,
  body.mobile-toggled .main-navigation li.current_page_item a,
  body.mobile-toggled .main-navigation li.active a {
    color: white !important;
    background-color: transparent !important;
  }

  body.mobile-toggled .main-navigation li.current-menu-item:hover,
  body.mobile-toggled .main-navigation li.current_page_item:hover,
  body.mobile-toggled .main-navigation li.active:hover {
    background-color: #9a2812 !important; /* Darker brand color on hover */
  }
}

/* Facebook Group CTA Widget */
.facebook-group-cta-widget-content {
  background: #fff;
  border: 1px solid #e1e5e9;
  border-radius: 16px;
  overflow: hidden;
}

.facebook-group-cta-image {
  width: 100%;
  height: 200px;
  overflow: hidden;
  border-radius: 16px 16px 0 0;
}

.facebook-group-cta-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.facebook-group-cta-text {
  padding: 20px;
  text-align: center;
}

.facebook-group-cta-title {
  font-size: 24px;
  font-weight: 700;
  color: #333;
  margin: 0 0 12px 0;
  line-height: 1.3;
}

.facebook-group-cta-description {
  font-size: 14px;
  color: #666;
  line-height: 1.5;
  margin: 0 0 20px 0;
}

.facebook-group-cta-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  background: #bc3116;
  color: #fff;
  text-decoration: none;
  padding: 12px 24px;
  border-radius: 6px;
  font-weight: 600;
  font-size: 14px;
  border: none;
  cursor: pointer;
  min-width: 140px;
}

.facebook-group-cta-button:hover {
  color: #fff !important;
  text-decoration: none;
}

.facebook-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  background: #bc3116;
  color: #fff;
  border-radius: 50%;
  flex-shrink: 0;
}

.facebook-icon svg {
  fill: #fff;
  width: 12px;
  height: 12px;
}

.button-text {
  font-weight: 600;
}

@media (max-width: 768px) {
  .facebook-group-cta-text {
    padding: 16px;
  }

  .facebook-group-cta-title {
    font-size: 18px;
  }

  .facebook-group-cta-description {
    font-size: 13px;
  }

  .facebook-group-cta-button {
    padding: 10px 20px;
    font-size: 13px;
    min-width: 120px;
  }

  .facebook-group-cta-image {
    height: 160px;
  }
}

@media (max-width: 480px) {
  .facebook-group-cta-text {
    padding: 14px;
  }

  .facebook-group-cta-title {
    font-size: 16px;
  }

  .facebook-group-cta-description {
    font-size: 12px;
  }

  .facebook-group-cta-button {
    padding: 8px 16px;
    font-size: 12px;
    min-width: 100px;
  }

  .facebook-group-cta-image {
    height: 140px;
  }
}

.widget-area .facebook-group-cta-widget-content {
  margin-bottom: 20px;
}

#secondary .facebook-group-cta-widget-content {
  margin-bottom: 30px;
}

.footer-widgets .facebook-group-cta-widget-content {
  margin-bottom: 25px;
}

.widget.facebook-group-cta-widget {
  margin-bottom: 0;
}

footer.site-footer .widget .widget-title,
footer.site-footer .widget.widget_block h2,
footer .widget .widget-title,
footer .widget h2 {
  color: #fff !important;
}

.single-post footer.site-footer .widget .widget-title,
.single-post footer.site-footer .widget.widget_block h2,
.single-post footer .widget .widget-title,
.single-post footer .widget h2,
.blog footer.site-footer .widget .widget-title,
.blog footer.site-footer .widget.widget_block h2,
.blog footer .widget .widget-title,
.blog footer .widget h2 {
  color: #fff !important;
}

/* Elementor Clickable Elements */
.elementor-section[link],
.elementor-column[link] > .elementor-widget-wrap,
.e-con[link],
.e-container[link] {
  cursor: pointer !important;
  transition: opacity 0.2s ease;
}

.elementor-section[link]:hover,
.elementor-column[link] > .elementor-widget-wrap:hover,
.e-con[link]:hover,
.e-container[link]:hover {
  opacity: 0.9;
}
