/**
 * Theme Name:  Twenty Twenty-Five Store
 * Template:    twentytwentyfive
 * Version:     1.0.0
 * Description: Twenty Twenty-Five modified for WooCommerce
 */

/* GENERAL */
.min-w-100 {
  min-width: 100%;
}

.max-w-xxs {
  max-width: 10rem !important; /*  160px */
}
.max-w-xs {
  max-width: 20rem !important; /*  320px */
}
.max-w-sm {
  max-width: 24rem !important; /*  384px */
}
.max-w-md {
  max-width: 28rem !important; /*  448px */
}
.max-w-lg {
  max-width: 32rem !important; /*  512px */
}
.max-w-xl {
  max-width: 36rem !important; /*  576px */
}
.max-w-2xl {
  max-width: 42rem !important; /*  672px */
}
.max-w-3xl {
  max-width: 48rem !important; /*  768px */
}
.max-w-4xl {
  max-width: 56rem !important; /*  896px */
}
.max-w-5xl {
  max-width: 64rem !important; /* 1024px */
}
.max-w-6xl {
  max-width: 72rem !important; /* 1152px */
}
.max-w-7xl {
  max-width: 80rem !important; /* 1280px */
}
.max-w-8xl {
  max-width: 90rem !important; /* 1440px */
}
.max-w-9xl {
  max-width: 120rem !important; /* 1920px */
}

.m-auto {
  margin: auto;
}

/* CONTACT FORM 7 */
form.wpcf7-form {
  display: flex;
  flex-direction: column;
  justify-content: start;
  align-items: start;
  gap: 1rem;
}
form.wpcf7-form > p {
  margin: 0;
  width: 100%;
}

form.wpcf7-form input[type="text"],
form.wpcf7-form input[type="email"],
form.wpcf7-form textarea {
  width: 100%;
  padding: 0.5rem 1rem;
  box-sizing: border-box;
  font-size: var(--wp--preset--font-size--medium);
  font-family: inherit;
  font-weight: inherit;
  line-height: 1.6;
  border: 1px solid var(--wp--preset--color--border);
  border-radius: 3.125rem;
}
form.wpcf7-form textarea {
  border-radius: 1.25rem;
}
form.wpcf7-form .wpcf7-radio {
  font-size: var(--wp--preset--font-size--medium);
  font-family: inherit;
  font-weight: inherit;
}
form.wpcf7-form .wpcf7-radio label {
  cursor: pointer;
  display: flex;
  flex-direction: row;
  justify-content: start;
  align-items: center;
  gap: 0.5rem;
}
form.wpcf7-form .wpcf7-radio input[type="radio"] {
  width: 1.5rem;
  height: 1.5rem;
  accent-color: var(--wp--preset--color--blue-500);
  cursor: pointer;
  margin: 0;
}
form.wpcf7-form input[type="submit"] {
  padding: 1rem 2.25rem;
  margin: 4px;
  color: var(--wp--preset--color--base);
  font-family: inherit;
  font-size: var(--wp--preset--font-size--medium);
  font-weight: inherit;
  text-decoration: none;
  line-height: inherit;
  background-color: var(--wp--preset--color--contrast);
  border-width: 0;
  border-radius: 3.125rem;
}
form.wpcf7-form span.wpcf7-label {
  margin-left: 1rem;
  font-size: var(--wp--preset--font-size--medium);
  font-family: inherit;
  font-weight: 400;
}
form.wpcf7-form span.wpcf7-not-valid-tip {
  margin-left: 1rem;
  font-size: var(--wp--preset--font-size--small);
  font-family: inherit;
  font-weight: inherit;
}
form.wpcf7-form input[type="submit"]:hover {
  opacity: 0.8;
}
form.wpcf7-form input[type="submit"]:active {
  outline: 2px solid var(--wp--preset--color--contrast) !important;
  outline-offset: 2px !important;
}
form.wpcf7-form input[type="submit"]:focus {
  outline: none;
}
form.wpcf7-form div.wpcf7-response-output {
  margin: 0;
  padding: 12px;
  font-size: var(--wp--preset--font-size--medium);
  font-family: inherit;
  font-weight: inherit;
  border: 2px solid var(--wp--preset--color--vivid-red) !important;
  border-radius: 1.125rem;
}
.newsletter-form form.wpcf7-form {
  flex-direction: row;
  justify-content: center;
  align-items: start;
  gap: 0.5rem;
}
.newsletter-form form.wpcf7-form input[type="email"] {
  padding: 1rem;
  flex-grow: 1;
}
.newsletter-form form.wpcf7-form div.wpcf7-response-output {
  display: none;
}
@media (width <= 512px) {
  .newsletter-form form.wpcf7-form {
    flex-direction: column;
    justify-content: start;
    align-items: center;
  }
}

