/*
Theme Name: Shopkeeper - The Child Theme
Theme URI: https://shopkeeper.getbowtied.com
Description: This is the Child Theme for Shopkeeper - a Hassle-free Worpress Theme with great design and extensive functionality.
Author: Get Bowtied
Author URI: https://getbowtied.com
Template: shopkeeper
Version: 2.0
*/


/****************************************************************/
/*************** ADD YOUR CUSTOM CSS IN THIS AREA ***************/
/****************************************************************/


/* =========================
   CHECKOUT LAYOUT
========================= */

@media (min-width: 992px) {
  form.checkout.woocommerce-checkout {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    column-gap: 24px !important;
    align-items: start !important;
  }

  form.checkout.woocommerce-checkout > #customer_details,
  form.checkout.woocommerce-checkout > #order_review {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 0 !important;
    float: none !important;
  }

  form.checkout.woocommerce-checkout > #customer_details {
    grid-column: 1 !important;
    grid-row: 1 !important;
  }

  form.checkout.woocommerce-checkout > #order_review_heading {
    display: none !important;
  }

  form.checkout.woocommerce-checkout > #woocommerce_checkout_before_order_review {
    display: none !important;
  }

  form.checkout.woocommerce-checkout > #order_review {
    grid-column: 2 !important;
    grid-row: 1 !important;
  }
}


/* =========================
   CART LAYOUT
========================= */

@media (min-width: 992px) {
  .woocommerce-cart .entry-content .wpb_wrapper > .woocommerce {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    column-gap: 24px !important;
    align-items: start !important;
  }

  .woocommerce-cart .entry-content .wpb_wrapper > .woocommerce > form.woocommerce-cart-form {
    grid-column: 1 !important;
    grid-row: 1 !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    float: none !important;
  }

  .woocommerce-cart .entry-content .wpb_wrapper > .woocommerce > #woocommerce_before_cart_collaterals {
    display: none !important;
  }

  .woocommerce-cart .entry-content .wpb_wrapper > .woocommerce > .cart-collaterals {
    grid-column: 2 !important;
    grid-row: 1 !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    float: none !important;
    align-self: start !important;
  }
}


/* =========================
   PRODUCT PAGE – DESKTOP LAYOUT
========================= */

@media (min-width: 1025px) {
  .single-product .product_layout_classic .product_content_wrapper > .row {
    display: flex !important;
    align-items: flex-start !important;
  }

  .single-product .product_layout_classic .product_content_wrapper > .row > .large-7,
  .single-product .product_layout_classic .product_content_wrapper > .row > .large-6 {
    width: 58% !important;
    max-width: 58% !important;
    flex: 0 0 58% !important;
  }

  .single-product .product_layout_classic .product_content_wrapper > .row > .large-4,
  .single-product .product_layout_classic .product_content_wrapper > .row > .large-5 {
    width: 42% !important;
    max-width: 42% !important;
    flex: 0 0 42% !important;
    padding-left: 40px !important;
  }
}


/* =========================
   PRODUCT GALLERY – DESKTOP
========================= */

@media (min-width: 1025px) {
  .single-product .product_layout_classic .product-images-wrapper .woocommerce-product-gallery {
    display: flex !important;
    flex-direction: column !important;
  }

  .single-product .product_layout_classic .product-images-wrapper .woocommerce-product-gallery .flex-viewport {
    order: 1 !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 0 18px 0 !important;
  }

  .single-product .product_layout_classic .product-images-wrapper .woocommerce-product-gallery .flex-viewport img {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    display: block !important;
    padding-left: 0 !important;
  }

  .single-product .product_layout_classic .product-images-wrapper .woocommerce-product-gallery ol.flex-control-thumbs {
    order: 2 !important;
    width: 100% !important;
    max-width: 100% !important;
    max-height: none !important;
    display: grid !important;
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
    gap: 12px !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
  }

  .single-product .product_layout_classic .product-images-wrapper .woocommerce-product-gallery ol.flex-control-thumbs li {
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    float: none !important;
    aspect-ratio: 1 / 1 !important;
    overflow: hidden !important;
    border-radius: 8px !important;
    background: #f5f5f5 !important;
  }

  .single-product .product_layout_classic .product-images-wrapper .woocommerce-product-gallery ol.flex-control-thumbs li img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
    border: 0 !important;
    outline: 0 !important;
    opacity: 1 !important;
    padding: 0 !important;
    border-radius: 8px !important;
  }

  .single-product .product_layout_classic .product-images-wrapper .woocommerce-product-gallery ol.flex-control-thumbs li img.flex-active {
    opacity: 1 !important;
    outline: 1px solid rgba(0,0,0,0.25) !important;
  }
}


/* =========================
   PRODUCT GALLERY – MOBILE
========================= */

@media (max-width: 767px) {
  body.single-product .woocommerce-product-gallery ol.flex-control-thumbs,
  body.single-product .woocommerce-product-gallery ol.flex-control-nav.flex-control-thumbs {
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch !important;
    gap: 10px !important;
    padding: 0 0 8px 0 !important;
    margin: 12px 0 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    scroll-snap-type: x proximity !important;
    list-style: none !important;
  }

  body.single-product .woocommerce-product-gallery ol.flex-control-thumbs li,
  body.single-product .woocommerce-product-gallery ol.flex-control-nav.flex-control-thumbs li {
    flex: 0 0 calc((100% - 20px) / 3) !important;
    width: calc((100% - 20px) / 3) !important;
    max-width: calc((100% - 20px) / 3) !important;
    margin: 0 !important;
    float: none !important;
    scroll-snap-align: start !important;
    aspect-ratio: 1 / 1 !important;
    overflow: hidden !important;
    border-radius: 8px !important;
  }

  body.single-product .woocommerce-product-gallery ol.flex-control-thumbs li img,
  body.single-product .woocommerce-product-gallery ol.flex-control-nav.flex-control-thumbs li img {
    width: 100% !important;
    height: 100% !important;
    display: block !important;
    object-fit: cover !important;
    opacity: 1 !important;
  }
}


