/** Shopify CDN: Minification failed

Line 16:0 Unexpected "{"
Line 16:1 Expected identifier but found "%"
Line 17:41 Unexpected "09"
Line 19:1 Expected identifier but found "%"
Line 21:0 Unexpected "{"
Line 21:1 Unexpected "{"
Line 21:3 Expected identifier but found "'labubu-sales-page-09-09.css'"
Line 23:0 Unexpected "{"
Line 23:1 Expected identifier but found "%"
Line 23:23 Expected identifier but found whitespace
... and 994 more hidden warnings

**/
{% comment %}
  Professional Labubu Sales Page Section 09-09
  Conversion-optimized sales page for Labubu Amigurumi Crochet Pattern
{% endcomment %}

{{ 'labubu-sales-page-09-09.css' | asset_url | stylesheet_tag }}

{% comment %} CRITICAL: Only load settings AND JavaScript if popups are enabled {% endcomment %}
{% if section.settings.enable_popups %}
  <script>
  // Pass section settings to JavaScript
  window.labubuSectionSettings = {
    exit_intent_title: {{ section.settings.exit_intent_title | default: "Wait! Don't miss this amazing offer! 🎁" | json }},
    exit_intent_description: {{ section.settings.exit_intent_description | default: "Get an extra 10% discount with code: SAVE10" | json }},
    exit_intent_button: {{ section.settings.exit_intent_button | default: "Get Discount Now!" | json }},
    sticky_bar_text: {{ section.settings.sticky_bar_text | default: "🔥 Limited Time: Only $7.99 instead of $14.99" | json }},
    sticky_bar_button: {{ section.settings.sticky_bar_button | default: "Order Now!" | json }},
    discount_code_text: {% if section.settings.discount_code_text %}{{ section.settings.discount_code_text | json }}{% else %}"🎉 Use code [code] and get [percentage]% extra discount!"{% endif %},
    urgency_notification_icon: {{ section.settings.urgency_notification_icon | default: "⏰" | json }},
    // JavaScript Feature Controls
    enable_popups: {{ section.settings.enable_popups | json }},
    enable_sticky_bar: {{ section.settings.enable_sticky_bar | json }},
    enable_exit_intent: {{ section.settings.enable_exit_intent | json }},
    enable_discount_banner: {{ section.settings.enable_discount_banner | json }},
    enable_urgency_notifications: {{ section.settings.enable_urgency_notifications | json }}
  };
  console.log('✅ POPUPS ENABLED - Loading settings and JavaScript:', window.labubuSectionSettings);
  </script>
  {{ 'labubu-sales-page-09-09.js' | asset_url | script_tag }}
{% else %}
  <script>
  console.log('❌ POPUPS DISABLED - No settings or JavaScript loaded');
  // Ensure no settings are available
  window.labubuSectionSettings = null;
  </script>
{% endif %}

<style>
  /* Global fixes for horizontal scroll prevention */
  html {
    overflow-x: hidden;
    /* Ensure smooth scrolling */
    scroll-behavior: smooth;
  }
  
  /* Ensure viewport is properly set */
  * {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
  }

  /* Force all elements to respect viewport width */
  #labubu-sales-{{ section.id }} *,
  #labubu-sales-{{ section.id }} *:before,
  #labubu-sales-{{ section.id }} *:after {
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  /* Special handling for images and media */
  #labubu-sales-{{ section.id }} img,
  #labubu-sales-{{ section.id }} video,
  #labubu-sales-{{ section.id }} canvas,
  #labubu-sales-{{ section.id }} svg {
    max-width: 100% !important;
    width: auto !important;
    height: auto !important;
  }
  
  #labubu-sales-{{ section.id }} {
    /* Prevent horizontal scroll */
    max-width: 100%;
    overflow-x: hidden;
    
    /* Design Variables */
    --primary-color: {{ section.settings.primary_color | default: '#ff6b9d' }};
    --secondary-color: {{ section.settings.secondary_color | default: '#4ecdc4' }};
    --accent-color: {{ section.settings.accent_color | default: '#ffd93d' }};
    --success-color: {{ section.settings.success_color | default: '#6bcf7f' }};
    --warning-color: {{ section.settings.warning_color | default: '#ffb347' }};
    --text-color: {{ section.settings.text_color | default: '#2c3e50' }};
    --light-bg: {{ section.settings.light_bg | default: '#fdf4f5' }};
    --container-width: {{ section.settings.container_width | default: 1200 }}px;
    --border-radius: {{ section.settings.border_radius | default: 15 }}px;
    
    /* Typography Variables */
    {% if section.settings.heading_font %}
      --heading-font: {{ section.settings.heading_font.family }}, {{ section.settings.heading_font.fallback_families }};
    {% endif %}
    {% if section.settings.body_font %}
      --body-font: {{ section.settings.body_font.family }}, {{ section.settings.body_font.fallback_families }};
    {% endif %}
  }

  #labubu-sales-{{ section.id }} {
    background: linear-gradient(135deg, var(--light-bg) 0%, #fff 100%);
    color: var(--text-color);
    font-family: var(--body-font);
    line-height: 1.6;
    /* Ensure proper containment */
    width: 100%;
    box-sizing: border-box;
    /* Prevent any content from causing horizontal scroll */
    overflow-x: hidden;
  }

  #labubu-sales-{{ section.id }} * {
    box-sizing: border-box;
    max-width: 100%;
  }

  /* Prevent all images from causing horizontal scroll */
  #labubu-sales-{{ section.id }} img {
    max-width: 100%;
    height: auto;
    display: block;
  }

  /* Ensure all containers are properly contained */
  #labubu-sales-{{ section.id }} .row,
  #labubu-sales-{{ section.id }} .col,
  #labubu-sales-{{ section.id }} .grid,
  #labubu-sales-{{ section.id }} .flex {
    max-width: 100%;
    box-sizing: border-box;
  }

  /* Prevent wide elements from causing horizontal scroll */
  #labubu-sales-{{ section.id }} table {
    width: 100%;
    table-layout: fixed;
  }

  #labubu-sales-{{ section.id }} pre,
  #labubu-sales-{{ section.id }} code {
    white-space: pre-wrap;
    word-wrap: break-word;
    max-width: 100%;
  }

  #labubu-sales-{{ section.id }} .container {
    max-width: min(var(--container-width), 100vw);
    margin: 0 auto;
    padding: 0 20px;
    width: 100%;
    box-sizing: border-box;
  }

  /* Responsive container padding */
  @media (max-width: 768px) {
    #labubu-sales-{{ section.id }} .container {
      padding: 0 15px;
    }
  }

  @media (max-width: 480px) {
    #labubu-sales-{{ section.id }} .container {
      padding: 0 10px;
    }
  }

  /* Responsive grid adjustments to prevent horizontal scroll */
  @media (max-width: 1024px) {
    #labubu-sales-{{ section.id }} .benefits-grid {
      grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
      gap: 30px;
    }
    
    #labubu-sales-{{ section.id }} .testimonials-grid {
      grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr));
      gap: 25px;
    }
  }

  @media (max-width: 768px) {
    #labubu-sales-{{ section.id }} .benefits-grid,
    #labubu-sales-{{ section.id }} .testimonials-grid {
      grid-template-columns: 1fr;
      gap: 20px;
    }
  }

  /* Hero Section */
  #labubu-sales-{{ section.id }} .hero-section {
    padding: 60px 0;
    text-align: center;
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--secondary-color) 100%);
    color: white;
    position: relative;
    overflow: hidden;
  }

  #labubu-sales-{{ section.id }} .hero-section::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 20"><defs><pattern id="hearts" x="0" y="0" width="20" height="20" patternUnits="userSpaceOnUse"><text x="10" y="15" text-anchor="middle" font-size="12" fill="rgba(255,255,255,0.1)">♥</text></pattern></defs><rect width="100" height="20" fill="url(%23hearts)"/></svg>') repeat;
    opacity: 0.3;
  }

  #labubu-sales-{{ section.id }} .hero-content {
    position: relative;
    z-index: 2;
  }

  #labubu-sales-{{ section.id }} .hero-badge {
    display: inline-block;
    background: var(--accent-color);
    color: var(--text-color);
    padding: 12px 24px;
    border-radius: 25px;
    font-weight: 700;
    font-size: 14px;
    margin-bottom: 20px;
    animation: pulse 2s infinite;
  }

  #labubu-sales-{{ section.id }} .hero-title {
    font-size: 56px;
    font-weight: 900;
    margin-bottom: 20px;
    font-family: var(--heading-font);
    text-shadow: 2px 2px 4px rgba(0,0,0,0.1);
  }

  #labubu-sales-{{ section.id }} .hero-subtitle {
    font-size: 24px;
    margin-bottom: 30px;
    opacity: 0.9;
  }

  #labubu-sales-{{ section.id }} .price-container {
    margin: 40px 0;
  }

  #labubu-sales-{{ section.id }} .original-price {
    font-size: 28px;
    text-decoration: line-through;
    opacity: 0.7;
    margin-right: 15px;
  }

  #labubu-sales-{{ section.id }} .sale-price {
    font-size: 48px;
    font-weight: 900;
    color: var(--accent-color);
    text-shadow: 2px 2px 4px rgba(0,0,0,0.2);
  }

  #labubu-sales-{{ section.id }} .savings-badge {
    display: inline-block;
    background: var(--success-color);
    color: white;
    padding: 8px 16px;
    border-radius: 20px;
    font-weight: 700;
    margin-left: 15px;
    animation: bounce 1s infinite;
  }

  /* Product Showcase */
  #labubu-sales-{{ section.id }} .product-showcase {
    padding: 60px 0;
    background: white;
  }

  #labubu-sales-{{ section.id }} .showcase-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
  }

  #labubu-sales-{{ section.id }} .product-images {
    position: relative;
  }

  #labubu-sales-{{ section.id }} .main-image {
    /* Desktop Settings */
    height: {{ section.settings.image_height_desktop | default: section.settings.image_height | default: 400 }}px;
    max-width: {{ section.settings.image_max_width_desktop | default: section.settings.image_max_width | default: 100 }}%;
    width: 100%;
    border-radius: {{ section.settings.image_border_radius_desktop | default: section.settings.image_border_radius | default: 15 }}px;
    object-fit: {{ section.settings.image_object_fit_desktop | default: section.settings.image_object_fit | default: 'cover' }};
    {% if section.settings.image_shadow %}
    box-shadow: 0 20px 60px rgba(0,0,0,0.1);
    {% endif %}
    transition: transform 0.3s ease;
    display: block;
    margin: 0 auto;
    /* Prevent overflow */
    box-sizing: border-box;
  }

  /* Mobile Responsive Settings */
  @media (max-width: 768px) {
    #labubu-sales-{{ section.id }} .main-image {
      height: {{ section.settings.image_height_mobile | default: section.settings.image_height_desktop | default: section.settings.image_height | default: 300 }}px;
      max-width: {{ section.settings.image_max_width_mobile | default: section.settings.image_max_width_desktop | default: section.settings.image_max_width | default: 100 }}%;
      border-radius: {{ section.settings.image_border_radius_mobile | default: section.settings.image_border_radius_desktop | default: section.settings.image_border_radius | default: 10 }}px;
      object-fit: {{ section.settings.image_object_fit_mobile | default: section.settings.image_object_fit_desktop | default: section.settings.image_object_fit | default: 'cover' }};
    }
  }

  #labubu-sales-{{ section.id }} .main-image:hover {
    transform: scale(1.05);
  }

  #labubu-sales-{{ section.id }} .image-badge {
    position: absolute;
    top: 20px;
    right: 20px;
    background: var(--warning-color);
    color: white;
    padding: 10px 15px;
    border-radius: 25px;
    font-weight: 700;
    font-size: 14px;
  }

  #labubu-sales-{{ section.id }} .product-details h2 {
    font-size: 42px;
    font-weight: 800;
    margin-bottom: 25px;
    color: var(--primary-color);
    font-family: var(--heading-font);
  }

  #labubu-sales-{{ section.id }} .product-description {
    font-size: 18px;
    margin-bottom: 30px;
    line-height: 1.8;
  }

  #labubu-sales-{{ section.id }} .feature-list {
    list-style: none;
    padding: 0;
    margin: 30px 0;
  }

  #labubu-sales-{{ section.id }} .feature-list li {
    display: flex;
    align-items: center;
    margin-bottom: 15px;
    font-size: 16px;
  }

  #labubu-sales-{{ section.id }} .feature-list li::before {
    content: '✨';
    font-size: 20px;
    margin-right: 12px;
    flex-shrink: 0;
  }

  /* Benefits Section */
  #labubu-sales-{{ section.id }} .benefits-section {
    padding: 50px 0;
    background: var(--light-bg);
  }

  #labubu-sales-{{ section.id }} .section-title {
    text-align: center;
    font-size: 42px;
    font-weight: 800;
    margin-bottom: 60px;
    color: var(--text-color);
    font-family: var(--heading-font);
  }

  #labubu-sales-{{ section.id }} .benefits-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr));
    gap: 40px;
  }

  #labubu-sales-{{ section.id }} .benefit-card {
    background: white;
    padding: 40px 30px;
    border-radius: var(--border-radius);
    text-align: center;
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
    transition: transform 0.3s ease;
  }

  #labubu-sales-{{ section.id }} .benefit-card:hover {
    transform: translateY(-10px);
  }

  #labubu-sales-{{ section.id }} .benefit-icon {
    font-size: 48px;
    margin-bottom: 20px;
    display: block;
  }

  #labubu-sales-{{ section.id }} .benefit-title {
    font-size: 24px;
    font-weight: 700;
    margin-bottom: 15px;
    color: var(--primary-color);
  }

  #labubu-sales-{{ section.id }} .benefit-description {
    font-size: 16px;
    opacity: 0.8;
  }

  /* Social Proof */
  #labubu-sales-{{ section.id }} .social-proof {
    padding: 50px 0;
    background: white;
    text-align: center;
  }

  #labubu-sales-{{ section.id }} .testimonials-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr));
    gap: 30px;
    margin-top: 50px;
  }

  #labubu-sales-{{ section.id }} .testimonial-card {
    background: var(--light-bg);
    padding: 30px;
    border-radius: var(--border-radius);
    position: relative;
  }

  #labubu-sales-{{ section.id }} .testimonial-text {
    font-style: italic;
    font-size: 16px;
    margin-bottom: 20px;
    line-height: 1.7;
  }

  #labubu-sales-{{ section.id }} .testimonial-author {
    font-weight: 700;
    color: var(--primary-color);
  }

  #labubu-sales-{{ section.id }} .quote-icon {
    position: absolute;
    top: 15px;
    left: 20px;
    font-size: 48px;
    color: var(--primary-color);
    opacity: 0.3;
  }

  /* Urgency Section */
  #labubu-sales-{{ section.id }} .urgency-section {
    padding: 60px 0;
    background: linear-gradient(135deg, {{ section.settings.urgency_bg_color_1 | default: '#ffb347' }} 0%, {{ section.settings.urgency_bg_color_2 | default: '#ff6b9d' }} 100%);
    color: {{ section.settings.urgency_text_color | default: '#ffffff' }};
    text-align: center;
    {% case section.settings.urgency_position %}
      {% when 'fixed-top' %}
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        z-index: {{ section.settings.urgency_z_index | default: 100 }};
      {% when 'fixed-bottom' %}
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        z-index: {{ section.settings.urgency_z_index | default: 100 }};
      {% when 'sticky-top' %}
        position: sticky;
        top: 0;
        z-index: {{ section.settings.urgency_z_index | default: 100 }};
      {% else %}
        position: static;
    {% endcase %}
  }

  #labubu-sales-{{ section.id }} .urgency-title {
    font-size: 36px;
    font-weight: 800;
    margin-bottom: 20px;
    font-family: var(--heading-font);
  }

  #labubu-sales-{{ section.id }} .countdown-timer {
    display: flex;
    justify-content: center;
    gap: 20px;
    margin: 30px 0;
  }

  #labubu-sales-{{ section.id }} .countdown-item {
    background: {{ section.settings.urgency_timer_bg | default: 'rgba(255,255,255,0.2)' }};
    padding: 20px;
    border-radius: var(--border-radius);
    min-width: 80px;
  }

  #labubu-sales-{{ section.id }} .countdown-number {
    font-size: 32px;
    font-weight: 900;
    display: block;
  }

  #labubu-sales-{{ section.id }} .countdown-label {
    font-size: 14px;
    opacity: 0.9;
  }

  /* What's Included */
  #labubu-sales-{{ section.id }} .whats-included {
    padding: 50px 0;
    background: white;
  }

  #labubu-sales-{{ section.id }} .included-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 30px;
    margin-top: 50px;
  }

  #labubu-sales-{{ section.id }} .included-item {
    display: flex;
    align-items: flex-start;
    gap: 15px;
    padding: 20px;
    background: var(--light-bg);
    border-radius: var(--border-radius);
  }

  #labubu-sales-{{ section.id }} .included-icon {
    font-size: 24px;
    color: var(--success-color);
    flex-shrink: 0;
  }

  #labubu-sales-{{ section.id }} .included-content h4 {
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 8px;
    color: var(--text-color);
  }

  #labubu-sales-{{ section.id }} .included-content p {
    font-size: 14px;
    opacity: 0.8;
    margin: 0;
  }

  /* CTA Section */
  #labubu-sales-{{ section.id }} .cta-section {
    padding: 50px 0;
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--secondary-color) 100%);
    color: white;
    text-align: center;
  }

  #labubu-sales-{{ section.id }} .cta-title {
    font-size: 48px;
    font-weight: 900;
    margin-bottom: 20px;
    font-family: var(--heading-font);
  }

  #labubu-sales-{{ section.id }} .cta-subtitle {
    font-size: 20px;
    margin-bottom: 40px;
    opacity: 0.9;
  }

  #labubu-sales-{{ section.id }} .cta-button {
    display: inline-block;
    background: var(--accent-color);
    color: var(--text-color);
    padding: 20px 50px;
    font-size: 24px;
    font-weight: 900;
    text-decoration: none;
    border-radius: 50px;
    transition: all 0.3s ease;
    box-shadow: 0 10px 30px rgba(0,0,0,0.2);
    animation: pulse 2s infinite;
  }

  #labubu-sales-{{ section.id }} .cta-button:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 40px rgba(0,0,0,0.3);
  }

  #labubu-sales-{{ section.id }} .money-back {
    margin-top: 30px;
    font-size: 16px;
    opacity: 0.9;
  }

  #labubu-sales-{{ section.id }} .security-badges {
    display: flex;
    justify-content: center;
    gap: 30px;
    margin-top: 40px;
    flex-wrap: wrap;
  }

  #labubu-sales-{{ section.id }} .security-badge {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    opacity: 0.9;
  }

  /* FAQ Section */
  #labubu-sales-{{ section.id }} .faq-section {
    padding: 50px 0;
    background: var(--light-bg);
  }

  #labubu-sales-{{ section.id }} .faq-item {
    background: white;
    margin-bottom: 20px;
    border-radius: var(--border-radius);
    overflow: hidden;
    box-shadow: 0 5px 15px rgba(0,0,0,0.1);
  }

  #labubu-sales-{{ section.id }} .faq-question {
    padding: 25px 30px;
    font-size: 18px;
    font-weight: 700;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: var(--text-color);
    transition: background 0.3s ease;
  }

  #labubu-sales-{{ section.id }} .faq-question:hover {
    background: var(--light-bg);
  }

  #labubu-sales-{{ section.id }} .faq-answer {
    padding: 0 30px 25px;
    font-size: 16px;
    line-height: 1.7;
    display: none;
  }

  #labubu-sales-{{ section.id }} .faq-toggle {
    font-size: 24px;
    color: var(--primary-color);
    transition: transform 0.3s ease;
  }

  #labubu-sales-{{ section.id }} .faq-item.active .faq-toggle {
    transform: rotate(45deg);
  }

  #labubu-sales-{{ section.id }} .faq-item.active .faq-answer {
    display: block;
  }

  /* Animations */
  @keyframes pulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.05); }
  }

  @keyframes bounce {
    0%, 20%, 50%, 80%, 100% { transform: translateY(0); }
    40% { transform: translateY(-10px); }
    60% { transform: translateY(-5px); }
  }

  /* Responsive Design */
  @media (max-width: 768px) {
    #labubu-sales-{{ section.id }} .hero-title {
      font-size: 36px;
    }
    
    #labubu-sales-{{ section.id }} .hero-subtitle {
      font-size: 18px;
    }
    
    #labubu-sales-{{ section.id }} .showcase-grid {
      grid-template-columns: 1fr;
      gap: 40px;
    }
    
    #labubu-sales-{{ section.id }} .countdown-timer {
      flex-wrap: wrap;
    }
    
    #labubu-sales-{{ section.id }} .security-badges {
      flex-direction: column;
      align-items: center;
    }
    
    #labubu-sales-{{ section.id }} .cta-title {
      font-size: 32px;
    }
    
    #labubu-sales-{{ section.id }} .cta-button {
      padding: 15px 30px;
      font-size: 20px;
    }
  }
