{% if section.settings.italic_font_family == 'georgia-pro'
  or section.settings.italic_font_family == 'bodoni-moda'
  or section.settings.italic_font_family == 'instrument-serif'
  or section.settings.italic_font_family == 'custom_google_font'
%}
  <link rel="preconnect" href="https://fonts.googleapis.com">
  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
  {% if section.settings.italic_font_family == 'georgia-pro' %}
    <link
      href="https://fonts.googleapis.com/css2?family=Georgia+Pro:ital,wght@0,400;0,600;0,700;1,400;1,600;1,700&display=swap"
      rel="stylesheet"
    >
  {% endif %}
  {% if section.settings.italic_font_family == 'bodoni-moda' %}
    <link
      href="https://fonts.googleapis.com/css2?family=Bodoni+Moda:ital,opsz,wght@0,6..96,400;0,6..96,500;0,6..96,600;0,6..96,700;1,6..96,400;1,6..96,500;1,6..96,600;1,6..96,700&display=swap"
      rel="stylesheet"
    >
  {% endif %}
  {% if section.settings.italic_font_family == 'instrument-serif' %}
    <link href="https://fonts.googleapis.com/css2?family=Instrument+Serif:ital@0;1&display=swap" rel="stylesheet">
  {% endif %}
  {% if section.settings.italic_font_family == 'custom_google_font'
    and section.settings.custom_google_font_name != blank
  %}
    <link
      href="https://fonts.googleapis.com/css2?family={{ section.settings.custom_google_font_name | replace: ' ', '+' }}:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600;1,700&display=swap"
      rel="stylesheet"
    >
  {% endif %}
{% endif %}

<link
  rel="stylesheet"
  href="https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200"
>

