/** Shopify CDN: Minification failed

Line 16:0 Unexpected "{"
Line 16:1 Unexpected "{"
Line 16:3 Expected identifier but found "\"mdp-weare-menu-1.css\""
Line 17:0 Unexpected "{"
Line 17:1 Expected identifier but found "%"
Line 19:0 Unexpected "<"
Line 26:11 Expected identifier but found "%"
Line 27:12 Unexpected "<"
Line 29:37 Expected identifier but found "%"
Line 29:76 Unexpected "<"
... and 43 more hidden warnings

**/
{{ "mdp-weare-menu-1.css" | asset_url | stylesheet_tag }}
{% assign logo = section.settings.logo | img_url: section.settings.logo_size %}

<div id="mdp-weare-{{ section.id }}" class="mdp mdp-weare-menu-1">
  <div data-sticky-class="mdp-sticky-menu">
    <div class="mdp-container mdp-grid" data-columns="1" data-gap="30">
      <div class="mdp-col mdp-row-full">

        <!-- LEFT: menu toggle -->
        <div class="mdp-row-left">
          {% if section.settings.menu != blank %}
            <div class="mdp-menu-element" data-mega-menu="12">
              <input id="mdp-menu" type="checkbox">
              <label for="mdp-menu">{% render 'mdp-weare-icon' with '191' %}</label>

              <div class="mdp-menu-wrapper mdp-menu-mobile">
                <div class="mdp-menu-root">

                  <!-- Mobile header with logo -->
                  <div class="mdp-mobile-devices-header">
                    <a href="/" class="mdp-logo mobile-only">
                      {% if section.settings.use_logo_img == false %}
                        <span>{{ shop.name }}</span>
                      {% else %}
                        <img src="{{ logo }}" alt="logo">
                      {% endif %}
                    </a>
                  </div>

                  <!-- Mobile menu links -->
                  {% for link in linklists[section.settings.menu].links %}
                    <div class="mdp-menu-item">
                      <a href="{{ link.url }}" class="mdp-menu-link">{{ link.title | escape }}</a>
                    </div>
                  {% endfor %}
                </div>
              </div>
            </div>
          {% endif %}
        </div>

        <!-- CENTER: LOGO -->
        <div class="mdp-row-center">
          <!-- Desktop logo -->
          <a href="/" class="mdp-logo desktop-only">
            {% if section.settings.use_logo_img == false %}
              <span>{{ shop.name }}</span>
            {% else %}
              <img src="{{ logo }}" alt="logo">
            {% endif %}
          </a>
        </div>

        <!-- RIGHT: icons -->
        <div class="mdp-row-right">
          {% if section.settings.search %}
            <a href="javascript:void(0);" class="mdp-search-link"><i class="fas fa-search mdp-menu-icon"></i></a>
          {% endif %}
          {% if shop.customer_accounts_enabled %}
            <a class="mdp-account" href="/account"><i class="fas fa-user mdp-menu-icon"></i></a>
          {% endif %}
          <a class="mdp-cart" href="/cart">
            <i class="fas fa-shopping-bag mdp-menu-icon"></i>
            <span class="mdp-cart-count">{{ cart.item_count }}</span>
          </a>
        </div>

      </div>
    </div>
  </div>
</div>

