/** Shopify CDN: Minification failed

Line 16:0 Unexpected "{"
Line 16:1 Unexpected "{"
Line 16:3 Expected identifier but found "'section-main-password.css'"
Line 18:0 Unexpected "{"
Line 18:1 Expected identifier but found "%"
Line 28:0 Unexpected "<"
Line 29:3 Expected identifier but found "%"
Line 30:4 Unexpected "<"
Line 39:66 Unterminated string token
Line 40:15 Unexpected "{"
... and 39 more hidden warnings

**/
{{ 'section-main-password.css' | asset_url | stylesheet_tag }}

{%- liquid
  assign background_image = section.settings.background_image
  assign mobile_image = section.settings.mobile_background_image
  assign display_mobile_image = mobile_image | default: background_image
  assign background_alt = background_image.alt
  if background_alt == blank
    assign background_alt = 'templates.password.background_alt' | t
  endif
-%}

<div class="password{% if background_image != blank %} password--has-image{% endif %}">
  {%- if background_image != blank -%}
    <img
      src="{{ display_mobile_image | image_url: width: 750 }}"
      alt="{{ background_alt | escape }}"
      loading="eager"
      fetchpriority="high"
      class="password__background password__background--mobile">

    <img
      src="{{ background_image | image_url: width: 1600 }}"
      srcset="{{ background_image | image_url: width: 750 }} 750w,
              {{ background_image | image_url: width: 1200 }} 1200w,
              {{ background_image | image_url: width: 1600 }} 1600w,
              {{ background_image | image_url: width: 2000 }} 2000w"
      sizes="100vw"
      width="{{ background_image.width }}"
      height="{{ background_image.height }}"
      alt="{{ background_alt | escape }}"
      loading="eager"
      fetchpriority="high"
      class="password__background password__background--desktop">
  {%- endif -%}

  <div class="container password__inner" style="display:flex; flex-direction:column; justify-content:space-between; min-height:100vh;">
    <a href="{{ routes.root_url }}" class="wordmark password__wordmark">
      {%- comment -%}{%- render 'brand-constants', part: 'wordmark' -%}{%- endcomment -%}
    </a>

    <div style="padding-bottom: 10vh; padding-top: 20vh;">
      {%- form 'storefront_password', class: 'password__form' -%}
        <label class="visually-hidden" for="PasswordInput">
          {{- 'templates.password.password_label' | t -}}
        </label>
        <input
          type="password"
          id="PasswordInput"
          name="password"
          class="password__input"
          placeholder="{{ 'templates.password.password_placeholder' | t }}"
          autocomplete="current-password"
          required>
        <button type="submit" class="btn btn--primary password__submit">
          {{- 'templates.password.submit' | t -}}
        </button>

        {%- if form.errors -%}
          <p class="password__error" role="alert">{{ 'templates.password.error' | t }}</p>
        {%- endif -%}
      {%- endform -%}
    </div>
  </div>
</div>

{% schema %}
{
  "name": "Contraseña",
  "settings": [
    {
      "type": "image_picker",
      "id": "background_image",
      "label": "Imagen de fondo",
      "info": "Opcional. Según docs/image-manifest.md. Se deja vacío para el fondo plano crema."
    },
    {
      "type": "image_picker",
      "id": "mobile_background_image",
      "label": "Imagen de fondo (móvil)",
      "info": "Opcional. Si se deja vacío, se usa la imagen de escritorio."
    }
  ]
}
{% endschema %}