{%- style -%}
    /* ── Spacing ──────────────────────────────────────────────────────── */
    .section-{{ section.id }}-padding {
      padding-top: {{ section.settings.padding_top | times: 0.75 | round: 0 }}px;
      padding-bottom: {{ section.settings.padding_bottom | times: 0.75 | round: 0 }}px;
      margin-top: {{ section.settings.margin_top }}px;
      margin-bottom: {{ section.settings.margin_bottom }}px;
    }
    @media screen and (min-width: 750px) {
      .section-{{ section.id }}-padding {
        padding-top: {{ section.settings.padding_top }}px;
        padding-bottom: {{ section.settings.padding_bottom }}px;
      }
    }

    /* ── Custom colour scheme ─────────────────────────────────────────── */
    .color-scheme-{{ section.id }}.color-custom {
      --color-background: {{ section.settings.custom_colors_background.red }}, {{ section.settings.custom_colors_background.green }}, {{ section.settings.custom_colors_background.blue }};
      --gradient-background: {% if section.settings.custom_gradient_background != blank %}{{ section.settings.custom_gradient_background }}{% else %}{{ section.settings.custom_colors_background }}{% endif %};
      {% if section.settings.custom_image_background != blank %}
        {% # theme-check-disable %}
        --gradient-background: url('{{ section.settings.custom_image_background | img_url: 'master' }}') center center / cover no-repeat;
        {% # theme-check-enable %}
      {% endif %}
      --color-foreground: {{ section.settings.custom_colors_text.red }}, {{ section.settings.custom_colors_text.green }}, {{ section.settings.custom_colors_text.blue }};
      --color-button: {{ section.settings.custom_colors_solid_button_background.red }}, {{ section.settings.custom_colors_solid_button_background.green }}, {{ section.settings.custom_colors_solid_button_background.blue }};
      --color-button-text: {{ section.settings.custom_colors_solid_button_text.red }}, {{ section.settings.custom_colors_solid_button_text.green }}, {{ section.settings.custom_colors_solid_button_text.blue }};
      --color-base-outline-button-labels: {{ section.settings.custom_colors_outline_button.red }}, {{ section.settings.custom_colors_outline_button.green }}, {{ section.settings.custom_colors_outline_button.blue }};
      background-attachment: scroll !important;
      transform: translateZ(0);
      backface-visibility: hidden;
      -webkit-backface-visibility: hidden;
      background-position: center center;
      background-repeat: no-repeat;
    }
    {% if section.settings.custom_mobile_image_background != blank %}
      @media screen and (max-width: 740px) {
        .color-scheme-{{ section.id }}.color-custom {
          {% # theme-check-disable %}
          --gradient-background: url('{{ section.settings.custom_mobile_image_background | img_url: 'master' }}') center center / cover no-repeat;
          {% # theme-check-enable %}
        }
      }
    {% endif %}

    /* ── Italic / em styling ──────────────────────────────────────────── */
    #RiskFreeTrial-{{ section.id }} .rft-heading em {
      {% if section.settings.italic_style == 'italic' %}
        text-decoration: none !important;
        font-style: italic !important;
      {% elsif section.settings.italic_style == 'font_family' and section.settings.italic_font_family != 'inherit' %}
        text-decoration: none !important;
        font-style: italic !important;
        {% if section.settings.italic_font_family == 'serif' %}
          font-family: serif !important;
        {% elsif section.settings.italic_font_family == 'georgia-pro' %}
          font-family: 'Georgia Pro', Georgia, serif !important;
        {% elsif section.settings.italic_font_family == 'bodoni-moda' %}
          font-family: 'Bodoni Moda', Georgia, serif !important;
        {% elsif section.settings.italic_font_family == 'instrument-serif' %}
          font-family: 'Instrument Serif', Georgia, serif !important;
        {% elsif section.settings.italic_font_family == 'custom_google_font' and section.settings.custom_google_font_name != blank %}
          font-family: '{{ section.settings.custom_google_font_name }}', sans-serif !important;
        {% elsif section.settings.italic_font_family == 'cursive' %}
          font-family: cursive !important;
        {% endif %}
        {% if section.settings.italic_font_weight != 'inherit' %}
          font-weight: {{ section.settings.italic_font_weight }} !important;
        {% endif %}
      {% else %}
        text-decoration: underline !important;
        font-style: normal !important;
        text-decoration-color: {{ section.settings.underlinetextcolor }} !important;
        text-decoration-thickness: {{ section.settings.underlinethickness }}px !important;
      {% endif %}
    }

    /* ── Gradient heading ─────────────────────────────────────────────── */
    {% if section.settings.enable_gradient %}
      #RiskFreeTrial-{{ section.id }} .rft-heading strong {
        background: {{ section.settings.title_gradient_background }};
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
        font-style: normal;
      }
    {% endif %}

    /* ── Layout ───────────────────────────────────────────────────────── */
    #RiskFreeTrial-{{ section.id }} .rft-inner {
      max-width: 1233px;
      margin-left: auto;
      margin-right: auto;
      padding-left: 20px;
      padding-right: 20px;
    }

    #RiskFreeTrial-{{ section.id }} .rft-grid {
      display: flex;
      flex-wrap: wrap;
      justify-content: space-between;
      align-items: center;
      gap: 40px;
      {% if section.settings.content_side == 'right' %}
        flex-direction: row-reverse;
      {% endif %}
    }

    #RiskFreeTrial-{{ section.id }} .rft-left {
      flex: 1;
      max-width: 494px;
      width: 100%;
      display: flex;
      flex-direction: column;
      align-items: {% if section.settings.heading_alignment == 'center' %}center{% elsif section.settings.heading_alignment == 'right' %}flex-end{% else %}flex-start{% endif %};
      text-align: {{ section.settings.heading_alignment }};
      margin-bottom: 36px;
    }

    {% if section.settings.hide_image %}
    #RiskFreeTrial-{{ section.id }} .rft-grid {
      justify-content: center;
    }
    #RiskFreeTrial-{{ section.id }} .rft-left {
      max-width: 600px;
      align-items: center;
      text-align: center;
    }
  {% endif %}

    #RiskFreeTrial-{{ section.id }} .rft-right {
      flex: 1;
      min-width: 300px;
      text-align: center;
    }

    #RiskFreeTrial-{{ section.id }} .rft-right img {
      width: 100%;
      height: auto;
      max-width: {{ section.settings.image_max_width }}px;
    }

    /* ── Badge ────────────────────────────────────────────────────────── */
    #RiskFreeTrial-{{ section.id }} .rft-badge {
      position: relative;
      display: inline-flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      width: {{ section.settings.badge_size }}px;
      height: {{ section.settings.badge_size }}px;
      {% if section.settings.badge_background_image != blank %}
        {% # theme-check-disable %}
        background-image: url('{{ section.settings.badge_background_image | img_url: 'master' }}');
        {% # theme-check-enable %}
        background-size: contain;
        background-color: transparent;
        background-repeat: no-repeat;
        background-position: center;
      {% endif %}
      color: {{ section.settings.badge_text_color }};
      font-size: {{ section.settings.badge_label_font_size }}px;
      line-height: 1.4;
      font-weight: 400;
      margin-bottom: 8px;
    }

    /* Icon layer — hidden when image is uploaded */
    #RiskFreeTrial-{{ section.id }} .rft-badge__icon {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      display: flex;
      align-items: center;
      justify-content: center;
      pointer-events: none;
      {% if section.settings.badge_background_image != blank %}
        display: none !important;
      {% endif %}
    }

    #RiskFreeTrial-{{ section.id }} .rft-badge__icon .material-symbols-rounded {
      font-size: {{ section.settings.badge_icon_size }}px;
      color: {{ section.settings.badge_icon_color }};
      font-variation-settings:
        'FILL' {{ section.settings.badge_icon_fill }},
        'wght' {{ section.settings.badge_icon_weight }},
        'GRAD' 0,
        'opsz' 48;
      line-height: 1;
      display: block;
    }

    /* Text content sits above the icon */
    #RiskFreeTrial-{{ section.id }} .rft-badge__content {
      position: relative;
      z-index: 1;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
    }

    #RiskFreeTrial-{{ section.id }} .rft-badge__number {
      font-weight: 500;
      font-size: {{ section.settings.badge_number_font_size }}px;
      letter-spacing: 0;
      line-height: 1;
    }

    /* ── Eyebrow ──────────────────────────────────────────────────────── */
    #RiskFreeTrial-{{ section.id }} .rft-eyebrow {
      font-size: 15px;
      font-weight: 400;
      line-height: 30px;
      letter-spacing: 0;
      text-transform: uppercase;
      margin-bottom: 4px;
      color: {{ section.settings.eyebrow_color }};
      display: block !important;
    }

    /* ── Heading ──────────────────────────────────────────────────────── */
    #RiskFreeTrial-{{ section.id }} .rft-heading {
      font-weight: 500;
      margin-top: 0;
      margin-bottom: 17px;
    }

    /* ── Body text ────────────────────────────────────────────────────── */
    #RiskFreeTrial-{{ section.id }} .rft-body {
      font-size: 14px;
      line-height: 1.65;
      margin-bottom: 0;
    }

    /* ── Trust items ──────────────────────────────────────────────────── */
    #RiskFreeTrial-{{ section.id }} .rft-trust-items {
      display: flex;
      flex-wrap: wrap;
      gap: 10px 16px;
      margin-top: 20px;
      justify-content: {% if section.settings.heading_alignment == 'center' %}center{% elsif section.settings.heading_alignment == 'right' %}flex-end{% else %}flex-start{% endif %};
    }

    #RiskFreeTrial-{{ section.id }} .rft-trust-item {
      display: flex;
      align-items: center;
      gap: 6px;
      font-size: 13px;
      font-weight: 500;
    }

    #RiskFreeTrial-{{ section.id }} .rft-trust-item .material-symbols-rounded {
      font-size: 18px;
      color: {{ section.settings.eyebrow_color }};
    }

    /* ── CTA Button ───────────────────────────────────────────────────── */
    #RiskFreeTrial-{{ section.id }} .rft-cta {
      display: inline-flex;
      justify-content: center;
      align-items: center;
      width: fit-content;
      margin-top: {{ section.settings.button_margin_top }}px;
      text-decoration: none;
    }
    {% unless section.settings.show_cta_desktop %}
      @media screen and (min-width: 750px) {
        #RiskFreeTrial-{{ section.id }} .rft-cta {
          display: none !important;
        }
      }
    {% endunless %}
    {% unless section.settings.show_cta_mobile %}
      @media screen and (max-width: 749px) {
        #RiskFreeTrial-{{ section.id }} .rft-cta {
          display: none !important;
        }
      }
    {% endunless %}

    /* ── Visibility ───────────────────────────────────────────────────── */
    {% if section.settings.visibility == 'desktop-hidden' %}
      @media screen and (min-width: 750px) {
        #RiskFreeTrial-{{ section.id }} { display: none !important; }
      }
    {% elsif section.settings.visibility == 'mobile-hidden' %}
      @media screen and (max-width: 749px) {
        #RiskFreeTrial-{{ section.id }} { display: none !important; }
      }
    {% endif %}

    /* ── Mobile ───────────────────────────────────────────────────────── */
    @media screen and (max-width: 749px) {
      #RiskFreeTrial-{{ section.id }} .rft-grid {
        gap: 0;
        flex-direction: column;
      }
      #RiskFreeTrial-{{ section.id }} .rft-left {
        margin-bottom: 22px;
      }
      #RiskFreeTrial-{{ section.id }} .rft-right img {
        max-width: 280px;
        margin: 0 auto;
      }
    }
{%- endstyle -%}

