/** Shopify CDN: Minification failed

Line 8:0 Unexpected "<"
Line 34:0 Unexpected "<"
Line 402:0 Expected "}" to go with "{"

**/
<style>
.card__media,
.product-card__image,
.grid-view-item__image {
  margin-bottom: 0px !important;
}

.card__heading,
.product-card__title,
.grid-view-item__title {
  font-family: 'Lexend Mega', sans-serif !important;
  font-size: 18px !important;
  font-weight: 500 !important;
  margin-top: 4px !important;
  margin-bottom: 8px !important;
  color: #000 !important;
}

.price,
.product-price {
  margin-top: 2px !important;
  margin-bottom: 8px !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  color: #000 !important;
}
</style>
/* ===== HEADER MENY (länkar + knappar) ===== */

/* 1) Grund: allt i header-menyn ska vara svart */
.header, header {
  --nav-text: #000; /* om temat använder CSS-variabler */
}

header nav a,
header nav button,
header nav summary,
header .list-menu__item a,
header .list-menu__item button,
header .list-menu__item summary {
  color: #000 !important;
  background: transparent !important;
  border: none !important;
  outline: none !important;
  font-weight: 500;
}

/* 2) Se till att TEXTEN inuti knapparna också blir svart (span m.m.) */
header nav button *,
header nav summary *,
header .list-menu__item button *,
header .list-menu__item summary * {
  color: #000 !important;
}

/* 3) Hover – gör lite tjockare men svart */
header nav a:hover,
header nav button:hover,
header nav summary:hover {
  color: #000 !important;
  font-weight: 600 !important;
}

