/*
Theme Name: Smagenaf WebApp
Theme URI: https://Sepstrup.me/
Author: Alexander.N Sepstrup
Description: WordPress theme for Smagenaf scan & betal webapp
Version: 1.1
License: GNU General Public License v2 or later
Text Domain: minbutik
*/

/* ────────────────────────────── */
/* Global styles                  */
/* ────────────────────────────── */
html, body {
  width: 100%;
  max-width: 100vw;
  overflow-x: clip !important; /* clip er mere moderne end hidden */
  position: relative;
}


a { text-decoration: none; color: inherit; }

.woocommerce-container {
  max-width: 28rem;
  margin: 0 auto;
  padding: 1rem;
}

.woocommerce-page .page-title { display: none !important; }


/* ────────────────────────────── */
/* Shop grid / Product cards      */
/* ────────────────────────────── */
ul.products {
  display: grid !important;
  grid-template-columns: 1fr !important; /* én kolonne */
  gap: 1.5rem !important; /* mellemrum mellem bokse */
  list-style: none;
  padding: 0;
  margin: 0;
}

li.product, li.product-category {
  background: #fff;
  border-radius: 1rem;
  box-shadow: 0 6px 16px rgba(0,0,0,0.05);
  padding: 1rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  transition: transform 0.2s, box-shadow 0.2s;
}

li.product:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 20px rgba(0,0,0,0.08);
}

li.product img, li.product-category img {
  width: 100%;
  aspect-ratio: 1/1; /* alle billeder får samme højde/bredde */
  object-fit: cover;
  border-radius: 1rem;
  margin-bottom: 0.5rem;
}

li.product h3, li.product-category h2 {
  font-size: 1rem;
  font-weight: 600;
  margin-bottom: 0.25rem;
}

li.product .price {
  font-size: 1.125rem;
  font-weight: 700;
  color: #e02d2d;
}

/* ────────────────────────────── */
/* Result count & ordering        */
/* ────────────────────────────── */
.woocommerce-result-count {
  font-size: 0.95rem;
  color: #6b7280;
  margin-bottom: 0.75rem;
  text-align: center;
  font-weight: 500;
}

.woocommerce-ordering {
  display: flex;
  justify-content: center;
  margin-bottom: 1.5rem;
}
.woocommerce:where(body:not(.woocommerce-uses-block-theme)) div.product p.price, .woocommerce:where(body:not(.woocommerce-uses-block-theme)) div.product span.price {
    color: #950909;
    font-size: 1.25em;
}
.woocommerce-ordering select.orderby {
  appearance: none;
  padding: 0.5rem 1rem;
  border: 1px solid #d1d5db;
  border-radius: 1rem;
  background: #fff url("data:image/svg+xml,%3Csvg viewBox='0 0 20 20' fill='none' stroke='%23e02d2d'%3E%3Cpath d='M6 8l4 4 4-4' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 0.75rem center / 1rem;
  font-size: 0.95rem;
  font-weight: 500;
  color: #111827;
  cursor: pointer;
  min-width: 14rem;
}

.woocommerce-ordering select.orderby:focus {
  outline: none;
  border-color: #e02d2d;
  box-shadow: 0 0 0 2px rgba(224,45,45,0.2);
}

/* ────────────────────────────── */
/* Pagination                     */
/* ────────────────────────────── */
.woocommerce-pagination { display: flex; justify-content: center; margin: 2rem 0; }

.woocommerce-pagination ul.page-numbers { display: flex; gap: 0.5rem; list-style: none; padding: 0; margin: 0; }

.woocommerce-pagination ul.page-numbers li a,
.woocommerce-pagination ul.page-numbers li span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.25rem;
  height: 2.25rem;
  padding: 0 0.5rem;
  border-radius: 0.75rem;
  background: #fff;
  color: #111827;
  font-weight: 600;
  text-decoration: none;
  box-shadow: 0 4px 8px rgba(0,0,0,0.05);
  transition: 0.15s;
}