</style>

<div class="labubu-sales-page" id="labubu-sales-{{ section.id }}">
  
  <!-- Hero Section -->
  <section class="hero-section">
    <div class="container">
      <div class="hero-content">
        {% if section.settings.show_limited_offer %}
          <div class="hero-badge">{{ section.settings.limited_offer_text | default: "🎉 Limited Time Offer - Save 47%!" }}</div>
        {% endif %}
        <h1 class="hero-title">{{ section.settings.hero_title | default: "Create Your Magical Labubu with Your Own Hands!" }}</h1>
        <p class="hero-subtitle">{{ section.settings.hero_subtitle | default: "Professional crochet pattern with step-by-step photo guide - Instant download!" }}</p>
        
        <div class="price-container">
          <span class="original-price">{{ section.settings.currency_symbol | default: '$' }}{{ section.settings.original_price | default: '14.99' }}</span>
          <span class="sale-price">{{ section.settings.currency_symbol | default: '$' }}{{ section.settings.sale_price | default: '7.99' }}</span>
          {% if section.settings.auto_calculate_savings %}
            {% assign original = section.settings.original_price | default: 14.99 | times: 1 %}
            {% assign sale = section.settings.sale_price | default: 7.99 | times: 1 %}
            {% assign savings_amount = original | minus: sale %}
            {% assign savings_percentage = savings_amount | divided_by: original | times: 100 | round %}
            <span class="savings-badge">Save {{ section.settings.currency_symbol | default: '$' }}{{ savings_amount }}! ({{ savings_percentage }}% off)</span>
          {% else %}
            <span class="savings-badge">{{ section.settings.savings_text | default: "Save $7!" }}</span>
          {% endif %}
        </div>
        
        <a href="{{ section.settings.cta_url | default: '#order' }}" class="cta-button">
          {{ section.settings.cta_button_text | default: "Get the Pattern Now! 🧶" }}
        </a>
      </div>
    </div>
  </section>

  <!-- Product Showcase -->
  <section class="product-showcase">
    <div class="container">
      <div class="showcase-grid">
        <div class="product-images">
          {% if section.settings.main_image %}
            <img src="{{ section.settings.main_image | image_url: width: 600 }}" alt="Labubu Amigurumi Pattern" class="main-image">
          {% else %}
            <img src="https://via.placeholder.com/600x600?text=Labubu+Pattern" alt="Labubu Amigurumi Pattern" class="main-image">
          {% endif %}
          <div class="image-badge">Instant Download!</div>
        </div>
        
        <div class="product-details">
          <h2>Why is This Labubu Pattern Special?</h2>
          <p class="product-description">
            Transform ordinary yarn into an amazing Labubu character! This comprehensive pattern takes you step by step to create your magical companion.
          </p>
          
          <ul class="feature-list">
            <li>42+ pages of detailed and clear instructions</li>
            <li>12+ high-quality photos for each step</li>
            <li>Suitable for beginners and professionals</li>
            <li>Troubleshooting and problem-solving guide</li>
            <li>Ideas for customization and variations</li>
            <li>30-day money-back guarantee</li>
            <li>Free lifetime technical support</li>
          </ul>
        </div>
      </div>
    </div>
  </section>

  <!-- Benefits Section -->
  <section class="benefits-section">
    <div class="container">
      <h2 class="section-title">What Will You Get?</h2>
      
      <div class="benefits-grid">
        {% for block in section.blocks %}
          {% if block.type == 'benefit' %}
            <div class="benefit-card">
              <span class="benefit-icon">{{ block.settings.icon | default: '✨' }}</span>
              <h3 class="benefit-title">{{ block.settings.title | default: 'Amazing Benefit' }}</h3>
              <p class="benefit-description">{{ block.settings.description | default: 'Benefit description here' }}</p>
            </div>
          {% endif %}
        {% endfor %}
      </div>
    </div>
  </section>

  <!-- Social Proof -->
  <section class="social-proof">
    <div class="container">
      <h2 class="section-title">What Our Happy Customers Say?</h2>
      
      <div class="testimonials-grid">
        {% for block in section.blocks %}
          {% if block.type == 'testimonial' %}
            <div class="testimonial-card">
              <div class="quote-icon">"</div>
              <p class="testimonial-text">{{ block.settings.text | default: 'Amazing testimonial from customer' }}</p>
              <div class="testimonial-author">- {{ block.settings.author | default: 'Sarah Johnson' }}</div>
            </div>
          {% endif %}
        {% endfor %}
      </div>
    </div>
  </section>

  <!-- Urgency Section -->
  <section class="urgency-section">
    <div class="container">
      <h2 class="urgency-title">{{ section.settings.urgency_title | default: '⏰ Offer Ends Soon!' }}</h2>
      <p>{{ section.settings.urgency_description | default: "Don't miss this limited discount - get the pattern at a reduced price now!" }}</p>
      
      {% if section.settings.enable_countdown_timer %}
      <div class="countdown-timer" 
           data-countdown-type="{{ section.settings.countdown_type | default: 'fixed_duration' }}"
           data-countdown-days="{% if section.settings.countdown_days != blank %}{{ section.settings.countdown_days }}{% else %}3{% endif %}"
           data-countdown-hours="{% if section.settings.countdown_hours != blank %}{{ section.settings.countdown_hours }}{% else %}12{% endif %}"
           data-countdown-end-date="{{ section.settings.countdown_end_date | default: '2025-12-31 23:59' }}"
           data-countdown-auto-restart="{{ section.settings.countdown_auto_restart }}"
           data-countdown-finished-text="{{ section.settings.countdown_finished_text | default: '🔥 Limited Time Offer Still Available!' }}">
        <div class="countdown-item">
          <span class="countdown-number" id="days-{{ section.id }}">00</span>
          <span class="countdown-label">Days</span>
        </div>
        <div class="countdown-item">
          <span class="countdown-number" id="hours-{{ section.id }}">00</span>
          <span class="countdown-label">Hours</span>
        </div>
        <div class="countdown-item">
          <span class="countdown-number" id="minutes-{{ section.id }}">00</span>
          <span class="countdown-label">Minutes</span>
        </div>
        <div class="countdown-item">
          <span class="countdown-number" id="seconds-{{ section.id }}">00</span>
          <span class="countdown-label">Seconds</span>
        </div>
      </div>
      {% endif %}
    </div>
  </section>

  <!-- What's Included -->
  <section class="whats-included">
    <div class="container">
      <h2 class="section-title">{{ section.settings.whats_included_title | default: "What's Included in the Package?" }}</h2>
      
      <div class="included-grid">
        {% for block in section.blocks %}
          {% if block.type == 'included_item' %}
            <div class="included-item">
              <span class="included-icon">{{ block.settings.icon | default: '✅' }}</span>
              <div class="included-content">
                <h4>{{ block.settings.title | default: 'Included Item' }}</h4>
                <p>{{ block.settings.description | default: 'Description of included item' }}</p>
              </div>
            </div>
          {% endif %}
        {% endfor %}
      </div>
    </div>
  </section>

  <!-- Final CTA -->
  <section class="cta-section" id="order">
    <div class="container">
      <h2 class="cta-title">Start Your Magical Labubu Journey Now!</h2>
      <p class="cta-subtitle">{{ section.settings.cta_subtitle_text | default: "Ready to create something magical? Click Order Now and start your journey to create the most amazing Labubu companion!" }}</p>
      
      <a href="{{ section.settings.purchase_url | default: '#' }}" class="cta-button">
        {% if section.settings.secondary_cta_text contains '$' %}
          {{ section.settings.secondary_cta_text | replace: '$7.99', section.settings.currency_symbol | append: section.settings.sale_price }}
        {% else %}
          {{ section.settings.secondary_cta_text | default: "🛒 Order Now - Only " | append: section.settings.currency_symbol | append: section.settings.sale_price }}
        {% endif %}
      </a>
      
      <p class="money-back">{{ section.settings.money_back_text | default: "💰 30-Day Money-Back Guarantee - No Questions Asked!" }}</p>
      
      <div class="security-badges">
        <div class="security-badge">
          <span>🔒</span>
          <span>{{ section.settings.security_badge_1_text | default: "100% Secure Payment" }}</span>
        </div>
        <div class="security-badge">
          <span>⚡</span>
          <span>{{ section.settings.security_badge_2_text | default: "Instant Download" }}</span>
        </div>
        <div class="security-badge">
          <span>📧</span>
          <span>{{ section.settings.security_badge_3_text | default: "Lifetime Support" }}</span>
        </div>
      </div>
    </div>
  </section>

  <!-- FAQ Section -->
  <section class="faq-section">
    <div class="container">
      <h2 class="section-title">{{ section.settings.faq_section_title | default: "Frequently Asked Questions" }}</h2>
      
      {% for block in section.blocks %}
        {% if block.type == 'faq' %}
          <div class="faq-item">
            <div class="faq-question">
              <span>{{ block.settings.question | default: 'Common question?' }}</span>
              <span class="faq-toggle">+</span>
            </div>
            <div class="faq-answer">
              <p>{{ block.settings.answer | default: 'Answer to the common question here' }}</p>
            </div>
          </div>
        {% endif %}
      {% endfor %}
    </div>
  </section>