<div
  id="RiskFreeTrial-{{ section.id }}"
  class="risk-free-trial animate-section animate--hidden color-scheme-{{ section.id }} color-{{ section.settings.color_scheme }} gradient section-{{ section.id }}-padding {{ section.settings.visibility }}"
>
  {% if section.settings.display_id %}
    <copy-button class="section-id-btn button" data-content="#shopify-section-{{ section.id }}" data-success="false">
      <span class="copy-text">Click to copy section ID</span>
      <span class="copy-success">ID copied successfully!</span>
    </copy-button>
  {% endif %}

  <div class="rft-inner">
    <div class="rft-grid">
      {%- comment -%} ── Content column ── {%- endcomment -%}
      <div class="rft-left animate-item animate-item--child" style="--index: 0;">
        {% if section.settings.badge_number != blank or section.settings.badge_label != blank %}
          <div class="rft-badge animate-item animate-item--child" style="--index: 1;">
            {%- comment -%} Icon layer — only rendered when no image is uploaded {%- endcomment -%}
            {% if section.settings.badge_background_image == blank %}
              <span class="rft-badge__icon" aria-hidden="true">
                <span class="material-symbols-rounded">{{ section.settings.badge_icon }}</span>
              </span>
            {% endif %}
            {%- comment -%} Text content {%- endcomment -%}
            <span class="rft-badge__content">
              {% if section.settings.badge_number != blank %}
                <span class="rft-badge__number">{{ section.settings.badge_number }}</span>
              {% endif %}
              {% if section.settings.badge_label != blank %}
                <span class="rft-badge__label">{{ section.settings.badge_label }}</span>
              {% endif %}
            </span>
          </div>
        {% endif %}

        {% if section.settings.eyebrow != blank %}
          <span class="rft-eyebrow animate-item animate-item--child" style="--index: 2;">
            {{ section.settings.eyebrow }}
          </span>
        {% endif %}

        {% if section.settings.title != blank %}
          <h2
            class="rft-heading title-with-highlight {{ section.settings.heading_size }} animate-item animate-item--child"
            style="--index: 3; --hightlight-color: {{ section.settings.title_highlight_color }}; --gradient-text: {{ section.settings.title_gradient_background }};"
          >
            {{ section.settings.title }}
          </h2>
        {% endif %}

        {% if section.settings.body_text != blank %}
          <div class="rft-body rte animate-item animate-item--child" style="--index: 4;">
            {{ section.settings.body_text }}
          </div>
        {% endif %}

        {%- assign trust_blocks = section.blocks | where: 'type', 'trust_item' -%}
        {% if trust_blocks.size > 0 %}
          <div class="rft-trust-items animate-item animate-item--child" style="--index: 5;">
            {% for block in trust_blocks %}
              <div class="rft-trust-item" {{ block.shopify_attributes }}>
                {% if block.settings.icon != blank %}
                  <span
                    class="material-symbols-rounded"
                    style="font-variation-settings: 'FILL' {% if block.settings.icon_filled %}1{% else %}0{% endif %}, 'wght' 400, 'GRAD' 0, 'opsz' 20;"
                  >
                    {{- block.settings.icon -}}
                  </span>
                {% endif %}
                {{ block.settings.label }}
              </div>
            {% endfor %}
          </div>
        {% endif %}

        {% if section.settings.cta_label != blank %}
          <a
            href="{{ section.settings.cta_link | default: '#' }}"
            class="rft-cta button animate-item animate-item--child"
            style="--index: 6;"
          >
            {{ section.settings.cta_label }}
          </a>
        {% endif %}
      </div>

      {%- comment -%} ── Image column ── {%- endcomment -%}
      {% if section.settings.image != blank and section.settings.hide_image == false %}
        <div class="rft-right animate-item animate-item--child" style="--index: 7;">
          {{
            section.settings.image
            | image_url: width: 800
            | image_tag:
              loading: 'lazy',
              widths: '300, 400, 600, 800',
              sizes: '(min-width: 750px) 400px, 280px',
              alt: section.settings.image.alt
            | default: section.settings.title
          }}
        </div>
      {% endif %}
    </div>
  </div>
