/* ========================================
   🎨 THEME VARIABLER - ÆNDR HER FOR NYT TEMA
   ========================================
   
   INSTRUKTIONER:
   For at lave et nyt tema, skal du bare ændre farverne i variablerne nedenfor.
   Alle farver i CSS'en bruger disse variabler, så hele temaet opdateres automatisk.
   
   ======================================== */
:root {
    /* Primære farver */
    --theme-primary: #3CAFC8;
    /* Calm Coastal Aqua */
    --theme-primary-hover: #237F95;
    /* Hover-farve for primær */
    --theme-primary-text: #ffffff;
    /* Tekstfarve på primær baggrund */

    /* Baggrundsfarver */
    --theme-bg-main: #F7EBD8;
    /* Hovedbaggrund (body, wrapper) - Light Sand */
    --theme-bg-secondary: #0F5F65;
    /* Sekundær baggrund (footer, dropdowns) - Deep Coastal Teal */
    --theme-bg-box: #ffffff;
    /* Boksbaggrund (kort, paneler) - White */
    --theme-bg-input: #ffffff;
    /* Input-felter baggrund */
    --theme-bg-overlay: rgba(0, 0, 0, 0.75);
    /* Overlay baggrund */

    /* Tekstfarver */
    --theme-text: #243236;
    /* Hovedtekst - Deep Slate */
    --theme-text-light: #5C6F73;
    /* Lys tekst (priser, sekundær tekst) */
    --theme-text-muted: #809195;
    /* Nedtonet tekst (placeholders) */
    --theme-text-lighter: #D7F4F2;
    /* Ekstra lys tekst (for dark backgrounds like footer) */
    --theme-text-lightest: #ffffff;
    /* Meget lys tekst */

    /* Border og divider farver */
    --theme-border: #BFE7E8;
    /* Standard border - Pale Seafoam */
    --theme-border-light: #E5F6F4;
    /* Lys border */
    --theme-border-lighter: #F7EBD8;
    /* Ekstra lys border */

    /* Special farver */
    --theme-success: #F2B84B;
    /* Success/checkout knapper - Muted Summer Sun */
    --theme-success-hover: #D99A26;
    /* Success hover */
    --theme-focus: #3CAFC8;
    /* Focus state color */
    --theme-link: #237F95;
    /* Link farve (kupon) */
    --theme-link-hover: #0F5F65;
    /* Link hover */
    --theme-link-alt: #0F5F65;
    /* Alternativ link farve */

    /* Ekstra baggrundsfarver */
    --theme-bg-sticky: #F2F7F6;
    /* Sticky header/cart baggrund */
    --theme-bg-mobile: #F2F7F6;
    /* Mobil menu baggrund */
    --theme-bg-mobile-input: #ffffff;
    /* Mobil input baggrund */
    --theme-bg-quantity: #ffffff;
    /* Quantity input baggrund */

    /* Ekstra border farver */
    --theme-border-sticky: #CFE3E3;
    /* Sticky element border */

    /* Shadows og effects */
    --theme-shadow: rgba(0, 0, 0, 0.1);
    /* Standard shadow */
    --theme-shadow-light: rgba(0, 0, 0, 0.1);
    /* Lys shadow (hover) */
    --theme-sand-size: 760px auto;
}

/* ========================================
   🌊 GENEREL SOMMERBAGGRUND
   ======================================== */
body,
#wrapper,
#main,
.page-wrapper,
.site,
.site-content {
    background-color: var(--theme-bg-main) !important;
    color: var(--theme-text) !important;
}

/* ✍️ Tekst i content-områder */
.page-wrapper,
.site-content,
.entry-content,
.ux-text,
h1,
h2,
h3,
h4,
h5,
h6,
p,
li {
    color: var(--theme-text) !important;
}

/* ========================================
   🧱 PRODUKTKORT
   ======================================== */
/* ========================================
   🎨 CALM COASTAL PRODUKTKORT (BLÅ VARIANTER)
   ======================================== */

/* 1/3 Light Coastal Blue */
.product-small.col:nth-child(3n+1) .col-inner,
.product-small.col:nth-child(3n+1) .product-small {
    background-color: #D8F3F5 !important;
    border: 1px solid #7CCDD5 !important;
    border-radius: 12px;
}

/* 1/3 Soft Sky Blue */
.product-small.col:nth-child(3n+2) .col-inner,
.product-small.col:nth-child(3n+2) .product-small {
    background-color: #E5F7FF !important;
    border: 1px solid #8AD4E8 !important;
    border-radius: 12px;
}

/* 1/3 Pale Aqua Blue */
.product-small.col:nth-child(3n) .col-inner,
.product-small.col:nth-child(3n) .product-small {
    background-color: #DDF8F2 !important;
    border: 1px solid #80D7CB !important;
    border-radius: 12px;
}

.product-small.col .col-inner,
.product-small.col .product-small {
    overflow: hidden !important;
    border-radius: 12px !important;
}

.product-small.col .box-image,
.product-small.col .box-image img {
    overflow: hidden !important;
    border-top-left-radius: 12px !important;
    border-top-right-radius: 12px !important;
    border-bottom-left-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}

.product-small.col .col-inner {
    overflow: hidden;
}

.product-small.col .box-text.box-text-products,
.product-small.col .product-small .box-text,
.product-small.box .box-text.box-text-products {
    background-color: transparent !important;
    color: var(--theme-text) !important;
}

ul.products li.product .box-text-products .woocommerce-loop-product__title,
ul.products li.product .box-text-products .price,
ul.products li.product .box-text-products .product-sku,
ul.products li.product .box-text-products a,
ul.products li.product .box-text-products p,
ul.products li.product .box-text-products span,
.product-small.box .box-text.box-text-products,
.product-small.box .box-text.box-text-products * {
    color: var(--theme-text) !important;
}

/* Sæson-dekorationer på produktkort holdes i baggrund/farver */

ul.products li.product .box-text-products .price {
    color: var(--theme-text-light) !important;
}

ul.products li.product:hover .product-small {
    box-shadow: 0 0 10px var(--theme-shadow-light);
    transform: translateY(-2px);
    transition: all 0.2s ease-in-out;
}

/* ========================================
   📄 FOOTER
   ======================================== */
.footer-wrapper {
    background-color: var(--theme-bg-secondary) !important;
    color: var(--theme-text-lighter) !important;
    padding-top: 30px;
    padding-bottom: 30px;
}

.footer-wrapper a,
.footer-wrapper p,
.footer-wrapper li,
.footer-wrapper h4,
.footer-wrapper h5 {
    color: var(--theme-text-lightest) !important;
}

.footer-wrapper .footer-1,
.footer-wrapper .footer-2,
.footer-wrapper .absolute-footer {
    border-top: none !important;
    background-color: transparent !important;
}

header .header-bottom {
    border-top: none !important;
}

.header.header-sticky {
    box-shadow: none !important;
}

/* ========================================
   � NYHEDSBREV / NEWSLETTER 
   ======================================== */
.newsletter-row .col-inner {
    background-color: var(--theme-primary) !important;
}

.newsletter-row .col-inner,
.newsletter-row .col-inner h1,
.newsletter-row .col-inner h2,
.newsletter-row .col-inner h3,
.newsletter-row .col-inner p,
.newsletter-row .col-inner span,
.newsletter-row .col-inner .icon-box-text,
.newsletter-row .col-inner .icon-box-text * {
    color: var(--theme-primary-text) !important;
}

/* ========================================
   �📋 HEADER
   ======================================== */
.header-wrapper,
.header-main,
#masthead,
.header-bottom {
    background: linear-gradient(180deg, #F6FBFA 0%, #EAF4F3 100%) !important;
    color: var(--theme-text) !important;
}

body header .header-top,
#top-bar {
    background-color: var(--theme-primary) !important;
    color: #ffffff !important;
}

/* Force top bar text elements to be white, overriding broad selectors */
.header-top p,
.header-top li,
.header-top span,
.header-top a,
.header-top .topbar-inner-item {
    color: #ffffff !important;
}

.header,
.header a,
.header-nav li a,
.header-cart-title,
.header-cart-price,
.header-account-link,
.header-bottom-nav li a,
.header .account-item,
.header .account-item * {
    color: var(--theme-text) !important;
}

.header a:hover,
.header-nav li a:hover {
    color: var(--theme-primary) !important;
}

.header-nav li a::before,
.header-nav li a::after {
    background-color: var(--theme-text) !important;
}

.header .header-links,
.header .cart-info,
.header .header-button,
.header .cart-item,
.header .cart-item *,
.header .cart-title,
.header .cart-price,
.header-cart-link i,
.header-cart-link svg {
    color: var(--theme-text) !important;
    fill: var(--theme-text) !important;
}

.header .searchform,
.header .search-field {
    background-color: var(--theme-bg-box) !important;
    color: var(--theme-text) !important;
    border: 1px solid var(--theme-text) !important;
    box-shadow: none !important;
}

.header .search-field::placeholder {
    color: var(--theme-text-muted) !important;
}

.dgwt-wcas-search-wrapp input[type="search"] {
    background-color: var(--theme-bg-box) !important;
    color: var(--theme-text) !important;
    border: 1px solid var(--theme-border-light) !important;
}

.dgwt-wcas-search-wrapp input[type="search"]::placeholder {
    color: var(--theme-text-light) !important;
}

.dgwt-wcas-search-submit svg {
    fill: var(--theme-text) !important;
}

.dgwt-wcas-suggestions-wrapp {
    background-color: var(--theme-bg-main) !important;
    color: var(--theme-text) !important;
    border: none !important;
    box-shadow: none !important;
}

.dgwt-wcas-suggestion {
    background-color: var(--theme-bg-main) !important;
    color: var(--theme-text) !important;
}

.dgwt-wcas-suggestion.dgwt-wcas-suggestion-selected,
.dgwt-wcas-suggestion:hover {
    background-color: var(--theme-border-light) !important;
}

.dgwt-wcas-suggestion .dgwt-wcas-suggestion-title,
.dgwt-wcas-suggestion .dgwt-wcas-suggestion-meta,
.dgwt-wcas-suggestion .dgwt-wcas-st *,
.dgwt-wcas-suggestion .dgwt-wcas-sku {
    color: var(--theme-text) !important;
}

.dgwt-wcas-suggestion:not(:last-child) {
    border-bottom: 1px solid var(--theme-border-light) !important;
}

.sub-menu.nav-dropdown,
.account-dropdown,
.account-dropdown ul,
.account-item .nav-dropdown {

    color: var(--theme-text) !important;
    border: none !important;
    box-shadow: none !important;
}

.sub-menu.nav-dropdown li a,
.account-dropdown li a,
.account-item .nav-dropdown li a {
    color: var(--theme-text) !important;
}

.sub-menu.nav-dropdown li:hover>a,
.account-dropdown li a:hover,
.account-item .nav-dropdown li:hover>a {
    background-color: var(--theme-border-light) !important;
    color: var(--theme-primary-hover) !important;
}

@media (min-width: 777px) {
    header .header-bottom {
        border-top: none !important;
    }
}