<style>
/* --- MOBILE --- */
@media (max-width: 768px) {
  .desktop-only { display: none !important; }
  .mdp-weare-menu-1 .mdp-row-center {
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .mdp-weare-menu-1 .mdp-row-center .mdp-logo {
    margin: 0 auto;
    display: inline-block;
  }
  .mdp-weare-menu-1 .mdp-row-center img {
    max-height: 50px;
    height: auto;
    width: auto;
  }
}

/* --- DESKTOP --- */
@media (min-width: 769px) {
  .mobile-only { display: none !important; }
  .desktop-only {
    display: block !important;
    margin: 0 auto;
  }
  .desktop-only img {
    display: block;
    max-height: 70px;
    height: auto;
    width: auto;
    margin: 0 auto;
  }
}
</style>
/* FORCE desktop logo to show and center */
@media (min-width: 769px) {
  .mdp-weare-menu-1 .mdp-row-center .mdp-logo {
    display: block !important;
    text-align: center !important;
    margin: 0 auto !important;
  }

  .mdp-weare-menu-1 .mdp-row-center .mdp-logo img {
    display: block !important;
    margin: 0 auto !important;
    max-height: 70px !important; /* adjust as needed */
    width: auto !important;
  }
}
/* --- Desktop logo fix --- */
@media (min-width: 769px) {
  .mdp-weare-menu-1 .mdp-row-center {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
  }

  .mdp-weare-menu-1 .mdp-row-center .mdp-logo img {
    display: block !important;
    margin: 0 auto !important;
    max-height: 70px !important; /* adjust */
    width: auto !important;
  }
}
/* ---- FORCE DESKTOP LOGO TO SHOW ---- */
@media (min-width: 769px) {
  .mdp-weare-menu-1 .mdp-row-center .mdp-logo {
    display: inline-block !important;
    visibility: visible !important;
    opacity: 1 !important;
  }
  .mdp-weare-menu-1 .mdp-row-center img {
    max-height: 70px !important;
    width: auto !important;
    height: auto !important;
  }
}
/* Desktop only: move logo to the left */
@media (min-width: 769px) {
  .mdp-weare-menu-1 .mdp-row-center {
    justify-content: flex-start !important; /* align to left */
  }
  .mdp-weare-menu-1 .mdp-row-center .mdp-logo {
    margin-left: 0 !important;
    margin-right: auto !important;
  }
}
/* Desktop: force logo left */
@media (min-width: 769px) {
  .mdp-weare-menu-1 .mdp-row-center {
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
  }

  .mdp-weare-menu-1 .mdp-row-center .mdp-logo {
    margin: 0 !important;
    margin-right: auto !important;
    text-align: left !important;
  }
}
/* Desktop: force logo to far left */
@media (min-width: 769px) {
  .mdp-weare-menu-1 .mdp-row-center {
    justify-content: flex-start !important; /* stick left */
  }

  .mdp-weare-menu-1 .mdp-row-center .mdp-logo {
    margin-left: 0 !important;    /* kill any gap */
    padding-left: 0 !important;   /* no padding */
    padding-right: 40px;          /* space before menu */
    display: inline-block !important;
  }

  .mdp-weare-menu-1 .mdp-row-center .mdp-menu-element {
    display: inline-block !important;
    margin-left: 0 !important;
    vertical-align: middle;
  }
}
/* Desktop logo alignment */
@media (min-width: 769px) {
  .mdp-weare-menu-1 .mdp-row-center {
    display: flex;
    justify-content: flex-start; /* push logo left */
    align-items: center;
  }

  .mdp-weare-menu-1 .mdp-row-center .mdp-logo {
    margin-left: 0; /* no extra margin */
  }
}
/* Force desktop logo left */
@media (min-width: 769px) {
  #mdp-weare-{{ section.id }} .mdp-row-center {
    justify-content: flex-start !important;
    text-align: left !important;
  }

  #mdp-weare-{{ section.id }} .mdp-row-center .mdp-logo {
    margin-left: 0 !important;
  }
}
@media (min-width: 769px) {
  .mdp-weare-menu-1 .mdp-row-center {
    justify-content: flex-start !important; /* shove logo left */
    text-align: left !important;
  }

  .mdp-weare-menu-1 .mdp-row-center .mdp-logo {
    margin-left: 0 !important;
  }
}
@media (min-width: 769px) {
  /* Align logo left on desktop */
  .mdp-weare-menu-1 .mdp-row-center {
    display: flex !important;
    justify-content: flex-start !important; /* Pushes left */
    align-items: center !important;
    flex: 0 0 auto !important;
    max-width: fit-content !important;
  }

  .mdp-weare-menu-1 .mdp-row-center .mdp-logo {
    margin-left: 0 !important;
    margin-right: auto !important; /* makes sure it sticks left */
    padding: 0 !important;
    text-align: left !important;
  }
}
@media (min-width: 769px) {
  /* Force desktop logo hard left */
  .mdp-weare-menu-1 .mdp-row-center {
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    width: auto !important;
    max-width: none !important;
  }

  .mdp-weare-menu-1 .mdp-row-center .mdp-logo {
    margin: 0 !important;
    padding: 0 !important;
    transform: translateX(-200px) !important; /* keep pushing left */
  }
}
@media (min-width: 769px) {
  .mdp-weare-menu-1 .mdp-row-center .mdp-logo {
    transform: translateX(-280px) !important; /* tweak until it lines up perfectly */
  }
}
@media (min-width: 769px) {
  .mdp-weare-menu-1 .mdp-desktop-nav {
    margin-left: 60px; /* push menu links away from logo */
  }
}
@media (min-width: 769px) {
  .mdp-weare-menu-1 .mdp-row-right {
    margin-right: 40px; /* adds breathing space */
  }
}
@media (min-width: 769px) {
  .mdp-weare-menu-1 {
    border-top: 3px solid #000; /* black line, 3px thick */
  }
}
@media (min-width: 769px) {
  .mdp-weare-menu-1 .mdp-menu-link {
    font-size: 18px;
    font-weight: 600;
  }
}
@media (min-width: 769px) {
  .mdp-weare-menu-1 .mdp-menu-root .mdp-menu-link {
    font-size: 18px !important;
    font-weight: 600 !important;
  }
}
/* Force the logo to always show */
.mdp-row-center .mdp-logo img {
  display: inline-block !important;
  max-height: 70px; /* adjust if you want */
}

/* Force black strip across all pages */
.mdp-weare-menu-1,
.mdp-weare-menu-2 {
  border-top: 2px solid black !important;
}

/* Force menu text to be larger everywhere */
.mdp-weare-menu-1 .mdp-menu-link,
.mdp-weare-menu-2 .mdp-menu-link {
  font-size: 18px !important;
  font-weight: 600;
}
/* Force product images into 1:1 square crop */
.product-card__image img,
.grid-view-item__image,
.card__media img,
.product-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;     /* crop neatly inside square */
  aspect-ratio: 1 / 1;   /* force square ratio */
}
/* Force product images into 1:1 square crop */
.product-card__image img,
.grid-view-item__image,
.card__media img,
.product-item img,
.collection-product img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;   /* crop neatly inside square */
  aspect-ratio: 1 / 1 !important; /* force square ratio */
}
/* Force all product images into perfect 1:1 squares */
.collection img,
.product-card img,
.card__media img {
  aspect-ratio: 1 / 1 !important;
  width: 100% !important;
  height: auto !important;
  object-fit: cover !important;
  position: static !important;
}
/* Force product image containers to always be 1:1 squares */
.card__media,
.product-card__image,
.collection__image {
  aspect-ratio: 1 / 1 !important;
  overflow: hidden !important;
  position: relative !important;
}

/* Make sure images inside fill that square */
.card__media img,
.product-card__image img,
.collection__image img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  position: absolute !important;
  top: 0;
  left: 0;
}
.mdp-box-product img {
  object-fit: contain !important;
  background: #fff; /* adds white padding */
}