/* =========================
   PRODUCT TITLE + RATING
========================= */

body.single-product .woocommerce-product-rating .star-rating {
  font-size: 20px !important;
  width: 6.4em !important;
  height: 1.2em !important;
  line-height: 1.2em !important;
}

@media (max-width: 767px) {
  body.single-product h1.product_title {
    font-size: 34px !important;
    line-height: 1.1 !important;
    letter-spacing: -0.5px !important;
    margin-top: 0 !important;
    margin-bottom: 8px !important;
  }

  body.single-product .product_summary_top {
    margin: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 6px !important;
  }

  body.single-product .product_summary_top .woocommerce-product-rating {
    margin-bottom: 6px !important;
  }

  body.single-product .product_infos {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }
}


/* =========================
   CUSTOM PRICE BOX
========================= */

body.single-product p.price:empty {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.single-product .product_infos p:empty {
  display: none !important;
}

body.single-product .kb-price-box {
  display: flex !important;
  align-items: baseline !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
}

body.single-product .kb-price-from {
  font-size: 16px !important;
  font-weight: 600 !important;
  color: #0b6b4b !important;
}

body.single-product .kb-price-current {
  font-size: 22px !important;
  font-weight: 700 !important;
  color: #0b6b4b !important;
}

body.single-product .kb-price-regular {
  font-size: 18px !important;
  color: #444 !important;
  text-decoration: line-through !important;
}

body.single-product .kb-price-badge {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 4px 10px !important;
  border-radius: 999px !important;
  background: #f3d21b !important;
  color: #111 !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
}

@media (max-width: 767px) {
  body.single-product .kb-price-box {
    gap: 6px !important;
    margin-bottom: 10px !important;
  }

  body.single-product .kb-price-from,
  body.single-product .kb-price-current {
    font-size: 28px !important;
    font-weight: 700 !important;
    line-height: 1.1 !important;
    color: #0b6b4b !important;
  }

  body.single-product .kb-price-regular {
    font-size: 18px !important;
    margin-left: 6px !important;
  }

  body.single-product .kb-price-badge {
    font-size: 12px !important;
    margin-left: 6px !important;
  }
}


/* =========================
   MOBILE PDP SPACING
========================= */

@media (max-width: 767px) {
  body.single-product .woocommerce-product-details__short-description {
    margin-bottom: 12px !important;
  }

  body.single-product .product_meta {
    margin-bottom: 12px !important;
  }

  body.single-product .product_infos > * {
    margin-bottom: 10px !important;
  }
}


/* =========================
   VARIATION SWATCHES – MOBILE
========================= */

@media (max-width: 767px) {
  body.single-product .variable-items-wrapper {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }

  body.single-product .variable-item {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: 44px !important;
    min-height: 44px !important;
    border-radius: 10px !important;
    box-sizing: border-box !important;
  }

  body.single-product .variable-item.selected {
    border: 3px solid #111 !important;
  }

  body.single-product .variable-item span,
  body.single-product .variable-item .variable-item-span,
  body.single-product .variable-item .variable-item-contents {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 44px !important;
    padding: 8px 4px !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    line-height: 1.1 !important;
    white-space: nowrap !important;
    text-align: center !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
  }

  body.single-product .variations label {
    font-size: 0 !important;
    margin-bottom: 8px !important;
  }

  body.single-product .variations label::before {
    content: "VÆLG STØRRELSE";
    font-size: 14px !important;
    font-weight: 600 !important;
    letter-spacing: 0.5px !important;
  }

  body.single-product .woo-selected-variation-item-name {
    display: none !important;
  }
}


/* =========================
   DESKTOP – PÆNERE STØRRELSESKNAPPER + CTA
========================= */

@media (min-width: 1025px) {
  body.single-product .variable-items-wrapper {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 12px !important;
    width: 100% !important;
  }

  body.single-product .variable-item {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: 46px !important;
    min-height: 46px !important;
    border-radius: 10px !important;
    border: 1px solid #d9d9d9 !important;
    background: #fff !important;
    box-sizing: border-box !important;
    box-shadow: none !important;
  }

  body.single-product .variable-item.selected {
    border: 2px solid #111 !important;
    box-shadow: none !important;
  }

  body.single-product .variable-item span,
  body.single-product .variable-item .variable-item-span,
  body.single-product .variable-item .variable-item-contents {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 46px !important;
    padding: 8px 10px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    line-height: 1.1 !important;
    white-space: nowrap !important;
    text-align: center !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
  }

  body.single-product .single_variation_wrap .woocommerce-variation-add-to-cart,
  body.single-product form.cart .woocommerce-variation-add-to-cart {
    display: flex !important;
    align-items: stretch !important;
    gap: 12px !important;
    width: 100% !important;
  }

  body.single-product form.cart .quantity {
    flex: 0 0 72px !important;
    width: 72px !important;
    max-width: 72px !important;
    margin: 0 !important;
  }

  body.single-product form.cart .quantity input.qty {
    width: 100% !important;
    height: 54px !important;
    text-align: center !important;
    border-radius: 6px !important;
    box-sizing: border-box !important;
  }

  body.single-product .single_add_to_cart_button {
    flex: 1 1 auto !important;
    width: auto !important;
    min-width: 0 !important;
    height: 54px !important;
    margin: 0 !important;
    background-color: #2f9e6b !important;
    color: #fff !important;
    border: none !important;
    border-radius: 6px !important;
    padding: 0 18px !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
  }
}


/* =========================
   FJERN TOM SPACING OVER VARIATIONS
========================= */

body.single-product #woocommerce_before_add_to_cart_form p:empty,
body.single-product #woocommerce_before_add_to_cart_form p {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.single-product #woocommerce_before_add_to_cart_form hr {
  display: none !important;
  margin: 0 !important;
}