.account-item .header-button,
.account-item .header-button:hover,
.account-item .header-button:focus,
.header .button.primary,
.header .button.primary:hover,
.header .button.primary:focus,
.cart-item .header-cart-link,
.cart-item .header-cart-link:hover,
.cart-item .header-cart-link:focus {
    background-color: transparent !important;
    box-shadow: none !important;
    color: var(--theme-text) !important;
    border: none !important;
}

/* Logo override removed for light theme */

/* ========================================
   🛒 MINI CART
   ======================================== */
.cart-popup,
.cart-popup-inner,
.cart-popup-title,
.widget_shopping_cart,
.widget_shopping_cart_content,
.woocommerce-mini-cart-item,
.woocommerce-mini-cart__total,
.off-canvas-cart,
#cart-popup {
    background-color: var(--theme-bg-main) !important;
    color: var(--theme-text) !important;
}

.cart-popup-title,
.cart-popup-title * {
    color: var(--theme-text) !important;
}

.woocommerce-mini-cart-item a,
.woocommerce-mini-cart-item p,
.woocommerce-mini-cart-item .product-title,
.woocommerce-mini-cart-item .quantity,
.woocommerce-mini-cart-item .variation,
.woocommerce-mini-cart__total strong,
.woocommerce-Price-amount,
.product-subtotal,
.product-subtotal .woocommerce-Price-amount {
    color: var(--theme-text) !important;
}

.ux-quantity_button,
.ux-quantity input[type="number"] {
    background-color: var(--theme-bg-box) !important;
    color: var(--theme-text) !important;
}

.product-subtotal.price--wrapper,
.product-subtotal .woocommerce-Price-amount {
    color: var(--theme-text-light) !important;
}

.woocommerce-mini-cart-total.total,
.widget_shopping_cart p.total {
    background-color: var(--theme-bg-box) !important;
    padding: 10px 15px !important;
    color: var(--theme-text) !important;
    text-align: left !important;
}

.ux-mini-cart-footer {
    background-color: var(--theme-bg-box) !important;
}

.woocommerce-mini-cart__buttons .button,
.woocommerce-mini-cart__buttons a.button {
    background-color: var(--theme-success) !important;
    color: var(--theme-text) !important;
    font-weight: 600;
    border: none !important;
}

a.remove {
    color: var(--theme-text-muted) !important;
}

a.remove:hover {
    color: var(--theme-text) !important;
}

.cart-popup-title-divider,
.cart-popup-title .is-divider,
#cart-popup .is-divider {
    background-color: var(--theme-border) !important;
    height: 1px;
    margin-top: 10px;
    margin-bottom: 15px;
    opacity: 1 !important;
}

.ux-free-shipping_bar {
    background-color: var(--theme-border-light) !important;
}

.ux-free-shipping_bar-progress {
    background-color: var(--theme-text) !important;
}

.product-checklist,
.product-checklist li,
.product-checklist .woocommerce-Price-amount {
    color: var(--theme-text) !important;
}

.product-checklist svg {
    fill: initial !important;
    stroke: initial !important;
    color: initial !important;
}

.payment-icon svg {
    display: none !important;
}

button.mfp-close {
    color: var(--theme-text) !important;
}

.mfp-bg {
    background-color: var(--theme-bg-overlay) !important;
}

.ux-mini-cart-cross-sells__list-item {
    display: grid !important;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 12px;
    padding: 15px;
    margin-bottom: 12px;
    background-color: var(--theme-bg-box) !important;
    border-radius: 10px;
    border: 1px solid var(--theme-border) !important;
    color: var(--theme-text);
}

.ux-mini-cart-cross-sells__list-item img {
    max-width: 60px;
    height: auto;
    border-radius: 6px;
    flex-shrink: 0;
}

.ux-mini-cart-cross-sells__list-item .product-title {
    font-size: 14px;
    font-weight: 500;
    line-height: 1.4;
    margin: 0;
}

.ux-mini-cart-cross-sells__list-item .price-wrapper,
.ux-mini-cart-cross-sells__list-item .woocommerce-Price-amount,
.ux-mini-cart-cross-sells__list-item>a:nth-of-type(2) {
    color: var(--theme-text) !important;
}

.ux-mini-cart-cross-sells__list-item .price-wrapper {
    font-weight: 600;
    font-size: 14px;
    margin-top: 2px;
}

.ux-mini-cart-cross-sells__list-item>a:nth-of-type(2) {
    display: flex;
    flex-direction: column;
    gap: 2px;
    text-decoration: none !important;
}

/* 🟩 Tilføj-knap */

.ux-mini-cart-cross-sells__list-item .button {
    background-color: var(--theme-success) !important;

    color: var(--theme-text) !important;

    border: none !important;

    padding: 6px 12px;

    border-radius: 4px;

    font-weight: 600;

    font-size: 13px;

    white-space: nowrap;
}

/* Mini-cart: quantity input */

.widget_shopping_cart input.qty {
    background-color: var(--theme-bg-input) !important;
}

/* Mini-cart: plus/minus knapper */

.widget_shopping_cart .ux-quantity__button {
    background-color: var(--theme-bg-box) !important;
}

/* ========================================
   🛒 CHECKOUT & ORDRE
   ======================================== */

body.woocommerce-checkout,
.woocommerce form.checkout,
.woocommerce-checkout #customer_details,
.woocommerce-checkout #order_review,
.woocommerce-checkout-review-order-table,
.woocommerce-checkout-payment,
.woocommerce-checkout .shop_table,
.woocommerce-checkout .form-row,
.woocommerce-checkout .input-text,
.woocommerce-checkout .select2-dropdown,
.woocommerce-checkout .select2-results__option,
.woocommerce-checkout .woocommerce-checkout-review-order-table thead,
.woocommerce-checkout .woocommerce-checkout-review-order-table tbody,
.woocommerce-checkout .woocommerce-checkout-review-order-table tfoot {
    color: var(--theme-text) !important;
}

/* 📦 Checkout container */

.page-checkout-simple,
.page-checkout-simple .container,
.woocommerce-checkout #customer_details .col-1,
.woocommerce-checkout #customer_details .col-2 {
    color: var(--theme-text) !important;
}

/* 📝 Formularfelter */

.woocommerce-checkout .input-text,
.woocommerce-checkout textarea,
.woocommerce-checkout select {
    background-color: var(--theme-bg-box) !important;

    color: var(--theme-text) !important;

    border: 1px solid var(--theme-border) !important;
}

/* 🧾 Label og placeholder */

.woocommerce-checkout .form-row label,
.woocommerce-checkout .form-row label span,
.woocommerce-checkout .form-row input::placeholder,
.woocommerce-checkout .form-row textarea::placeholder {
    color: var(--theme-text-light) !important;
}

/* 🖤 Border og divider */

.woocommerce-checkout .shop_table th,
.woocommerce-checkout .shop_table td,
.woocommerce-checkout .shop_table tfoot th,
.woocommerce-checkout .shop_table tfoot td {
    border-color: var(--theme-border-light) !important;
}

/* 🧮 Ordreoversigt tekst */

.woocommerce-checkout-review-order-table .product-name,
.woocommerce-checkout-review-order-table .product-total,
.woocommerce-checkout-review-order-table tfoot td,
.woocommerce-checkout-review-order-table tfoot th {
    color: var(--theme-text) !important;
}

/* 🚚 Forsendelsesvalg */

.woocommerce-checkout .shipping_list_label,
.woocommerce-checkout .shipping-description,
.woocommerce-checkout .woocommerce-Price-amount {
    color: var(--theme-text) !important;
}


/* ✅ Checkbox og betingelser */

.woocommerce-checkout .woocommerce-terms-and-conditions,
.woocommerce-checkout .woocommerce-privacy-policy-text,
.woocommerce-checkout label[for="terms"] {
    color: var(--theme-text) !important;
}

/* 🧾 "Gem mit kort" tekst */

#wc-reepay_checkout-new-payment-method+label {
    color: var(--theme-text) !important;
}

/* 💸 Skjul betalingsikoner */

#payment .payment-method img,
.product-payment-icons,
.payment-icon,
.payment-icons {
    display: none !important;
}

/* ⭐ Trustpilot – valgfrit skjul */

.trustpilot-icon {
    display: none !important;
}

/* ========================================
   🎨 CHECKOUT - CUSTOM STYLING
   ======================================== */

/* Gør valgt land (dropdown tekst) hvid */

.select2-selection__rendered {
    color: var(--theme-text) !important;
}

/* Gør "Send til anden adresse?" teksten hvid */

#ship-to-different-address span,
#ship-to-different-address label span {
    color: var(--theme-text) !important;
}

/* Gør al tekst i checkboxes, spans og labels hvid */

.woocommerce-checkout label,
.woocommerce-checkout .form-row span,
.woocommerce-checkout .payment_box p,
.woocommerce-checkout .woocommerce-terms-and-conditions span {
    color: var(--theme-text) !important;
}

/* Gør dropdown-pilen hvid i landvælger */

.select2-selection__arrow b {
    border-color: var(--theme-text) transparent transparent transparent !important;
}

/* Breadcrumbs */

.breadcrumbs a.current {
    color: var(--theme-text-light) !important;
}

.breadcrumbs a:hover,
.breadcrumbs a:focus {
    color: var(--theme-text) !important;

    text-decoration: underline;
}

.breadcrumbs a.no-click:hover {
    color: var(--theme-text) !important;

    cursor: default;
}

/* Kuponlink */

.woocommerce-info a.showcoupon {
    color: var(--theme-link) !important;
}

.woocommerce-info a.showcoupon:hover {
    color: var(--theme-text) !important;
}

/* Gør selve shipping item-boksen mørkere og elegant */

.shipping__list_item {
    background-color: var(--theme-bg-input);

    border: 1px solid var(--theme-border);

    border-radius: 6px;

    padding: 1.2rem;

    margin-bottom: 1rem;

    transition: border-color 0.2s ease;
}

/* Fjern baggrund fra label, så den arver fra li */

.shipping__list_item label {
    background: transparent !important;

    display: block;

    width: 100%;
}

/* Gør aktivt (valgt) item tydeligt med grøn outline */

.shipping__list_item input[type="radio"]:checked+label {
    border: none !important;
    /* Fjern evt. resterende border */
}

/* Sæt grøn outline på det overordnede li-element ved selection */

.shipping__list_item input[type="radio"]:checked:focus-visible {
    outline: none;
    /* Fjern native fokus-outline */
}

.shipping__list_item input[type="radio"]:checked+label::before {
    outline: none;
}

.shipping__list_item input[type="radio"]:checked+label::after {
    outline: none;
}

.shipping__list_item input[type="radio"]:checked+label {
    outline: none;
}

/* NYT: Tilføj en grøn kant på hele boksen ved valgt metode */

.shipping__list_item:has(input[type="radio"]:checked) {
    border-color: var(--fs-color-primary);
    /* Grøn farve */
}

/* ========================================
   📦 PRODUKTSIDE
   ======================================== */

.product-info.summary.col-fit.col.entry-summary.product-summary {
    background-color: var(--theme-bg-box) !important;
    /* Ensartet bokse-baggrund */

    color: var(--theme-text) !important;

    padding: 2.5rem;

    border-radius: 12px;

    border: 1px solid var(--theme-border) !important;
    /* Konsistent borderfarve */
}

/* Produktnavn */

.product-info .product-title {
    color: var(--theme-text) !important;
}