</div>

<!-- Floating Action Button -->
{% if section.settings.show_floating_button %}
<div id="floating-action-button" class="floating-action-button {{ section.settings.fab_position | default: 'bottom-right' }}">
  <div class="fab-main">
    {% if section.settings.fab_url and section.settings.fab_url != blank %}
      <!-- FAB with External URL -->
      <a href="{{ section.settings.fab_url }}" class="fab-text">{{ section.settings.fab_text | default: '🔥 Special Offer!' }}</a>
    {% else %}
      <!-- FAB opens Modal (independent of popup controls) -->
      <span class="fab-text" onclick="{% if section.settings.show_modal %}openModal();{% else %}alert('🎯 Configure FAB action in theme settings');{% endif %}">{{ section.settings.fab_text | default: '🔥 Special Offer!' }}</span>
    {% endif %}
  </div>
</div>
{% endif %}

<!-- Modal Popup -->
{% if section.settings.show_modal %}
<div id="salesModal" class="modal" style="display: none;">
  <div class="modal-content">
    <div class="modal-header">
      <h2 class="modal-title">{{ section.settings.modal_title | default: '🎉 Special Limited Offer!' }}</h2>
      <span class="modal-close" onclick="closeModal()">&times;</span>
    </div>²
    
    <div class="modal-body">
      {% if section.settings.modal_image %}
        <div class="modal-image">
          <img src="{{ section.settings.modal_image | image_url: width: 400 }}" alt="{{ section.settings.modal_title }}" style="border-radius: {{ section.settings.modal_border_radius | default: 15 }}px;">
        </div>
      {% endif %}
      
      <div class="modal-text">
        <p class="modal-subtitle">{{ section.settings.modal_subtitle | default: "Don't miss this amazing opportunity!" }}</p>
        <div class="modal-description">{{ section.settings.modal_description | default: "Get your Labubu pattern now with an exclusive discount!" }}</div>
        
        {% if section.settings.show_modal_countdown %}
        <div class="modal-countdown">
          <p class="countdown-text">{{ section.settings.modal_countdown_text | default: '⏰ Offer expires in:' }}</p>
          <div class="modal-timer">
            <div class="timer-item">
              <span class="timer-number" id="modal-hours">00</span>
              <span class="timer-label">Hours</span>
            </div>
            <div class="timer-item">
              <span class="timer-number" id="modal-minutes">00</span>
              <span class="timer-label">Minutes</span>
            </div>
            <div class="timer-item">
              <span class="timer-number" id="modal-seconds">00</span>
              <span class="timer-label">Seconds</span>
            </div>
          </div>
        </div>
        {% endif %}
        
        {% if section.settings.show_modal_price %}
        <div class="modal-pricing">
          <span class="modal-original-price">${{ section.settings.modal_original_price | default: '14.99' }}</span>
          <span class="modal-sale-price">${{ section.settings.modal_sale_price | default: '7.99' }}</span>
          <span class="modal-discount">{{ section.settings.modal_discount_text | default: 'Save 47%!' }}</span>
        </div>
        {% endif %}
      </div>
    </div>
    
    <div class="modal-footer">
      {% if section.settings.modal_primary_url %}
        <a href="{{ section.settings.modal_primary_url }}" class="modal-btn modal-btn-primary">{{ section.settings.modal_primary_text | default: '🛒 Get Now!' }}</a>
      {% endif %}
      {% if section.settings.modal_secondary_text %}
        <button class="modal-btn modal-btn-secondary" onclick="closeModal()">{{ section.settings.modal_secondary_text | default: 'Maybe Later' }}</button>
      {% endif %}
    </div>
  </div>
</div>
{% endif %}

<style>
/* Floating Action Button Container - Responsive Positioning */
.floating-action-button {
  position: fixed;
  z-index: 1000;
  font-family: Arial, sans-serif;
  pointer-events: none;
}

/* Bottom Positions */
.floating-action-button.bottom-right { 
  bottom: {{ section.settings.fab_bottom_distance | default: 20 }}px;
  right: {{ section.settings.fab_margin | default: 20 }}px;
  left: auto;
  transform: none;
}

.floating-action-button.bottom-left { 
  bottom: {{ section.settings.fab_bottom_distance | default: 20 }}px;
  left: {{ section.settings.fab_margin | default: 20 }}px;
  right: auto;
  transform: none;
}

.floating-action-button.bottom-center { 
  bottom: {{ section.settings.fab_bottom_distance | default: 20 }}px;
  left: 50%;
  transform: translateX(-50%);
  right: auto;
}

/* Top Positions */
.floating-action-button.top-right { 
  top: {{ section.settings.fab_top_distance | default: 20 }}px;
  right: {{ section.settings.fab_margin | default: 20 }}px;
  left: auto;
  transform: none;
}

.floating-action-button.top-left { 
  top: {{ section.settings.fab_top_distance | default: 20 }}px;
  left: {{ section.settings.fab_margin | default: 20 }}px;
  right: auto;
  transform: none;
}

.floating-action-button.top-center { 
  top: {{ section.settings.fab_top_distance | default: 20 }}px;
  left: 50%;
  transform: translateX(-50%);
  right: auto;
}

/* Center Positions */
.floating-action-button.center-right { 
  top: 50%;
  right: {{ section.settings.fab_margin | default: 20 }}px;
  transform: translateY(-50%);
  left: auto;
}

.floating-action-button.center-left { 
  top: 50%;
  left: {{ section.settings.fab_margin | default: 20 }}px;
  transform: translateY(-50%);
  right: auto;
}

.floating-action-button.center { 
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  right: auto;
}

.fab-main {
  pointer-events: auto;
  {% if section.settings.fab_full_width %}
    /* Full Width Mode: Stretch across available space */
    width: {% if section.settings.fab_position contains 'center' %}calc(100% - {{ section.settings.fab_margin | default: 20 }}px * 2){% else %}calc(100% - {{ section.settings.fab_margin | default: 20 }}px - 
    {% case section.settings.fab_position %}
      {% when 'bottom-right', 'top-right', 'center-right' %}{{ section.settings.fab_margin | default: 20 }}px{% else %}0px{% endcase %}){% endif %};
    max-width: calc(100vw - 40px);
    display: flex;
    justify-content: center;
  {% else %}
    /* Button Size Mode: Natural button size */
    display: inline-block;
  {% endif %}
}

.fab-text {
  background: {{ section.settings.fab_bg_color | default: section.settings.fab_color | default: '#ff6b9d' }};
  color: {{ section.settings.fab_text_color | default: 'white' }};
  padding: {{ section.settings.fab_padding | default: section.settings.fab_desktop_padding | default: '15px 30px' }};
  border-radius: {{ section.settings.fab_border_radius | default: section.settings.fab_desktop_border_radius | default: 30 }}px;
  font-size: {{ section.settings.fab_font_size | default: section.settings.fab_desktop_font_size | default: 18 }}px;
  font-weight: {{ section.settings.fab_font_weight | default: 'bold' }};
  font-family: {{ section.settings.fab_font_family | default: 'inherit' }};
  box-shadow: {{ section.settings.fab_shadow | default: '0 4px 15px rgba(0,0,0,0.3)' }};
  border: {{ section.settings.fab_border | default: 'none' }};
  animation: pulse 2s infinite;
  transition: all 0.3s ease;
  text-decoration: none;
  display: inline-block;
  cursor: pointer;
  text-align: center;
  {% if section.settings.fab_full_width %}
    /* Full width button */
    width: 100%;
    max-width: {{ section.settings.fab_max_width | default: section.settings.fab_desktop_max_width | default: 500 }}px;
  {% else %}
    /* Natural button size */
    min-width: {{ section.settings.fab_size | default: 60 }}px;
    max-width: calc(100vw - 40px);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  {% endif %}
}

.fab-text:hover {
  background: {{ section.settings.fab_hover_bg_color | default: '#e55a87' }};
  color: {{ section.settings.fab_hover_text_color | default: 'white' }};
  transform: {{ section.settings.fab_hover_transform | default: 'scale(1.05)' }};
  box-shadow: {{ section.settings.fab_hover_shadow | default: '0 6px 20px rgba(0,0,0,0.4)' }};
}