body.single-product #woocommerce_before_add_to_cart_form {
  margin: 0 !important;
  padding: 0 !important;
  min-height: 0 !important;
}


/* =========================
   LAGER + COUNTDOWN
========================= */

body.single-product .kb-stock-countdown {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 14px 0 16px !important;
  font-size: 15px;
  line-height: 1.4;
  color: #111;
}

body.single-product .kb-stock-dot {
  width: 12px;
  height: 12px;
  min-width: 12px;
  border-radius: 50%;
  background: #22c55e;
  display: inline-block;
}

body.single-product .kb-stock-text strong {
  font-weight: 700;
}

@media (max-width: 767px) {
  body.single-product .kb-stock-countdown {
    margin: 12px 0 14px !important;
    font-size: 13px;
    line-height: 1.45;
  }

  body.single-product .kb-stock-dot {
    width: 10px;
    height: 10px;
    min-width: 10px;
  }
}

/* ========================================
   PRODUKTSIDE - SKJUL VALGT STØRRELSE I LABEL
   Formål:
   - Fjerne teksten fx "50X70 cm" ved siden af "STØRRELSE"
   - Beholde selve swatches synlige og klikbare
======================================== */

table.variations th.label .woo-selected-variation-item-name {
  display: none !important;
}

/* ========================================
   PRODUKTSIDE - FLYT "PÅ LAGER" OVER ANTAL + CTA
   Kun desktop
   Formål:
   - Lagerstatus skal tage sin egen linje
   - Antal + CTA skal stå på linjen under
   - Mobil bevares som den er
======================================== */

@media (min-width: 768px) {

  /* Wrapper omkring lager, antal og CTA */
  .woocommerce-variation-add-to-cart.variations_button {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: flex-start !important;
    gap: 12px !important;
  }

  /* Lagerstatus skal fylde hele første linje */
  .woocommerce-variation-add-to-cart.variations_button .stock,
  .woocommerce-variation-add-to-cart.variations_button .woocommerce-variation-availability,
  .woocommerce-variation-add-to-cart.variations_button p.stock {
    flex: 0 0 100% !important;
    width: 100% !important;
    margin: 0 0 12px 0 !important;
  }

  /* Antal felt */
  .woocommerce-variation-add-to-cart.variations_button .quantity {
    flex: 0 0 72px !important;
    width: 72px !important;
    margin: 0 !important;
  }

  /* CTA-knap fylder resten */
  .woocommerce-variation-add-to-cart.variations_button .single_add_to_cart_button {
    flex: 1 1 0 !important;
    margin: 0 !important;
  }
}

/* ========================================
   CTA KNAP - ENS DESIGN (MOBIL + DESKTOP)
   Formål:
   - Samme farve, radius, hover osv. overalt
======================================== */

.single_add_to_cart_button {
  background-color: #2f9e6b !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 8px !important;
  font-weight: 600 !important;
  padding: 14px 18px !important;
  transition: all 0.2s ease !important;
}

/* Hover (desktop) */
.single_add_to_cart_button:hover {
  background-color: #278a5c !important;
  transform: translateY(-1px);
}

/* ========================================
   CHECKOUT CTA - SAMME LOOK SOM PRODUKTKNAP
   Formål:
   - Gøre "GÅ TIL KASSEN" knappen identisk med produktets CTA
   - Ens farve, radius, tekst og spacing
======================================== */

.woocommerce .wc-proceed-to-checkout a.checkout-button,
.woocommerce-page .wc-proceed-to-checkout a.checkout-button {
  background-color: #2f9e6b !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 8px !important;
  font-weight: 600 !important;
  font-size: 16px !important;
  line-height: 1.2 !important;
  text-transform: uppercase !important;
  text-align: center !important;
  padding: 16px 20px !important;
  box-shadow: none !important;
  transition: all 0.2s ease !important;
}

/* Hover state på desktop */
.woocommerce .wc-proceed-to-checkout a.checkout-button:hover,
.woocommerce-page .wc-proceed-to-checkout a.checkout-button:hover {
  background-color: #278a5c !important;
  color: #ffffff !important;
  transform: translateY(-1px);
}

/* Fokus state for bedre UX/accessibility */
.woocommerce .wc-proceed-to-checkout a.checkout-button:focus,
.woocommerce-page .wc-proceed-to-checkout a.checkout-button:focus {
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(47, 158, 107, 0.18) !important;
}

/* ========================================
   CHECKOUT - BETAL KNAP (PLACE ORDER)
   Formål:
   - Samme design som produkt + kurv CTA
   - Ens farve, radius, font og spacing
======================================== */

#place_order {
  background-color: #2f9e6b !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 8px !important;
  font-weight: 600 !important;
  font-size: 16px !important;
  text-transform: uppercase !important;
  padding: 16px 20px !important;
  width: 100% !important;
  transition: all 0.2s ease !important;
}

/* Hover (desktop) */
#place_order:hover {
  background-color: #278a5c !important;
  transform: translateY(-1px);
}

/* Disabled state (vigtigt for UX) */
#place_order:disabled {
  background-color: #cfcfcf !important;
  cursor: not-allowed;
}