/* Pris */

.product-info .price-wrapper,
.product-info .woocommerce-Price-amount {
    color: var(--theme-text) !important;
}

/* Modelnummer og lagerstatus */

.product-info .product-model-box,
.product-info .product-stock-box {
    color: var(--theme-text-muted) !important;
}

/* Mængde input og knapper */

.product-info .ux-quantity {
    background-color: var(--theme-bg-quantity) !important;
}

.product-info .ux-quantity input.qty,
.product-info .ux-quantity button {
    background-color: var(--theme-bg-quantity) !important;

    color: var(--theme-text) !important;
}

/* Add to cart-knap */

.product-info .single_add_to_cart_button.button {
    background-color: var(--theme-success) !important;
    color: var(--theme-primary-text) !important;
    position: relative;
    /* Gør plads til strandbussen */
}

.product-info .single_add_to_cart_button.button:hover {
    background-color: var(--theme-success-hover) !important;
}

/* Calm Coastal strandbus på knappen (Peek-a-boo animation) */
.product-info .single_add_to_cart_button.button::after {
    content: "";
    position: absolute;
    width: 230px;
    height: 150px;
    bottom: -28px;
    left: 82%;
    transform: translateX(-50%) translateY(20px) scale(0.8);
    /* Gemt bagved og lidt mindre */
    background-image: url('assets/summer/summer-button-bus.png');
    background-size: contain;
    background-repeat: no-repeat;
    z-index: -1;
    /* Ligger BAG knappen */
    opacity: 0;
    transition: transform 0.15s ease-out, opacity 0.15s ease-out;
    /* Hurtigere animation */
    pointer-events: none;
}

.product-info .single_add_to_cart_button.button:hover::after {
    transform: translateX(-50%) translateY(-58px) scale(1);
    /* Popper op og vokser til fuld størrelse */
    opacity: 1;
}

/* Sørg for at formen ikke klipper strandbussen af og holder z-index samlet */
.product-info form.cart {
    overflow: visible !important;
    isolation: isolate;
    /* Holder z-index internt, så strandbussen er synlig */
}

/* Kort beskrivelse */

.product-info .woocommerce-product-short-description {
    color: var(--theme-text-light) !important;
}

/* Links */

.product-info a {
    color: var(--theme-link-alt) !important;
}

/* Modelnummer tekst og værdi */

.product-model-box,
.product-model-box-text {
    color: var(--theme-text) !important;
}

/* Lagerstatus */

.product-stock-box,
.product-stock-box-text,
.product-stock-box-dot {
    color: var(--theme-text) !important;

    fill: var(--theme-text) !important;
}

/* === DARK MODE: Breadcrumb === */

.woocommerce-breadcrumb,
.woocommerce-breadcrumb a,
.woocommerce-breadcrumb .divider {
    color: var(--theme-text) !important;
}

/* === DARK MODE: Tabs-container (overskrifter og paneler) === */

.woocommerce-tabs.wc-tabs-wrapper {
    background-color: var(--theme-bg-box) !important;

    color: var(--theme-text) !important;
}

/* Faneoverskrifter */

.woocommerce-tabs .tabs li a {
    color: var(--theme-text-muted) !important;
}

/* Aktiv fane */

.woocommerce-tabs .tabs li.active a {
    color: var(--theme-text) !important;

    border-bottom: 2px solid var(--theme-success) !important;
}

/* Panel-indhold */

.woocommerce-tabs .tab-panels,
.woocommerce-tabs .tab-panels * {
    background-color: var(--theme-bg-box) !important;

    color: var(--theme-text) !important;
}

/* Sektion borders (f.eks. tabeller og hr) */

.woocommerce-tabs table,
.woocommerce-tabs hr {
    border-color: var(--theme-border) !important;
}

/* === DARK MODE: Sticky Add to Cart === */

.sticky-add-to-cart,
.sticky-add-to-cart--active {
    background-color: var(--theme-bg-sticky) !important;

    color: var(--theme-text) !important;

    border-top: 1px solid var(--theme-border-sticky) !important;

    box-shadow: 0 -2px 6px var(--theme-shadow);

    padding: 1rem;
}

/* Produktnavn */

.sticky-add-to-cart .product-title-small {
    color: var(--theme-text) !important;
}

/* Mængdevælger */

.sticky-add-to-cart .ux-quantity {
    background-color: var(--theme-bg-box) !important;
}

.sticky-add-to-cart .ux-quantity input.qty,
.sticky-add-to-cart .ux-quantity button {
    background-color: var(--theme-bg-box) !important;

    color: var(--theme-text) !important;
}

/* Add to cart-knap */

.sticky-add-to-cart .single_add_to_cart_button.button {
    background-color: var(--theme-success) !important;

    color: var(--theme-text) !important;
}

.sticky-add-to-cart .single_add_to_cart_button.button:hover {
    background-color: var(--theme-success-hover) !important;
}

/* Evt. links eller ikoner */

.sticky-add-to-cart a,
.sticky-add-to-cart svg {
    color: var(--theme-link-alt) !important;

    fill: var(--theme-link-alt) !important;
}

/* ========================================
   👤 MY ACCOUNT
   ======================================== */
.my-account-header.page-title {
    background-color: var(--theme-bg-main) !important;
    padding: 2em 0;
    border-top: none !important;
    border-bottom: none !important;
    box-shadow: none !important;
}

.my-account-header.page-title h1,
.my-account-header.page-title small {
    color: var(--theme-text) !important;
}

/* ========================================
   📱 MOBIL MENU
   ======================================== */
.nav-icon .icon-menu::before {
    color: var(--theme-text) !important;
}

.mfp-content .mobile-sidebar,
.mfp-content .mobile-sidebar ul,
.mfp-content .mobile-sidebar .nav-sidebar {
    background-color: var(--theme-bg-mobile) !important;
    color: var(--theme-text) !important;
}

.mobile-sidebar a,
.mobile-sidebar .menu-item a,
.mobile-sidebar .menu-item {
    color: var(--theme-text) !important;
}

.header-search-form input[type="search"] {
    background-color: var(--theme-bg-mobile-input) !important;
    color: var(--theme-text) !important;
    border: 1px solid var(--theme-border-light) !important;
}

.header-search-form input[type="search"]::placeholder {
    color: var(--theme-text-muted) !important;
}

.mobile-sidebar .menu-item .icon-angle-down::before {
    color: var(--theme-text) !important;
}

.js-dgwt-wcas-overlay-mobile.dgwt-wcas-overlay-mobile {
    background-color: var(--theme-bg-mobile) !important;
}

/* ========================================
   🔘 BUTTONS & KNAPPER
   ======================================== */
/* Add to cart buttons */
.add-to-cart-button a.add_to_cart_button,
a.add_to_cart_button,
button.single_add_to_cart_button.button.alt {
    background-color: var(--theme-primary) !important;
    border-color: var(--theme-primary) !important;
    color: var(--theme-primary-text) !important;
}

.add-to-cart-button a.add_to_cart_button:hover,
a.add_to_cart_button:hover,
button.single_add_to_cart_button.button.alt:hover {
    background-color: var(--theme-primary-hover) !important;
    border-color: var(--theme-primary-hover) !important;
    color: var(--theme-primary-text) !important;
}

.product-small .add-to-cart-button .add_to_cart_button {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    height: 54px !important;
    width: 100% !important;
    border-radius: 4px !important;
    font-size: 0.8em !important;
    margin-top: 1em !important;
}

/* Button ikoner */
a.primary.is-small.mb-0.button.product_type_simple.add_to_cart_button.ajax_add_to_cart.is-flat::before,
button.single_add_to_cart_button.button.alt::before {
    background-image: url("data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' fill='%23fff' class='size-6' viewBox='0 0 24 24'><path d='M2.25 2.25a.75.75 0 0 0 0 1.5h1.386c.17 0 .318.114.362.278l2.558 9.592a3.75 3.75 0 0 0-2.806 3.63c0 .414.336.75.75.75h15.75a.75.75 0 0 0 0-1.5H5.378A2.25 2.25 0 0 1 7.5 15h11.218a.75.75 0 0 0 .674-.421 60 60 0 0 0 2.96-7.228.75.75 0 0 0-.525-.965A60.9 60.9 0 0 0 5.68 4.509l-.232-.867A1.875 1.875 0 0 0 3.636 2.25zm1.5 18a1.5 1.5 0 1 1 3 0 1.5 1.5 0 0 1-3 0m12.75 0a1.5 1.5 0 1 1 3 0 1.5 1.5 0 0 1-3 0'/></svg>") !important;
    width: 24px !important;
    height: 24px !important;
    background-size: contain !important;
    display: inline-block !important;
    vertical-align: middle !important;
    margin-right: 0.25em !important;
    content: "" !important;
}

a.primary.is-small.mb-0.button.product_type_simple.add_to_cart_button.ajax_add_to_cart.is-flat {
    color: var(--theme-primary-text) !important;
}

/* Primary buttons */
a.button.primary,
button.button.primary,
input.button.primary {
    background-color: var(--theme-primary) !important;
    border-color: var(--theme-primary) !important;
    color: var(--theme-primary-text) !important;
}

a.button.primary:hover,
button.button.primary:hover,
input.button.primary:hover {
    background-color: var(--theme-primary-hover) !important;
    border-color: var(--theme-primary-hover) !important;
    color: var(--theme-primary-text) !important;
}

.button .icon,
.button i {
    color: var(--theme-primary-text) !important;
    fill: var(--theme-primary-text) !important;
}

/* 💛 Global linkfarve – med udelukkelser */
a:not(.button):not(.primary):not(.alt):not(.add_to_cart_button):not(.woocommerce-loop-product__link):not(.product_type_simple):not(.site-header a):not(header a):not(footer a):not(.product-title):not(.woocommerce-cart-item-name):not(.menu-item a):not(.header-nav a):not(.cart-item-name a) {
    color: var(--theme-primary) !important;
    text-decoration: none;
}

a:not(.button):not(.primary):not(.alt):not(.add_to_cart_button):not(.woocommerce-loop-product__link):not(.product_type_simple):not(.site-header a):not(header a):not(footer a):not(.product-title):not(.woocommerce-cart-item-name):not(.menu-item a):not(.header-nav a):not(.cart-item-name a):hover {
    color: var(--theme-primary-hover) !important;
}

/* 🎨 Korrekt farve i cart-popup til dark mode */
#cart-popup {
    color: var(--theme-text) !important;
}

#cart-popup a {
    color: var(--theme-text) !important;
}

#cart-popup a:hover {
    color: var(--theme-primary) !important;
}

/* Mini cart coupon */
#cart-popup .minicart-coupon,
#cart-popup .minicart-coupon-form {
    background: transparent !important;
}

#cart-popup #minicart-coupon-form {
    display: flex;
    gap: 8px;
}

#cart-popup #minicart-coupon-form input[name="coupon_code"] {
    background-color: var(--theme-bg-box) !important;
    border: 1px solid var(--theme-border) !important;
    color: var(--theme-text) !important;
}

#cart-popup #minicart-coupon-form button[name="apply_coupon"],
#cart-popup .minicart-coupon-form button[type="submit"] {
    background-color: var(--theme-primary) !important;
    border-color: var(--theme-primary) !important;
    color: var(--theme-primary-text) !important;
}