/* Responsive Design - Mobile First */
@media (max-width: 480px) {
  .fab-text {
    padding: {{ section.settings.fab_mobile_padding | default: '12px 20px' }};
    font-size: {{ section.settings.fab_mobile_font_size | default: 16 }}px;
    border-radius: {{ section.settings.fab_mobile_border_radius | default: 25 }}px;
    width: calc(100% - {{ section.settings.fab_mobile_margin | default: 15 }}px);
    max-width: {{ section.settings.fab_mobile_max_width | default: 400 }}px;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .fab-text {
    padding: {{ section.settings.fab_tablet_padding | default: '14px 25px' }};
    font-size: {{ section.settings.fab_tablet_font_size | default: 17 }}px;
    border-radius: {{ section.settings.fab_tablet_border_radius | default: 30 }}px;
    width: calc(100% - {{ section.settings.fab_tablet_margin | default: 20 }}px);
    max-width: {{ section.settings.fab_tablet_max_width | default: 450 }}px;
  }
}

@media (min-width: 769px) {
  .fab-text {
    padding: {{ section.settings.fab_desktop_padding | default: '15px 30px' }};
    font-size: {{ section.settings.fab_desktop_font_size | default: 18 }}px;
    border-radius: {{ section.settings.fab_desktop_border_radius | default: 30 }}px;
    width: calc(100% - {{ section.settings.fab_desktop_margin | default: 20 }}px);
    max-width: {{ section.settings.fab_desktop_max_width | default: 500 }}px;
  }
}
  {% unless section.settings.fab_show_on_mobile %}
  .floating-action-button {
    display: none;
  }
  {% else %}
  .fab-text {
    {% if section.settings.fab_mobile_hide_text %}
      display: none;
    {% else %}
      display: block;
      padding: {{ section.settings.fab_mobile_padding | default: '12px 20px' }};
      font-size: {{ section.settings.fab_mobile_font_size | default: 16 }}px;
      border-radius: {{ section.settings.fab_mobile_border_radius | default: 25 }}px;
      {% if section.settings.fab_full_width %}
        width: calc(100% - {{ section.settings.fab_mobile_margin | default: 20 }}px);
        text-align: center;
        max-width: {{ section.settings.fab_mobile_max_width | default: 400 }}px;
      {% endif %}
    {% endif %}
  }
  
  .floating-action-button {
    {% if section.settings.fab_full_width %}
      left: 50% !important;
      right: auto !important;
      transform: translateX(-50%);
    {% endif %}
  }
  {% endunless %}
}

/* Modal Styles */
.modal {
  position: fixed;
  z-index: 10000;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, {{ section.settings.modal_overlay_opacity | default: 0.6 }});
  animation: fadeIn 0.3s ease;
}

.modal-content {
  background-color: {{ section.settings.modal_background_color | default: '#ffffff' }};
  margin: 5% auto;
  border-radius: {{ section.settings.modal_border_radius | default: 15 }}px;
  width: {{ section.settings.modal_width | default: 90 }}%;
  max-width: {{ section.settings.modal_max_width | default: 600 }}px;
  max-height: 90vh;
  overflow-y: auto;
  animation: slideIn 0.3s ease;
  box-shadow: 0 20px 60px rgba(0,0,0,0.3);
  position: relative;
  box-sizing: border-box;
  /* Prevent horizontal overflow */
  overflow-x: hidden;
}

.modal-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: {{ section.settings.modal_padding | default: 25 }}px;
  border-bottom: 2px solid {{ section.settings.modal_border_color | default: '#f0f0f0' }};
  background: {{ section.settings.modal_header_bg | default: 'linear-gradient(135deg, #ff6b9d 0%, #4ecdc4 100%)' }};
  color: {{ section.settings.modal_header_text_color | default: 'white' }};
  border-radius: {{ section.settings.modal_border_radius | default: 15 }}px {{ section.settings.modal_border_radius | default: 15 }}px 0 0;
}

.modal-title {
  margin: 0;
  font-size: {{ section.settings.modal_title_size | default: 24 }}px;
  font-weight: 900;
  text-shadow: 1px 1px 2px rgba(0,0,0,0.2);
}

.modal-close {
  font-size: 32px;
  font-weight: bold;
  cursor: pointer;
  color: {{ section.settings.modal_header_text_color | default: 'white' }};
  transition: all 0.3s ease;
  line-height: 1;
  padding: 5px 10px;
  border-radius: 50%;
}

.modal-close:hover {
  background: rgba(255,255,255,0.2);
  transform: scale(1.1);
}

.modal-body {
  padding: {{ section.settings.modal_padding | default: 25 }}px;
  text-align: center;
  color: {{ section.settings.modal_text_color | default: '#2c3e50' }};
}

.modal-image {
  margin-bottom: 20px;
}

.modal-image img {
  max-width: 100%;
  height: {{ section.settings.modal_image_height_desktop | default: section.settings.modal_image_height | default: 300 }}px;
  object-fit: cover;
  box-shadow: 0 10px 30px rgba(0,0,0,0.1);
}

/* Mobile responsive modal image */
@media (max-width: 768px) {
  .modal-image img {
    height: {{ section.settings.modal_image_height_mobile | default: section.settings.modal_image_height_desktop | default: section.settings.modal_image_height | default: 200 }}px;
  }
}

.modal-subtitle {
  font-size: {{ section.settings.modal_subtitle_size | default: 18 }}px;
  font-weight: 700;
  margin-bottom: 15px;
  color: {{ section.settings.modal_accent_color | default: '#ff6b9d' }};
}

.modal-description {
  font-size: {{ section.settings.modal_text_size | default: 16 }}px;
  line-height: 1.6;
  margin-bottom: 20px;
  color: {{ section.settings.modal_text_color | default: '#2c3e50' }};
}

.modal-countdown {
  background: {{ section.settings.modal_countdown_bg | default: '#fdf4f5' }};
  padding: 20px;
  border-radius: 10px;
  margin: 20px 0;
}

.countdown-text {
  font-size: 16px;
  font-weight: 700;
  margin-bottom: 15px;
  color: {{ section.settings.modal_accent_color | default: '#ff6b9d' }};
}

.modal-timer {
  display: flex;
  justify-content: center;
  gap: 15px;
}

.timer-item {
  background: {{ section.settings.modal_accent_color | default: '#ff6b9d' }};
  color: white;
  padding: 10px 15px;
  border-radius: 8px;
  min-width: 60px;
}

.timer-number {
  display: block;
  font-size: 20px;
  font-weight: 900;
}

.timer-label {
  font-size: 12px;
  opacity: 0.9;
}

.modal-pricing {
  background: {{ section.settings.modal_price_bg | default: 'linear-gradient(135deg, #6bcf7f 0%, #4ecdc4 100%)' }};
  padding: 20px;
  border-radius: 10px;
  margin: 20px 0;
}

.modal-original-price {
  font-size: 18px;
  text-decoration: line-through;
  opacity: 0.7;
  margin-right: 10px;
  color: white;
}

.modal-sale-price {
  font-size: 28px;
  font-weight: 900;
  color: white;
  text-shadow: 1px 1px 2px rgba(0,0,0,0.2);
}

.modal-discount {
  display: block;
  font-size: 14px;
  font-weight: 700;
  margin-top: 5px;
  color: #ffd93d;
}

.modal-footer {
  padding: {{ section.settings.modal_padding | default: 25 }}px;
  border-top: 2px solid {{ section.settings.modal_border_color | default: '#f0f0f0' }};
  display: flex;
  gap: 15px;
  justify-content: center;
  flex-wrap: wrap;
}

.modal-btn {
  padding: {{ section.settings.modal_btn_padding | default: '12px 30px' }};
  border: none;
  border-radius: {{ section.settings.modal_btn_radius | default: 25 }}px;
  font-size: {{ section.settings.modal_btn_size | default: 16 }}px;
  font-weight: 700;
  cursor: pointer;
  transition: all 0.3s ease;
  text-decoration: none;
  display: inline-block;
  min-width: 120px;
}

.modal-btn-primary {
  background: {{ section.settings.modal_primary_btn_color | default: '#ff6b9d' }};
  color: {{ section.settings.modal_primary_btn_text | default: 'white' }};
  box-shadow: 0 5px 15px rgba(255, 107, 157, 0.3);
}

.modal-btn-primary:hover {
  background: {{ section.settings.modal_primary_btn_hover | default: '#e55a87' }};
  transform: translateY(-2px);
  box-shadow: 0 8px 25px rgba(255, 107, 157, 0.4);
  color: {{ section.settings.modal_primary_btn_text | default: 'white' }};
  text-decoration: none;
}

.modal-btn-secondary {
  background: {{ section.settings.modal_secondary_btn_color | default: 'transparent' }};
  color: {{ section.settings.modal_secondary_btn_text | default: '#666' }};
  border: 2px solid {{ section.settings.modal_secondary_btn_text | default: '#666' }};
}

.modal-btn-secondary:hover {
  background: {{ section.settings.modal_secondary_btn_text | default: '#666' }};
  color: white;
}

@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes slideIn {
  from { 
    opacity: 0;
    transform: translateY(-50px);
  }
  to { 
    opacity: 1;
    transform: translateY(0);
  }
}

/* Mobile Modal Styles */
@media (max-width: 768px) {
  .modal-content {
    width: 95%;
    margin: 10% auto;
  }
  
  .modal-header,
  .modal-body,
  .modal-footer {
    padding: 20px;
  }
  
  .modal-title {
    font-size: 20px;
  }
  
  .modal-timer {
    gap: 10px;
  }
  
  .timer-item {
    padding: 8px 12px;
    min-width: 50px;
  }
  
  .timer-number {
    font-size: 16px;
  }
  
  .modal-footer {
    flex-direction: column;
  }
  
  .modal-btn {
    width: 100%;
  }
}
</style>

<script>
document.addEventListener('DOMContentLoaded', function() {
  // FAQ Functionality
  const faqItems = document.querySelectorAll('#labubu-sales-{{ section.id }} .faq-item');
  
  faqItems.forEach(item => {
    const question = item.querySelector('.faq-question');
    question.addEventListener('click', () => {
      const isActive = item.classList.contains('active');
      
      // Close all FAQ items
      faqItems.forEach(faq => faq.classList.remove('active'));
      
      // Open clicked item if it wasn't active
      if (!isActive) {
        item.classList.add('active');
      }
    });
  });

  // Countdown Timer
  function startCountdown() {
    const countdownDate = new Date().getTime() + (24 * 60 * 60 * 1000); // 24 hours from now
    
    const timer = setInterval(function() {
      const now = new Date().getTime();
      const distance = countdownDate - now;
      
      const days = Math.floor(distance / (1000 * 60 * 60 * 24));
      const hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
      const minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
      const seconds = Math.floor((distance % (1000 * 60)) / 1000);
      
      document.getElementById('days').textContent = days.toString().padStart(2, '0');
      document.getElementById('hours').textContent = hours.toString().padStart(2, '0');
      document.getElementById('minutes').textContent = minutes.toString().padStart(2, '0');
      document.getElementById('seconds').textContent = seconds.toString().padStart(2, '0');
      
      if (distance < 0) {
        clearInterval(timer);
        // Reset countdown
        startCountdown();
      }
    }, 1000);
  }
  
  startCountdown();

  // Smooth scrolling for CTA buttons
  const ctaButtons = document.querySelectorAll('#labubu-sales-{{ section.id }} a[href*="#"]');
  ctaButtons.forEach(button => {
    button.addEventListener('click', function(e) {
      const href = this.getAttribute('href');
      if (href.startsWith('#')) {
        e.preventDefault();
        const target = document.querySelector(href);
        if (target) {
          target.scrollIntoView({
            behavior: 'smooth',
            block: 'start'
          });
        }
      }
    });
  });
  
  // Auto-show modal based on settings (ONLY if popups are enabled)
  {% if section.settings.show_modal and section.settings.modal_auto_show %}
  // Check if popups are enabled before showing modal
  if (window.labubuSectionSettings && window.labubuSectionSettings.enable_popups) {
    console.log('✅ Auto-showing modal - popups enabled');
    setTimeout(function() {
      openModal();
    }, {{ section.settings.modal_delay | default: 5000 }});
  } else {
    console.log('❌ Modal auto-show BLOCKED - popups disabled');
  }
  {% endif %}
});

// Modal Functions
{% if section.settings.modal_auto_hide %}
let modalAutoHideTimer;
{% endif %}

function openModal() {
  // Check if popups are enabled before opening modal
  if (!window.labubuSectionSettings || !window.labubuSectionSettings.enable_popups) {
    console.log('❌ Modal opening BLOCKED - popups disabled');
    return;
  }
  
  console.log('✅ Opening modal - popups enabled');
  const modal = document.getElementById('salesModal');
  if (modal) {
    modal.style.display = 'block';
    // Store original overflow value
    if (!document.body.dataset.originalOverflow) {
      document.body.dataset.originalOverflow = window.getComputedStyle(document.body).overflow;
    }
    document.body.style.overflow = 'hidden';
    document.body.style.overflowX = 'hidden';
    
    // Start modal countdown if enabled
    {% if section.settings.show_modal_countdown %}
    startModalCountdown();
    {% endif %}
    
    // Start auto-hide timer if enabled
    {% if section.settings.modal_auto_hide %}
    if (modalAutoHideTimer) clearTimeout(modalAutoHideTimer);
    modalAutoHideTimer = setTimeout(function() {
      closeModal();
    }, {{ section.settings.modal_auto_hide_delay | default: 20 }} * 1000);
    {% endif %}
  }
}