/* ========================================
   PRODUKTLISTE - REN PRISTEKST
   Formål:
   - Vise: "Fra 635 kr - Før 747 kr"
   - Fjerne "Spar 15%"
   - Beholde theme font og styling
======================================== */

/* Fjern "Spar xx%" */
.product_after_shop_loop .price .kb-price-badge {
  display: none !important;
}

/* Skjul original "Fra kun" */
.product_after_shop_loop .price .kb-price-from {
  font-size: 0 !important;
}

/* Indsæt "Fra " */
.product_after_shop_loop .price .kb-price-from::before {
  content: "Fra " !important;
  font-size: inherit !important; /* Bevarer samme font */
}

/* Tilføj " - Før " foran normalpris */
.product_after_shop_loop .price .kb-price-regular::before {
  content: " - Før " !important;
}

/* Sørg for førpris er overstreget */
.product_after_shop_loop .price .kb-price-regular {
  text-decoration: line-through !important;
}

/* ========================================
   PRODUKTLISTE - JUSTER SALE BADGE STØRRELSE
   Formål:
   - Mindre end før (ca. halv størrelse)
   - Stadig tydelig, men ikke dominerende
======================================== */

.woocommerce ul.products li.product .onsale {
  font-size: 14px !important;
  padding: 8px 12px !important;
  border-radius: 6px !important;
  font-weight: 600 !important;
}

/* ========================================
   PRODUKTSIDE - MATCH SALE BADGE STØRRELSE
   Formål:
   - Samme størrelse som på produktliste
   - Ens look på hele sitet
======================================== */

.single-product .product-sale .onsale {
  font-size: 14px !important;
  padding: 8px 12px !important;
  border-radius: 6px !important;
  font-weight: 600 !important;
}

/* ========================================
   VARIATION SWATCHES - MINDRE TEKST I KNAPPER
   Formål:
   - Gøre størrelserne mere læsbare
   - Undgå at teksten virker presset
======================================== */

.woo-variation-swatches .variable-items-wrapper .variable-item .variable-item-span-button,
.woo-variation-swatches .variable-items-wrapper .variable-item span {
  font-size: 11px !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
}

/* ========================================
   VARIATION SWATCHES - SELECTED STATE
   Formål:
   - Grøn border (matcher CTA)
   - Mindre tykkelse
   - Mere clean look
======================================== */

.woo-variation-swatches .variable-items-wrapper .variable-item.selected,
.woo-variation-swatches .variable-items-wrapper .variable-item.selected:hover {
  border: 2px solid #2f9e6b !important;
  box-shadow: none !important;
}

/* ========================================
   PAYMENT ICONS - CLEAN GRID DESIGN
   Formål:
   - Ens bokse omkring alle betalingsikoner
   - Pæn spacing
   - Centreret layout
======================================== */

/* Wrapper */
.payment-icons,
.wc_payment_methods,
.woocommerce-checkout-payment {
  display: flex !important;
  justify-content: center !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
}

/* Hver ikon-boks */
.payment-icons img,
.woocommerce-checkout-payment img,
.wc_payment_methods img {
  background: #fff !important;
  border: 1px solid #e5e5e5 !important;
  border-radius: 6px !important;
  padding: 6px 10px !important;
  height: 28px !important;
  width: auto !important;
  object-fit: contain !important;
}

/* ========================================
   PAYMENT ICONS - CLEAN LOOK
======================================== */

.custom-payment-icons {
  display: flex;
  justify-content: center;
  gap: 10px;
  margin-top: 10px;
}

.custom-payment-icons img {
  height: 26px;
  padding: 6px 10px;
  border: 1px solid #e5e5e5;
  border-radius: 6px;
  background: #fff;
}

/* Trustpilot */
.custom-trustpilot {
  display: flex;
  justify-content: center;
  gap: 6px;
  margin-top: 8px;
}

.custom-trustpilot img {
  height: 18px;
}

/* ========================================
   FJERN GAMMEL PAYMENT BLOK UNDER CTA
   Formål:
   - Fjerne eksisterende Stripe/payment + Trustpilot blok
======================================== */

#woocommerce_after_add_to_cart_form {
  display: none !important;
}

/* ========================================
   PAYMENT ICONS - MOBIL FIX (IKKE STRETCH)
   Formål:
   - Beholde ikonernes proportioner
   - Gøre dem større og pænere
   - Stadig fylde bredden bedre
======================================== */

@media (max-width: 768px) {

  .custom-payment-icons {
    justify-content: center !important;
    gap: 12px !important;
    padding: 0 10px !important;
  }

  .custom-payment-icons img {
    height: 30px !important;
    width: auto !important; /* vigtig */
    padding: 6px 12px !important;
  }
}

/* ========================================
   PAYMENT ICONS - DESKTOP STØRRELSE
   Formål:
   - Gøre ikoner større på desktop
   - Beholde clean box look
======================================== */

@media (min-width: 768px) {

  .custom-payment-icons img {
    height: 34px !important;
    width: auto !important;
    padding: 8px 16px !important;
    border-radius: 8px !important;
  }

  /* Trustpilot lidt større også */
  .custom-trustpilot img {
    height: 22px !important;
  }
}

/* ========================================
   PRODUKTSIDE - TRUSTPILOT STYLE REVIEW
   Formål:
   - Style review så det ligner Trustpilot
======================================== */

.kb-review-card {
  background: #ffffff;
  border-radius: 10px;
  padding: 18px;
  margin-top: 16px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
}

