/** Shopify CDN: Minification failed

Line 47:0 All "@import" rules must come first

**/
/* ==========================================================================
   NaturaRevives - Modern Improvements
   ========================================================================== */

/* Typography Improvements */
:root {
  /* Brand Colors - Refined Palette */
  --color-brand-primary: #0E7A57;
  --color-brand-secondary: #16A085;
  --color-brand-light: #9FD9C7;
  --color-brand-lighter: #E8F8F5;
  --color-brand-lightest: #F8FFFE;

  /* Neutral Colors */
  --color-text-primary: #1A1A1A;
  --color-text-secondary: #525252;
  --color-text-muted: #737373;
  --color-bg-primary: #FAFAF9;
  --color-bg-secondary: #FFFFFF;
  --color-border: #ECECEC;

  /* Spacing */
  --spacing-section: 100px;
  --spacing-section-mobile: 60px;
  --spacing-element: 40px;
  --spacing-element-mobile: 24px;

  /* Border Radius - More Modern */
  --radius-small: 8px;
  --radius-medium: 12px;
  --radius-large: 16px;
  --radius-xlarge: 20px;

  /* Shadows - Subtle and Modern */
  --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.06);
  --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.08);
  --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.1);
  --shadow-xl: 0 12px 32px rgba(0, 0, 0, 0.12);
}

/* Typography - Load Inter font for body text */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Poppins:wght@600;700&display=swap');

body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
  color: var(--color-text-primary);
  font-size: 16px;
  line-height: 1.6;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  font-family: 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif !important;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--color-text-primary);
}

/* Improved Button Styles */
.button,
.shopify-payment-button__button,
button[type="submit"],
input[type="submit"],
.product-form__submit {
  border-radius: 10px !important;
  padding: 14px 32px !important;
  font-weight: 600 !important;
  font-size: 15px !important;
  transition: all 0.3s ease !important;
  box-shadow: 0 4px 12px rgba(14, 122, 87, 0.2) !important;
  border: none !important;
  outline: none !important;
  text-decoration: none !important;
}

/* Remove any inner borders or outlines that create lines */
.button::before,
.button::after,
.product-form__submit::before,
.product-form__submit::after,
button::before,
button::after {
  display: none !important;
}

/* Fix double border effect on buttons */
.button,
button[type="submit"],
.product-form__submit {
  box-sizing: border-box !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  appearance: none !important;
}

.button:hover,
.product-form__submit:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 6px 20px rgba(14, 122, 87, 0.3) !important;
  outline: none !important;
}

.button:focus,
.product-form__submit:focus {
  outline: 3px solid rgba(14, 122, 87, 0.3) !important;
  outline-offset: 2px !important;
}

.button--secondary {
  background: white !important;
  color: var(--color-brand-primary) !important;
  border: 2px solid var(--color-brand-primary) !important;
  box-shadow: none !important;
}

.button--secondary:hover {
  background: var(--color-brand-lightest) !important;
}

/* Improved Card Styles */
.card,
.product-card,
.article-card,
.collection-card {
  border-radius: var(--radius-large) !important;
  overflow: hidden;
  box-shadow: var(--shadow-md) !important;
  transition: all 0.3s ease !important;
  border: 1px solid var(--color-border) !important;
}

.card:hover,
.product-card:hover {
  transform: translateY(-4px) !important;
  box-shadow: var(--shadow-lg) !important;
}

/* Section Spacing Improvements */
.section {
  padding-top: var(--spacing-section) !important;
  padding-bottom: var(--spacing-section) !important;
}

@media (max-width: 749px) {
  .section {
    padding-top: var(--spacing-section-mobile) !important;
    padding-bottom: var(--spacing-section-mobile) !important;
  }
}

/* Background Color Improvements */
.color-scheme-1 {
  background-color: var(--color-bg-secondary) !important;
}

.color-scheme-2 {
  background-color: var(--color-bg-primary) !important;
}

.gradient-background {
  background: linear-gradient(135deg, #F8FFFE 0%, #FFFFFF 100%);
}

/* Improved Form Inputs */
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="number"],
input[type="password"],
textarea,
select {
  border-radius: var(--radius-medium) !important;
  border: 1px solid var(--color-border) !important;
  padding: 12px 16px !important;
  font-size: 15px !important;
  transition: all 0.2s ease !important;
  font-family: 'Inter', sans-serif !important;
  outline: none !important;
  box-shadow: none !important;
}