#cart-popup #minicart-coupon-form button[name="apply_coupon"]:hover,
#cart-popup .minicart-coupon-form button[type="submit"]:hover {
    background-color: var(--theme-primary-hover) !important;
    border-color: var(--theme-primary-hover) !important;
    color: var(--theme-primary-text) !important;
}

/*Tilføj knapper i mini cart */

li.ux-mini-cart-cross-sells__list-item a.button.product_type_simple.add_to_cart_button.ajax_add_to_cart {
    background-color: var(--theme-primary) !important;
}

/* This targets the button's text with maximum specificity */
#cart-popup li.ux-mini-cart-cross-sells__list-item a.button.product_type_simple.add_to_cart_button.ajax_add_to_cart,
#cart-popup li.ux-mini-cart-cross-sells__list-item a.button.product_type_simple.add_to_cart_button.ajax_add_to_cart * {
    color: var(--theme-primary-text) !important;
    /* Force text to black */
}

/* This targets the SVG icon with maximum specificity */
#cart-popup li.ux-mini-cart-cross-sells__list-item a.button.product_type_simple.add_to_cart_button.ajax_add_to_cart svg,
#cart-popup li.ux-mini-cart-cross-sells__list-item a.button.product_type_simple.add_to_cart_button.ajax_add_to_cart svg * {
    fill: var(--theme-primary-text) !important;
    /* Force icon to black */
}

/* Variable product cross-sells - override #cart-popup a to make text white */
#cart-popup li.ux-mini-cart-cross-sells__list-item a.button.product_type_variable.add_to_cart_button,
#cart-popup li.ux-mini-cart-cross-sells__list-item a.button.product_type_variable.add_to_cart_button * {
    background-color: var(--theme-primary) !important;
    color: var(--theme-primary-text) !important;
    /* Force text to white for variable products */
}

/* Variable product SVG icon */
#cart-popup li.ux-mini-cart-cross-sells__list-item a.button.product_type_variable.add_to_cart_button svg,
#cart-popup li.ux-mini-cart-cross-sells__list-item a.button.product_type_variable.add_to_cart_button svg * {
    fill: var(--theme-primary-text) !important;
    /* Force icon to white for variable products */
    background: transparent !important;
    /* Remove any background from SVG elements */
}

/* Variable product button hover */
#cart-popup li.ux-mini-cart-cross-sells__list-item a.button.product_type_variable.add_to_cart_button:hover {
    background-color: var(--theme-primary-hover) !important;
}

/*Progress bar mini cart */
span.ux-free-shipping__bar-progress {
    background-color: var(--theme-primary) !important;
}

/* Override for the checkout button's background color */
/* No change needed for background, as it was working */
p.woocommerce-mini-cart__buttons.buttons a.button.checkout.wc-forward {
    background-color: var(--theme-primary) !important;
}

/* Ensure text is black for the checkout button and its children */
/* This now includes #cart-popup for maximum specificity */
#cart-popup p.woocommerce-mini-cart__buttons.buttons a.button.checkout.wc-forward,
#cart-popup p.woocommerce-mini-cart__buttons.buttons a.button.checkout.wc-forward * {
    color: var(--theme-primary-text) !important;
}

/* Style for the first list item's SVG icon */
ol.product-checklist li:first-child svg,
ol.product-checklist li:first-child svg * {
    stroke: var(--theme-primary) !important;
    fill: transparent !important;
}

/* Override for the checkout button's background color */
button#place_order {
    background-color: var(--theme-primary) !important;
}

/* Ensure text is black for the checkout button and its children */
button#place_order,
button#place_order * {
    /* This targets the button and any potential children if they exist */
    color: var(--theme-primary-text) !important;
}

/* Style for the last list item's SVG icon */
ol.product-checklist li:last-child svg,
ol.product-checklist li:last-child svg * {
    stroke: var(--theme-primary) !important;
    fill: transparent !important;
}

/* Style for the middle list item's SVG icon */
ol.product-checklist li:nth-child(2) svg,
/* Assuming the second child is the middle one as per your description */
ol.product-checklist li:nth-child(2) svg * {
    fill: var(--theme-primary) !important;
    stroke: transparent !important;
}

/* First, set a neutral/default border for all shipping list items */
ul#shipping_method li.shipping__list_item {
    border-color: #ccc !important;
    /* Example: a light gray border for unchecked items */
    /* If you know the original border color of unchecked items, use that here instead of #ccc */
}

/* Then, apply the yellow border ONLY to the selected (checked) shipping list item */
ul#shipping_method li.shipping__list_item:has(input[type="radio"]:checked) {
    border-color: var(--theme-primary) !important;
    /* Yellow border for the checked item */
}

button#place_order.button.alt {
    background-color: var(--theme-primary) !important;
    color: var(--theme-primary-text) !important;
}

/* 📍 Breadcrumb styling */
nav.breadcrumbs.flex-row.flex-row-center.heading-font.checkout-breadcrumbs.text-center.strong.h2.uppercase {
    color: var(--theme-text) !important;
}

/* Aktuel breadcrumb = gul */
nav.breadcrumbs.flex-row.flex-row-center.heading-font.checkout-breadcrumbs.text-center.strong.h2.uppercase a.current {
    color: var(--theme-primary) !important;
}

/* Øvrige links (ikke current) */
nav.breadcrumbs.flex-row.flex-row-center.heading-font.checkout-breadcrumbs.text-center.strong.h2.uppercase a:not(.current) {
    color: var(--theme-text) !important;
}

/* Pile-ikoner (fx .icon-angle-right) */
nav.breadcrumbs.flex-row.flex-row-center.heading-font.checkout-breadcrumbs.text-center.strong.h2.uppercase i,
nav.breadcrumbs.flex-row.flex-row-center.heading-font.checkout-breadcrumbs.text-center.strong.h2.uppercase i::before {
    color: var(--theme-text) !important;
    fill: var(--theme-text) !important;
}

i.icon-shopping-cart::after {
    color: var(--theme-primary-text) !important;
    background-color: var(--theme-primary) !important;
}

/* Header hover & active states */
.header a:hover,
.header-nav li a:hover,
.header-nav-main li a:hover,
.nav>li>a:hover,
.header-nav li.current-menu-item>a,
.header-nav-main li.current-menu-item>a {
    color: var(--theme-primary) !important;
}

.header-nav li a::before,
.header-nav li a::after,
.header-nav-main li a::before,
.header-nav-main li a::after {
    background-color: var(--theme-primary) !important;
}

.header .cart-icon strong,
.header .cart-price {
    color: var(--theme-primary) !important;
}

/* ========================================
   💳 BETALINGER
   ======================================== */
.woocommerce-checkout-payment,
.woocommerce-checkout #payment,
.woocommerce-checkout .payment_box,
.woocommerce-checkout .wc_payment_methods,
.woocommerce-checkout .payment_box fieldset {
    background-color: var(--theme-bg-input) !important;
    color: var(--theme-text) !important;
    border: none !important;
}

.wc_payment_methods li {
    background-color: var(--theme-bg-box) !important;
    color: var(--theme-text) !important;
    border: 1px solid var(--theme-border-light) !important;
    border-radius: 6px !important;
    margin-bottom: 10px !important;
    padding: 10px 14px !important;
    transition: border-color 0.2s ease;
}

.wc_payment_methods li:has(input[type="radio"]:checked) {
    border-color: var(--theme-primary) !important;
}

.wc_payment_methods li:hover {
    border-color: var(--theme-primary-hover) !important;
}

.wc_payment_methods label {
    color: var(--theme-text) !important;
    background: transparent !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
}

.wc_payment_methods a {
    color: var(--theme-primary) !important;
    font-weight: 500 !important;
}

.wc_payment_methods a:hover {
    color: var(--theme-primary-hover) !important;
}

.woocommerce-checkout .payment_box input,
.woocommerce-checkout .payment_box select,
.woocommerce-checkout .payment_box textarea {
    background-color: var(--theme-bg-box) !important;
    border: 1px solid var(--theme-border) !important;
    color: var(--theme-text) !important;
}

.woocommerce-checkout .payment_box input::placeholder {
    color: var(--theme-text-muted) !important;
}

.payment_box img,
.wc_payment_method img {
    filter: none !important;
    opacity: 1 !important;
}

/* PayPal card field iframes - style the container */
iframe[id^="zoid-paypal-card"],
iframe[name*="ppcp"],
div[id*="ppcp-credit-card"] iframe {
    background-color: transparent !important;
    border: 1px solid var(--theme-border) !important;
    border-radius: 6px !important;
    padding: 2px !important;
}

/* PayPal card fields wrapper */
.wc-credit-card-form-card-number,
.wc-credit-card-form-card-expiry,
.wc-credit-card-form-card-cvc {
    margin-bottom: 12px !important;
}

button#place_order,
button#place_order.alt {
    background-color: var(--theme-primary) !important;
    color: var(--theme-primary-text) !important;
    font-weight: 600 !important;
    border: none !important;
    border-radius: 6px !important;
}

button#place_order:hover {
    background-color: var(--theme-primary-hover) !important;
    color: var(--theme-primary-text) !important;
}

/* 🌑 Klarna og kortfeltets Shadow DOM host */
#osm_shadow_host {
    background-color: var(--theme-bg-box) !important;
    border: 1px solid var(--theme-border) !important;
    border-radius: 8px !important;
    color: var(--theme-text) !important;
    display: block !important;
    padding: 1rem !important;
}

/* Hvis Klarna selv sætter et lys tema via data-theme="light", tving mørk tilstand */
#osm_shadow_host[data-theme="light"],
#osm_container[data-theme="light"] {
    background-color: var(--theme-bg-box) !important;
    color: var(--theme-text) !important;
}

/* 🌑 Shadow root host (beskyttet container) */
#osm_shadow_host::part(container),
#osm_shadow_host::part(root),
#osm_container {
    background-color: var(--theme-bg-box) !important;
    color: var(--theme-text) !important;
}

/* 🌑 Dark card på almindelige sider – men IKKE hvis siden har Fluent Form */
body.page:not(.home):not(.woocommerce-checkout):not(.woocommerce-cart):not(:has(.fluentform)) #content .row>.col>.col-inner {
    background: #202327 !important;
    /* lidt lysere end body */
    border-radius: 18px !important;
    border: 1px solid #3b3f45 !important;
    /* samme vibe som produktkort */
    padding: 32px !important;
    box-shadow: 0 18px 45px rgba(0, 0, 0, .55) !important;
}

.payment_box input,
.payment_box select,
.payment_box textarea {
    background-color: var(--theme-bg-input) !important;
    border: 1px solid var(--theme-border) !important;
    color: var(--theme-text) !important;
}

/* Placeholder */
.payment_box input::placeholder {
    color: var(--theme-text-muted) !important;
}

/* 💳 Klarna / kort shadow host container */
#osm_shadow_host,
#osm_container {
    background: none !important;
    /* Fjern baggrund */
    border: none !important;
    /* Fjern kant */
    color: var(--theme-text) !important;
}

/* Tving mørkt tema, hvis Klarna sætter light */
#osm_shadow_host[data-theme="light"],
#osm_container[data-theme="light"] {
    background: none !important;
    border: none !important;
    padding: 0 !important;
    color: var(--theme-text) !important;
}