/* Top række */
.kb-review-top {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

/* Avatar */
.kb-review-avatar {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: #f3d8ad;
  color: #222;
  font-size: 18px;
  font-weight: 600;
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 44px;
}

/* Navn + meta */
.kb-review-author-meta {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.kb-review-author {
  font-size: 18px;
  font-weight: 500;
  color: #111;
  line-height: 1.2;
}

.kb-review-submeta {
  font-size: 14px;
  color: #555;
  line-height: 1.2;
}

/* Dato til højre */
.kb-review-date {
  margin-left: auto;
  font-size: 14px;
  color: #555;
  line-height: 1.2;
}

/* Stjerner */
.kb-review-stars {
  display: flex;
  gap: 3px;
  margin-top: 16px;
  margin-bottom: 14px;
}

.kb-star {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  background: #00b67a;
  color: #ffffff;
  font-size: 14px;
  line-height: 1;
  font-weight: 700;
}

/* Titel */
.kb-review-title {
  font-size: 16px;
  font-weight: 700;
  color: #111;
  line-height: 1.4;
  margin-bottom: 12px;
}

/* Brødtekst */
.kb-review-text {
  font-size: 15px;
  color: #111;
  line-height: 1.6;
  margin-bottom: 14px;
}

/* Små badges */
.kb-review-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.kb-review-badge {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 4px 10px;
  border-radius: 6px;
  background: #f1f1f1;
  color: #333;
  font-size: 13px;
  line-height: 1.2;
}

/* Mobil */
@media (max-width: 767px) {
  .kb-review-card {
    padding: 16px;
  }

  .kb-review-author {
    font-size: 16px;
  }

  .kb-review-date {
    width: 100%;
    margin-left: 56px;
  }

  .kb-review-text {
    font-size: 14px;
  }
}

/* ========================================
   FJERN GAMMEL TESTIMONIAL BLOK
   Formål:
   - Fjerne "Tidligere kunde (Kirsten)"
   - Give plads til ny Trustpilot review
======================================== */

#woocommerce_single_product_summary .hookmeup-hook {
  display: none !important;
}

/* ========================================
   FJERN GAMMEL TESTIMONIAL BLOK
   Formål:
   - Fjerne "Tidligere kunde (Kirsten)"
   - Fjerne den gamle Trustpilot-tekstblok
   - Beholde resten af produktsiden
======================================== */

/* Selve overskriften */
#woocommerce_single_product_summary .vc_custom_heading {
  display: none !important;
}

/* Tekstblokken under overskriften */
#woocommerce_single_product_summary .wpb_text_column.wpb_content_element {
  display: none !important;
}

/* ========================================
   RECAPTCHA BADGE - SKJUL
   Formål:
   - Fjerne den blå "beskyttet af reCAPTCHA" boks
   - Give et renere design uden forstyrrelser
   Vigtigt:
   - Husk at tilføje reCAPTCHA tekst i footer (krav fra Google)
======================================== */

.grecaptcha-badge {
  visibility: hidden !important;   /* Skjuler badge visuelt */
  opacity: 0 !important;           /* Sikrer den er usynlig */
  pointer-events: none !important; /* Deaktiverer klik */
}

/* ========================================
   PRODUKTSIDE - ENS PRIS TYPOGRAFI (STØRRE)
   Formål:
   - Gøre hele prislinjen større
   - Lade prisen være mere fremhævet (fed)
   - Beholde clean alignment
======================================== */

@media (min-width: 768px) {

  /* Ens font */
  .single-product .kb-price-box,
  .single-product .kb-price-box * {
    font-family: inherit !important;
  }

  /* "Fra kun" */
  .single-product .kb-price-box .kb-price-from {
    font-size: 18px !important;
    font-weight: 500 !important;
    line-height: 1.2 !important;
  }

  /* Selve prisen (mere prominent) */
  .single-product .kb-price-box .kb-price-current,
  .single-product .kb-price-box .kb-price-current .woocommerce-Price-amount,
  .single-product .kb-price-box .kb-price-current .woocommerce-Price-amount bdi,
  .single-product .kb-price-box .kb-price-current .woocommerce-Price-currencySymbol {
    font-size: 22px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
  }

  /* Alignment */
  .single-product .kb-price-box {
    display: flex !important;
    align-items: baseline !important;
    gap: 6px !important;
  }
}

/* ========================================
   PRODUKTSIDE - MINDRE BESKRIVELSE PÅ MOBIL/IPAD
   Formål:
   - Gøre tekstblokken under produktnavn mere kompakt
   - Ramme selve p-tags og teksten inde i beskrivelsen
   - Gælder kun tablet og mobil
======================================== */

@media (max-width: 1024px) {

  /* Hele short description blokken */
  .single-product .woocommerce-product-details__short-description {
    font-size: 13px !important;
    line-height: 1.45 !important;
  }

  /* Selve tekststykkerne inde i blokken */
  .single-product .woocommerce-product-details__short-description p,
  .single-product .woocommerce-product-details__short-description div,
  .single-product .woocommerce-product-details__short-description span,
  .single-product .woocommerce-product-details__short-description em,
  .single-product .woocommerce-product-details__short-description strong,
  .single-product .woocommerce-product-details__short-description a,
  .single-product .woocommerce-product-details__short-description li {
    font-size: 13px !important;
    line-height: 1.45 !important;
  }

  /* Gør afstand mellem tekststykker lidt mindre */
  .single-product .woocommerce-product-details__short-description p {
    margin-bottom: 8px !important;
  }
}

/* ========================================
   PRODUKTSIDE - FJERN SHARE / SOCIAL IKONER
   Formål:
   - Fjerne "Share this product" + sociale ikoner
   - Gælder på hele sitet
======================================== */

.product_socials_wrapper {
  display: none !important;
}