/* CARDS */
.card {
  border: 1px solid var(--wp--preset--color--border);
  border-radius: 8px;
  width: 100%;
  text-decoration: none;
}
.card .card__header {
  padding: 2rem;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: black;
  border-radius: 8px 8px 0 0;
}
.card .card__header img {
  width: auto;
  height: 64px;
}
.card .card__content {
  padding: 1rem;
}
.card .card__content p {
  margin: 0;
  padding: 0;

  font-size: large;
}
.card .card__content a {
  cursor: pointer;
  text-decoration: none;
  font-size: var(--wp--preset--font-size--medium);
  font-size: medium;
  padding: 0.25rem 1rem;
  background-color: var(--wp--preset--color--base);
  color: black;
  border: 1px solid var(--wp--preset--color--border);
  border-radius: 1rem;
}
.card .card__content a:hover {
  background-color: black;
  opacity: 0.8;
  color: var(--wp--preset--color--base);
}
.card .card__content a:focus {
  outline: 2px solid var(--wp--preset--color--contrast) !important;
  outline-offset: 2px !important;
}

/* HEADER */
/* Responsive menu button */
button.wp-block-navigation__responsive-container-open {
  padding: 0.5em;
}
/* Product search */
header.wp-block-template-part form.wp-block-search {
  width: 100%;
}
.product-search-small {
  height: 42px;
}
.product-search-small button {
  padding: 0 1rem;
}

@media (width <= 768px) {
  .show-on-mobile {
    display: flex !important; /* Show on mobile */
  }
  .show-on-desktop {
    display: none !important; /* Hide on mobile */
  }
}
@media (width > 768px) {
  .show-on-mobile {
    display: none !important; /* Hide on desktop */
  }
  .show-on-desktop {
    display: flex !important; /* Show on desktop */
  }
}

/* TRUSTPILOT */
.trustpilot {
  cursor: default;
  user-select: none;
  pointer-events: none;
  -webkit-user-drag: none;
  -webkit-touch-callout: none;
  gap: 0.75rem;
}
.trustpilot .trustpilot__logo {
  margin-bottom: 0.5rem;
}
.trustpilot .trustpilot__rating {
  width: 100%;
  max-width: 10rem;
}

/* CAROUSEL */
.product-carousel ul {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  gap: 1rem;
  overflow-x: auto;
  scroll-behavior: smooth; /* For smooth scrolling */
  -webkit-overflow-scrolling: touch; /* Better performance on mobile */
  scroll-snap-type: x mandatory; /* Optional: helps with alignment */
  margin: 0;
  padding: 1rem 1rem 2rem 1rem;
}
ul > li.wc-block-product {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
}
.product-carousel ul > li {
  width: 256px;
  min-width: 256px;
  max-width: 256px;
  scroll-snap-align: start; /* Optional: aligns items during scroll */
}
@media (width <= 480px) {
  .product-carousel ul {
    gap: 0.5rem;
    padding: 0.5rem 0.5rem 1rem 0.5rem;
  }
  .product-carousel ul > li {
    width: 186px;
    min-width: 186px;
  }
}