function closeModal() {
  const modal = document.getElementById('salesModal');
  if (modal) {
    modal.style.display = 'none';
    // Restore original overflow value
    const originalOverflow = document.body.dataset.originalOverflow || 'auto';
    document.body.style.overflow = originalOverflow;
    document.body.style.overflowX = 'hidden';
    
    // Clear auto-hide timer
    {% if section.settings.modal_auto_hide %}
    if (modalAutoHideTimer) clearTimeout(modalAutoHideTimer);
    {% endif %}
  }
}

// Close modal when clicking outside
window.onclick = function(event) {
  const modal = document.getElementById('salesModal');
  if (event.target === modal) {
    closeModal();
  }
}

// Close modal with Escape key
document.addEventListener('keydown', function(event) {
  if (event.key === 'Escape') {
    closeModal();
  }
});

// Modal Countdown Timer
function startModalCountdown() {
  const modalCountdownDate = new Date().getTime() + ({{ section.settings.modal_countdown_hours | default: 2 }} * 60 * 60 * 1000);
  
  const modalTimer = setInterval(function() {
    const now = new Date().getTime();
    const distance = modalCountdownDate - now;
    
    const hours = Math.floor(distance / (1000 * 60 * 60));
    const minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
    const seconds = Math.floor((distance % (1000 * 60)) / 1000);
    
    const hoursEl = document.getElementById('modal-hours');
    const minutesEl = document.getElementById('modal-minutes');
    const secondsEl = document.getElementById('modal-seconds');
    
    if (hoursEl) hoursEl.textContent = hours.toString().padStart(2, '0');
    if (minutesEl) minutesEl.textContent = minutes.toString().padStart(2, '0');
    if (secondsEl) secondsEl.textContent = seconds.toString().padStart(2, '0');
    
    if (distance < 0) {
      clearInterval(modalTimer);
      // Reset modal countdown
      startModalCountdown();
    }
  }, 1000);
}

// Initialize LabubuSalesPage with popup controls
document.addEventListener('DOMContentLoaded', function() {
  // Only initialize if enable_popups is true
  if (window.labubuSectionSettings && window.labubuSectionSettings.enable_popups) {
    console.log('🚀 Initializing LabubuSalesPage - popups enabled');
    window.LabubuSalesPageInstance = new LabubuSalesPage();
  } else {
    console.log('❌ LabubuSalesPage initialization BLOCKED - popups disabled');
    console.log('📊 Current settings:', window.labubuSectionSettings);
  }

  // Initialize Countdown Timer
  function initializeCountdownTimer() {
    const countdownTimer = document.querySelector('.countdown-timer');
    if (!countdownTimer) return;

    const sectionId = '{{ section.id }}';
    const countdownType = countdownTimer.getAttribute('data-countdown-type') || 'fixed_duration';
    const countdownDaysAttr = countdownTimer.getAttribute('data-countdown-days');
    const countdownHoursAttr = countdownTimer.getAttribute('data-countdown-hours');
    const countdownDays = countdownDaysAttr !== null ? parseInt(countdownDaysAttr) : 3;
    const countdownHours = countdownHoursAttr !== null ? parseInt(countdownHoursAttr) : 12;
    const endDateStr = countdownTimer.getAttribute('data-countdown-end-date') || '2025-12-31 23:59';
    const autoRestart = countdownTimer.getAttribute('data-countdown-auto-restart') === 'true';
    const finishedText = countdownTimer.getAttribute('data-countdown-finished-text') || '🔥 Limited Time Offer Still Available!';

    let targetDate;

    // Calculate target date based on countdown type
    function calculateTargetDate() {
      const now = new Date();
      
      switch(countdownType) {
        case 'fixed_duration':
          targetDate = new Date(now.getTime() + (countdownDays * 24 * 60 * 60 * 1000) + (countdownHours * 60 * 60 * 1000));
          break;
          
        case 'specific_date':
          try {
            targetDate = new Date(endDateStr.replace(' ', 'T'));
            if (isNaN(targetDate.getTime())) {
              console.error('Invalid date format:', endDateStr);
              targetDate = new Date(now.getTime() + (3 * 24 * 60 * 60 * 1000)); // Fallback to 3 days
            }
          } catch (e) {
            console.error('Date parsing error:', e);
            targetDate = new Date(now.getTime() + (3 * 24 * 60 * 60 * 1000));
          }
          break;
          
        case 'daily_reset':
          targetDate = new Date(now);
          targetDate.setHours(23, 59, 59, 999); // End of today
          break;
          
        case 'weekly_reset':
          targetDate = new Date(now);
          const daysUntilSunday = (7 - now.getDay()) % 7;
          targetDate.setDate(now.getDate() + (daysUntilSunday || 7));
          targetDate.setHours(23, 59, 59, 999);
          break;
          
        default:
          targetDate = new Date(now.getTime() + (3 * 24 * 60 * 60 * 1000));
      }
      
      return targetDate;
    }

    // Update countdown display
    function updateCountdown() {
      const now = new Date().getTime();
      const distance = targetDate.getTime() - now;

      const daysEl = document.getElementById(`days-${sectionId}`);
      const hoursEl = document.getElementById(`hours-${sectionId}`);
      const minutesEl = document.getElementById(`minutes-${sectionId}`);
      const secondsEl = document.getElementById(`seconds-${sectionId}`);

      if (distance > 0) {
        const days = Math.floor(distance / (1000 * 60 * 60 * 24));
        const hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
        const minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
        const seconds = Math.floor((distance % (1000 * 60)) / 1000);

        if (daysEl) daysEl.textContent = days.toString().padStart(2, '0');
        if (hoursEl) hoursEl.textContent = hours.toString().padStart(2, '0');
        if (minutesEl) minutesEl.textContent = minutes.toString().padStart(2, '0');
        if (secondsEl) secondsEl.textContent = seconds.toString().padStart(2, '0');
      } else {
        // Countdown finished
        if (autoRestart) {
          // Restart countdown
          targetDate = calculateTargetDate();
          updateCountdown();
        } else {
          // Show finished state
          if (daysEl) daysEl.textContent = '00';
          if (hoursEl) hoursEl.textContent = '00';
          if (minutesEl) minutesEl.textContent = '00';
          if (secondsEl) secondsEl.textContent = '00';
          
          // Replace countdown with finished text
          const urgencyDescription = document.querySelector('.urgency-section p');
          if (urgencyDescription) {
            urgencyDescription.textContent = finishedText;
          }
        }
      }
    }

    // Initialize
    targetDate = calculateTargetDate();
    updateCountdown();
    
    // Update every second
    const countdownInterval = setInterval(updateCountdown, 1000);
    
    console.log('⏰ Countdown timer initialized:', {
      type: countdownType,
      targetDate: targetDate,
      autoRestart: autoRestart
    });
  }

  // Initialize countdown timer
  initializeCountdownTimer();
});
</script>