/* ========================================
   PRODUKTSIDE - FJERN PRODUKT NAVIGATION
   Formål:
   - Fjerne "Previous / Next product"
   - Beholde separator/linje ovenover
======================================== */

.product_navigation {
  display: none !important;
}

/* ========================================
   OPSELG - PRIS SOM "PRIS FRA"
   Formål:
   - Gøre prisen mindre
   - Tilføje "Pris fra" foran
   - Give mere roligt udtryk
======================================== */

.upsells .kb-price-box {
  display: flex !important;
  align-items: baseline !important;
  gap: 4px !important;
}

/* Tilføj "Pris fra" */
.upsells .kb-price-box::before {
  content: "Pris fra ";
  font-size: 13px;
  font-weight: 400;
  color: #666;
}

/* Selve prisen */
.upsells .kb-price-current,
.upsells .kb-price-current .woocommerce-Price-amount,
.upsells .kb-price-current .woocommerce-Price-amount bdi {
  font-size: 16px !important;
  font-weight: 600 !important;
}

/* Fjern evt. eksisterende "Fra kun" */
.upsells .kb-price-from {
  display: none !important;
}

/* ========================================
   OPSELG + RELATEREDE VARER - PRIS SOM "FRA 249 KR."
   Formål:
   - Gøre prisvisningen ens i både upsells og related products
   - Vise teksten som "Fra 249 kr."
   - Bruge samme grønne farve på hele prislinjen
   - Holde teksten på én linje
   - Gælde på både mobil og desktop
======================================== */

/* Pris-wrapper i både upsell og relaterede varer */
.upsells .kb-price-box,
.related .kb-price-box,
.single_product_summary_upsell .kb-price-box,
.single_product_summary_related .kb-price-box {
  display: inline-flex !important;
  align-items: baseline !important;
  gap: 4px !important;
  flex-wrap: nowrap !important;
  white-space: nowrap !important;
  margin-bottom: 8px !important;
}

/* Skjul eksisterende "Fra kun" tekst */
.upsells .kb-price-box .kb-price-from,
.related .kb-price-box .kb-price-from,
.single_product_summary_upsell .kb-price-box .kb-price-from,
.single_product_summary_related .kb-price-box .kb-price-from {
  display: none !important;
}

/* Tilføj ny tekst: "Fra" */
.upsells .kb-price-box::before,
.related .kb-price-box::before,
.single_product_summary_upsell .kb-price-box::before,
.single_product_summary_related .kb-price-box::before {
  content: "Fra";
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.2 !important;
  color: #0b6b4b !important; /* matcher grøn pris */
}

/* Selve prisen */
.upsells .kb-price-box .kb-price-current,
.related .kb-price-box .kb-price-current,
.single_product_summary_upsell .kb-price-box .kb-price-current,
.single_product_summary_related .kb-price-box .kb-price-current,
.upsells .kb-price-box .woocommerce-Price-amount,
.related .kb-price-box .woocommerce-Price-amount,
.single_product_summary_upsell .kb-price-box .woocommerce-Price-amount,
.single_product_summary_related .kb-price-box .woocommerce-Price-amount,
.upsells .kb-price-box .woocommerce-Price-amount bdi,
.related .kb-price-box .woocommerce-Price-amount bdi,
.single_product_summary_upsell .kb-price-box .woocommerce-Price-amount bdi,
.single_product_summary_related .kb-price-box .woocommerce-Price-amount bdi,
.upsells .kb-price-box .woocommerce-Price-currencySymbol,
.related .kb-price-box .woocommerce-Price-currencySymbol,
.single_product_summary_upsell .kb-price-box .woocommerce-Price-currencySymbol,
.single_product_summary_related .kb-price-box .woocommerce-Price-currencySymbol {
  font-size: 16px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  color: #0b6b4b !important; /* matcher grøn pris */
  white-space: nowrap !important;
}

/* ========================================
   OPSELG + RELATEREDE - TYPOGRAFI FIX (DESKTOP)
   Formål:
   - Gøre produkt-titler mindre
   - Gøre "Fra 249 kr." mindre og ensartet
   - Skabe bedre visuel balance
======================================== */

@media (min-width: 1024px) {

  /* Produkt titel */
  .upsells h2.woocommerce-loop-product__title,
  .related h2.woocommerce-loop-product__title {
    font-size: 16px !important;
    line-height: 1.3 !important;
    font-weight: 500 !important;
    margin-bottom: 6px !important;
  }

  /* Hele prislinjen */
  .upsells .kb-price-box,
  .related .kb-price-box {
    font-size: 15px !important;
    line-height: 1.3 !important;
  }

  /* "Fra" tekst */
  .upsells .kb-price-box::before,
  .related .kb-price-box::before {
    font-size: 15px !important;
    font-weight: 400 !important;
  }

  /* Selve prisen */
  .upsells .kb-price-current,
  .related .kb-price-current,
  .upsells .woocommerce-Price-amount,
  .related .woocommerce-Price-amount,
  .upsells .woocommerce-Price-amount bdi,
  .related .woocommerce-Price-amount bdi {
    font-size: 15px !important;
    font-weight: 600 !important;
  }

  /* Fjern mismatch spacing */
  .product_after_shop_loop {
    margin-top: 4px !important;
  }
}

/* ========================================
   OPSELG + RELATEREDE - TITEL & PRIS FIX
   Formål:
   - Gøre produkttitler mindre
   - Gøre "Fra 249 kr." mindre og mere ensartet
   - Gælde i både upsells og relaterede varer
   - Overstyre Shopkeeper theme styling
======================================== */

/* ========================================
   PRODUKTTITEL
======================================== */