/* SHOP */
/* Active filters */
div.wc-block-active-filters {
  display: flex;
  justify-content: start;
  align-items: center;
  flex-wrap: wrap;
}
div.wc-block-active-filters ul li.wc-block-active-filters__list-item span.wc-block-components-chip {
  margin: 4px;
  padding: 0.5rem 0.75rem;
}
div.wc-block-active-filters button.wc-block-active-filters__clear-all {
  margin: 4px;
  padding: 0.5rem 1rem;
  font-size: var(--wp--preset--font-size--small);
  text-decoration: none;
  color: var(--wp--preset--color--base);
  background-color: var(--wp--preset--color--contrast);
  border: 1px solid var(--wp--preset--color--border);
  border-radius: 3.125rem;
}
div.wc-block-active-filters button.wc-block-active-filters__clear-all:hover {
  color: var(--wp--preset--color--base);
  background-color: var(--wp--preset--color--contrast);
  opacity: 0.8;
}
div.wc-block-active-filters button.wc-block-active-filters__clear-all:active {
  outline: 2px solid var(--wp--preset--color--contrast);
  outline-offset: 2px;
}

/* Product variant filter */
details.product-catalog-variant-filter div.wp-block-woocommerce-filter-wrapper {
  margin-top: 0;
}
details.product-catalog-variant-filter
  div.wp-block-woocommerce-filter-wrapper
  div.wc-block-attribute-filter {
  max-height: 225px;
  overflow: auto;
  margin: 0;
}
details.product-catalog-variant-filter
  div.wp-block-woocommerce-filter-wrapper
  div.wc-block-attribute-filter__actions {
  display: none;
}
/* Product Category filter */
div.wc-block-product-categories.is-dropdown select {
  padding: 0.5rem 1rem;
  font-size: var(--wp--preset--font-size--medium);
  font-family: inherit;
  font-weight: inherit;
  appearance: none;
  background-color: var(--wp--preset--color--base);
  background-image: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23000000%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.4-12.8z%22%2F%3E%3C%2Fsvg%3E");
  background-repeat: no-repeat;
  background-position: right 1rem center;
  background-size: 0.65em;
  padding-right: 2.5rem;
  border: 1px solid var(--wp--preset--color--border);
  border-radius: 3.125rem;
}
div.wc-block-product-categories.is-dropdown select:focus {
  outline: 2px solid var(--wp--preset--color--contrast);
  outline-offset: 2px;
}
div.wc-block-product-categories.is-dropdown button {
  cursor: pointer;
  padding: 0 1rem;
  color: var(--wp--preset--color--base);
  font-family: inherit;
  font-size: var(--wp--preset--font-size--medium);
  font-weight: inherit;
  background-color: var(--wp--preset--color--contrast);
  border-width: 0;
  border-radius: 1.25rem;
}
div.wc-block-product-categories.is-dropdown button:hover {
  opacity: 0.8;
}
div.wc-block-product-categories.is-dropdown button:active {
  outline: 2px solid var(--wp--preset--color--contrast) !important;
  outline-offset: 2px !important;
}
/* Sort selector */
form.woocommerce-ordering select {
  padding: 0.5rem 1rem;
  font-size: inherit;
  font-family: inherit;
  font-weight: inherit;
  appearance: none;
  background-color: var(--wp--preset--color--base);
  background-image: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23000000%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.4-12.8z%22%2F%3E%3C%2Fsvg%3E");
  background-repeat: no-repeat;
  background-position: right 1rem center;
  background-size: 0.65em;
  padding-right: 2.5rem;
  border: 1px solid var(--wp--preset--color--border);
  border-radius: 3.125rem;
}
form.woocommerce-ordering select:focus {
  outline: 2px solid var(--wp--preset--color--contrast);
  outline-offset: 2px;
}
/* Sale bade */
ul.wc-block-product-template li.wc-block-product div.wc-block-components-product-sale-badge {
  font-size: var(--wp--preset--font-size--medium);
  font-family: inherit;
  font-weight: 500;
  appearance: none;
  color: var(--wp--preset--color--base);
  background-color: var(--wp--preset--color--purple-700);
  border: 1px solid var(--wp--preset--color--purple-900);
  border-radius: 3.125rem;
}