/* 💳 Betalingsboks generelt */
.payment_box {
    background: none !important;
    /* Fjern baggrund */
    border: none !important;
    /* Fjern kant */
    color: var(--theme-text) !important;
}

/* Fjern dobbelt padding i containerne */
.wc_payment_methods li {
    padding: 0.75rem 1rem !important;
}

/* 💳 Fjern baggrund helt for PayPal og kortbetaling */
.woocommerce-checkout .wc_payment_methods .payment_box.payment_method_ppcp-gateway,
.woocommerce-checkout .wc_payment_methods .payment_box.payment_method_ppcp-credit-card-gateway {
    background: none !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
}

/* 🧾 Fjern baggrund på alle betalingsbokse */
.woocommerce-checkout-payment,
.woocommerce-checkout #payment,
.woocommerce-checkout .payment_box,
.woocommerce-checkout .wc_payment_methods,
.woocommerce-checkout .payment_box fieldset {
    background: none !important;
    border: none !important;
    box-shadow: none !important;
}

/* ========================================
   🚚 FORSENDELSESMETODER
   ======================================== */
.shipping__list_item {
    background-color: var(--theme-bg-box) !important;
    color: var(--theme-text) !important;
    border: 1px solid var(--theme-border-light) !important;
    border-radius: 6px !important;
    padding: 0.5rem !important;
    transition: border-color 0.25s ease !important;
    display: flex !important;
    align-items: center !important;
    gap: 1px !important;
}

/* Sørg for at radioknappen ikke er absolut positioneret */
.shipping__list_item .shipping_method {
    position: static !important;
    top: auto !important;
    left: auto !important;
}

/* Shipmondo dropdown */
.shipmondo-dropdown_wrapper,
.service_points_dropdown,
.service_points_list,
.service_point {
    background-color: var(--theme-bg-input) !important;
    color: var(--theme-text) !important;
    border: 1px solid var(--theme-border-light) !important;
    border-radius: 6px !important;
}

.service_point.selected {
    border-color: var(--theme-primary) !important;
    background-color: var(--theme-bg-box) !important;
}

.service_point:hover {
    background-color: var(--theme-bg-box) !important;
    border-color: var(--theme-primary) !important;
    cursor: pointer;
}

.service_points_list::-webkit-scrollbar {
    width: 8px;
}

.service_points_list::-webkit-scrollbar-track {
    background: var(--theme-bg-mobile);
}

.service_points_list::-webkit-scrollbar-thumb {
    background-color: var(--theme-border);
    border-radius: 4px;
}

.service_points_list::-webkit-scrollbar-thumb:hover {
    background-color: var(--theme-border-light);
}

/* 🏷️ Fjerne “powered by Shipmondo” og andet unødvendigt */
.powered_by_shipmondo,
.hidden_chosen_shop {
    display: none !important;
}

/* Tekst inde i dropdowns (afstand og linjehøjde) */
.service_point {
    padding: 10px 12px !important;
    line-height: 1.4 !important;
}

/* 📍 Shipmondo dropdown: address + distance tekst */
.service_point .address_info,
.service_point .distance {
    color: var(--theme-text) !important;
    opacity: 0.9 !important;
    /* let nedtonet for balance */
    font-size: 0.85em !important;
}

/* 📦 Hvis du vil have city/navn tydeligere */
.service_point .header {
    color: var(--theme-text) !important;
    font-weight: 600 !important;
}

/* Fjern den grå baggrund på checkout body */
body.woocommerce-checkout,
.woocommerce form.checkout,
.woocommerce-checkout #order_review,
.woocommerce-checkout .shop_table {
    background: none !important;
    background-color: transparent !important;
}

/* 🧾 Gør inputfelter dark mode */
.woocommerce-checkout input[type="text"],
.woocommerce-checkout input[type="email"],
.woocommerce-checkout input[type="tel"],
.woocommerce-checkout input[type="number"],
.woocommerce-checkout input[type="password"],
.woocommerce-checkout textarea,
.woocommerce-checkout select {
    background-color: var(--theme-bg-input) !important;
    color: var(--theme-text) !important;
    border: 1px solid var(--theme-border-light) !important;
    border-radius: 6px !important;
    padding: 10px 12px !important;
    font-size: 15px !important;
}

/* Placeholder tekst */
.woocommerce-checkout input::placeholder,
.woocommerce-checkout textarea::placeholder {
    color: var(--theme-text-muted) !important;
    opacity: 1 !important;
}

/* Fokus-effekt */
.woocommerce-checkout input:focus,
.woocommerce-checkout textarea:focus,
.woocommerce-checkout select:focus {
    border-color: var(--theme-focus) !important;
    outline: none !important;
}


/* Gør overskriften (f.eks. "Skicka som Brev") ekstra fed */
#order_review #shipping_method.shipping__list .shipping__list_label {
    font-weight: 700 !important;
}

/* Gør beskrivelsen og prisen lettere (mere balanceret look) */
.woocommerce-checkout .shipping__description,
.woocommerce-checkout .woocommerce-Price-amount {
    font-weight: 300 !important;
}

.category-slide .product-category .box-image:hover {
    border-color: var(--theme-primary) !important;
    /* Gul highlightfarve */
}

body.single-product .product-info form.cart .single_add_to_cart_button.button.alt {
    background-color: var(--theme-primary) !important;
    border-color: var(--theme-primary) !important;
    color: var(--theme-primary-text) !important;
}

body.single-product .product-footer .woocommerce-tabs .nav>li.active a:before {
    background-color: var(--theme-primary) !important;
}

/* 💛 Aktiv faneblad – gul underline/border */
.woocommerce-tabs .tabs li.active a {
    border-bottom: 2px solid var(--theme-primary) !important;
    color: var(--theme-text) !important;
}

/* 🩶 Inaktive faner – gennemsigtige kanter */
.woocommerce-tabs .tabs li:not(.active) a {
    border-bottom: 2px solid transparent !important;
    color: var(--theme-text-light) !important;
    /* valgfri – lidt nedtonet tekst */
}

/* 💛 Review form border */
.review-form-inner.has-border {
    border: 2px solid var(--theme-primary) !important;
}

/* 🌙 Dark mode for produktvariationer (dropdowns som “Storlek”) */
.variations select,
.variations select#pa_size,
.variations select[name^="attribute_"] {
    background-color: var(--theme-bg-input) !important;
    /* mørk baggrund */
    color: var(--theme-text) !important;
    /* hvid tekst */
    border: 1px solid var(--theme-border-light) !important;
    border-radius: 6px !important;
    padding: 10px 12px !important;
    font-size: 15px !important;
    transition: border-color 0.2s ease;
}

/* 🌟 Hover + fokus-effekt */
.variations select:hover,
.variations select:focus {
    border-color: var(--theme-primary) !important;
    box-shadow: 0 0 0 2px var(--theme-shadow-light) !important;
    outline: none !important;
}

/* 🌙 Option-menu (dropdown-listen når åbnet) */
.variations select option {
    background-color: var(--theme-bg-box) !important;
    color: var(--theme-text) !important;
}

/* Placeholder “Välj storlek” */
.variations select option[value=""] {
    color: var(--theme-text-muted) !important;
}

/* “Rensa alternativ”-link */
a.reset_variations {
    color: var(--theme-primary) !important;
    font-size: 0.9em !important;
}

a.reset_variations:hover {
    color: var(--theme-primary-hover) !important;
}

/* 🏷️ Label for produktvariationer (fx “Storlek”) */
.variations label,
.variations th.label label {
    color: var(--theme-text) !important;
    font-weight: 500 !important;
    font-size: 15px !important;
}

/* 🌙 Gør "Frakt" + cells hvide i shipping-tabellen */
.woocommerce-checkout .woocommerce-shipping-totals.shipping td,
.woocommerce-checkout .woocommerce-shipping-totals.shipping th,
.woocommerce-checkout .shipping_inner td,
.woocommerce-checkout .shipping_inner th,
.shipping__table--multiple td,
.shipping__table--multiple th {
    color: var(--theme-text) !important;
    border-color: var(--theme-border-light) !important;
    background: transparent !important;
}

ul#shipping_method label.shipping__list_label {
    color: var(--theme-text) !important;
}

/* 💛 Fortsæt til kassen-knap */
a.checkout-button.button.alt.wc-forward {
    background-color: var(--theme-primary) !important;
    /* gul baggrund */
    color: var(--theme-primary-text) !important;
    /* sort tekst */
    border: none !important;
    border-radius: 6px !important;
    font-weight: 600 !important;
    text-transform: none !important;
    /* behold normal tekst */
    transition: background-color 0.2s ease, color 0.2s ease !important;
}

/* Hover state */
a.checkout-button.button.alt.wc-forward:hover {
    background-color: var(--theme-primary-hover) !important;
    /* mørkere gul ved hover */
    color: var(--theme-primary-text) !important;
}

/* 🌙 Dark Mode – Fluent Form (alle med .ffs_custom_wrap) */
.fluentform.ff-default.ffs_custom_wrap {
    color: var(--theme-text) !important;
    padding: 2rem !important;
}

/* 🧾 Inputfelter */
.fluentform.ff-default.ffs_custom_wrap input,
.fluentform.ff-default.ffs_custom_wrap select,
.fluentform.ff-default.ffs_custom_wrap textarea {
    background-color: var(--theme-bg-box) !important;
    color: var(--theme-text) !important;
    border: 1px solid var(--theme-border) !important;
    border-radius: 6px !important;
    padding: 10px 12px !important;
}

.fluentform.ff-default.ffs_custom_wrap input::placeholder,
.fluentform.ff-default.ffs_custom_wrap textarea::placeholder {
    color: var(--theme-text-muted) !important;
}

/* 🔘 Knapper */
.fluentform.ff-default.ffs_custom_wrap button,
.fluentform.ff-default.ffs_custom_wrap .ff-btn-submit {
    background-color: var(--theme-primary) !important;
    color: var(--theme-primary-text) !important;
    font-weight: 600 !important;
    border: none !important;
    border-radius: 6px !important;
    transition: background-color 0.2s ease !important;
}

.fluentform.ff-default.ffs_custom_wrap button:hover,
.fluentform.ff-default.ffs_custom_wrap .ff-btn-submit:hover {
    background-color: var(--theme-primary-hover) !important;
    color: var(--theme-primary-text) !important;
}

/* 🧩 Labels og tekst */
.fluentform.ff-default.ffs_custom_wrap label,
.fluentform.ff-default.ffs_custom_wrap .ff-el-input--label label {
    color: var(--theme-text) !important;
    font-weight: 500 !important;
}

/* 🟢 Checkboxes og radioknapper */
.fluentform.ff-default.ffs_custom_wrap input[type="checkbox"],
.fluentform.ff-default.ffs_custom_wrap input[type="radio"] {
    accent-color: var(--theme-primary) !important;
}

/* 🌙 Dark Mode – Kontoformular (Rediger konto) */
form.woocommerce-EditAccountForm.edit-account {
    color: var(--theme-text) !important;
    padding: 2rem !important;
}