section.up-sells.upsells.products ul.products li.product h2.woocommerce-loop-product__title,
section.related.products ul.products li.product h2.woocommerce-loop-product__title,
section.up-sells.upsells.products ul.products li.product h2.woocommerce-loop-product__title a,
section.related.products ul.products li.product h2.woocommerce-loop-product__title a {
  font-size: 16px !important;
  line-height: 1.3 !important;
  font-weight: 500 !important;
  margin-bottom: 8px !important;
}

/* ========================================
   PRIS-WRAPPER
======================================== */

section.up-sells.upsells.products ul.products li.product .product_after_shop_loop .kb-price-box,
section.related.products ul.products li.product .product_after_shop_loop .kb-price-box {
  display: inline-flex !important;
  align-items: baseline !important;
  gap: 4px !important;
  flex-wrap: nowrap !important;
  white-space: nowrap !important;
  margin-bottom: 8px !important;
}

/* ========================================
   SKJUL ORIGINAL "FRA KUN"
======================================== */

section.up-sells.upsells.products ul.products li.product .product_after_shop_loop .kb-price-from,
section.related.products ul.products li.product .product_after_shop_loop .kb-price-from {
  display: none !important;
}

/* ========================================
   NY TEKST: "Fra"
======================================== */

section.up-sells.upsells.products ul.products li.product .product_after_shop_loop .kb-price-box::before,
section.related.products ul.products li.product .product_after_shop_loop .kb-price-box::before {
  content: "Fra";
  font-size: 14px !important;
  line-height: 1.2 !important;
  font-weight: 400 !important;
  color: #0b6b4b !important;
}

/* ========================================
   SELVE PRISEN
======================================== */

section.up-sells.upsells.products ul.products li.product .product_after_shop_loop .kb-price-current,
section.related.products ul.products li.product .product_after_shop_loop .kb-price-current,
section.up-sells.upsells.products ul.products li.product .product_after_shop_loop .woocommerce-Price-amount,
section.related.products ul.products li.product .product_after_shop_loop .woocommerce-Price-amount,
section.up-sells.upsells.products ul.products li.product .product_after_shop_loop .woocommerce-Price-amount bdi,
section.related.products ul.products li.product .product_after_shop_loop .woocommerce-Price-amount bdi,
section.up-sells.upsells.products ul.products li.product .product_after_shop_loop .woocommerce-Price-currencySymbol,
section.related.products ul.products li.product .product_after_shop_loop .woocommerce-Price-currencySymbol {
  font-size: 14px !important;
  line-height: 1.2 !important;
  font-weight: 600 !important;
  color: #0b6b4b !important;
  white-space: nowrap !important;
}

/* Mobil */
body.woocommerce.single-product section.related.products > h2,
body.woocommerce.single-product section.upsells.products > h2,
body.woocommerce.single-product section.up-sells.upsells.products > h2 {
  font-size: 20px !important;
  line-height: 1.25 !important;
  margin: 0 0 16px !important;
  text-align: left !important;
}

/* Tablet + desktop */
@media (min-width: 768px) {
  body.woocommerce.single-product section.related.products > h2,
  body.woocommerce.single-product section.upsells.products > h2,
  body.woocommerce.single-product section.up-sells.upsells.products > h2 {
    font-size: 28px !important;   /* ↓ fra 40 → 28 */
    line-height: 1.2 !important;
    margin: 0 0 24px !important;
    text-align: center !important;
  }
}

/* Skjul kun WooCommerce fanenavigation */
body.single-product .woocommerce-tabs > ul.wc-tabs {
  display: none !important;
}

/* Skjul kun de rigtige WooCommerce panels */
body.single-product .woocommerce-tabs > .woocommerce-Tabs-panel--description,
body.single-product .woocommerce-tabs > .woocommerce-Tabs-panel--additional_information,
body.single-product .woocommerce-tabs > .woocommerce-Tabs-panel--reviews {
  display: none !important;
}

/* Fjern spacing fra de skjulte tabs */
body.single-product .woocommerce-tabs {
  border: 0 !important;
  padding-top: 0 !important;
  margin-top: 0 !important;
}

@media (min-width: 768px) {
  body.woocommerce.single-product .single_product_summary_upsell {
    margin-top: 40px !important;
  }

  body.woocommerce.single-product section.upsells.products {
    padding-top: 8px !important;
  }

  body.woocommerce.single-product section.upsells.products > h2 {
    margin-bottom: 28px !important;
  }
}

/* =========================
   GLOBAL REVIEWS
   ========================= */

body.single-product section.kb-reviews {
  margin-top: 60px !important;
}

body.single-product .kb-reviews-inner {
  max-width: 1200px !important;
  margin: 0 auto !important;
}

body.single-product .kb-reviews-header {
  text-align: center !important;
  margin-bottom: 30px !important;
}

body.single-product .kb-reviews-header h2 {
  margin: 0 0 8px !important;
  font-size: 32px !important;
  line-height: 1.15 !important;
}

body.single-product .kb-reviews-header p {
  margin: 0 !important;
  color: #777 !important;
}

body.single-product .kb-reviews-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 20px !important;
}

body.single-product .kb-card {
  background: #fff !important;
  border: 1px solid #eee !important;
  border-radius: 14px !important;
  padding: 20px !important;
  min-width: 0 !important;
}

body.single-product .kb-card-top {
  margin-bottom: 10px !important;
}

body.single-product .kb-card-top strong {
  display: block !important;
  margin-bottom: 10px !important;
  color: #1f1f1f !important;
  font-size: 17px !important;
  line-height: 1.3 !important;
}