</div>

{% schema %}
{
  "name": "Risk-Free Trial",
  "tag": "section",
  "class": "section",
  "disabled_on": {
    "groups": ["header", "footer"]
  },
  "settings": [
    {
      "type": "checkbox",
      "id": "display_id",
      "label": "Display section ID",
      "info": "ID can be used to be put inside any button link and the button will scroll to this section.",
      "default": false
    },
    {
      "type": "select",
      "id": "visibility",
      "options": [
        {
          "value": "desktop-hidden",
          "label": "Mobile only"
        },
        {
          "value": "mobile-hidden",
          "label": "Desktop only"
        },
        {
          "value": "always-display",
          "label": "All devices"
        }
      ],
      "label": "Display on",
      "default": "always-display"
    },
    {
      "type": "header",
      "content": "General"
    },
    {
      "type": "select",
      "id": "content_side",
      "label": "Content side (desktop)",
      "options": [
        {
          "value": "left",
          "label": "Left"
        },
        {
          "value": "right",
          "label": "Right"
        }
      ],
      "default": "left"
    },
    {
      "type": "select",
      "id": "heading_alignment",
      "label": "Content alignment",
      "options": [
        {
          "value": "left",
          "label": "Left"
        },
        {
          "value": "center",
          "label": "Center"
        },
        {
          "value": "right",
          "label": "Right"
        }
      ],
      "default": "center"
    },
    {
      "type": "text",
      "id": "eyebrow",
      "label": "Eyebrow text",
      "default": "Feel the difference"
    },
    {
      "type": "color",
      "id": "eyebrow_color",
      "label": "Eyebrow / icon color",
      "default": "#095946"
    },
    {
      "type": "inline_richtext",
      "id": "title",
      "label": "Heading",
      "default": "30-Day <em>Risk-Free</em> Trial",
      "info": "Bold certain words to highlight them with a different color."
    },
    {
      "type": "select",
      "id": "heading_size",
      "options": [
        {
          "value": "h2",
          "label": "Small"
        },
        {
          "value": "h1",
          "label": "Medium"
        },
        {
          "value": "h0",
          "label": "Large"
        }
      ],
      "default": "h1",
      "label": "Heading size"
    },
    {
      "type": "color",
      "id": "title_highlight_color",
      "label": "Heading highlight color",
      "default": "#6D388B"
    },
    {
      "type": "checkbox",
      "id": "enable_gradient",
      "label": "Enable gradient for bold text",
      "default": false,
      "info": "Override solid color with gradient for bold text"
    },
    {
      "type": "color_background",
      "id": "title_gradient_background",
      "label": "Gradient highlight",
      "default": "linear-gradient(45deg, #5d5aaf 0%, #ff6b9d 100%)",
      "info": "Used when gradient is enabled"
    },
    {
      "type": "header",
      "content": "Italic Text Styling",
      "info": "Choose how italic text (created with *text*) should be displayed"
    },
    {
      "type": "select",
      "id": "italic_style",
      "label": "Italic Text Style",
      "options": [
        {
          "value": "italic",
          "label": "Normal Italic"
        },
        {
          "value": "underline",
          "label": "Underline"
        },
        {
          "value": "font_family",
          "label": "Custom Font Family"
        }
      ],
      "default": "italic",
      "info": "Choose to either underline italic text or use a custom font family"
    },
    {
      "type": "color",
      "id": "underlinetextcolor",
      "label": "Underline color",
      "default": "#FF0000",
      "info": "Used when 'Underline' style is selected"
    },
    {
      "type": "range",
      "id": "underlinethickness",
      "min": 1,
      "max": 8,
      "step": 1,
      "unit": "px",
      "label": "Underline thickness",
      "default": 3,
      "info": "Used when 'Underline' style is selected"
    },
    {
      "type": "select",
      "id": "italic_font_family",
      "label": "Italic Text Font Family",
      "options": [
        {
          "value": "inherit",
          "label": "Default (Inherit)"
        },
        {
          "value": "serif",
          "label": "Serif"
        },
        {
          "value": "instrument-serif",
          "label": "Instrument Serif"
        },
        {
          "value": "georgia-pro",
          "label": "Georgia Pro"
        },
        {
          "value": "bodoni-moda",
          "label": "Bodoni Moda"
        },
        {
          "value": "cursive",
          "label": "Cursive"
        },
        {
          "value": "custom_google_font",
          "label": "Custom Google Font"
        }
      ],
      "default": "serif",
      "info": "Used when 'Custom Font Family' style is selected"
    },
    {
      "type": "text",
      "id": "custom_google_font_name",
      "label": "Custom Google Font Name",
      "info": "Enter the exact Google Font family name (e.g., 'Roboto', 'Open Sans', 'Playfair Display'). Font will be loaded from Google Fonts automatically. Browse fonts at https://fonts.google.com/"
    },
    {
      "type": "select",
      "id": "italic_font_weight",
      "label": "Italic Text Font Weight",
      "options": [
        {
          "value": "inherit",
          "label": "Default (Inherit)"
        },
        {
          "value": "300",
          "label": "Light (300)"
        },
        {
          "value": "400",
          "label": "Normal (400)"
        },
        {
          "value": "500",
          "label": "Medium (500)"
        },
        {
          "value": "600",
          "label": "Semi Bold (600)"
        },
        {
          "value": "700",
          "label": "Bold (700)"
        },
        {
          "value": "800",
          "label": "Extra Bold (800)"
        },
        {
          "value": "900",
          "label": "Black (900)"
        }
      ],
      "default": "inherit",
      "info": "Used when 'Custom Font Family' style is selected"
    },
    {
      "type": "richtext",
      "id": "body_text",
      "label": "Body text",
      "default": "<p>We're so confident in the quality of our product that we offer a satisfaction guarantee. If you're not completely satisfied with your purchase, simply return the item within 30 days for a full refund.</p>"
    },
    {
      "type": "header",
      "content": "Badge"
    },
    {
      "type": "text",
      "id": "badge_number",
      "label": "Badge number",
      "default": "30"
    },
    {
      "type": "text",
      "id": "badge_label",
      "label": "Badge label",
      "default": "DAYS"
    },
    {
      "type": "image_picker",
      "id": "badge_background_image",
      "label": "Badge background image",
      "info": "If set, replaces the icon below. Leave blank to use the Material icon."
    },
    {
      "type": "header",
      "content": "Badge icon",
      "info": "Used when no background image is uploaded."
    },
    {
      "type": "text",
      "id": "badge_icon",
      "label": "Icon name",
      "default": "shield",
      "info": "Material Symbols name. Browse at fonts.google.com/icons"
    },
    {
      "type": "color",
      "id": "badge_icon_color",
      "label": "Icon color",
      "default": "#095946"
    },
    {
      "type": "range",
      "id": "badge_icon_size",
      "min": 40,
      "max": 180,
      "step": 4,
      "unit": "px",
      "label": "Icon size",
      "default": 108
    },
    {
      "type": "select",
      "id": "badge_icon_fill",
      "label": "Icon fill",
      "options": [
        {
          "value": "0",
          "label": "Outlined"
        },
        {
          "value": "1",
          "label": "Filled"
        }
      ],
      "default": "1"
    },
    {
      "type": "select",
      "id": "badge_icon_weight",
      "label": "Icon weight",
      "options": [
        {
          "value": "100",
          "label": "Thin (100)"
        },
        {
          "value": "200",
          "label": "Extra Light (200)"
        },
        {
          "value": "300",
          "label": "Light (300)"
        },
        {
          "value": "400",
          "label": "Regular (400)"
        },
        {
          "value": "500",
          "label": "Medium (500)"
        },
        {
          "value": "600",
          "label": "Semi Bold (600)"
        },
        {
          "value": "700",
          "label": "Bold (700)"
        }
      ],
      "default": "400"
    },
    {
      "type": "range",
      "id": "badge_size",
      "min": 60,
      "max": 180,
      "step": 4,
      "unit": "px",
      "label": "Badge size",
      "default": 108
    },
    {
      "type": "color",
      "id": "badge_text_color",
      "label": "Badge text color",
      "default": "#ffffff"
    },
    {
      "type": "range",
      "id": "badge_number_font_size",
      "min": 16,
      "max": 72,
      "step": 2,
      "unit": "px",
      "label": "Badge number font size",
      "default": 38
    },
    {
      "type": "range",
      "id": "badge_label_font_size",
      "min": 8,
      "max": 32,
      "step": 1,
      "unit": "px",
      "label": "Badge label font size",
      "default": 15
    },
    {
      "type": "header",
      "content": "CTA Button"
    },
    {
      "type": "text",
      "id": "cta_label",
      "label": "Button label",
      "default": "Try Risk-Free Today"
    },
    {
      "type": "url",
      "id": "cta_link",
      "label": "Button link"
    },
    {
      "type": "range",
      "id": "button_margin_top",
      "min": 0,
      "max": 60,
      "step": 4,
      "unit": "px",
      "label": "Button top spacing",
      "default": 20
    },
    {
      "type": "checkbox",
      "id": "show_cta_desktop",
      "label": "Show button on desktop",
      "default": false
    },
    {
      "type": "checkbox",
      "id": "show_cta_mobile",
      "label": "Show button on mobile",
      "default": true
    },
    {
      "type": "header",
      "content": "Image"
    },
    {
      "type": "checkbox",
      "id": "hide_image",
      "label": "Hide image",
      "default": false,
      "info": "When enabled, the image is hidden and all content is centered on desktop."
    },
    {
      "type": "image_picker",
      "id": "image",
      "label": "Image"
    },
    {
      "type": "range",
      "id": "image_max_width",
      "min": 200,
      "max": 600,
      "step": 20,
      "unit": "px",
      "label": "Max image width",
      "default": 400
    },
    {
      "type": "select",
      "id": "color_scheme",
      "options": [
        {
          "value": "accent-1",
          "label": "Accent 1"
        },
        {
          "value": "accent-2",
          "label": "Accent 2"
        },
        {
          "value": "background-1",
          "label": "Background 1"
        },
        {
          "value": "background-2",
          "label": "Background 2"
        },
        {
          "value": "inverse",
          "label": "Inverse"
        },
        {
          "value": "custom",
          "label": "Custom"
        }
      ],
      "default": "background-2",
      "label": "Color scheme",
      "info": "Custom color scheme is edited at the bottom of section settings."
    },
    {
      "type": "header",
      "content": "t:sections.all.padding.section_padding_heading"
    },
    {
      "type": "range",
      "id": "padding_top",
      "min": 0,
      "max": 100,
      "step": 4,
      "unit": "px",
      "label": "t:sections.all.padding.padding_top",
      "default": 28
    },
    {
      "type": "range",
      "id": "padding_bottom",
      "min": 0,
      "max": 100,
      "step": 4,
      "unit": "px",
      "label": "t:sections.all.padding.padding_bottom",
      "default": 0
    },
    {
      "type": "range",
      "id": "margin_top",
      "min": 0,
      "max": 100,
      "step": 4,
      "unit": "px",
      "label": "Margin top",
      "default": 0
    },
    {
      "type": "range",
      "id": "margin_bottom",
      "min": 0,
      "max": 100,
      "step": 4,
      "unit": "px",
      "label": "Margin bottom",
      "default": 0
    },
    {
      "type": "header",
      "content": "Custom color scheme",
      "info": "Applied if Color scheme setting is set to Custom."
    },
    {
      "type": "color",
      "id": "custom_colors_background",
      "default": "#F1F3EA",
      "label": "Background color"
    },
    {
      "type": "color_background",
      "id": "custom_gradient_background",
      "label": "Gradient background",
      "info": "If added, replaces Background color when applicable."
    },
    {
      "type": "image_picker",
      "id": "custom_image_background",
      "label": "Image background"
    },
    {
      "type": "image_picker",
      "id": "custom_mobile_image_background",
      "label": "Mobile image background",
      "info": "If empty, the Image background will also be applied to mobile devices"
    },
    {
      "type": "color",
      "id": "custom_colors_text",
      "default": "#2E2A39",
      "label": "Text"
    },
    {
      "type": "color",
      "id": "custom_colors_solid_button_background",
      "default": "#095946",
      "label": "Solid button background"
    },
    {
      "type": "color",
      "id": "custom_colors_solid_button_text",
      "default": "#ffffff",
      "label": "Solid button label"
    },
    {
      "type": "color",
      "id": "custom_colors_outline_button",
      "default": "#095946",
      "label": "Outline button"
    }
  ],
  "blocks": [
    {
      "type": "trust_item",
      "name": "Trust item",
      "settings": [
        {
          "type": "text",
          "id": "icon",
          "label": "Icon name",
          "default": "check_circle",
          "info": "Use a Material Symbols name, e.g. check_circle, verified, lock"
        },
        {
          "type": "checkbox",
          "id": "icon_filled",
          "label": "Filled icon",
          "default": false
        },
        {
          "type": "text",
          "id": "label",
          "label": "Label",
          "default": "No questions asked"
        }
      ]
    }
  ],
  "presets": [
    {
      "name": "Risk-Free Trial",
      "category": "Content",
      "settings": {
        "badge_number": "30",
        "badge_label": "DAYS",
        "badge_icon": "shield",
        "badge_icon_color": "#095946",
        "badge_icon_size": 108,
        "badge_icon_fill": "1",
        "badge_icon_weight": "400",
        "badge_size": 108,
        "badge_text_color": "#ffffff",
        "badge_number_font_size": 38,
        "badge_label_font_size": 15,
        "eyebrow": "Feel the difference",
        "eyebrow_color": "#095946",
        "title": "30-Day <em>Risk-Free</em> Trial",
        "heading_size": "h1",
        "heading_alignment": "center",
        "content_side": "left",
        "body_text": "<p>We're so confident in the quality of our product that we offer a satisfaction guarantee. If you're not completely satisfied with your purchase, simply return the item within 30 days for a full refund.</p>",
        "cta_label": "Try Risk-Free Today",
        "button_margin_top": 20,
        "show_cta_desktop": false,
        "show_cta_mobile": true,
        "image_max_width": 400,
        "color_scheme": "background-2",
        "custom_colors_background": "#F1F3EA",
        "custom_colors_text": "#2E2A39",
        "custom_colors_solid_button_background": "#095946",
        "custom_colors_solid_button_text": "#ffffff",
        "custom_colors_outline_button": "#095946",
        "italic_style": "italic",
        "padding_top": 28,
        "padding_bottom": 0
      },
      "blocks": [
        {
          "type": "trust_item",
          "settings": {
            "icon": "check_circle",
            "label": "Full refund guarantee"
          }
        },
        {
          "type": "trust_item",
          "settings": {
            "icon": "lock",
            "label": "No questions asked"
          }
        },
        {
          "type": "trust_item",
          "settings": {
            "icon": "verified",
            "label": "Free return shipping"
          }
        }
      ]
    }
  ]
}
{% endschema %}