/* 4) Aktiv/öppen dropdown (Categories öppnad) – gör fet svart */
header nav [aria-expanded="true"],
header nav [aria-expanded="true"] * {
  color: #000 !important;
  font-weight: 700 !important;
}
@media (max-width: 749px) {
  .center-me {
    display: flex !important;
    justify-content: center !important;
    width: 100% !important;
    margin: 0 auto !important;
  }
}
/* === Amoura: centrera Quantity på mobil, utan att röra desktop === */
@media screen and (max-width: 749px) {

  /* Själva quantity-blocket */
  .product-form .product-form__input--quantity,
  .product-form .quantity,
  .product-form .quantity__wrapper {
    display: flex;
    justify-content: center !important;
    align-items: center;
    width: 100%;
    margin: 0 auto 12px !important; /* liten luft under quantity */
  }

  /* Själva inputen i mitten */
  .product-form .quantity__input {
    text-align: center;
  }

  /* Säkerställ att knapparna hamnar på egen rad och centreras */
  .product-form .product-form__buttons,
  .product-form .product-form__submit {
    width: 100%;
    justify-content: center;
  }

  /* I vissa BuildYourStore-varianter finns en högerjustering – nollställ den */
  .product-form .product-form__input--quantity,
  .product-form .quantity {
    text-align: center !important;
  }
}
@media screen and (max-width: 749px) {
  .product__info-wrapper .product-form {
    display: flex;
    flex-direction: column;
    align-items: center; /* tvinga mittenjustering av alla barn */
  }
}
/* === Amoura fix: centrera Quantity + knapp på mobil, oavsett temaregel === */
@media screen and (max-width: 749px) {

  /* Gör själva product-formen till en kolumn och centrera allt innehåll */
  .product__info-wrapper form.product-form,
  .product-form {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
  }

  /* Själva quantity-blocket (custom-elementet <quantity-input>) i mitten */
  .product-form .product-form__input--quantity,
  .product__info-wrapper quantity-input.quantity,
  quantity-input.quantity {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
    margin: 0 auto 12px !important;
    text-align: center !important;
  }

  /* Inre element: minus/plus + input */
  quantity-input.quantity .quantity__button,
  quantity-input.quantity .quantity__input {
    position: relative;
  }
  quantity-input.quantity .quantity__input {
    max-width: 90px;
    text-align: center !important;
    margin: 0 8px;
  }

  /* Lägg knappen på egen rad och centrera */
  .product-form .product-form__buttons,
  .product-form .product-form__submit,
  .shopify-payment-button {
    width: 100% !important;
    display: flex !important;
    justify-content: center !important;
  }

  /* Om något block till höger tvinga*
.product__info-wrapper .product-form__input--quantity + .product-form__buttons {
  margin-top: 10px;
  justify-content: center !important;
}
/* Centera app-block (t.ex. "Kvantitetsväljare") på mobil */
@media (max-width: 749px){
  .product__info-wrapper .shopify-app-block{
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
    margin: 0 auto 12px !important;
    text-align: center !important;
  }
  .product__info-wrapper .shopify-app-block > *{
    margin-left: auto !important;
    margin-right: auto !important;
  }
}
/* === Amoura FIX: centrera "Kvantitetsväljare" (app-block) på MOBIL === */
@media (max-width: 749px){

  /* 1) Gör själva app-blocket fullbrett och tillåt text-align-centering */
  .product__info-wrapper .shopify-app-block{
    width: 100% !important;
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
    grid-column: 1 / -1 !important; /* om sektionen använder grid */
    float: none !important;
  }

  /* 2) Centrera första inre containern som appen renderar */
  .product__info-wrapper .shopify-app-block > div,
  .product__info-wrapper .shopify-app-block > section,
  .product__info-wrapper .shopify-app-block > form {
    display: inline-block !important;   /* gör att text-align:center på föräldern funkar */
    margin-left: auto !important;
    margin-right: auto !important;
    float: none !important;
    text-align: left !important;        /* så inte allt inuti blir centrerat */
  }

  /* 3) Om appen använder flex och trycker åt höger — nollställ till center */
  .product__info-wrapper .shopify-app-block [style*="justify-content"],
  .product__info-wrapper .shopify-app-block [class*="justify"],
  .product__info-wrapper .shopify-app-block .row,
  .product__info-wrapper .shopify-app-block .wrapper,
  .product__info-wrapper .shopify-app-block .container {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
  }

  /* 4) Säkerställ att själva qty-inputen inte drar åt sidan */
  .product__info-wrapper .shopify-app-block input[type="number"]{
    text-align: center !important;
    max-width: 90px;
    margin: 0 8px !important;
  }

  /* 5) Köpknapp på egen rad och centrerad (om den påverkas) */
  .product-form .product-form__buttons,
  .product-form .product-form__submit,
  .shopify-payment-button {
    width: 100% !important;
    display: flex !important;
    justify-content: center !important;
  }
}
/* === Amoura: centrera appens "Kvantitetsväljare" på MOBIL oavsett tema/app === */
@media (max-width: 749px){

  /* Välj exakt det shopify-app-block som innehåller qty-knappar/input */
  .product__info-wrapper .shopify-app-block:has(input[type="number"]) {
    width: 100% !important;
    text-align: center !important;       /* gör att inline-block kan centreras */
    grid-column: 1 / -1 !important;      /* egen rad även i grid */
    float: none !important;
    margin: 0 auto 12px !important;
  }

  /* Centrera blockets första inre container */
  .product__info-wrapper .shopify-app-block:has(input[type="number"]) > * {
    display: inline-block !important;     /* låter text-align:center slå igenom */
    max-width: 100%;
    float: none !important;
    margin: 0 auto !important;
  }

  /* Om appen kör flex och drar åt höger – nollställ */
  .product__info-wrapper .shopify-app-block:has(input[type="number"]) .row,
  .product__info-wrapper .shopify-app-block:has(input[type="number"]) .wrapper,
  .product__info-wrapper .shopify-app-block:has(input[type="number"]) .container,
  .product__info-wrapper .shopify-app-block:has(input[type="number"]) [style*="justify-content"] {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
  }

  /* Själva nummerfältet i mitten och inte för brett */
  .product__info-wrapper .shopify-app-block:has(input[type="number"]) input[type="number"]{
    text-align: center !important;
    max-width: 90px;
    margin: 0 8px !important;
  }

  /* Köpknappen på egen rad och centrerad (ifall den trycks) */
  .product-form .product-form__buttons,
  .product-form .product-form__submit,
  .shopify-payment-button {
    width: 100% !important;
    display: flex !important;
    justify-content: center !important;
  }
}
@media (max-width: 749px){
  .product__info-wrapper .shopify-app-block:has(input[type="number"]) > * {
    position: relative;
    left: 50%;
    transform: translateX(-50%); /* tvångs-centrering av innerwrap */
  }
}
/* === Amoura: centrera alla app-block på produktinfo (MOBIL) === */
@media (max-width: 749px){

  /* 1) Gör app-blocket till ett centrerande grid */
  .product__info-wrapper .shopify-app-block{
    display: grid !important;
    place-items: center !important;   /* hor + vert center */
    width: 100% !important;
    margin: 0 auto 12px !important;
    grid-column: 1 / -1 !important;   /* egen rad även i grid-layouter */
    float: none !important;
    text-align: center !important;
  }

  /* 2) Inre wrapper ska inte vara 100% – centrera som “innehållsbredd” */
  .product__info-wrapper .shopify-app-block > *{
    width: max-content !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    float: none !important;
  }

  /* 3) Om appen kör flex och högerställer – nollställ till center */
  .product__info-wrapper .shopify-app-block .row,
  .product__info-wrapper .shopify-app-block .wrapper,
  .product__info-wrapper .shopify-app-block .container,
  .product__info-wrapper .shopify-app-block [style*="justify-content"]{
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
  }

  /* 4) Själva qty-input – centrera siffran */
  .product__info-wrapper .shopify-app-block input[type="number"]{
    text-align: center !important;
    max-width: 90px;
    margin: 0 8px !important;
  }
}
/* Amoura: centrera quantity på mobil */
@media (max-width: 749px){
  .am-qty-wrap{
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
    margin: 0 auto 12px !important;
  }
}
/* Amoura: centrera Shopifys quantity på MOBIL (träffar just ditt input-ID) */
@media (max-width: 749px){
  /* Centrera hela blocket (minus + input + plus) */
  quantity-input.quantity:has(#Quantity-template--25929070215500__main){
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
    margin: 0 auto 12px !important;
    text-align: center !important;
  }

  /* Själva siffran i mitten och lagom bredd */
  #Quantity-template--25929070215500__main{
    text-align: center !important;
    max-width: 90px;
    margin: 0 8px !important;
  }

  /* Se till att knappraden ligger på egen rad och centrerad */
  .product-form .product-form__buttons,
  .product-form .product-form__submit{
    width: 100% !important;
    display: flex !important;
    justify-content: center !important;
  }
}
/* === FIX: Centrera Shopifys quantity på MOBIL (utan att röra HTML) === */
@media (max-width: 749px){

  /* Föräldern till quantity på din produkt: gör den centrerande */
  .product__info-wrapper .price-per-item__container{
    display: block !important;
    text-align: center !important;     /* nyckeln: låter barn centreras */
    width: 50% !important;
    margin: 0 auto 12px !important;
    float: none !important;
    justify-self: center !important;   /* om grid används */
    grid-column: 1 / -1 !important;    /* egen rad i grid */
  }

  /* Själva quantity-blocket ska bli inline-flex och centreras */
  .product__info-wrapper .price-per-item__container quantity-input.quantity{
    display: inline-flex !important;   /* så text-align:center funkar */
    justify-content: center !important;
    align-items: center !important;
    margin: 0 auto !important;
  }

  /* Siffran i mitten och lagom bredd */
  .product__info-wrapper .price-per-item__container quantity-input.quantity .quantity__input{
    text-align: center !important;
    max-width: 90px;
    margin: 0 8px !important;
  }

  /* Om något tvingar högerjustering – nollställ */
  .product__info-wrapper .price-per-item__container [style*="justify-content"]{
    justify-content: center !important;
  }
}