{%- comment -%} MW · Footer — dark newsletter footer with link columns and socials. {%- endcomment -%}
{%- assign uid = section.id | replace: '_', '' | replace: '-', '' -%}
{% style %}
  #shopify-section-{{ section.id }}{ --ft-bg:{{ section.settings.bg_color }}; --ft-head:{{ section.settings.heading_color }}; --ft-text:{{ section.settings.text_color }}; --ft-link:{{ section.settings.link_color }}; --ft-line:{{ section.settings.divider_color }}; --ft-btn:{{ section.settings.button_bg }}; --ft-btntx:{{ section.settings.button_text_color }}; --ft-field:{{ section.settings.field_border }}; }
  .ft-{{ uid }}{ background:var(--ft-bg); padding:{{ section.settings.padding_top }}px {{ section.settings.side_padding }}px {{ section.settings.padding_bottom }}px; }
  .ft-{{ uid }} .ft__wrap{ max-width:{{ section.settings.max_width }}px; margin:0 auto; }
  .ft-{{ uid }} .ft__news{ display:grid; grid-template-columns:1.2fr auto; align-items:center; gap:clamp(20px,4vw,60px); padding-bottom:28px; }
  .ft-{{ uid }} .ft__nh{ font-family:{{ section.settings.serif_font.family }},{{ section.settings.serif_font.fallback_families }}; font-style:italic; font-weight:500; font-size:clamp(22px,2.4vw,30px); color:var(--ft-head); margin:0 0 8px; }
  .ft-{{ uid }} .ft__ns{ font-family:{{ section.settings.body_font.family }},{{ section.settings.body_font.fallback_families }}; font-size:14px; line-height:1.55; color:var(--ft-text); margin:0; max-width:48ch; }
  .ft-{{ uid }} .ft__form{ display:flex; gap:10px; flex-wrap:wrap; }
  .ft-{{ uid }} .ft__form input{ background:transparent; border:1px solid var(--ft-field); border-radius:4px; padding:13px 16px; color:var(--ft-head); font-size:14px; min-width:150px; font-family:inherit; }
  .ft-{{ uid }} .ft__form input::placeholder{ color:var(--ft-text); }
  .ft-{{ uid }} .ft__form button{ background:var(--ft-btn); color:var(--ft-btntx); border:0; border-radius:4px; padding:13px 24px; font-family:{{ section.settings.heading_font.family }},{{ section.settings.heading_font.fallback_families }}; font-weight:600; font-size:14px; cursor:pointer; }
  .ft-{{ uid }} .ft__hr{ border:0; border-top:1px solid var(--ft-line); margin:6px 0 34px; }
  .ft-{{ uid }} .ft__cols{ display:grid; grid-template-columns:1.4fr repeat({{ section.blocks | where: 'type','menu' | size }},1fr) auto; gap:clamp(20px,3vw,48px); }
  .ft-{{ uid }} .ft__about{ font-family:{{ section.settings.body_font.family }},{{ section.settings.body_font.fallback_families }}; font-size:13.5px; line-height:1.6; color:var(--ft-text); }
  .ft-{{ uid }} .ft__about p{ margin:0 0 12px; }
  .ft-{{ uid }} .ft__chat{ display:inline-flex; align-items:center; gap:9px; background:rgba(255,255,255,.06); border:1px solid var(--ft-line); border-radius:999px; padding:8px 14px; font-size:12.5px; color:var(--ft-text); }
  .ft-{{ uid }} .ft__chat img{ width:22px; height:22px; border-radius:50%; object-fit:cover; }
  .ft-{{ uid }} .ft__ch{ font-family:{{ section.settings.heading_font.family }},{{ section.settings.heading_font.fallback_families }}; font-weight:600; font-size:13px; letter-spacing:.02em; color:var(--ft-head); margin:0 0 14px; }
  .ft-{{ uid }} .ft__col a{ display:block; font-family:{{ section.settings.body_font.family }},{{ section.settings.body_font.fallback_families }}; font-size:13.5px; color:var(--ft-link); text-decoration:none; margin:0 0 10px; }
  .ft-{{ uid }} .ft__col a:hover{ color:var(--ft-head); }
  .ft-{{ uid }} .ft__social{ display:flex; gap:12px; }
  .ft-{{ uid }} .ft__social a{ color:var(--ft-head); opacity:.85; }
  .ft-{{ uid }} .ft__social svg{ width:20px; height:20px; }
  @media (max-width:820px){ .ft-{{ uid }} .ft__news{ grid-template-columns:1fr; } .ft-{{ uid }} .ft__cols{ grid-template-columns:1fr 1fr; } }
  @media (max-width:520px){ .ft-{{ uid }} .ft__cols{ grid-template-columns:1fr; } }
{% endstyle %}
<div class="ft-{{ uid }}">
  <div class="ft__wrap">
    {%- if section.settings.newsletter_heading != blank -%}
    <div class="ft__news">
      <div>
        <h2 class="ft__nh">{{ section.settings.newsletter_heading | escape }}</h2>
        <p class="ft__ns">{{ section.settings.newsletter_sub | escape }}</p>
      </div>
      {% form 'customer' %}
        <input type="hidden" name="contact[tags]" value="newsletter">
        <div class="ft__form">
          <input type="text" name="contact[first_name]" placeholder="{{ section.settings.name_placeholder | escape }}" aria-label="First name">
          <input type="email" name="contact[email]" placeholder="{{ section.settings.email_placeholder | escape }}" aria-label="Email" required>
          <button type="submit">{{ section.settings.button_label | escape }}</button>
        </div>
      {% endform %}
    </div>
    <hr class="ft__hr">
    {%- endif -%}
    <div class="ft__cols">
      <div class="ft__about">
        {%- if section.settings.about != blank -%}<div>{{ section.settings.about }}</div>{%- endif -%}
        {%- if section.settings.chat_text != blank -%}<span class="ft__chat">{% render 'mw-image', image: section.settings.chat_avatar, url: section.settings.chat_avatar_url, width: 60 %}{{ section.settings.chat_text | escape }}</span>{%- endif -%}
      </div>
      {%- for block in section.blocks -%}{%- if block.type == 'menu' -%}
        <div class="ft__col" {{ block.shopify_attributes }}>
          <p class="ft__ch">{{ block.settings.heading | escape }}</p>
          {%- assign lines = block.settings.links | newline_to_br | split: '<br />' -%}
          {%- for line in lines -%}{%- assign parts = line | strip | split: '|' -%}{%- if parts[0] != blank -%}<a href="{{ parts[1] | default: '#' | strip }}">{{ parts[0] | strip | escape }}</a>{%- endif -%}{%- endfor -%}
        </div>
      {%- endif -%}{%- endfor -%}
      <div class="ft__col">
        {%- if section.settings.social_heading != blank -%}<p class="ft__ch">{{ section.settings.social_heading | escape }}</p>{%- endif -%}
        <div class="ft__social">
          {%- if section.settings.facebook != blank -%}<a href="{{ section.settings.facebook }}" aria-label="Facebook"><svg viewBox="0 0 24 24" fill="currentColor"><path d="M14 9h3V5h-3c-2.2 0-4 1.8-4 4v2H7v4h3v6h4v-6h3l1-4h-4V9c0-.6.4-1 1-1z"/></svg></a>{%- endif -%}
          {%- if section.settings.instagram != blank -%}<a href="{{ section.settings.instagram }}" aria-label="Instagram"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7"><rect x="3" y="3" width="18" height="18" rx="5"/><circle cx="12" cy="12" r="4"/><circle cx="17.5" cy="6.5" r="1" fill="currentColor" stroke="none"/></svg></a>{%- endif -%}
          {%- if section.settings.youtube != blank -%}<a href="{{ section.settings.youtube }}" aria-label="YouTube"><svg viewBox="0 0 24 24" fill="currentColor"><path d="M22 8.2a3 3 0 0 0-2.1-2.1C18 5.6 12 5.6 12 5.6s-6 0-7.9.5A3 3 0 0 0 2 8.2 31 31 0 0 0 1.6 12 31 31 0 0 0 2 15.8a3 3 0 0 0 2.1 2.1c1.9.5 7.9.5 7.9.5s6 0 7.9-.5a3 3 0 0 0 2.1-2.1A31 31 0 0 0 22.4 12 31 31 0 0 0 22 8.2zM10 15V9l5.2 3z"/></svg></a>{%- endif -%}
          {%- if section.settings.tiktok != blank -%}<a href="{{ section.settings.tiktok }}" aria-label="TikTok"><svg viewBox="0 0 24 24" fill="currentColor"><path d="M16.5 3c.3 2.1 1.5 3.5 3.5 3.7v2.4c-1.3.1-2.5-.3-3.6-1v6.3c0 3.2-2.4 5.6-5.5 5.6A5.4 5.4 0 0 1 5.5 14c0-3.3 3-5.8 6.4-5.2v2.6c-.4-.1-.9-.2-1.3-.2-1.5 0-2.7 1.3-2.5 2.9.1 1.3 1.2 2.2 2.5 2.2 1.4 0 2.4-1 2.4-2.6V3h3.5z"/></svg></a>{%- endif -%}
        </div>
      </div>
    </div>
  </div>