/* SINGLE PRODUCT */
/* Product variant selector */
body.product-template-default table.variations th.label {
  min-width: 50px; 
}
body.product-template-default table.variations div.select-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  max-width: 350px;
}
body.product-template-default table.variations button.select-option {
  cursor: pointer;
  min-width: max-content;
  padding: 8px 12px;
  width: 64px;
  font-size: 16px;
  font-weight: 300;
  border-radius: 4px;
  color: dimgray;
  background-color: var(--wp--preset--color--base);
  border: 1px solid lightgray;
}
body.product-template-default table.variations button.select-option:hover {
  color: var(--wp--preset--color--purple-500);
  background-color: var(--wp--preset--color--base);
  border: 1px solid lightgray;
}
body.product-template-default table.variations button.select-option.active,
body.product-template-default table.variations button.select-option:focus {
  outline: none;
  color: var(--wp--preset--color--purple-500);
  background-color: rgba(166, 44, 196, 0.05);
  border: 1px solid rgba(166, 44, 196, 0.2);
  font-weight: 600;
}
body.product-template-default table.variations a.reset_variations {
  display: none !important;
}
/* Add to cart button */
body.product-template-default button.single_add_to_cart_button {
  border-radius: 3.125rem;
  width: 100%;
}

/* Sale badge */
body.product-template-default div.wp-block-woocommerce-product-image-gallery span.onsale {
  margin: 0;
  padding: 0.5rem 1rem;
  line-height: normal;
  min-height: 0;
  font-size: var(--wp--preset--font-size--medium);
  font-family: inherit;
  font-weight: 500;
  appearance: none;
  text-transform: uppercase;
  color: var(--wp--preset--color--base);
  background-color: var(--wp--preset--color--purple-700);
  border: 1px solid var(--wp--preset--color--purple-900);
  border-radius: 3.125rem;
}
/* Product price */
body.product-template-default div.wc-block-components-product-price {
  display: flex;
  justify-content: start;
  align-items: center;
  flex-direction: row-reverse;
}
body.product-template-default div.wc-block-components-product-price ins {
  padding-right: 1rem;
  color: black;
  font-size: 2rem;
  letter-spacing: -2px;
  font-weight: 700;
}
body.product-template-default div.wc-block-components-product-price del {
  color: black;
  background-color: #ffc700;
  padding: 0 1rem;
  border-radius: 3rem;
  font-style: italic;
  font-weight: 700;
  font-size: 1rem;
}

/* For green pulsing thingy */
@keyframes pulse {
  0% {
    transform: translate(-50%, -50%) scale(1);
    opacity: 1;
  }
  100% {
    transform: translate(-50%, -50%) scale(1.5);
    opacity: 0;
  }
}

/* FAQ */
/* Category filter */
div.wp-block-categories-dropdown select[name="category_name"] {
  padding: 0.5rem 1rem;
  width: 100%;
  font-size: inherit;
  font-family: inherit;
  font-weight: inherit;
  appearance: none;
  background-color: var(--wp--preset--color--base);
  background-image: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23000000%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.4-12.8z%22%2F%3E%3C%2Fsvg%3E");
  background-repeat: no-repeat;
  background-position: right 1rem center;
  background-size: 0.65em;
  padding-right: 2.5rem;
  border: 1px solid var(--wp--preset--color--border);
  border-radius: 3.125rem;
}
div.wp-block-categories-dropdown select[name="category_name"]:focus {
  outline: 2px solid var(--wp--preset--color--contrast);
  outline-offset: 2px;
}

/* Read more button */
.wp-block-post a.wp-block-post-excerpt__more-link {
  cursor: pointer;
  text-decoration: none;
  font-size: var(--wp--preset--font-size--medium);
  font-size: medium;
  padding: 0.25rem 1rem;
  background-color: var(--wp--preset--color--base);
  color: black;
  border: 1px solid var(--wp--preset--color--border);
  border-radius: 1rem;
}
.wp-block-post a.wp-block-post-excerpt__more-link:hover {
  background-color: black;
  color: var(--wp--preset--color--base);
}
.wp-block-post a.wp-block-post-excerpt__more-link:focus {
  outline: 2px solid var(--wp--preset--color--contrast);
  outline-offset: 2px;
}