/* 🧾 Inputfelter */
form.woocommerce-EditAccountForm.edit-account input[type="text"],
form.woocommerce-EditAccountForm.edit-account input[type="email"],
form.woocommerce-EditAccountForm.edit-account input[type="password"],
form.woocommerce-EditAccountForm.edit-account input[type="tel"],
form.woocommerce-EditAccountForm.edit-account input[type="number"],
form.woocommerce-EditAccountForm.edit-account textarea,
form.woocommerce-EditAccountForm.edit-account select {
    background-color: var(--theme-bg-box) !important;
    color: var(--theme-text) !important;
    border: 1px solid var(--theme-border) !important;
    border-radius: 6px !important;
    padding: 10px 12px !important;
    font-size: 15px !important;
}

form.woocommerce-EditAccountForm.edit-account input::placeholder,
form.woocommerce-EditAccountForm.edit-account textarea::placeholder {
    color: var(--theme-text-muted) !important;
}

/* 🟡 Fokus-effekt */
form.woocommerce-EditAccountForm.edit-account input:focus,
form.woocommerce-EditAccountForm.edit-account textarea:focus,
form.woocommerce-EditAccountForm.edit-account select:focus {
    border-color: var(--theme-focus) !important;
    outline: none !important;
}

/* 🧩 Labels */
form.woocommerce-EditAccountForm.edit-account label {
    color: var(--theme-text) !important;
    font-weight: 500 !important;
}

/* 💛 Knapper */
form.woocommerce-EditAccountForm.edit-account button,
form.woocommerce-EditAccountForm.edit-account input[type="submit"] {
    background-color: var(--theme-primary) !important;
    color: var(--theme-primary-text) !important;
    font-weight: 600 !important;
    border: none !important;
    border-radius: 6px !important;
    padding: 12px 20px !important;
    transition: background-color 0.2s ease, color 0.2s ease !important;
}

form.woocommerce-EditAccountForm.edit-account button:hover,
form.woocommerce-EditAccountForm.edit-account input[type="submit"]:hover {
    background-color: var(--theme-primary-hover) !important;
    color: var(--theme-primary-text) !important;
}

/* 🔘 Checkbox & radioknapper */
form.woocommerce-EditAccountForm.edit-account input[type="checkbox"],
form.woocommerce-EditAccountForm.edit-account input[type="radio"] {
    accent-color: var(--theme-primary) !important;
}

/* ✉️ Notifikationer (success/error) */
form.woocommerce-EditAccountForm.edit-account .woocommerce-message,
form.woocommerce-EditAccountForm.edit-account .woocommerce-error,
form.woocommerce-EditAccountForm.edit-account .woocommerce-info {
    background-color: var(--theme-bg-box) !important;
    color: var(--theme-text) !important;
    border-left: 4px solid var(--theme-primary) !important;
}

/* 💛 Knap – Lägg till betalningsmetod (My Account) */
.woocommerce a.button,
.woocommerce-page a.button {
    background-color: var(--theme-primary) !important;
    color: var(--theme-primary-text) !important;
    border: none !important;
    border-radius: 6px !important;
    font-weight: 600 !important;
    padding: 12px 20px !important;
    text-transform: none !important;
    transition: background-color 0.2s ease, color 0.2s ease !important;
}

/* Hover state */
.woocommerce a.button:hover,
.woocommerce-page a.button:hover {
    background-color: var(--theme-primary-hover) !important;
    color: var(--theme-primary-text) !important;
}

/* 💛 "Redigera" links i Mit Konto */
.woocommerce-Address a.edit {
    color: var(--theme-primary) !important;
    font-weight: 500 !important;
    text-decoration: none !important;
    transition: color 0.2s ease !important;
}

/* Hover-effekt – lidt mørkere gul */
.woocommerce-Address a.edit:hover {
    color: var(--theme-primary-hover) !important;
}

/* 💛 Gør navigation underline gul */
.nav-line-bottom>li>a:before,
.nav-line-grow>li>a:before,
.nav-line>li>a:before {
    background-color: var(--theme-primary) !important;
}

.accordion-title.active {
    border-color: var(--theme-primary) !important;
}

/* Rule for text color */
a.primary.is-small.mb-0.button.product_type_variable.add_to_cart_button.is-flat {
    color: var(--theme-primary-text) !important;
}

/* Rule for icon color (::before pseudo-element) */
a.primary.is-small.mb-0.button.product_type_variable.add_to_cart_button.is-flat::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 24 24'%3E%3Cpath fill-rule='evenodd' d='M10.5 3.75a6.75 6.75 0 1 0 0 13.5 6.75 6.75 0 0 0 0-13.5M2.25 10.5a8.25 8.25 0 1 1 14.59 5.28l4.69 4.69a.75.75 0 1 1-1.06 1.06l-4.69-4.69A8.25 8.25 0 0 1 2.25 10.5z'/%3E%3C/svg%3E") !important;
}

/* --- WooCommerce address edit form dark mode (aligned with Edit Account styling) --- */
.woocommerce form .form-row label {
    color: var(--theme-text) !important;
}

/* Felter og dropdowns */
.woocommerce form .input-text,
.woocommerce form select,
.select2-container .select2-selection {
    background-color: var(--theme-bg-box) !important;
    /* samme mørke grå som Edit Account */
    color: var(--theme-text) !important;
    border: 1px solid var(--theme-border) !important;
    /* samme kantfarve som Edit Account */
    border-radius: 6px !important;
    transition: all 0.2s ease;
}

/* Placeholder tekst */
.woocommerce form .input-text::placeholder {
    color: var(--theme-text-muted) !important;
    opacity: 1;
}

/* Fokus-styling */
.woocommerce form .input-text:focus,
.woocommerce form select:focus,
.select2-container--default .select2-selection:focus {
    border-color: var(--theme-focus) !important;
    outline: none !important;
}

/* Select2 styling */
.select2-container--default .select2-selection--single {
    background-color: var(--theme-bg-box) !important;
    border: 1px solid var(--theme-border) !important;
    color: var(--theme-text) !important;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    color: var(--theme-text) !important;
}

.select2-dropdown {
    background-color: var(--theme-bg-box) !important;
    border: 1px solid var(--theme-border) !important;
}

.select2-results__option {
    color: var(--theme-text) !important;
}

.select2-results__option--highlighted {
    background-color: var(--theme-bg-box) !important;
}

/* Required asterisk */
.woocommerce form .required {
    color: var(--theme-primary) !important;
}

/* --- WooCommerce save address button (clean version) --- */
.woocommerce form .button[name="save_address"] {
    background-color: var(--theme-primary) !important;
    /* Japebo-gul */
    color: var(--theme-primary-text) !important;
    /* Sort tekst */
    font-weight: 600;
    border: none !important;
    border-radius: 6px;
    padding: 10px 22px;
    transition: background-color 0.2s ease;
}

/* Hover: en anelse mørkere gul */
.woocommerce form .button[name="save_address"]:hover {
    background-color: var(--theme-primary-hover) !important;
    color: var(--theme-primary-text) !important;
}


/* === CHRISTMAS THEME – DARK MODE FOR LEGAL OVERVIEW =================== */

/* 1) Baggrund omkring kortene (board-baggrund) – styres separat */

/* 2) Selve kortene */
.legal-grid .legal-card {
    position: relative;
    background: var(--theme-bg-box) !important;
    border: 1px solid var(--theme-border) !important;
    border-radius: 12px !important;
    padding: 18px 18px 76px 18px;
    min-height: 260px;
    display: flex;
    flex-direction: column;
    height: 100%;
    color: var(--theme-text) !important;
    box-shadow: 0 8px 20px var(--theme-shadow) !important;
    transition:
        border-color .2s ease,
        box-shadow .2s ease,
        transform .2s ease;
}

/* Hover på kortet */
.legal-grid .legal-card:hover,
.legal-grid .legal-card:focus-within {
    border-color: var(--theme-primary) !important;
    box-shadow: 0 14px 32px var(--theme-shadow) !important;
    transform: translateY(-2px);
}

/* 3) Ikonboks */
.legal-grid .legal-card-icon {
    width: 48px;
    height: 48px;
    border-radius: 10px;
    background: var(--theme-border-light) !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 26px;
    margin-bottom: 10px;
    color: var(--theme-primary) !important;
    box-shadow: 0 3px 8px var(--theme-shadow);
}

/* 4) Tekst */
.legal-grid .legal-card h3 {
    margin: 0 0 6px 0;
    font-size: 1.05em;
    color: var(--theme-text) !important;
}

.legal-grid .legal-card p {
    margin: 0;
    color: var(--theme-text-light) !important;
    font-size: .92em;
}

/* 5) CTA badges */
.legal-grid .cta-group {
    position: absolute;
    left: 16px;
    bottom: 16px;
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.legal-grid .cta-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 10px;
    background: transparent !important;
    border: 1px solid var(--theme-primary) !important;
    color: var(--theme-primary) !important;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.9em;
    text-decoration: none !important;
    box-shadow: none !important;
    transition:
        background .18s ease,
        color .18s ease,
        box-shadow .18s ease,
        transform .06s ease;
}

/* Hover-state til knappen */
.legal-grid .cta-badge:hover {
    background: var(--theme-primary) !important;
    border-color: var(--theme-primary) !important;
    box-shadow: 0 3px 9px var(--theme-shadow) !important;
    transform: translateY(-1px);
}

/* Sørg for at ALT indhold i knappen bliver sort på hover */
.legal-grid .cta-badge:hover,
.legal-grid .cta-badge:hover * {
    color: var(--theme-primary-text) !important;
}

.legal-grid .cta-icon {
    font-size: 1em;
    color: inherit !important;
}

/* 6) Mobile tweaks */
@media (max-width:520px) {
    .legal-grid {
        padding: 18px !important;
    }

    .legal-grid .legal-card {
        padding: 14px;
        min-height: 220px;
    }

    .legal-grid .cta-group {
        position: static;
        margin-top: 6px;
        width: 100%;
        flex-direction: column;
        gap: 4px;
    }

    .legal-grid .cta-badge {
        width: 100%;
        justify-content: center;
        padding: 8px 10px;
        font-size: 0.88em;
    }
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce) {

    .legal-grid .legal-card,
    .legal-grid .cta-badge {
        transition: none;
    }
}

/* 🌑 Full-width dark baggrund på sider med .legal-grid  */
body:has(.legal-grid),
#wrapper:has(.legal-grid) {
    background: var(--theme-bg-secondary) !important;
}

/* Få selve content-området til at fylde 100% bredde */
body:has(.legal-grid) #content {
    max-width: 100% !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 60px 0 80px !important;
    /* luft over/under grid */
    background: transparent !important;
}

/* Fjern den hvide “kort”-container rundt om overview’et */
body:has(.legal-grid) #content .row,
body:has(.legal-grid) #content .row>.col,
body:has(.legal-grid) #content .row>.col>.col-inner {
    background: transparent !important;
    box-shadow: none !important;
    border-radius: 0 !important;
}

/* Lidt ekstra luft til grid’et selv */
body:has(.legal-grid) .legal-grid {
    margin-top: 30px !important;
}