</div>
{% schema %}
{
  "name": "MW · Footer",
  "tag": "section",
  "class": "mw-section mw-footer",
  "settings": [
    { "type": "header", "content": "Newsletter" },
    { "type": "text", "id": "newsletter_heading", "label": "Heading", "default": "First to know, first to wear" },
    { "type": "textarea", "id": "newsletter_sub", "label": "Sub", "default": "Early access to new colourways, restocks and subscriber-only pieces. No spam, unsubscribe any time." },
    { "type": "text", "id": "name_placeholder", "label": "Name placeholder", "default": "First Name" },
    { "type": "text", "id": "email_placeholder", "label": "Email placeholder", "default": "Your Email" },
    { "type": "text", "id": "button_label", "label": "Button label", "default": "Subscribe" },
    { "type": "header", "content": "Brand column" },
    { "type": "richtext", "id": "about", "label": "About text", "default": "<p>Hand-finished knitwear made to be worn, washed and worn again.</p><p>Premium brand from Germany 🇩🇪</p>" },
    { "type": "image_picker", "id": "chat_avatar", "label": "Chat avatar" },
    { "type": "text", "id": "chat_avatar_url", "label": "…or chat avatar URL" },
    { "type": "text", "id": "chat_text", "label": "Chat line", "default": "Questions? Our team replies within a few hours." },
    { "type": "header", "content": "Social" },
    { "type": "text", "id": "social_heading", "label": "Heading", "default": "Follow us" },
    { "type": "url", "id": "facebook", "label": "Facebook" },
    { "type": "url", "id": "instagram", "label": "Instagram" },
    { "type": "url", "id": "youtube", "label": "YouTube" },
    { "type": "url", "id": "tiktok", "label": "TikTok" },
    { "type": "header", "content": "Layout & colour" },
    { "type": "range", "id": "max_width", "min": 900, "max": 1400, "step": 10, "unit": "px", "label": "Content width", "default": 1200 },
    { "type": "range", "id": "padding_top", "min": 0, "max": 160, "step": 4, "unit": "px", "label": "Padding top", "default": 56 },
    { "type": "range", "id": "padding_bottom", "min": 0, "max": 160, "step": 4, "unit": "px", "label": "Padding bottom", "default": 44 },
    { "type": "range", "id": "side_padding", "min": 12, "max": 64, "step": 2, "unit": "px", "label": "Side padding", "default": 24 },
    { "type": "font_picker", "id": "heading_font", "label": "Heading font", "default": "poppins_n6" },
    { "type": "font_picker", "id": "serif_font", "label": "Newsletter serif font", "default": "cormorant_n6" },
    { "type": "font_picker", "id": "body_font", "label": "Body font", "default": "inter_n4" },
    { "type": "color", "id": "bg_color", "label": "Background", "default": "#241C15" },
    { "type": "color", "id": "heading_color", "label": "Headings", "default": "#EFE7DA" },
    { "type": "color", "id": "text_color", "label": "Body text", "default": "#A99C8A" },
    { "type": "color", "id": "link_color", "label": "Links", "default": "#C9BCA9" },
    { "type": "color", "id": "divider_color", "label": "Divider", "default": "#463A2C" },
    { "type": "color", "id": "field_border", "label": "Field border", "default": "#5A4C3B" },
    { "type": "color", "id": "button_bg", "label": "Button", "default": "#D6C19E" },
    { "type": "color", "id": "button_text_color", "label": "Button text", "default": "#2A2015" }
  ],
  "blocks": [
    { "type": "menu", "name": "Link column", "settings": [
      { "type": "text", "id": "heading", "label": "Heading", "default": "Shop" },
      { "type": "textarea", "id": "links", "label": "Links", "info": "One per line: Label | /url", "default": "Clothing | /collections/clothing\nAccessories | /collections/accessories\nShop All | /collections/all\nContact | /pages/contact" }
    ] }
  ],
  "max_blocks": 4,
  "presets": [ { "name": "MW · Footer", "blocks": [
    { "type": "menu", "settings": { "heading": "Shop", "links": "Clothing | /collections/clothing\nPlush & Cozy | /collections/plush\nAccessories | /collections/accessories\nShop All | /collections/all\nContact | /pages/contact" } },
    { "type": "menu", "settings": { "heading": "Important Links", "links": "About Us | /pages/about\nRefund Policy | /policies/refund-policy\nShipping Policy | /policies/shipping-policy\nTrack your order | /pages/track-order" } }
  ] } ]
}
{% endschema %}