.woocommerce-pagination ul.page-numbers li a:hover { background: #fee2e2; color: #e02d2d; transform: scale(1.05); }
.woocommerce-pagination ul.page-numbers li span.current { background: #e02d2d; color: #fff; box-shadow: 0 4px 8px rgba(224,45,45,0.3); cursor: default; }

.woocommerce-pagination ul.page-numbers li a.next,
.woocommerce-pagination ul.page-numbers li a.prev { font-weight: bold; padding: 0 0.75rem; }

/* ────────────────────────────── */
/* Responsive tweaks              */
/* ────────────────────────────── */
@media (max-width: 639px) {
  .woocommerce-container { padding: 1rem; margin: 0 auto; max-width: 95%; }
  ul.products { grid-template-columns: repeat(auto-fill, minmax(10rem,1fr)); gap: 0.75rem; }
  li.product img, .woocommerce-product-gallery__image img { aspect-ratio: 1/1; padding: 0.25rem; }
  .single_add_to_cart_button { font-size: 1rem; padding: 0.75rem; }
  .woocommerce-ordering select.orderby { width: 100%; min-width: auto; }
  .woocommerce-result-count { font-size: 0.9rem; }
  .woocommerce-pagination ul.page-numbers { gap: 0.35rem; }
  .woocommerce-pagination ul.page-numbers li a,
  .woocommerce-pagination ul.page-numbers li span { min-width: 2rem; height: 2rem; font-size: 0.875rem; }
}

/* --- Wishlist mobil fix --- */
@media (max-width: 768px) {
  #minbutik-wishlist ul.wishlist_table.responsive.mobile {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: 0;
    margin: 0;
  }

  #minbutik-wishlist ul.wishlist_table.responsive.mobile > li {
    list-style: none;
    background: #fff;
    border-radius: 0.75rem;
    padding: 1rem;
    box-shadow: 0 2px 6px rgba(0,0,0,0.08);
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    position: relative; /* gør plads til X */
  }

  /* Thumbnail */
  #minbutik-wishlist .item-wrapper {
    display: flex;
    gap: 1rem;
  }
  #minbutik-wishlist .product-thumbnail img {
    width: 90px;
    height: auto;
    border-radius: 0.5rem;
  }

  /* Tekstinfo */
  #minbutik-wishlist .item-details h3 {
    font-size: 1rem;
    font-weight: 600;
    margin-bottom: 0.25rem;
  }
  #minbutik-wishlist .item-details-table,
  #minbutik-wishlist .additional-info {
    width: 100%;
    font-size: 0.85rem;
    color: #444;
  }
  #minbutik-wishlist .item-details-table td.label,
  #minbutik-wishlist .additional-info td.label {
    font-weight: 500;
    padding-right: 0.5rem;
  }

  /* Tilføj til kurv knap */
  #minbutik-wishlist .product-add-to-cart a {
    display: block;
    text-align: center;
    background: #b91c1c;
    color: #fff;
    font-weight: 600;
    padding: 0.5rem 0.75rem;
    border-radius: 0.5rem;
    margin-top: 0.5rem;
  }

  /* Fjern-ikon ("X") */
  #minbutik-wishlist .product-remove {
    position: absolute;
    top: 0.75rem;
    right: 0.75rem;
  }
  #minbutik-wishlist .product-remove a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 9999px;
    background: #fee2e2;
    color: #b91c1c;
    font-size: 14px;
    transition: all 0.2s ease;
  }
  #minbutik-wishlist .product-remove a:hover {
    background: #ef4444;
    color: #fff;
  }
  #minbutik-wishlist .product-remove i.fa {
    font-size: 14px;
    line-height: 1;
  }
}/* --- WooCommerce knapper (alt) --- */
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit.alt,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button.alt,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button.alt,
:where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce #respond input#submit.alt,
:where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce a.button.alt,
:where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce button.button.alt,
:where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce input.button.alt {
  background-color: #B00020 !important;
  color: #fff !important;
  -webkit-font-smoothing: antialiased;
  border: none;
  transition: background-color 0.2s ease;
}
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit.alt:hover,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button.alt:hover,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt:hover,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button.alt:hover {
  background-color: #900018 !important;
}

/* Skjul notices */
.woocommerce-notices-wrapper,
.woocommerce-info {
  display: none !important;
}

/* --- Result count (MinButik / Coop stil) --- */
.woocommerce-result-count {
  font-size: 0.875rem;
  font-weight: 600;
  color: #333;
  background-color: #F3F3F3;
  padding: 0.5rem 1rem;
  border-radius: 0.25rem;
  display: inline-block;
  margin-bottom: 1rem;
}



#events-slider-2 {
  display: flex;
  gap: 1.5rem;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  align-items: stretch;     /* ← Gør alle børn lige høje */
}

#events-slider-2 > * {
  flex: 0 0 18rem;          /* fast bredde */
  scroll-snap-align: start;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  background: #fff;
  border-radius: 1rem;
  box-shadow: 0 4px 10px rgba(0,0,0,0.05);
}

#events-slider-2 img {
  aspect-ratio: 4/3;
  object-fit: cover;
  border-top-left-radius: 1rem;
  border-top-right-radius: 1rem;
}