{% schema %}
{
  "name": "Labubu Sales Page 09-09",
  "tag": "section",
  "class": "labubu-sales-wrapper",
  "settings": [
    {
      "type": "header",
      "content": "🎯 Hero Section"
    },
    {
      "type": "text",
      "id": "hero_title",
      "label": "Hero Title",
      "default": "Create Your Magical Labubu with Your Own Hands!"
    },
    {
      "type": "textarea",
      "id": "hero_subtitle",
      "label": "Hero Subtitle",
      "default": "Professional crochet pattern with step-by-step photo guide - Instant download!"
    },
    {
      "type": "text",
      "id": "limited_offer_text",
      "label": "Limited Offer Badge Text",
      "default": "🎉 Limited Time Offer - Save 47%!"
    },
    {
      "type": "checkbox",
      "id": "show_limited_offer",
      "label": "Show Limited Offer Badge",
      "default": true
    },
    {
      "type": "text",
      "id": "original_price",
      "label": "Original Price (USD)",
      "default": "14.99",
      "info": "Enter price without $ symbol"
    },
    {
      "type": "text",
      "id": "sale_price",
      "label": "Sale Price (USD)",
      "default": "7.99",
      "info": "Enter price without $ symbol"
    },
    {
      "type": "select",
      "id": "currency_symbol",
      "label": "Currency Symbol",
      "default": "$",
      "options": [
        { "value": "$", "label": "Dollar ($)" },
        { "value": "€", "label": "Euro (€)" },
        { "value": "£", "label": "Pound (£)" },
        { "value": "¥", "label": "Yen (¥)" },
        { "value": "₹", "label": "Rupee (₹)" },
        { "value": "SAR", "label": "Saudi Riyal (SAR)" },
        { "value": "AED", "label": "UAE Dirham (AED)" }
      ]
    },
    {
      "type": "checkbox",
      "id": "auto_calculate_savings",
      "label": "Auto Calculate Savings",
      "default": true,
      "info": "Automatically calculate savings amount and percentage"
    },
    {
      "type": "text",
      "id": "savings_text",
      "label": "Custom Savings Text (if auto-calculate disabled)",
      "default": "Save $7!",
      "info": "Only used when auto-calculate is disabled"
    },
    {
      "type": "text",
      "id": "cta_button_text",
      "label": "Main CTA Button Text",
      "default": "Get the Pattern Now! 🧶"
    },
    {
      "type": "text",
      "id": "secondary_cta_text",
      "label": "Secondary CTA Button Text", 
      "default": "🛒 Order Now - Only $7.99"
    },
    {
      "type": "textarea",
      "id": "cta_subtitle_text",
      "label": "CTA Subtitle Text",
      "default": "Ready to create something magical? Click Order Now and start your journey to create the most amazing Labubu companion!"
    },
    {
      "type": "text",
      "id": "money_back_text",
      "label": "Money Back Guarantee Text",
      "default": "💰 30-Day Money-Back Guarantee - No Questions Asked!"
    },
    {
      "type": "url",
      "id": "cta_url",
      "label": "CTA Button URL"
    },
    {
      "type": "url",
      "id": "purchase_url",
      "label": "Purchase URL"
    },
    {
      "type": "header",
      "content": "🖼️ Images"
    },
    {
      "type": "image_picker",
      "id": "main_image",
      "label": "Main Product Image",
      "info": "Recommended size: 600x600px"
    },
    {
      "type": "header",
      "content": "🎨 Design Settings"
    },
    {
      "type": "color",
      "id": "primary_color",
      "label": "Primary Color",
      "default": "#ff6b9d"
    },
    {
      "type": "color",
      "id": "secondary_color",
      "label": "Secondary Color",
      "default": "#4ecdc4"
    },
    {
      "type": "color",
      "id": "accent_color",
      "label": "Accent Color",
      "default": "#ffd93d"
    },
    {
      "type": "color",
      "id": "success_color",
      "label": "Success Color",
      "default": "#6bcf7f"
    },
    {
      "type": "color",
      "id": "warning_color",
      "label": "Warning Color",
      "default": "#ffb347"
    },
    {
      "type": "color",
      "id": "text_color",
      "label": "Text Color",
      "default": "#2c3e50"
    },
    {
      "type": "color",
      "id": "light_bg",
      "label": "Light Background",
      "default": "#fdf4f5"
    },
    {
      "type": "range",
      "id": "container_width",
      "label": "Container Max Width",
      "min": 1000,
      "max": 1400,
      "step": 50,
      "unit": "px",
      "default": 1200,
      "info": "Maximum width will be limited to viewport width to prevent horizontal scroll"
    },
    {
      "type": "range",
      "id": "border_radius",
      "label": "Border Radius",
      "min": 5,
      "max": 30,
      "step": 5,
      "unit": "px",
      "default": 15
    },
    {
      "type": "header",
      "content": "� Section Titles & Content"
    },
    {
      "type": "text",
      "id": "whats_included_title",
      "label": "What's Included Section Title",
      "default": "What's Included in the Package?"
    },
    {
      "type": "text",
      "id": "security_badge_1_text",
      "label": "Security Badge 1 Text",
      "default": "100% Secure Payment"
    },
    {
      "type": "text",
      "id": "security_badge_2_text", 
      "label": "Security Badge 2 Text",
      "default": "Instant Download"
    },
    {
      "type": "text",
      "id": "security_badge_3_text",
      "label": "Security Badge 3 Text", 
      "default": "Money-Back Guarantee"
    },
    {
      "type": "text",
      "id": "faq_section_title",
      "label": "FAQ Section Title",
      "default": "Frequently Asked Questions"
    },
    {
      "type": "header",
      "content": "🔔 JavaScript Popups & Notifications"
    },
    {
      "type": "text",
      "id": "exit_intent_title",
      "label": "Exit Intent Popup Title",
      "default": "Wait! Don't miss this amazing offer! 🎁"
    },
    {
      "type": "textarea",
      "id": "exit_intent_description",
      "label": "Exit Intent Description",
      "default": "Get an extra 10% discount with code: SAVE10"
    },
    {
      "type": "text",
      "id": "exit_intent_button",
      "label": "Exit Intent Button Text",
      "default": "Get Discount Now!"
    },
    {
      "type": "text",
      "id": "sticky_bar_text",
      "label": "Sticky Bar Text",
      "default": "🔥 Limited Time: Only $7.99 instead of $14.99"
    },
    {
      "type": "text",
      "id": "sticky_bar_button",
      "label": "Sticky Bar Button Text",
      "default": "Order Now!"
    },
    {
      "type": "textarea",
      "id": "discount_code_text",
      "label": "Discount Code Banner Text",
      "default": "🎉 Use code [code] and get [percentage]% extra discount!",
      "info": "Use [code] and [percentage] placeholders"
    },
    {
      "type": "text",
      "id": "urgency_notification_icon",
      "label": "Urgency Notification Icon",
      "default": "⏰"
    },
    {
      "type": "header",
      "content": "🖼️ Professional Image Settings"
    },
    {
      "type": "paragraph",
      "content": "💡 **Responsive Image Control**: Set different image settings for desktop and mobile devices. If you don't set mobile values, they will inherit from desktop settings."
    },
    {
      "type": "header",
      "content": "🖥️ Desktop Image Settings"
    },
    {
      "type": "range",
      "id": "image_height_desktop",
      "label": "Image Height - Desktop",
      "min": 200,
      "max": 800,
      "step": 50,
      "unit": "px",
      "default": 400,
      "info": "Height of main product image on desktop"
    },
    {
      "type": "range",
      "id": "image_max_width_desktop",
      "label": "Image Max Width - Desktop",
      "min": 50,
      "max": 100,
      "step": 5,
      "unit": "%",
      "default": 100,
      "info": "Maximum width as percentage of container"
    },
    {
      "type": "range",
      "id": "image_border_radius_desktop",
      "label": "Border Radius - Desktop",
      "min": 0,
      "max": 50,
      "step": 5,
      "unit": "px",
      "default": 15,
      "info": "Rounded corners for desktop image"
    },
    {
      "type": "select",
      "id": "image_object_fit_desktop",
      "label": "Image Fit Style - Desktop",
      "default": "cover",
      "options": [
        { "value": "cover", "label": "Cover (Fill & Crop)" },
        { "value": "contain", "label": "Contain (Fit All)" },
        { "value": "fill", "label": "Fill (Stretch)" },
        { "value": "scale-down", "label": "Scale Down" }
      ],
      "info": "How image should fit within its container on desktop"
    },
    {
      "type": "header",
      "content": "📱 Mobile Image Settings"
    },
    {
      "type": "range",
      "id": "image_height_mobile",
      "label": "Image Height - Mobile",
      "min": 150,
      "max": 600,
      "step": 25,
      "unit": "px",
      "default": 300,
      "info": "Height of main product image on mobile devices"
    },
    {
      "type": "range",
      "id": "image_max_width_mobile",
      "label": "Image Max Width - Mobile",
      "min": 50,
      "max": 100,
      "step": 5,
      "unit": "%",
      "default": 100,
      "info": "Maximum width as percentage of container on mobile"
    },
    {
      "type": "range",
      "id": "image_border_radius_mobile",
      "label": "Border Radius - Mobile",
      "min": 0,
      "max": 30,
      "step": 2,
      "unit": "px",
      "default": 10,
      "info": "Rounded corners for mobile image (usually smaller than desktop)"
    },
    {
      "type": "select",
      "id": "image_object_fit_mobile",
      "label": "Image Fit Style - Mobile",
      "default": "cover",
      "options": [
        { "value": "cover", "label": "Cover (Fill & Crop)" },
        { "value": "contain", "label": "Contain (Fit All)" },
        { "value": "fill", "label": "Fill (Stretch)" },
        { "value": "scale-down", "label": "Scale Down" }
      ],
      "info": "How image should fit within its container on mobile"
    },
    {
      "type": "header",
      "content": "🎨 Legacy Image Settings (Fallback)"
    },
    {
      "type": "paragraph",
      "content": "⚠️ **Legacy Support**: These settings are kept for backward compatibility. Use desktop/mobile settings above for better control."
    },
    {
      "type": "range",
      "id": "image_height",
      "label": "Legacy Image Height",
      "min": 200,
      "max": 800,
      "step": 50,
      "unit": "px",
      "default": 400,
      "info": "Used as fallback if desktop setting is not set"
    },
    {
      "type": "range",
      "id": "image_border_radius",
      "label": "Legacy Border Radius",
      "min": 0,
      "max": 50,
      "step": 5,
      "unit": "px",
      "default": 15,
      "info": "Used as fallback if desktop setting is not set"
    },
    {
      "type": "select",
      "id": "image_object_fit",
      "label": "Legacy Image Fit Style",
      "default": "cover",
      "options": [
        { "value": "cover", "label": "Cover (Fill & Crop)" },
        { "value": "contain", "label": "Contain (Fit All)" },
        { "value": "fill", "label": "Fill (Stretch)" },
        { "value": "scale-down", "label": "Scale Down" }
      ],
      "info": "Used as fallback if desktop setting is not set"
    },
    {
      "type": "checkbox",
      "id": "image_shadow",
      "label": "Add Image Shadow",
      "default": true
    },
    {
      "type": "range",
      "id": "image_max_width",
      "label": "Image Maximum Width",
      "min": 30,
      "max": 100,
      "step": 5,
      "unit": "%",
      "default": 100
    },
    {
      "type": "header",
      "content": "�🔤 Typography"
    },
    {
      "type": "font_picker",
      "id": "heading_font",
      "label": "Heading Font",
      "default": "assistant_n7"
    },
    {
      "type": "font_picker",
      "id": "body_font",
      "label": "Body Font",
      "default": "assistant_n4"
    },
    {
      "type": "header",
      "content": "🖼️ Secondary Image Settings"
    },
    {
      "type": "paragraph",
      "content": "💡 **Responsive Secondary Image**: Set different settings for desktop and mobile devices."
    },
    {
      "type": "header",
      "content": "🖥️ Desktop Secondary Image"
    },
    {
      "type": "range",
      "id": "secondary_image_height_desktop",
      "label": "Secondary Image Height - Desktop",
      "min": 200,
      "max": 800,
      "step": 50,
      "unit": "px",
      "default": 400,
      "info": "Height of secondary image on desktop"
    },
    {
      "type": "range",
      "id": "secondary_image_width_desktop",
      "label": "Secondary Image Width - Desktop",
      "min": 50,
      "max": 100,
      "step": 5,
      "unit": "%",
      "default": 100,
      "info": "Width as percentage of container on desktop"
    },
    {
      "type": "range",
      "id": "secondary_image_border_radius_desktop",
      "label": "Secondary Border Radius - Desktop",
      "min": 0,
      "max": 50,
      "step": 5,
      "unit": "px",
      "default": 15,
      "info": "Rounded corners for desktop secondary image"
    },
    {
      "type": "header",
      "content": "📱 Mobile Secondary Image"
    },
    {
      "type": "range",
      "id": "secondary_image_height_mobile",
      "label": "Secondary Image Height - Mobile",
      "min": 150,
      "max": 600,
      "step": 25,
      "unit": "px",
      "default": 300,
      "info": "Height of secondary image on mobile"
    },
    {
      "type": "range",
      "id": "secondary_image_width_mobile",
      "label": "Secondary Image Width - Mobile",
      "min": 50,
      "max": 100,
      "step": 5,
      "unit": "%",
      "default": 100,
      "info": "Width as percentage of container on mobile"
    },
    {
      "type": "range",
      "id": "secondary_image_border_radius_mobile",
      "label": "Secondary Border Radius - Mobile",
      "min": 0,
      "max": 30,
      "step": 2,
      "unit": "px",
      "default": 10,
      "info": "Rounded corners for mobile secondary image"
    },
    {
      "type": "header",
      "content": "🎨 Legacy Secondary Image (Fallback)"
    },
    {
      "type": "range",
      "id": "secondary_image_height",
      "label": "Legacy Secondary Image Height",
      "min": 200,
      "max": 800,
      "step": 50,
      "unit": "px",
      "default": 400,
      "info": "Used as fallback if desktop setting is not set"
    },
    {
      "type": "range",
      "id": "image_width",
      "label": "Legacy Image Width",
      "min": 50,
      "max": 100,
      "step": 5,
      "unit": "%",
      "default": 100,
      "info": "Used as fallback if desktop setting is not set"
    },
    {
      "type": "range",
      "id": "secondary_image_border_radius",
      "label": "Legacy Secondary Border Radius",
      "min": 0,
      "max": 50,
      "step": 5,
      "unit": "px",
      "default": 15,
      "info": "Used as fallback if desktop setting is not set"
    },
    {
      "type": "select",
      "id": "secondary_image_object_fit_desktop",
      "label": "Secondary Image Object Fit - Desktop",
      "default": "cover",
      "options": [
        { "value": "cover", "label": "Cover (Fill & Crop)" },
        { "value": "contain", "label": "Contain (Fit All)" },
        { "value": "fill", "label": "Fill (Stretch)" },
        { "value": "scale-down", "label": "Scale Down" }
      ],
      "info": "How secondary image should fit on desktop"
    },
    {
      "type": "select",
      "id": "secondary_image_object_fit_mobile",
      "label": "Secondary Image Object Fit - Mobile",
      "default": "cover",
      "options": [
        { "value": "cover", "label": "Cover (Fill & Crop)" },
        { "value": "contain", "label": "Contain (Fit All)" },
        { "value": "fill", "label": "Fill (Stretch)" },
        { "value": "scale-down", "label": "Scale Down" }
      ],
      "info": "How secondary image should fit on mobile"
    },
    {
      "type": "select",
      "id": "secondary_image_object_fit",
      "label": "Legacy Secondary Image Object Fit",
      "default": "cover",
      "options": [
        { "value": "cover", "label": "Cover (Fill & Crop)" },
        { "value": "contain", "label": "Contain (Fit All)" },
        { "value": "fill", "label": "Fill (Stretch)" },
        { "value": "scale-down", "label": "Scale Down" }
      ],
      "info": "Used as fallback if desktop setting is not set"
    },
    {
      "type": "header",
      "content": "🎯 Floating Action Button"
    },
    {
      "type": "checkbox",
      "id": "show_floating_button",
      "label": "Show Floating Button",
      "default": true
    },
    {
      "type": "checkbox",
      "id": "fab_full_width",
      "label": "Full Width Button",
      "default": true,
      "info": "Make button stretch across screen width on all devices"
    },
    {
      "type": "text",
      "id": "fab_text",
      "label": "Button Text",
      "default": "🔥 Special Offer!",
      "info": "Maximum 20 characters"
    },
    {
      "type": "select",
      "id": "fab_position",
      "label": "Button Position",
      "options": [
        {
          "value": "bottom-right",
          "label": "Bottom Right"
        },
        {
          "value": "bottom-left",
          "label": "Bottom Left"
        },
        {
          "value": "bottom-center",
          "label": "Bottom Center"
        },
        {
          "value": "top-right",
          "label": "Top Right"
        },
        {
          "value": "top-left",
          "label": "Top Left"
        },
        {
          "value": "top-center",
          "label": "Top Center"
        }
      ],
      "default": "bottom-right"
    },
    {
      "type": "color",
      "id": "fab_color",
      "label": "Button Color",
      "default": "#ff6b9d"
    },
    {
      "type": "range",
      "id": "fab_size",
      "label": "Button Size",
      "min": 40,
      "max": 80,
      "step": 10,
      "unit": "px",
      "default": 60
    },
    {
      "type": "url",
      "id": "fab_url",
      "label": "Button URL",
      "info": "If URL is provided, button will link to this page. If empty, button will open the modal popup."
    },
    {
      "type": "paragraph",
      "content": "💡 **FAB Behavior**: If you provide a URL above, the button will navigate to that link. If you leave URL empty, the button will open the modal popup (requires 'Show Modal Popup' to be enabled)."
    },
    {
      "type": "header",
      "content": "🎨 FAB Design Controls"
    },
    {
      "type": "color",
      "id": "fab_bg_color",
      "label": "Background Color",
      "default": "#ff6b9d"
    },
    {
      "type": "color",
      "id": "fab_text_color",
      "label": "Text Color",
      "default": "#ffffff"
    },
    {
      "type": "color",
      "id": "fab_hover_bg_color",
      "label": "Hover Background Color",
      "default": "#e55a87"
    },
    {
      "type": "color",
      "id": "fab_hover_text_color",
      "label": "Hover Text Color",
      "default": "#ffffff"
    },
    {
      "type": "text",
      "id": "fab_border",
      "label": "Border Style",
      "default": "none",
      "info": "CSS border property (e.g., 2px solid #333)"
    },
    {
      "type": "text",
      "id": "fab_shadow",
      "label": "Box Shadow",
      "default": "0 4px 15px rgba(0,0,0,0.3)",
      "info": "CSS box-shadow property"
    },
    {
      "type": "text",
      "id": "fab_hover_shadow",
      "label": "Hover Box Shadow",
      "default": "0 6px 20px rgba(0,0,0,0.4)",
      "info": "Box shadow on hover"
    },
    {
      "type": "select",
      "id": "fab_font_weight",
      "label": "Font Weight",
      "options": [
        {"value": "normal", "label": "Normal"},
        {"value": "bold", "label": "Bold"},
        {"value": "500", "label": "Medium"},
        {"value": "600", "label": "Semi Bold"},
        {"value": "700", "label": "Bold"},
        {"value": "800", "label": "Extra Bold"}
      ],
      "default": "bold"
    },
    {
      "type": "text",
      "id": "fab_font_family",
      "label": "Font Family",
      "default": "inherit",
      "info": "Font family name or inherit"
    },
    {
      "type": "text",
      "id": "fab_hover_transform",
      "label": "Hover Transform",
      "default": "scale(1.05)",
      "info": "CSS transform on hover (e.g., scale(1.1), rotate(5deg))"
    },
    {
      "type": "header",
      "content": "📏 Size & Spacing Controls"
    },
    {
      "type": "text",
      "id": "fab_padding",
      "label": "Padding",
      "default": "15px 30px",
      "info": "CSS padding (top/bottom left/right)"
    },
    {
      "type": "range",
      "id": "fab_border_radius",
      "label": "Border Radius",
      "min": 0,
      "max": 50,
      "step": 5,
      "unit": "px",
      "default": 30
    },
    {
      "type": "range",
      "id": "fab_font_size",
      "label": "Font Size",
      "min": 12,
      "max": 24,
      "step": 1,
      "unit": "px",
      "default": 18
    },
    {
      "type": "range",
      "id": "fab_margin",
      "label": "Side Margins",
      "min": 10,
      "max": 60,
      "step": 5,
      "unit": "px",
      "default": 20
    },
    {
      "type": "range",
      "id": "fab_max_width",
      "label": "Maximum Width",
      "min": 300,
      "max": 800,
      "step": 50,
      "unit": "px",
      "default": 500
    },
    {
      "type": "header",
      "content": "📱 Mobile Controls"
    },
    {
      "type": "text",
      "id": "fab_mobile_padding",
      "label": "Mobile Padding",
      "default": "12px 20px"
    },
    {
      "type": "range",
      "id": "fab_mobile_font_size",
      "label": "Mobile Font Size",
      "min": 12,
      "max": 20,
      "step": 1,
      "unit": "px",
      "default": 16
    },
    {
      "type": "range",
      "id": "fab_mobile_border_radius",
      "label": "Mobile Border Radius",
      "min": 10,
      "max": 40,
      "step": 5,
      "unit": "px",
      "default": 25
    },
    {
      "type": "range",
      "id": "fab_mobile_margin",
      "label": "Mobile Side Margins",
      "min": 10,
      "max": 30,
      "step": 5,
      "unit": "px",
      "default": 15
    },
    {
      "type": "range",
      "id": "fab_mobile_max_width",
      "label": "Mobile Max Width",
      "min": 250,
      "max": 500,
      "step": 25,
      "unit": "px",
      "default": 400
    },
    {
      "type": "header",
      "content": "💻 Tablet Controls"
    },
    {
      "type": "text",
      "id": "fab_tablet_padding",
      "label": "Tablet Padding",
      "default": "14px 25px"
    },
    {
      "type": "range",
      "id": "fab_tablet_font_size",
      "label": "Tablet Font Size",
      "min": 14,
      "max": 22,
      "step": 1,
      "unit": "px",
      "default": 17
    },
    {
      "type": "range",
      "id": "fab_tablet_border_radius",
      "label": "Tablet Border Radius",
      "min": 15,
      "max": 45,
      "step": 5,
      "unit": "px",
      "default": 30
    },
    {
      "type": "range",
      "id": "fab_tablet_margin",
      "label": "Tablet Side Margins",
      "min": 10,
      "max": 40,
      "step": 5,
      "unit": "px",
      "default": 20
    },
    {
      "type": "range",
      "id": "fab_tablet_max_width",
      "label": "Tablet Max Width",
      "min": 300,
      "max": 600,
      "step": 25,
      "unit": "px",
      "default": 450
    },
    {
      "type": "header",
      "content": "🖥️ Desktop Settings"
    },
    {
      "type": "range",
      "id": "fab_desktop_font_size",
      "label": "Desktop Font Size",
      "min": 14,
      "max": 24,
      "step": 1,
      "unit": "px",
      "default": 18
    },
    {
      "type": "text",
      "id": "fab_desktop_padding",
      "label": "Desktop Padding",
      "default": "15px 30px",
      "info": "Format: top/bottom left/right (e.g., 15px 30px)"
    },
    {
      "type": "range",
      "id": "fab_desktop_border_radius",
      "label": "Desktop Border Radius",
      "min": 5,
      "max": 50,
      "step": 5,
      "unit": "px",
      "default": 30
    },
    {
      "type": "range",
      "id": "fab_desktop_margin",
      "label": "Desktop Side Margin",
      "min": 20,
      "max": 100,
      "step": 10,
      "unit": "px",
      "default": 40,
      "info": "Space from screen edges when full width is enabled"
    },
    {
      "type": "range",
      "id": "fab_desktop_max_width",
      "label": "Desktop Max Width",
      "min": 400,
      "max": 800,
      "step": 50,
      "unit": "px",
      "default": 600,
      "info": "Maximum width when full width is enabled"
    },
    {
      "type": "header",
      "content": "📱 Mobile Settings"
    },
    {
      "type": "checkbox",
      "id": "fab_show_on_mobile",
      "label": "Show on Mobile",
      "default": true
    },
    {
      "type": "checkbox",
      "id": "fab_mobile_hide_text",
      "label": "Hide Text on Mobile",
      "default": false,
      "info": "Show only icon/emoji on mobile devices"
    },
    {
      "type": "header",
      "content": "🗺️ Modal Popup Settings"
    },
    {
      "type": "checkbox",
      "id": "show_modal",
      "label": "Enable Modal Popup",
      "default": true
    },
    {
      "type": "checkbox",
      "id": "modal_auto_show",
      "label": "Auto Show Modal",
      "default": false,
      "info": "Show modal automatically after page load"
    },
    {
      "type": "range",
      "id": "modal_delay",
      "label": "Auto Show Delay",
      "min": 1000,
      "max": 9000,
      "step": 1000,
      "unit": "ms",
      "default": 5000,
      "info": "Delay before auto-showing modal (milliseconds)"
    },
    {
      "type": "text",
      "id": "modal_title",
      "label": "Modal Title",
      "default": "🎉 Special Limited Offer!"
    },
    {
      "type": "text",
      "id": "modal_subtitle",
      "label": "Modal Subtitle",
      "default": "Don't miss this amazing opportunity!"
    },
    {
      "type": "textarea",
      "id": "modal_description",
      "label": "Modal Description",
      "default": "Get your Labubu pattern now with an exclusive discount!"
    },
    {
      "type": "image_picker",
      "id": "modal_image",
      "label": "Modal Image",
      "info": "Optional image for the modal"
    },
    {
      "type": "header",
      "content": "🎨 Modal Design"
    },
    {
      "type": "range",
      "id": "modal_width",
      "label": "Modal Width",
      "min": 80,
      "max": 95,
      "step": 5,
      "unit": "%",
      "default": 90
    },
    {
      "type": "range",
      "id": "modal_max_width",
      "label": "Modal Max Width",
      "min": 400,
      "max": 800,
      "step": 50,
      "unit": "px",
      "default": 600
    },
    {
      "type": "range",
      "id": "modal_border_radius",
      "label": "Border Radius",
      "min": 0,
      "max": 30,
      "step": 5,
      "unit": "px",
      "default": 15
    },
    {
      "type": "range",
      "id": "modal_padding",
      "label": "Modal Padding",
      "min": 15,
      "max": 40,
      "step": 5,
      "unit": "px",
      "default": 25
    },
    {
      "type": "range",
      "id": "modal_overlay_opacity",
      "label": "Background Opacity",
      "min": 0.3,
      "max": 0.9,
      "step": 0.1,
      "default": 0.6
    },
    {
      "type": "color",
      "id": "modal_background_color",
      "label": "Background Color",
      "default": "#ffffff"
    },
    {
      "type": "color",
      "id": "modal_border_color",
      "label": "Border Color",
      "default": "#f0f0f0"
    },
    {
      "type": "text",
      "id": "modal_header_bg",
      "label": "Header Background",
      "default": "linear-gradient(135deg, #ff6b9d 0%, #4ecdc4 100%)",
      "info": "CSS background property (color or gradient)"
    },
    {
      "type": "color",
      "id": "modal_header_text_color",
      "label": "Header Text Color",
      "default": "#ffffff"
    },
    {
      "type": "color",
      "id": "modal_text_color",
      "label": "Body Text Color",
      "default": "#2c3e50"
    },
    {
      "type": "color",
      "id": "modal_accent_color",
      "label": "Accent Color",
      "default": "#ff6b9d"
    },
    {
      "type": "header",
      "content": "📝 Modal Content"
    },
    {
      "type": "range",
      "id": "modal_title_size",
      "label": "Title Font Size",
      "min": 18,
      "max": 32,
      "step": 2,
      "unit": "px",
      "default": 24
    },
    {
      "type": "range",
      "id": "modal_subtitle_size",
      "label": "Subtitle Font Size",
      "min": 14,
      "max": 24,
      "step": 1,
      "unit": "px",
      "default": 18
    },
    {
      "type": "range",
      "id": "modal_text_size",
      "label": "Text Font Size",
      "min": 12,
      "max": 20,
      "step": 1,
      "unit": "px",
      "default": 16
    },
    {
      "type": "header",
      "content": "🖼️ Modal Image Settings"
    },
    {
      "type": "paragraph",
      "content": "💡 **Responsive Modal Image**: Different image settings for desktop and mobile modal windows."
    },
    {
      "type": "range",
      "id": "modal_image_height_desktop",
      "label": "Modal Image Height - Desktop",
      "min": 150,
      "max": 600,
      "step": 25,
      "unit": "px",
      "default": 300,
      "info": "Modal image height on desktop devices"
    },
    {
      "type": "range",
      "id": "modal_image_height_mobile",
      "label": "Modal Image Height - Mobile",
      "min": 100,
      "max": 400,
      "step": 20,
      "unit": "px",
      "default": 200,
      "info": "Modal image height on mobile devices"
    },
    {
      "type": "range",
      "id": "modal_image_height",
      "label": "Legacy Modal Image Height",
      "min": 150,
      "max": 400,
      "step": 25,
      "unit": "px",
      "default": 200,
      "info": "Used as fallback if desktop setting is not set"
    },
    {
      "type": "header",
      "content": "⏰ Modal Countdown"
    },
    {
      "type": "checkbox",
      "id": "show_modal_countdown",
      "label": "Show Countdown Timer",
      "default": true
    },
    {
      "type": "text",
      "id": "modal_countdown_text",
      "label": "Countdown Text",
      "default": "⏰ Offer expires in:"
    },
    {
      "type": "range",
      "id": "modal_countdown_hours",
      "label": "Countdown Duration",
      "min": 1,
      "max": 24,
      "step": 1,
      "unit": "h",
      "default": 2
    },
    {
      "type": "color",
      "id": "modal_countdown_bg",
      "label": "Countdown Background",
      "default": "#fdf4f5"
    },
    {
      "type": "header",
      "content": "💰 Modal Pricing"
    },
    {
      "type": "checkbox",
      "id": "show_modal_price",
      "label": "Show Pricing",
      "default": true
    },
    {
      "type": "text",
      "id": "modal_original_price",
      "label": "Original Price",
      "default": "14.99"
    },
    {
      "type": "text",
      "id": "modal_sale_price",
      "label": "Sale Price",
      "default": "7.99"
    },
    {
      "type": "text",
      "id": "modal_discount_text",
      "label": "Discount Text",
      "default": "Save 47%!"
    },
    {
      "type": "text",
      "id": "modal_price_bg",
      "label": "Price Background",
      "default": "linear-gradient(135deg, #6bcf7f 0%, #4ecdc4 100%)",
      "info": "CSS background property (color or gradient)"
    },
    {
      "type": "header",
      "content": "🔘 Modal Buttons"
    },
    {
      "type": "text",
      "id": "modal_primary_text",
      "label": "Primary Button Text",
      "default": "🛒 Get Now!"
    },
    {
      "type": "url",
      "id": "modal_primary_url",
      "label": "Primary Button URL"
    },
    {
      "type": "text",
      "id": "modal_secondary_text",
      "label": "Secondary Button Text",
      "default": "Maybe Later"
    },
    {
      "type": "text",
      "id": "modal_btn_padding",
      "label": "Button Padding",
      "default": "12px 30px",
      "info": "Format: top/bottom left/right"
    },
    {
      "type": "range",
      "id": "modal_btn_radius",
      "label": "Button Border Radius",
      "min": 5,
      "max": 50,
      "step": 5,
      "unit": "px",
      "default": 25
    },
    {
      "type": "range",
      "id": "modal_btn_size",
      "label": "Button Font Size",
      "min": 12,
      "max": 20,
      "step": 1,
      "unit": "px",
      "default": 16
    },
    {
      "type": "color",
      "id": "modal_primary_btn_color",
      "label": "Primary Button Color",
      "default": "#ff6b9d"
    },
    {
      "type": "color",
      "id": "modal_primary_btn_text",
      "label": "Primary Button Text",
      "default": "#ffffff"
    },
    {
      "type": "color",
      "id": "modal_primary_btn_hover",
      "label": "Primary Button Hover",
      "default": "#e55a87"
    },
    {
      "type": "color",
      "id": "modal_secondary_btn_color",
      "label": "Secondary Button Color",
      "default": "transparent"
    },
    {
      "type": "color",
      "id": "modal_secondary_btn_text",
      "label": "Secondary Button Text",
      "default": "#666666"
    },
    {
      "type": "header",
      "content": "⏰ Modal Timing Controls"
    },
    {
      "type": "header",
      "content": "🎯 JavaScript Features Control"
    },
    {
      "type": "checkbox",
      "id": "enable_popups",
      "label": "🔌 Load JavaScript File",
      "default": true,
      "info": "Master switch: Controls if JavaScript file is loaded. Individual features below work independently when file is loaded."
    },
    {
      "type": "checkbox",
      "id": "enable_sticky_bar",
      "label": "Enable Sticky Bar",
      "default": true,
      "info": "Controls the visibility of the sticky promotional bar"
    },
    {
      "type": "checkbox",
      "id": "enable_exit_intent",
      "label": "Enable Exit Intent Popup",
      "default": true,
      "info": "Shows popup when user tries to leave the page"
    },
    {
      "type": "checkbox",
      "id": "enable_discount_banner",
      "label": "Enable Discount Banner",
      "default": true,
      "info": "Shows promotional discount notifications"
    },
    {
      "type": "checkbox",
      "id": "enable_urgency_notifications",
      "label": "Enable Urgency Notifications",
      "default": true,
      "info": "Shows time-sensitive promotional messages"
    },
    {
      "type": "header",
      "content": "⏰ Urgency Section Customization"
    },
    {
      "type": "text",
      "id": "urgency_title",
      "label": "Urgency Section Title",
      "default": "⏰ Offer Ends Soon!"
    },
    {
      "type": "textarea",
      "id": "urgency_description",
      "label": "Urgency Description",
      "default": "Don't miss this limited discount - get the pattern at a reduced price now!"
    },
    {
      "type": "color",
      "id": "urgency_bg_color_1",
      "label": "Background Gradient Color 1",
      "default": "#ffb347"
    },
    {
      "type": "color",
      "id": "urgency_bg_color_2", 
      "label": "Background Gradient Color 2",
      "default": "#ff6b9d"
    },
    {
      "type": "color",
      "id": "urgency_text_color",
      "label": "Text Color",
      "default": "#ffffff"
    },
    {
      "type": "color",
      "id": "urgency_timer_bg",
      "label": "Timer Background Color",
      "default": "rgba(255,255,255,0.2)"
    },
    {
      "type": "select",
      "id": "urgency_position",
      "label": "Section Position",
      "options": [
        { "value": "static", "label": "Normal Flow" },
        { "value": "fixed-top", "label": "Fixed at Top" },
        { "value": "fixed-bottom", "label": "Fixed at Bottom" },
        { "value": "sticky-top", "label": "Sticky at Top" }
      ],
      "default": "static",
      "info": "Control how the urgency section behaves on scroll"
    },
    {
      "type": "range",
      "id": "urgency_z_index",
      "label": "Layer Priority (Z-index)",
      "min": 1,
      "max": 100,
      "step": 1,
      "default": 50,
      "info": "Higher number = appears on top of other elements"
    },
    {
      "type": "header",
      "content": "⏰ Countdown Timer Settings"
    },
    {
      "type": "checkbox",
      "id": "enable_countdown_timer",
      "label": "Enable Countdown Timer",
      "default": true,
      "info": "Shows countdown timer in urgency section"
    },
    {
      "type": "select",
      "id": "countdown_type",
      "label": "Countdown Type",
      "options": [
        { "value": "fixed_duration", "label": "Fixed Duration (Hours/Days)" },
        { "value": "specific_date", "label": "Specific End Date" },
        { "value": "daily_reset", "label": "Daily Reset (Midnight)" },
        { "value": "weekly_reset", "label": "Weekly Reset (Sunday)" }
      ],
      "default": "fixed_duration",
      "info": "Choose how the countdown behaves"
    },
    {
      "type": "range",
      "id": "countdown_days",
      "label": "Days to Count Down",
      "min": 0,
      "max": 30,
      "step": 1,
      "default": 3,
      "info": "For Fixed Duration mode"
    },
    {
      "type": "range",
      "id": "countdown_hours",
      "label": "Hours to Count Down",
      "min": 0,
      "max": 23,
      "step": 1,
      "default": 12,
      "info": "For Fixed Duration mode"
    },
    {
      "type": "text",
      "id": "countdown_end_date",
      "label": "End Date (YYYY-MM-DD HH:MM)",
      "default": "2025-12-31 23:59",
      "info": "For Specific Date mode. Format: YYYY-MM-DD HH:MM"
    },
    {
      "type": "checkbox",
      "id": "countdown_auto_restart",
      "label": "Auto Restart When Finished",
      "default": true,
      "info": "Automatically restart countdown when it reaches zero"
    },
    {
      "type": "text",
      "id": "countdown_finished_text",
      "label": "Text When Countdown Finished",
      "default": "🔥 Limited Time Offer Still Available!",
      "info": "Text to show when countdown reaches zero"
    }

  ],
  "blocks": [
    {
      "type": "benefit",
      "name": "💎 Benefit",
      "settings": [
        {
          "type": "text",
          "id": "icon",
          "label": "Icon (Emoji)",
          "default": "✨"
        },
        {
          "type": "text",
          "id": "title",
          "label": "Benefit Title",
          "default": "Amazing Benefit"
        },
        {
          "type": "textarea",
          "id": "description",
          "label": "Benefit Description",
          "default": "Benefit description and how it helps the customer"
        }
      ]
    },
    {
      "type": "testimonial",
      "name": "💬 Testimonial",
      "settings": [
        {
          "type": "textarea",
          "id": "text",
          "label": "Testimonial Text",
          "default": "This pattern is truly amazing! The instructions are clear and the result is stunning!"
        },
        {
          "type": "text",
          "id": "author",
          "label": "Author Name",
          "default": "Sarah Johnson"
        }
      ]
    },
    {
      "type": "included_item",
      "name": "✅ Included Item",
      "settings": [
        {
          "type": "text",
          "id": "icon",
          "label": "Icon (Emoji)",
          "default": "✅"
        },
        {
          "type": "text",
          "id": "title",
          "label": "Item Title",
          "default": "Included Item"
        },
        {
          "type": "textarea",
          "id": "description",
          "label": "Item Description",
          "default": "Description of the item included in the package"
        }
      ]
    },
    {
      "type": "faq",
      "name": "❓ FAQ Item",
      "settings": [
        {
          "type": "text",
          "id": "question",
          "label": "Question",
          "default": "Is the pattern suitable for beginners?"
        },
        {
          "type": "textarea",
          "id": "answer",
          "label": "Answer",
          "default": "Yes! The pattern is designed to be suitable for beginners with detailed step-by-step instructions."
        }
      ]
    }
  ],
  "presets": [
    {
      "name": "Labubu Sales Page 09-10",
      "blocks": [
        {
          "type": "benefit",
          "settings": {
            "icon": "📚",
            "title": "Comprehensive 42+ Page Guide",
            "description": "Detailed and clear instructions with high-quality photos for every step"
          }
        },
        {
          "type": "benefit",
          "settings": {
            "icon": "👶",
            "title": "Beginner Friendly",
            "description": "Even if you're new to crochet, you'll be able to make Labubu easily"
          }
        },
        {
          "type": "benefit",
          "settings": {
            "icon": "⚡",
            "title": "Instant Download",
            "description": "Get the pattern instantly after purchase - no waiting!"
          }
        },
        {
          "type": "benefit",
          "settings": {
            "icon": "💎",
            "title": "Professional Quality",
            "description": "Pattern designed by experts with guaranteed perfect results"
          }
        },
        {
          "type": "benefit",
          "settings": {
            "icon": "🎁",
            "title": "Perfect Gift",
            "description": "Create special and beloved gifts for your children and loved ones"
          }
        },
        {
          "type": "benefit",
          "settings": {
            "icon": "🌟",
            "title": "Lifetime Support",
            "description": "Our support team is ready to help you anytime - for free!"
          }
        },
        {
          "type": "testimonial",
          "settings": {
            "text": "This was my first crochet project and the result was amazing! The instructions are very clear and the photos helped me a lot. My daughter loves her new Labubu!",
            "author": "Emma Johnson - New York"
          }
        },
        {
          "type": "testimonial",
          "settings": {
            "text": "I'm a crochet teacher and I honestly say this is one of the best patterns I've seen. Detailed, organized and suitable for all levels. I highly recommend it!",
            "author": "Sarah Wilson - Los Angeles"
          }
        },
        {
          "type": "testimonial",
          "settings": {
            "text": "I made 5 Labubu pieces as gifts for family children and they all loved them! The pattern is easy to follow and the result is very professional. Worth every penny!",
            "author": "Lisa Martinez - Miami"
          }
        },
        {
          "type": "included_item",
          "settings": {
            "icon": "📖",
            "title": "Complete 42+ Page Guide",
            "description": "Detailed instructions with 9 chapters covering every part of Labubu"
          }
        },
        {
          "type": "included_item",
          "settings": {
            "icon": "📸",
            "title": "12+ Illustrative Photos",
            "description": "High-quality photos for each step with explanatory notes"
          }
        },
        {
          "type": "included_item",
          "settings": {
            "icon": "📋",
            "title": "Quick Reference Guide",
            "description": "Quick summary of stitches and abbreviations table"
          }
        },
        {
          "type": "included_item",
          "settings": {
            "icon": "🔧",
            "title": "Troubleshooting Guide",
            "description": "Solutions for common errors and tips for beginners"
          }
        },
        {
          "type": "included_item",
          "settings": {
            "icon": "🎨",
            "title": "Customization Ideas",
            "description": "Creative ways to vary colors and accessories"
          }
        },
        {
          "type": "included_item",
          "settings": {
            "icon": "📏",
            "title": "Size Adjustments",
            "description": "Instructions for making mini or larger versions"
          }
        },
        {
          "type": "faq",
          "settings": {
            "question": "Is the pattern suitable for beginners?",
            "answer": "Yes absolutely! The pattern is specifically designed to be suitable for beginners with detailed step-by-step instructions and high-quality illustrative photos. Even if this is your first crochet experience, you'll be able to complete the project successfully."
          }
        },
        {
          "type": "faq",
          "settings": {
            "question": "How long do I need to finish the project?",
            "answer": "It depends on your skill level and daily work time. Beginners usually finish the project in 3-5 days with 2 hours daily, while experts might finish it in a day or two."
          }
        },
        {
          "type": "faq",
          "settings": {
            "question": "What materials are required?",
            "answer": "You will need: soft pink yarn (Alize Softy), beige cotton yarn (YarnArt Jeans), a small amount of light yellow yarn, crochet hooks 1.75 and 2.0 mm, polyester stuffing, white felt fabric for eyes, acrylic paints, and basic sewing tools."
          }
        },
        {
          "type": "faq",
          "settings": {
            "question": "Can I download the pattern multiple times?",
            "answer": "Yes! Once you purchase the pattern, you get lifetime access and can download it unlimited times. Keep the download link or save the file to your device."
          }
        },
        {
          "type": "faq",
          "settings": {
            "question": "Is there a money-back guarantee?",
            "answer": "Yes! We offer a 100% money-back guarantee for 30 days. If you're not satisfied with the pattern for any reason, just contact us and we'll refund your money immediately without questions."
          }
        },
        {
          "type": "faq",
          "settings": {
            "question": "Can I sell products made from the pattern?",
            "answer": "Yes! You can sell Labubu made from this pattern, but please don't resell or distribute the pattern itself. You can mention that the product is made from a Pattern Charm pattern."
          }
        }
      ]
    }
  ]
}
{% endschema %}