/* 🌑 Dark card på almindelige sider – men IKKE hvis siden har Fluent Form */
body.page:not(.home):not(.woocommerce-checkout):not(.woocommerce-cart):not(:has(.fluentform)) #content .row>.col>.col-inner {
    background: var(--theme-bg-main) !important;
    /* lidt lysere end body */
    border-radius: 18px !important;
    border: 1px solid var(--theme-border) !important;
    /* samme vibe som produktkort */
    padding: 32px !important;
    box-shadow: 0 18px 45px var(--theme-shadow) !important;
}

/* === DARK MODE – LOGIN POPUP ================================== */

/* Ydre container i lightboxen */
#login-form-popup .account-container.lightbox-inner {
    background: var(--theme-bg-main);
    border-radius: 20px;
    border: 1px solid var(--theme-border);
    box-shadow: 0 18px 40px var(--theme-shadow);
    padding: 28px 24px;
    color: var(--theme-text);
}

/* Fjern evt. hvide baggrunde inde i de to kolonner */
#login-form-popup .col2-set .col-1,
#login-form-popup .col2-set .col-2,
#login-form-popup .col2-set .col-1 .col-inner,
#login-form-popup .col2-set .col-2 .col-inner {
    background: transparent !important;
    box-shadow: none !important;
    border-radius: 0 !important;
}

/* Overskrifter (Log ind / Registrer) */
#login-form-popup .account-login-inner h3,
#login-form-popup .account-register-inner h3 {
    color: var(--theme-text);
}

/* Brødtekst + privacy-tekst */
#login-form-popup p,
#login-form-popup .woocommerce-privacy-policy-text {
    color: var(--theme-text-light);
}

/* Formularfelter */
#login-form-popup .woocommerce form .input-text,
#login-form-popup .woocommerce form input[type="text"],
#login-form-popup .woocommerce form input[type="email"],
#login-form-popup .woocommerce form input[type="password"] {
    background-color: var(--theme-bg-box);
    color: var(--theme-text);
    border: 1px solid var(--theme-border);
    border-radius: 6px;
    padding: 10px 12px;
}

/* Placeholder-tekst */
#login-form-popup .woocommerce form .input-text::placeholder,
#login-form-popup .woocommerce form input::placeholder {
    color: var(--theme-text-muted);
}

/* Labels */
#login-form-popup .woocommerce form label {
    color: var(--theme-text);
    font-weight: 500;
}

/* Checkboxes (fx “Husk mig”) */
#login-form-popup .woocommerce form input[type="checkbox"],
#login-form-popup .woocommerce form input[type="radio"] {
    accent-color: var(--theme-primary);
}

/* Knapper (Log ind / Registrer) */
#login-form-popup .woocommerce form button.button,
#login-form-popup .woocommerce form button[type="submit"],
#login-form-popup .woocommerce form .woocommerce-Button {
    background-color: var(--theme-primary);
    color: var(--theme-primary-text);
    border: none;
    border-radius: 999px;
    padding: 10px 22px;
    font-weight: 600;
    transition: background-color .2s ease, transform .06s ease,
        box-shadow .18s ease;
}

#login-form-popup .woocommerce form button.button:hover,
#login-form-popup .woocommerce form button[type="submit"]:hover,
#login-form-popup .woocommerce form .woocommerce-Button:hover {
    background-color: var(--theme-primary-hover);
    color: var(--theme-primary-text);
    transform: translateY(-1px);
    box-shadow: 0 6px 16px var(--theme-shadow);
}

/* Links (glemt password osv.) */
#login-form-popup a {
    color: var(--theme-primary);
}

#login-form-popup a:hover {
    color: var(--theme-primary-hover);
}

/* 🌙 Dark mode for hele login-popup'en */

/* Yderste popup-boks */
#login-form-popup.lightbox-content {
    background: var(--theme-bg-main) !important;
    border-radius: 24px !important;
    overflow: hidden !important;
    /* klipper evt. hvide hjørner væk */
    padding: 0 !important;
    /* så indholdet styrer padding */
}

/* Indre “account container” – samme radius som ydre */
#login-form-popup .account-container.lightbox-inner {
    background: var(--theme-bg-main) !important;
    border-radius: 24px !important;
}

/* Hvis temaet giver en hvid baggrund på .mfp-content, så neutralisér den */
.mfp-content {
    background: transparent !important;
    box-shadow: none !important;
}

#content.content-area {
    position: relative;
    background-color: var(--theme-bg-main) !important;
    background-image: none !important;
    /* Soft Coastal Sand */
    color: var(--theme-text) !important;
    overflow: hidden;
}

/* Real sand texture layer, same logic as previous seasonal image backgrounds */
#content.content-area::before {
    content: "";
    position: absolute;
    inset: 0;
    /* Fylder hele containeren */
    pointer-events: none;
    /* Klik gennem baggrunden */
    z-index: 0;

    background-image: url("assets/summer/summer-sand-bg.png");
    background-repeat: repeat;
    background-size: var(--theme-sand-size);
    background-position: 0 0;
    mix-blend-mode: multiply;
    opacity: 0.82;
}

/* Ensure all content appears above background */
#content.content-area>* {
    position: relative;
    z-index: 1;
}

/* Fix category button background color */
.category-page-row .product-category>.col-inner {
    background-color: var(--theme-bg-secondary) !important;
}

/* Ensure text is white on category buttons */
.category-page-row .product-category .box-text,
.category-page-row .product-category .box-text *,
.category-page-row .product-category h5,
.category-page-row .product-category .header-title {
    color: #ffffff !important;
}

/* Remove any dark overlays on category boxes */
.category-page-row .product-category .box-image::before,
.category-page-row .product-category .box-image::after {
    background-color: transparent !important;
    opacity: 0 !important;
}

/* Fix My Account dashboard links hover - lighter background */
.woocommerce-MyAccount-navigation ul li a:hover,
.dashboard-links a:hover {
    background-color: #f0f0f0 !important;
    color: var(--theme-text) !important;
}

/* Improve border contrast on My Account dashboard links */
.dashboard-links a {
    border-color: #cccccc !important;
}

/* Search button - primary action */
.header .dgwt-wcas-search-submit {
    background-color: var(--theme-primary) !important;
    border-radius: 0 8px 8px 0 !important;
}

.header .dgwt-wcas-search-submit:hover {
    background-color: var(--theme-primary-hover) !important;
}


/* Sørg for at pseudo-elementet positioneres i forhold til footeren */
.footer-wrapper {
    position: relative;
    z-index: 1;
    /* så indholdet stadig ligger over baggrundsfarver under */
}

/* Calm Coastal footer ledge */
.footer-wrapper::before {
    content: "";
    position: absolute;
    top: -18px;
    left: 0;
    width: 100%;
    height: 42px;
    background-image: url('assets/summer/summer-footer-wave-transition.svg');
    background-repeat: repeat-x;
    background-size: 1200px 42px;
    background-position: bottom center;
    pointer-events: none;
    z-index: 2;
}

/* topbaren */
.header-top {
    padding-top: 58px;
}

/* Default (mobil og små skærme) — ingen ekstra padding */
.header-wrapper.stuck #masthead.header-main {
    padding-top: 68px;
}

/* Kun på skærme over 800px i bredde */
@media (max-width: 801px) {
    .header-wrapper.stuck #masthead.header-main {
        padding-top: 0px;
    }
}

/* Fast Calm Coastal sommerguirlande i toppen */
body::before {
    content: '';
    position: fixed;
    top: -8px;
    left: 0;
    width: 100%;
    height: 78px;

    /* VIGTIGT: ingen baggrundsfarve her! */
    background-color: transparent;

    background-image: url('assets/summer/summer-top-garland.png');
    background-repeat: repeat-x;
    background-size: 430px auto;
    background-position: center -2px;

    pointer-events: none;
    z-index: 9999;
}

/* På mobil: skjul kun guirlanden og dens ekstra luft når headeren bliver sticky. */
@media (max-width: 849px) {
    body:has(.header-wrapper.stuck)::before {
        display: none !important;
    }

    body:has(.header-wrapper.stuck) .header-top {
        padding-top: 0 !important;
    }

    body:has(.header-wrapper.stuck) .header-wrapper.stuck #masthead.header-main {
        padding-top: 0 !important;
    }
}

/* ========================================
   🌊 SLIDER NAVIGATION ARROWS - HOVER EFFECT
   ======================================== */

/* Flickity slider arrows - primary color on hover */
.flickity-prev-next-button:hover,
.flickity-prev-next-button:hover .arrow {
    fill: var(--theme-primary) !important;
}

.flickity-prev-next-button:hover svg {
    fill: var(--theme-primary) !important;
}

/* ========================================
   🏷️ QUANTITY DISCOUNTS
   ======================================== */

/* Ensure table borders match theme */
.plugify_main_parent_div {
    border: 2px solid var(--theme-success) !important;
    border-radius: 6px;
    overflow: hidden;
}

/* ========================================
   🌊 CUSTOM MY ACCOUNT PLUGIN OVERRIDES
   ======================================== */
body.woocommerce-account {
    --wc-acct-primary: var(--theme-primary);
    --wc-acct-primary-hover: var(--theme-primary-hover);
    --wc-acct-bg: var(--theme-bg-main);
    --wc-acct-card-bg: var(--theme-bg-box);
    --wc-acct-text-main: var(--theme-text);
    --wc-acct-text-muted: var(--theme-text-light);
    --wc-acct-border: var(--theme-border-light);
}

body.woocommerce-account .my-account-header small,
body.woocommerce-account .required,
body.woocommerce-account .woocommerce-MyAccount-navigation ul li:not(.is-active) a:hover,
body.woocommerce-account .dashboard-links li a,
body.woocommerce-account .woocommerce-Address-title a.edit,
body.woocommerce-account .woocommerce-orders-table__cell-order-number a,
body.woocommerce-account .woocommerce-orders-table__cell-order-status {
    color: var(--theme-primary) !important;
}

body.woocommerce-account .my-account-header small:hover,
body.woocommerce-account .woocommerce-Address-title a.edit:hover {
    color: var(--theme-primary-hover) !important;
}

body.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a,
body.woocommerce-account .woocommerce-MyAccount-content .button,
body.woocommerce-account .woocommerce-Button,
body.woocommerce-account .woocommerce-MyAccount-content .shop_table .button,
body.woocommerce-account .woocommerce-MyAccount-content button.button,
body.woocommerce-account .woocommerce-MyAccount-content input[type="submit"] {
    background: var(--theme-primary) !important;
    color: var(--theme-primary-text) !important;
}

body.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a {
    box-shadow: 0 4px 12px rgba(60, 175, 200, 0.22) !important;
}

body.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a,
body.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a *,
body.woocommerce-account .dashboard-links li.is-active a,
body.woocommerce-account .dashboard-links li.is-active a * {
    color: var(--theme-primary-text) !important;
    text-decoration-color: var(--theme-primary-text) !important;
    -webkit-text-fill-color: var(--theme-primary-text) !important;
}

body.woocommerce-account .woocommerce-MyAccount-content .button:hover,
body.woocommerce-account .woocommerce-Button:hover,
body.woocommerce-account .woocommerce-MyAccount-content .shop_table .button:hover,
body.woocommerce-account .woocommerce-MyAccount-content button.button:hover,
body.woocommerce-account .woocommerce-MyAccount-content input[type="submit"]:hover {
    background: var(--theme-primary-hover) !important;
    color: var(--theme-primary-text) !important;
}