/* Remove any inner borders from inputs */
input[type="text"]::before,
input[type="text"]::after,
input[type="email"]::before,
input[type="email"]::after {
  display: none !important;
}

input:focus,
textarea:focus,
select:focus {
  border-color: var(--color-brand-primary) !important;
  box-shadow: 0 0 0 3px rgba(14, 122, 87, 0.1) !important;
  outline: none !important;
}

/* Product Page Improvements */
.product__info-container {
  background: var(--color-bg-primary);
  padding: 32px;
  border-radius: var(--radius-large);
}

.product__title {
  font-size: 32px;
  margin-bottom: 16px;
}

.price {
  font-size: 28px;
  font-weight: 700;
  color: var(--color-brand-primary);
}

.price--on-sale .price-item--sale {
  color: #E74C3C;
}

/* Badge Improvements */
.badge {
  border-radius: 20px !important;
  padding: 6px 14px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: 0.3px !important;
}

/* Cart Drawer Improvements */
.drawer {
  border-radius: var(--radius-xlarge) 0 0 var(--radius-xlarge) !important;
}

.cart-item {
  border-radius: var(--radius-medium);
  padding: 16px;
  margin-bottom: 12px;
  background: var(--color-bg-primary);
}

/* Announcement Bar */
.announcement-bar {
  font-weight: 500;
  padding: 12px 20px;
}

/* Header Improvements */
.header {
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}

/* Footer Improvements - Keep original scheme colors */
.footer {
  /* Don't force background - let color scheme handle it */
}

/* Ensure footer with scheme-2 keeps its light background */
.footer.color-scheme-2,
footer.color-scheme-2,
section.footer.color-scheme-2 {
  /* Let it use the scheme-2 settings naturally */
}

.footer a {
  /* Let the color scheme handle link colors */
  transition: color 0.2s ease;
}

.footer a:hover {
  /* Let the color scheme handle hover colors */
  opacity: 0.8;
}

/* Fix: Ensure footer columns don't have white backgrounds covering social icons */
.footer__column--info,
.footer__column--info::before,
.footer__column--info::after {
  background: transparent !important;
  display: block !important;
}

.footer__payment,
.footer__payment::before,
.footer__payment::after {
  background: transparent !important;
  margin-bottom: 24px !important;
}

/* Center payment icons */
.footer__payment {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
}

.list-payment {
  justify-content: center !important;
}

.footer__content-bottom,
.footer__content-bottom::before,
.footer__content-bottom::after,
.footer__content-bottom-wrapper,
.footer__content-bottom-wrapper::before,
.footer__content-bottom-wrapper::after {
  background: transparent !important;
}

/* Ensure social icons are visible */
.footer__list-social,
.list-social,
.footer__list-social::before,
.footer__list-social::after,
.list-social::before,
.list-social::after {
  background: transparent !important;
  z-index: 10 !important;
  position: relative !important;
}

/* Make social icons more visible */
.list-social__item {
  z-index: 10 !important;
  position: relative !important;
  background: transparent !important;
}

.list-social__link {
  opacity: 1 !important;
  z-index: 10 !important;
  position: relative !important;
  background: transparent !important;
}

.list-social__link .svg-wrapper,
.list-social__link .icon,
.list-social__link svg {
  opacity: 1 !important;
  z-index: 10 !important;
  position: relative !important;
  background: transparent !important;
}

.list-social__link:hover .icon,
.list-social__link:hover svg {
  opacity: 0.7 !important;
}

/* Social icons use text color for proper contrast */
.footer .list-social__link {
  /* Let it use the color scheme's text color */
}

.footer .list-social__link .icon,
.footer .list-social__link svg {
  /* Icons will use currentColor (text color) */
}

/* Remove any isolate that might be creating stacking context issues */
.footer__column.isolate {
  isolation: auto !important;
}

/* Let gradient and color schemes use their natural colors */
.footer .gradient,
.footer .color-scheme-1,
.footer .color-scheme-2 {
  /* Use natural color scheme settings */
}

/* Ensure the footer-block-newsletter wrapper is transparent */
.footer-block--newsletter,
.footer-block__newsletter {
  background: transparent !important;
}

/* Newsletter section should have light background (it's before footer) */
section.newsletter,
.newsletter.color-scheme-2 {
  /* Keep newsletter section with light background - it's separate from footer */
  background: #E8F8F5 !important;
}

/* Specific fix for social icons in footer bottom */
.footer__content-bottom .footer__list-social,
.footer__content-bottom .list-social {
  z-index: 999 !important;
  position: relative !important;
}