body.single-product .kb-stars {
  display: flex !important;
  gap: 4px !important;
  align-items: center !important;
  margin: 0 0 8px !important;
}

body.single-product .kb-stars .kb-star {
  width: 22px !important;
  height: 22px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 4px !important;
  background: #d9d9d9 !important;
  color: transparent !important;
  position: relative !important;
  line-height: 1 !important;
  font-size: 0 !important;
  padding: 0 !important;
}

body.single-product .kb-stars .kb-star.is-filled {
  background: #2f9e6b !important;
}

body.single-product .kb-stars .kb-star::before {
  content: "★" !important;
  color: #fff !important;
  font-size: 12px !important;
  line-height: 1 !important;
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
}

body.single-product .kb-text {
  margin: 10px 0 !important;
  line-height: 1.55 !important;
  color: #2c2c2c !important;
  font-size: 15px !important;
}

body.single-product .kb-product {
  display: block !important;
  font-size: 13px !important;
  color: #777 !important;
}

body.single-product .kb-more-wrap {
  text-align: center !important;
  margin-top: 20px !important;
  display: none !important; /* skjult på desktop */
}

body.single-product #kb-more-btn {
  border: 1px solid #ddd !important;
  padding: 10px 16px !important;
  border-radius: 999px !important;
  background: #fff !important;
  cursor: pointer !important;
}

/* Desktop: skjul alt efter de første 3 */
@media (min-width: 768px) {
  body.single-product .kb-hide-desktop {
    display: none !important;
  }
}

/* Mobil */
@media (max-width: 767px) {
  body.single-product .kb-reviews-grid {
    grid-template-columns: 1fr !important;
  }

  body.single-product .kb-hide-mobile {
    display: none !important;
  }

  body.single-product .kb-hide-mobile.kb-show-mobile {
    display: block !important;
  }

  body.single-product .kb-more-wrap {
    display: block !important; /* kun mobil */
  }

  body.single-product .kb-hide-desktop {
    display: block !important; /* desktop-hide må ikke gælde på mobil */
  }
}

@media (max-width: 767px) {
  body.single-product .kb-reviews-grid {
    grid-template-columns: 1fr !important;
  }

  /* skjul alle fra nr. 3 og frem på mobil */
  body.single-product .kb-card.kb-hide-mobile {
    display: none !important;
  }

  /* vis dem igen efter klik */
  body.single-product .kb-card.kb-hide-mobile.kb-show-mobile {
    display: block !important;
  }

  /* vis kun knappen på mobil */
  body.single-product .kb-more-wrap {
    display: block !important;
  }

  /* desktop-skjul må ikke gælde på mobil */
  body.single-product .kb-hide-desktop {
    display: block !important;
  }
}

/* BAGGRUND */
.off-canvas.menu-offcanvas {
  background: #f5f6f8 !important;
}

/* WRAP */
#mobiles-menu-offcanvas {
  padding: 20px 14px !important;
}

/* HEADER */
.kb-header {
  margin-bottom: 20px;
}

.kb-logo {
  font-size: 20px;
  font-weight: 800;
  letter-spacing: 0.05em;
  color: #2f4b6b;
}

/* MENU */
.kb-menu {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

/* ITEM */
.kb-item {
  display: flex;
  align-items: center;
  height: 58px;
  padding: 0 16px;
  background: #fff;
  border-radius: 12px;
  border: 1px solid #e6e9ef;
  text-decoration: none;
  color: #111;
  font-size: 16px;
  font-weight: 500;
  position: relative;
}

/* IKON */
.kb-icon {
  width: 24px;
  margin-right: 14px;
  color: #111;
}

/* TEKST */
.kb-text {
  flex: 1;
}

/* PIL */
.kb-arrow {
  font-size: 22px;
  color: #111;
}

/* HOVER */
.kb-item:hover {
  background: #fafafa;
}

.kb-menu-header {
  margin: 0 0 18px;
}

.kb-menu-logo-img {
  max-width: 180px;
  height: auto;
  display: block;
}

.kb-custom-menu {
  display: flex;
  flex-direction: column;
  gap: 0;
  border-radius: 8px;
  overflow: hidden;
  background: #fff;
  margin-bottom: 16px;
}

.kb-custom-item {
  background: #fff;
  border: 0;
  border-bottom: 1px solid #e5e7eb;
  border-radius: 0;
  overflow: hidden;
}

.kb-custom-item:last-child {
  border-bottom: 0;
}

.kb-custom-row {
  display: flex;
  align-items: stretch;
  min-height: 56px;
}

.kb-main-link {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 0 14px 0 18px;
  text-decoration: none;
  color: #111;
  font-size: 16px;
  font-weight: 500;
  background: #fff;
}

.kb-item-icon {
  width: 22px;
  height: 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #111;
  flex: 0 0 22px;
}

.kb-item-text {
  flex: 1;
}

.kb-item-toggle {
  width: 50px;
  border: 0;
  background: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.kb-item-arrow {
  font-size: 26px;
  line-height: 1;
  color: #111;
  transition: transform .2s ease;
}

.kb-custom-item.is-open .kb-item-arrow {
  transform: rotate(90deg);
}

.kb-submenu {
  border-top: 1px solid #eef0f3;
  background: #fff;
  padding: 4px 0 8px;
}

.kb-submenu-link {
  display: block;
  padding: 10px 18px 10px 56px;
  text-decoration: none;
  color: #444;
  font-size: 14px;
  line-height: 1.4;
  background: #fff;
}

.kb-submenu-link:hover,
.kb-main-link:hover,
.kb-item-toggle:hover {
  background: #f5f6f8;
}

/****************************************************************/
/****************************************************************/
/****************************************************************/