body.woocommerce-account .woocommerce-MyAccount-navigation ul li:not(.is-active) a:hover,
body.woocommerce-account .dashboard-links li a:hover,
body.woocommerce-account .show-password-input:hover,
body.woocommerce-account .show-password-input:focus {
    background: #E5F6F4 !important;
}

body.woocommerce-account .dashboard-links li a:hover,
body.woocommerce-account .woocommerce-Address:hover {
    border-color: var(--theme-primary) !important;
}

body.woocommerce-account .dashboard-links li a:hover {
    box-shadow: 0 4px 12px rgba(60, 175, 200, 0.12) !important;
}

body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Input:focus,
body.woocommerce-account .woocommerce-MyAccount-content .input-text:focus,
body.woocommerce-account .woocommerce-MyAccount-content input:focus,
body.woocommerce-account .woocommerce-MyAccount-content select:focus,
body.woocommerce-account .woocommerce-MyAccount-content textarea:focus,
body.woocommerce-account .woocommerce-form-login input:focus,
body.woocommerce-account .woocommerce-form-register input:focus,
body.woocommerce-account .select2-container--default.select2-container--open .select2-selection--single,
body.woocommerce-account .select2-container--default.select2-container--focus .select2-selection--single {
    border-color: var(--theme-primary) !important;
    box-shadow: 0 0 0 4px rgba(60, 175, 200, 0.14) !important;
}

body.woocommerce-account .select2-container--default .select2-results__option--highlighted[aria-selected] {
    background: var(--theme-primary) !important;
    color: var(--theme-primary-text) !important;
}

/* ========================================
   🌊 FINAL CHECKOUT + AUTH BUTTON OVERRIDES
   ======================================== */
.woocommerce-checkout form.checkout_coupon button[name="apply_coupon"],
.woocommerce-checkout form.checkout_coupon button[type="submit"],
.woocommerce-checkout form.checkout_coupon .button,
#login-form-popup .woocommerce-form-register__submit,
#login-form-popup button[name="register"],
.woocommerce-form-register button[name="register"],
.woocommerce-form-register .woocommerce-Button,
.account-register-inner button[name="register"] {
    background-color: var(--theme-primary) !important;
    border-color: var(--theme-primary) !important;
    color: var(--theme-primary-text) !important;
}

.woocommerce-checkout form.checkout_coupon button[name="apply_coupon"]:hover,
.woocommerce-checkout form.checkout_coupon button[type="submit"]:hover,
.woocommerce-checkout form.checkout_coupon .button:hover,
#login-form-popup .woocommerce-form-register__submit:hover,
#login-form-popup button[name="register"]:hover,
.woocommerce-form-register button[name="register"]:hover,
.woocommerce-form-register .woocommerce-Button:hover,
.account-register-inner button[name="register"]:hover {
    background-color: var(--theme-primary-hover) !important;
    border-color: var(--theme-primary-hover) !important;
    color: var(--theme-primary-text) !important;
}

body.woocommerce-checkout #order_review,
body.woocommerce-checkout .woocommerce-checkout-review-order,
body.woocommerce-checkout .woocommerce-checkout-review-order-table,
body.woocommerce-checkout #payment,
body.woocommerce-checkout .woocommerce-checkout-payment {
    background: var(--theme-bg-box) !important;
    color: var(--theme-text) !important;
}

body.woocommerce-checkout #order_review {
    border: 1px solid var(--theme-border) !important;
    border-radius: 8px !important;
    box-shadow: 0 4px 18px rgba(15, 95, 101, 0.08) !important;
    padding: 28px !important;
}

body.woocommerce-checkout .woocommerce-checkout-review-order-table {
    border-collapse: separate !important;
    border-spacing: 0 !important;
    border: 1px solid var(--theme-border-light) !important;
    border-radius: 8px !important;
    overflow: hidden !important;
}

body.woocommerce-checkout .woocommerce-checkout-review-order-table thead th,
body.woocommerce-checkout .woocommerce-checkout-review-order-table tbody td,
body.woocommerce-checkout .woocommerce-checkout-review-order-table tfoot th,
body.woocommerce-checkout .woocommerce-checkout-review-order-table tfoot td {
    background: var(--theme-bg-box) !important;
    border-color: var(--theme-border-light) !important;
    color: var(--theme-text) !important;
}

body.woocommerce-checkout .woocommerce-checkout-review-order-table thead th {
    background: #F4FBFB !important;
}

body.woocommerce-checkout .woocommerce-shipping-totals td,
body.woocommerce-checkout .woocommerce-shipping-totals th,
body.woocommerce-checkout ul#shipping_method li,
body.woocommerce-checkout .shipping__list_item {
    background: #FFFFFF !important;
}

body.woocommerce-checkout .shipping__list_item,
body.woocommerce-checkout ul#shipping_method li.shipping__list_item {
    border: 1px solid var(--theme-border) !important;
    border-radius: 8px !important;
}

body.woocommerce-checkout .shipping__list_item:has(input[type="radio"]:checked),
body.woocommerce-checkout ul#shipping_method li.shipping__list_item:has(input[type="radio"]:checked) {
    border-color: var(--theme-primary) !important;
    box-shadow: 0 0 0 1px var(--theme-primary) !important;
}

body.woocommerce-checkout #payment,
body.woocommerce-checkout .woocommerce-checkout-payment {
    border: 1px solid var(--theme-border) !important;
    border-radius: 8px !important;
    padding: 0 !important;
}

body.woocommerce-checkout #payment .wc_payment_methods,
body.woocommerce-checkout .wc_payment_methods {
    background: var(--theme-bg-box) !important;
    border: none !important;
    padding: 0 !important;
}

body.woocommerce-checkout .wc_payment_methods li {
    background: var(--theme-bg-box) !important;
    border: 1px solid var(--theme-border-light) !important;
    border-radius: 8px !important;
    padding: 14px 16px !important;
}

body.woocommerce-checkout .wc_payment_methods li:has(input[type="radio"]:checked) {
    border-color: var(--theme-primary) !important;
    box-shadow: 0 0 0 1px var(--theme-primary) !important;
}

body.woocommerce-checkout .payment_box {
    background: #FFFFFF !important;
    border: none !important;
    color: var(--theme-text) !important;
    padding: 12px 0 0 !important;
}

body.woocommerce-checkout .payment_box input,
body.woocommerce-checkout .payment_box select,
body.woocommerce-checkout .payment_box textarea,
body.woocommerce-checkout .woocommerce-checkout-payment input,
body.woocommerce-checkout .woocommerce-checkout-payment select {
    background: #FFFFFF !important;
    border: 1px solid var(--theme-border) !important;
    color: var(--theme-text) !important;
}

/* Keep checkout utilitarian; avoid decorative garland overlapping order title. */
body.woocommerce-checkout::before {
    display: none !important;
}

body.woocommerce-checkout #order_review {
    padding: 22px !important;
}

body.woocommerce-checkout .woocommerce-checkout-review-order-table th,
body.woocommerce-checkout .woocommerce-checkout-review-order-table td {
    padding: 12px 16px !important;
}

body.woocommerce-checkout .woocommerce-checkout-review-order-table tfoot tr.order-total th,
body.woocommerce-checkout .woocommerce-checkout-review-order-table tfoot tr.order-total td {
    background: #F4FBFB !important;
    border-top: 1px solid var(--theme-primary) !important;
    font-weight: 700 !important;
}

/* ========================================
   🏖️ GLOBAL SAND PAGE CANVAS
   ======================================== */
body.woocommerce-page,
body.woocommerce-page #wrapper,
body.woocommerce-page #main,
body.woocommerce-page #content,
body.woocommerce-page .page-wrapper,
body.woocommerce-page .site-content,
body.woocommerce-page .shop-container,
body.single-product,
body.single-product #wrapper,
body.single-product #main,
body.single-product #content,
body.single-product .page-wrapper,
body.single-product .product-main,
body.single-product .product-footer,
body.woocommerce-account,
body.woocommerce-account #wrapper,
body.woocommerce-account #main,
body.woocommerce-account #content,
body.woocommerce-account .page-wrapper,
body.woocommerce-checkout,
body.woocommerce-checkout #wrapper,
body.woocommerce-checkout #main,
body.woocommerce-checkout #content,
body.woocommerce-checkout .page-wrapper,
body.woocommerce-cart,
body.woocommerce-cart #wrapper,
body.woocommerce-cart #main,
body.woocommerce-cart #content,
body.woocommerce-cart .page-wrapper {
    position: relative;
    background-color: var(--theme-bg-main) !important;
    background-image: none !important;
}

body.woocommerce-page #content::before,
body.single-product .product-main::before,
body.single-product .product-footer::before,
body.woocommerce-account .page-wrapper::before,
body.woocommerce-checkout .page-wrapper::before,
body.woocommerce-cart .page-wrapper::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    background-image: url("assets/summer/summer-sand-bg.png");
    background-repeat: repeat;
    background-size: var(--theme-sand-size);
    background-position: 0 0;
    mix-blend-mode: multiply;
    opacity: 0.82;
}

body.woocommerce-page #content>*,
body.single-product .product-main>*,
body.single-product .product-footer>*,
body.woocommerce-account .page-wrapper>*,
body.woocommerce-checkout .page-wrapper>*,
body.woocommerce-cart .page-wrapper>* {
    position: relative;
    z-index: 1;
}

body.woocommerce-checkout form.checkout,
body.woocommerce-checkout #customer_details,
body.woocommerce-checkout .page-checkout-simple,
body.woocommerce-checkout .page-checkout-simple .container,
body.woocommerce-account .row.vertical-tabs,
body.woocommerce-cart .cart-container,
body.woocommerce-cart .cart-wrapper,
body.single-product .product-container {
    background: transparent !important;
}

/* ========================================
   ☀️ OPTIONAL SUMMER BUTTON ICON
   Add class "japebo-summer-button" to a Flatsome button.
   ======================================== */
.japebo-summer-button {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 0.55em;
}

.japebo-summer-button .ux-button-text,
.japebo-summer-button span {
    display: inline-flex;
    align-items: center;
}

.japebo-summer-button::after {
    content: "";
    display: inline-block;
    width: 1.3em;
    height: 1.3em;
    flex: 0 0 1.3em;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cg fill='%23FFC83D'%3E%3Ccircle cx='32' cy='32' r='13'/%3E%3Cpath d='M32 3l5 13H27zM32 61l-5-13h10zM61 32l-13 5V27zM3 32l13-5v10zM52.5 11.5l-5.6 12.7-7.1-7.1zM11.5 52.5l5.6-12.7 7.1 7.1zM52.5 52.5l-12.7-5.6 7.1-7.1zM11.5 11.5l12.7 5.6-7.1 7.1z'/%3E%3C/g%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

/* ========================================
   🔐 LOGOUT CONFIRMATION
   ======================================== */
body.is-logout-confirmation .message-container a:not(.cancel-logout-link),
body.is-logout-confirmation .message-container a:not(.cancel-logout-link):visited,
body.is-logout-confirmation .message-container a:not(.cancel-logout-link):hover,
body.is-logout-confirmation .message-container a:not(.cancel-logout-link):focus {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    text-decoration-color: #ffffff !important;
}