.footer__content-bottom .list-social__item,
.footer__content-bottom .list-social__link {
  z-index: 999 !important;
}

/* Ensure the parent containers don't have backgrounds */
.footer__column--info,
.footer__content-bottom,
.footer__content-bottom-wrapper {
  background-color: transparent !important;
  background-image: none !important;
}

/* Target specifically where social icons appear */
.footer-block--newsletter,
.footer-block__newsletter,
.footer__blocks-wrapper {
  background: transparent !important;
  background-image: none !important;
}

/* Force all footer column elements to be transparent except footer itself */
.footer__column,
.footer__blocks,
.footer-block {
  background: transparent !important;
  background-image: none !important;
}

/* CRITICAL FIX: Force ALL footer child elements to have dark/transparent background */
.footer > *,
.footer section,
.footer div:not(.list-social):not(.list-social__item) {
  background-color: transparent !important;
  background-image: none !important;
}

/* Let sections use their natural backgrounds */
.footer > section,
.footer .section {
  /* Use color scheme backgrounds */
}

/* Let SVG icons use their natural colors from the color scheme */
.footer svg,
.footer .icon {
  /* Icons will use color from color scheme */
  opacity: 1 !important;
}

/* Social icon SVGs should use text color */
.list-social__link svg,
.list-social__link .icon,
.footer__list-social svg,
.footer__list-social .icon {
  fill: currentColor !important;
  color: currentColor !important;
  opacity: 1 !important;
}

/* Payment icons use their natural colors */
.list-payment svg,
.list-payment .icon {
  /* Keep payment icon colors as-is */
}

/* Trust Badges Styling */
.trust-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
  justify-content: center;
  padding: 32px 0;
}

.trust-badge {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  padding: 20px;
  background: white;
  border-radius: var(--radius-medium);
  box-shadow: var(--shadow-sm);
  min-width: 140px;
  text-align: center;
  transition: all 0.3s ease;
}

.trust-badge:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-md);
}

.trust-badge svg {
  width: 40px;
  height: 40px;
  color: var(--color-brand-primary);
}

.trust-badge-text {
  font-size: 14px;
  font-weight: 600;
  color: var(--color-text-primary);
}

/* Newsletter Section */
.newsletter-form__field-wrapper {
  display: flex;
  gap: 12px;
  max-width: 500px;
  margin: 0 auto;
}

.newsletter-form input,
.newsletter-form .field input {
  flex: 1;
  border-radius: var(--radius-medium) !important;
  box-shadow: none !important;
  outline: none !important;
}

.newsletter-form button,
.newsletter-form__button {
  border-radius: var(--radius-medium) !important;
  padding: 12px 24px !important;
  box-shadow: none !important;
  outline: none !important;
  border: none !important;
}

/* Remove pseudo-elements from newsletter fields and ALL fields */
.field::before,
.field::after,
.newsletter-form .field::before,
.newsletter-form .field::after,
.field__input-wrapper::before,
.field__input-wrapper::after {
  display: none !important;
  content: none !important;
}

/* Force remove any inner borders on field elements */
.field,
.field__input,
.field__input-wrapper {
  border: none !important;
  box-shadow: none !important;
}

.field input {
  box-sizing: border-box !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  appearance: none !important;
}

/* Testimonials Improvements */
.testimonial-card {
  background: white;
  border-radius: var(--radius-large);
  padding: 32px;
  box-shadow: var(--shadow-md);
  height: 100%;
}

.testimonial-stars {
  color: #F39C12;
  font-size: 18px;
  margin-bottom: 16px;
}

.testimonial-text {
  font-size: 15px;
  line-height: 1.7;
  color: var(--color-text-secondary);
  margin-bottom: 20px;
}

.testimonial-author {
  font-weight: 600;
  color: var(--color-text-primary);
}

/* Responsive Improvements */
@media (max-width: 749px) {
  .product__title {
    font-size: 24px;
  }

  .price {
    font-size: 24px;
  }

  .button,
  .product-form__submit {
    width: 100%;
    padding: 16px 24px !important;
  }
}

/* Accessibility Improvements */
:focus-visible {
  outline: 3px solid var(--color-brand-primary);
  outline-offset: 2px;
}

/* Loading States */
.loading {
  opacity: 0.6;
  pointer-events: none;
}

/* Animations */
@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.animate-fade-in-up {
  animation: fadeInUp 0.6s ease;
}

/* Print Styles */
@media print {
  .header,
  .footer,
  .announcement-bar,
  .sticky-mobile-bar {
    display: none !important;
  }
}
