body:not(.logged-in) {
    .logged-in-view {
        display:none;
    }
}

body.logged-in {
    .logged-out-view, .button-log-in {
        display:none;
    }
}

.ts_header_image img{
    height: 60px;
    margin: 0 16px;
}

.add_to_cart_button, .product_type_variable {
    white-space: nowrap;
}

.style-column-list .button-log-in {
    margin-top: 32px !important;
    white-space: nowrap;
}

.elementor-widget-ts-products .product-group-button-meta {
    width: 100%;

}

.price .product-group-button-meta {
    z-index: 99 !important;
}

.price .product-group-button-meta .button-log-in{
    width: 100% !important;
    font-size: 100% !important;
    line-height: 18px !important;
    padding: 7px 10px !important;
}

ul.product_list_widget li .quantity, .woocommerce ul.product_list_widget li .quantity, .woocommerce .widget_shopping_cart .cart_list li .quantity, .woocommerce.widget_shopping_cart .cart_list li .quantity, .woocommerce .ts-tiny-cart-wrapper .dropdown-container ul.cart_list li .quantity, .ts-tiny-cart-wrapper .dropdown-container ul.cart_list li .quantity, .products .product:not(.product-category) .meta-wrapper-2 .quantity {
    margin-bottom: 5px;
}

.quantity .number-button {
    background: #f2f2f2;
}

.style-column-list .number-button.default {
    display: none;
}

.wco-qty-update-wrapper {
    width: 70px;
    display: flex;
    background: #f2f2f2;
    padding-top: 2px;
    padding-bottom: 2px;
}

.wco-qty-update-wrapper .quantity {
    margin: 0 auto !important;
}

.wco-qty-update-wrapper.loading {
    position: relative;
}

.wco-qty-update-wrapper.loading input {
    pointer-events: none;
    opacity: 0;
    transition: none;
}

.wco-qty-update-wrapper.loading:before {
    content: "";
    width: 14px;
    height: 14px;
    border-width: 1px;
    border-style: solid;
    border-color: rgba(0, 0, 0, 0.3);
    border-top: 1px solid #000000;
    border-radius: 50%;
    text-align: center;
    display: inline-block;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -9px;
    margin-left: -7px;
    opacity: 1;
    visibility: visible;
    -webkit-animation: spin 1s
    linear infinite;
    animation: spin 1s
    linear infinite;
    z-index: 99;
}

.woocommerce form.woocommerce-form-login, .woocommerce form.woocommerce-ResetPassword.lost_reset_password {
    max-width: 500px;
    background: #FFFFFF;
    padding: 0;
    box-shadow: none;

    label {
        line-height: 2;
    }

    input {
        font-size: 15px;
        line-height: 24px;
    }
}

.mhk-account-form-heading {
    margin-bottom: 16px;
}

/* Not applied to form-lost-password.php for logged-out visitors - it shares login's Elementor container, which already pads it. */
.woocommerce form.woocommerce-ResetPassword.lost_reset_password.mhk-reset-password-form {
    padding: 34px;
}

/* Logged-in users also get the lost password form (WooCommerce shows it regardless of login), but inside the unpadded logged-in-view container. */
.logged-in-view .woocommerce form.woocommerce-ResetPassword.lost_reset_password {
    padding: 34px;
}

.apply-form {
    label {
        line-height: 2;
    }

    input {
        font-size: 15px;
        line-height: 24px;
    }

    .required {
        color: var(--wc-red);
    }
}

.show-password-input {
    top: 50% !important;
}

.cart-wrapper {
    padding-right: 2px;
}

.theme-title {
    margin-left: 10px;
}

.woocommerce-Price-currencySymbol {
    margin-right: 45px;
}

.product-wrapper .woocommerce-Price-currencySymbol {
    margin-right: 5px;
}

.ts-tiny-cart-wrapper .cart_list li img {
    display: none;
}

.ts-tiny-cart-wrapper .cart_list li .thumbnail,
.ts-tiny-cart-wrapper .cart_list li .thumbnail a {
    display: none !important;
}

.woocommerce-mini-cart-item .cart-item-wrapper {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    white-space: nowrap;
}

.ts-tiny-cart-wrapper .cart_list li .cart-item-wrapper .price {
    width: auto !important;
    display: inline-block !important;
    margin-top: 5px;
}

.ts-tiny-cart-wrapper .cart_list li .cart-item-wrapper .quantity {
    display: inline-block !important;
}

.ts-tiny-cart-wrapper .cart_list li .cart-item-wrapper .subtotal {
    display: none;
}

.woocommerce-EditAccountForm > * {
    display: none;
}

.woocommerce-EditAccountForm fieldset {
    display: block;
}

.woocommerce-EditAccountForm button[type="submit"] {
    display: inline-block;
}

.woocommerce-account .woocommerce-Address .edit {
    display: none !important;
}

/* Hide Update cart button on cart page since we use AJAX updates */
.woocommerce-cart button[name="update_cart"],
.woocommerce-cart input[name="update_cart"],
.woocommerce-cart .button[name="update_cart"] {
    display: none !important;
}


@media screen and (max-width: 768px) {
    .product-per-page-form {
        position: absolute;
        right: 0;
        top: 20px;
        width: 100%;
    }

    .woocommerce-ordering {
        position: absolute;
        right: 0;
        top: -10px;
        text-align: right;
    }

    .orderby-current {
        text-align: left;
    }

    .ts_header_image {
        display: none;
    }
}

@media screen and (max-width: 426px) {
    .product-per-page-form {
        position: absolute;
        align-items: center;
        right: 0;
        top: 20px;
    }

     .woocommerce-ordering {
         position: absolute;
         align-items: center;
         right: 0;
         top: -10px;
         text-align: right;
         white-space: nowrap;
    }

    .orderby-current {
        text-align: left;
    }
}

@media screen and (max-width: 1700px){
    .loop-add-to-cart, .product-group-button-meta {
        width: 120px;
    }
}

@media screen and (max-width: 480px){
    .loop-add-to-cart {
        width: 100px;
    }
}

.elementor-icon-list-items.elementor-inline-items {
    display: flex;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
    gap: 24px;
}

.elementor-icon-list-item.elementor-inline-item {
    display: flex;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
}

@media (max-width: 800px) {
    .elementor-icon-list-items.elementor-inline-items {
        flex-direction: column;
        align-items: center;
    }

    .elementor-icon-list-item.elementor-inline-item {
        white-space: normal;
        justify-content: center;
    }
}

.woocommerce div.product.product-style-4 .product-images-summary:last-child {
    margin-bottom: 0;
}

section.related.products {
    padding-top: 30px !important;
}

.elementor-icon-list-items.elementor-inline-items {
    display: flex;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
    gap: 24px;
}

.elementor-icon-list-item.elementor-inline-item {
    display: flex;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
}

@media (max-width: 800px) {
    .elementor-icon-list-items.elementor-inline-items {
        flex-direction: column;
        align-items: flex-start;
        justify-content: flex-start;
    }

    .elementor-icon-list-item.elementor-inline-item {
        white-space: normal;
        justify-content: flex-start;
    }
}

/* Korten fyrkantiga */
.thumbnail-wrapper figure.no-back-image {
    aspect-ratio: 1 / 1;
    margin: 0;
    background-color: #fff;
}

.thumbnail-wrapper figure.no-back-image img {
    width: 100%;
    height: 100%;
    object-fit: contain !important;
}

.product-wrapper {
    display: flex !important;
    flex-direction: column !important;
}

.main-products .meta-wrapper-2 {
    margin-top: auto !important;
}

.main-products .meta-wrapper {
    flex: 1 !important;
}

/* Kort på startsida slider*/
.owl-item .meta-wrapper {
    flex: unset !important;
}

.owl-item .meta-wrapper-2 {
    margin-top: auto !important;
}

/* Hjärta */
.product-group-button {
    position: absolute !important;
    top: -5px !important;
    right: 15px !important;
    bottom: auto !important;
    left: auto !important;
    margin: 0 !important;
    z-index: 9 !important;
}

.style-column-list .product-group-button {
    top: 25px !important;
}

.button-in.wishlist a {
    display: flex !important;
    border-radius: 50% !important;
    width: 36px !important;
    height: 36px !important;
    justify-content: center !important;
    align-items: center !important;
}

.button-in.wishlist .ts-tooltip {
    display: none !important;
}

.product-group-button,
.button-in.wishlist {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

.thumbnail-wrapper,
.product-wrapper {
    overflow: visible !important;
    position: relative !important;
}

.product-group-button > div.wishlist a:not(.added)::after {
    content: "\e90a";
    color: #ffffff;
    opacity: 1;
}

.product-group-button > div.wishlist a:not(.added)::after {
    text-shadow: 0 0 1px #000000, 0 0 1px #000000;
}

/* Artikelnummer varukorg */
.woocommerce-cart .woocommerce-cart-form td.product-name strong {
    color: rgb(128 128 128);
}

.sku-number {
    color: #999;
    display: block;
    font-size: 12px;
    margin-bottom: 8px;
}

.count {
    display: none;
}

.product-group-button-meta {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: relative !important;
    transform: none !important;
    left: 0 !important;
    margin: 15px 0 0 0 !important;
}

/* Artnr startsidan*/
.owl-item .product-name {
    display: flex !important;
    flex-direction: column !important;
}

.owl-item .product-name a {
    order: 2 !important;
}

.owl-item .sku-number {
    order: 1 !important;
    display: block !important;
    font-size: 11px !important;
    color: #999 !important;
    margin-bottom: 2px !important;
}

.owl-item .product-name br {
    display: none !important;
}

/* Förhindra att föräldern klipper texten när den sticker ut */
.product-group-button-meta {
    overflow: visible !important;
    display: block !important;
}

/* Antal i lager på produktkorten */
p.stock-count {
    display: block !important;
    width: 100% !important;
    text-align: right !important;
    margin: 8px 0 0 0 !important;
    padding-right: 5px !important;
    font-size: 11px !important;
    color: #999 !important;
    line-height: 1.2 !important;
}


@media (max-width: 1700px) {
    .product-group-button-meta {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        flex-wrap: nowrap !important;
        min-height: 60px !important;
    }

    .loop-add-to-cart {
        flex-shrink: 0 !important;
    }

    .loop-add-to-cart, .product-group-button-meta {
        width: 120px;
    }

    body:not(.logged-in) .stock-count {
        margin-left: auto !important;
        margin-top: 0 !important;
        padding-left: 8px !important;
        white-space: nowrap !important;
        align-self: center !important;
    }
}

.elementor-widget-ts-products .price .product-group-button-meta .button-log-in {
    display: block !important;
    width: 120px !important;
    font-size: 100% !important;
    line-height: 18px !important;
    padding: 7px 10px !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: relative !important;
    transform: none !important;
    left: 0 !important;
    margin: 15px 0 0 0 !important;
}

/*hover*/
.product-hover-vertical-style-2 .products .product:not(.product-category) .product-wrapper:hover .product-group-button-meta {
    position: relative !important;
    transform: none !important;
    box-shadow: none !important;
    bottom: auto !important;
    left: auto !important;
    right: auto !important;
    padding: 0 !important;
    animation: none !important;
    -webkit-animation: none !important;
}

button[name="update_cart"] {
    display: none !important;
}

.product-name {
    padding-bottom: 10px !important;
}

.woocommerce-mini-cart-item .product-name a br {
    display: none;
}

.woocommerce-mini-cart-item .product-name a .sku-number {
    display: block;
    order: -1;
}

@media (max-width: 555px) {
.product-name {
    padding-bottom: 30px !important;
    }
}

span.price {
    margin-top: auto !important;
    display: block !important;
    padding-top: 15px;
}

.meta-wrapper {
    display: flex;
    flex-direction: column;
    min-height: 120px;
}

.price, .meta-wrapper-2, .product-group-button-meta {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    width: 100% !important;
}

a.button.button-log-in {
    width: 160px !important;
    margin: 0 auto;
    display: block !important;
    text-align: center;
}

a.button.button-log-in {
    margin-left: 0 !important;
    margin-right: auto !important;
    display: inline-block !important;
    min-width: 150px;
    max-width: 100%;
    text-align: center;
    box-sizing: border-box;
}

@media (max-width: 380px) {
    a.button.button-log-in {
        min-width: 130px;
        font-size: 13px !important;
    }
}

/* Stock status indicator — product cards */
.wco-price-stock-row {
    display: flex;
    align-self: stretch;
    align-items: baseline;
    justify-content: space-between;
    width: 100% !important;
}

.wco-price-stock-row .woocommerce-Price-amount {
    flex-shrink: 0;
}

.wco-stock-indicator {
    display: block;
    font-size: 12px;
    font-weight: normal;
    text-align: right;
}

.wco-stock-dot {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    margin-right: 4px;
    vertical-align: 0.5px;
}

.wco-stock-in {
    color: #2e7d32;
}
.wco-stock-in .wco-stock-dot {
    background-color: #2e7d32;
}

.wco-stock-out {
    color: #c62828;
}
.wco-stock-out .wco-stock-dot {
    background-color: #c62828;
}

.product-label .out-of-stock {
    display: none !important;
}

.summary.entry-summary .wco-stock-indicator {
    font-size: 15px;
}

.ts-tiny-cart-wrapper .cart-item-wrapper dl.variation {
    list-style: none outside;
    border: 0;
    padding: 0;
    margin: -16px 0 16px;
}
.ts-tiny-cart-wrapper .cart-item-wrapper dl.variation dt {
    float: left;
    clear: both;
    margin-right: 0.25em;
    display: inline-block;
    list-style: none outside;
}
.ts-tiny-cart-wrapper .cart-item-wrapper dl.variation dd {
    margin: 0;
}
.ts-tiny-cart-wrapper .cart-item-wrapper dl.variation p, .ts-tiny-cart-wrapper .cart-item-wrapper dl.variation:last-child {
    margin-bottom: 0;
}

.product-filter-by-varutyp-wrapper ul {
    margin-bottom: 0;
}

.product-filter-by-varutyp-wrapper ul li input[type="checkbox"] {
    display: none;
}

.product-filter-by-varutyp-wrapper ul li label {
    padding-bottom: 0;
    cursor: pointer;
    display: inline;
    position: relative;
    padding-left: 30px;
    transition: 200ms ease;

    &:before {
        content: '';
        width: 20px;
        height: 20px;
        border-width: 1px;
        border-style: solid;
        border-color: #dcdcdc;
        border-radius: 2px;
        position: absolute;
        top: -3px;
        left: 0;
    }

    &:after {
        font-family: "Font Awesome 5 Free";
        font-style: normal;
        font-weight: 900;
        text-transform: none;
        content: '\f00c';
        display: inline-block;
        position: absolute;
        top: 2px;
        left: 5px;
        transform: translate(0);
        font-size: 10px;
        line-height: 1;
        text-align: center;
        color: #fff;
        text-shadow: 0 0 1px rgba(0, 0, 0, 0.1);
        opacity: 0;
        visibility: hidden;
        transition: opacity 200ms, visibility 200ms;
    }

    &:hover:before {
        background: #00B412;
        border-color: #00B412 !important;
    }

    &:hover:after {
        opacity: 1;
        visibility: visible;
    }
}

.product-filter-by-varutyp-wrapper ul li.selected label {
    &:before {
        background: #00B412;
        border-color: #00B412 !important;
    }

    &:after {
        opacity: 1;
        visibility: visible;
    }
}

/* ==========================================================================
   Typesense-sök ([typesense_search], t.ex. sidan "search-comparison").
   Ren styling av pluginets markup (#ts-woo-search-root, .ts-*, .ais-*) -
   inget i wp-content/plugins/typesense-woocommerce-search rörs härifrån.
   #ts-woo-search-root används som prefix på varje regel eftersom pluginets
   egen css/instantsearch.css laddas i wp_footer, dvs efter child-style i
   <head> - utan id-specificiteten skulle pluginets regler vinna kapplöpningen.
   ========================================================================== */

#ts-woo-search-root {
    margin-top: 1.5rem;
    font-family: "Red Hat Display", sans-serif;
}

/* Sökfältet begränsas och centreras, men facetter/resultat under det
   (.ts-search-layout) ska fortsätta fylla hela bredden - se längre ner. */
#ts-woo-search-root .ts-search-box {
    max-width: 520px;
    margin: 0 auto;
}

/* Sökfält - matchar det rundade sökfältet i headern */
#ts-woo-search-root .ts-search-box .ais-SearchBox-input {
    height: 46px;
    border: none;
    border-radius: 60px;
    background-color: #f0f0f0;
    padding: 11px 44px 11px 44px;
    font-size: 14px;
    color: #000;
    box-shadow: none;
}

#ts-woo-search-root .ts-search-box .ais-SearchBox-input:focus {
    background-color: #ebebeb;
    outline: none;
}

#ts-woo-search-root .ts-search-box .ais-SearchBox-input::placeholder {
    color: #999;
}

#ts-woo-search-root .ts-search-box .ais-SearchBox-form {
    /* Satellite-temat sätter en fast formulärhöjd (35px) som inte följer med
       när inputen görs 46px hög - utan detta centreras ikonerna mot fel höjd. */
    height: 46px;
}

#ts-woo-search-root .ts-search-box .ais-SearchBox-form:before {
    left: 18px;
    top: 50%;
    width: 16px;
    height: 16px;
    margin-top: 0;
    transform: translateY(-50%);
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2300B412' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><circle cx='11' cy='11' r='8'></circle><line x1='21' y1='21' x2='16.65' y2='16.65'></line></svg>");
}

#ts-woo-search-root .ts-search-box .ais-SearchBox-reset {
    top: 50%;
    margin-top: 0;
    transform: translateY(-50%);
    fill: #999;
}

#ts-woo-search-root .ts-search-box .ais-SearchBox-reset:hover,
#ts-woo-search-root .ts-search-box .ais-SearchBox-reset:focus {
    background: #dcdcdc;
    fill: #333;
}

/* Layout: filter till vänster, resultat till höger (radbryts på mobil) */
@media (max-width: 768px) {
    #ts-woo-search-root .ts-search-layout {
        flex-direction: column;
    }

    #ts-woo-search-root .ts-search-facets {
        flex: 1 1 auto;
        width: 100%;
    }
}

/* Filter (Typesense-facetterna) */
#ts-woo-search-root .ts-search-facets {
    background: #fff;
    border: 1px solid #ececec;
    border-radius: 2px;
    padding: 20px;
}

#ts-woo-search-root .ts-search-facets .ais-RefinementList-item {
    padding: 8px 0;
}

/* Pluginets JS lägger etikett + "visa kategori"-pil som syskon i en <div>
   som instantsearch.js själv skapar runt varje facet-rad. Den divven måste
   vara flex, annars radbryts pil-länken under etiketten (label blir block
   eftersom .ts-facet-item är display:flex, dvs. tar hela bredden). */
#ts-woo-search-root .ts-search-facets .ais-RefinementList-item > div {
    display: flex;
    align-items: center;
    width: 100%;
    gap: 0.4rem;
}

/* Kryssrutor i samma stil som "Förvaring"-filtret (product-filter-by-varutyp-wrapper).
   Gäller både kategori-facetten (.ts-facet-item, egen mall med "visa
   kategori"-pil) och typ-facetten (product/page/post, som instantsearch.js
   renderar med sin standardmall - .ais-RefinementList-label). */
#ts-woo-search-root .ts-facet-item,
#ts-woo-search-root .ais-RefinementList-label {
    position: relative;
    padding-left: 30px;
    font-size: 13px;
    color: #000;
    cursor: pointer;
}

#ts-woo-search-root .ts-facet-item .ais-RefinementList-checkbox,
#ts-woo-search-root .ais-RefinementList-label .ais-RefinementList-checkbox {
    display: none;
}

#ts-woo-search-root .ts-facet-item:before,
#ts-woo-search-root .ais-RefinementList-label:before {
    content: '';
    width: 20px;
    height: 20px;
    border: 1px solid #dcdcdc;
    border-radius: 2px;
    position: absolute;
    top: -3px;
    left: 0;
    transition: 200ms ease;
}

#ts-woo-search-root .ts-facet-item:after,
#ts-woo-search-root .ais-RefinementList-label:after {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: '\f00c';
    position: absolute;
    top: 2px;
    left: 5px;
    font-size: 10px;
    line-height: 1;
    color: #fff;
    opacity: 0;
    visibility: hidden;
    transition: opacity 200ms, visibility 200ms;
}

#ts-woo-search-root .ts-facet-item:hover:before,
#ts-woo-search-root .ts-facet-item:has(input:checked):before,
#ts-woo-search-root .ais-RefinementList-label:hover:before,
#ts-woo-search-root .ais-RefinementList-label:has(input:checked):before {
    background: #00B412;
    border-color: #00B412;
}

#ts-woo-search-root .ts-facet-item:hover:after,
#ts-woo-search-root .ts-facet-item:has(input:checked):after,
#ts-woo-search-root .ais-RefinementList-label:hover:after,
#ts-woo-search-root .ais-RefinementList-label:has(input:checked):after {
    opacity: 1;
    visibility: visible;
}

#ts-woo-search-root .ts-facet-item .ais-RefinementList-labelText,
#ts-woo-search-root .ais-RefinementList-label .ais-RefinementList-labelText {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#ts-woo-search-root .ts-facet-item .ais-RefinementList-count,
#ts-woo-search-root .ais-RefinementList-label .ais-RefinementList-count {
    background: #f2f2f2;
    color: #666;
    font-weight: 500;
}

/* Grupperingsmarginal mellan kategori-facetten och typ-facetten
   (product/page/post) som numera kommer efter den - en tydlig linje med
   luft på båda sidor istället för att filtren (t.ex. "Produkter") ligger
   klistrade direkt under kategorilistan. */
#ts-woo-search-root .ts-search-type-facet {
    margin-top: 24px;
    padding-top: 20px;
    border-top: 1px solid #f2f2f2;
}

#ts-woo-search-root .ts-facet-item__view {
    color: #00B412;
    font-size: 14px;
    font-weight: 700;
    opacity: 1;
}

#ts-woo-search-root .ts-facet-item__view:hover {
    opacity: 0.6;
}

/* Träfflista - samma kortkänsla som produktkorten i sortimentet */
#ts-woo-search-root .ts-search-hits .ais-Hits-list {
    gap: 1.25rem;
}

#ts-woo-search-root .ts-hit {
    background: #fff;
    border-radius: 2px;
    box-shadow: 0 1px 4px 0 rgba(106, 106, 106, .1);
    padding: 12px;
    gap: 6px;
    transition: box-shadow 150ms ease;
}

#ts-woo-search-root .ts-hit:hover {
    box-shadow: 0 2px 10px 0 rgba(106, 106, 106, .2);
}

#ts-woo-search-root .ts-hit img {
    background: #fff;
    object-fit: contain;
}

#ts-woo-search-root .ts-hit-name {
    font-size: 13px;
    font-weight: 500;
    color: #000;
    line-height: 1.3;
}

#ts-woo-search-root .ts-hit-price {
    margin-top: auto;
    font-size: 14px;
    font-weight: 700;
    color: #00B412;
}

#ts-woo-search-root .ts-search-hits .ais-Hits--empty {
    padding: 40px 0;
    text-align: center;
    font-size: 14px;
    color: #666;
}

/* Paginering */

/* Temats globala reset.css nollar padding-bottom på "ol/ul li:last-child" -
   tänkt för vanliga innehållslistor, men pagineringens knappar ligger i en
   rad (flex), så sista knappen (»/Last Page) blir 5px lägre och hamnar
   därför synligt lägre än de andra. Återställ paddingen bara här. */
#ts-woo-search-root .ts-search-pagination .ais-Pagination-item:last-child {
    padding-bottom: 5px;
}

#ts-woo-search-root .ts-search-pagination .ais-Pagination-item--selected .ais-Pagination-link {
    background: #00B412;
    border-color: #00B412;
    color: #fff;
}

#ts-woo-search-root .ts-search-pagination .ais-Pagination-link:hover {
    border-color: #00B412;
    color: #00B412;
}

#ts-woo-search-root .ts-search-pagination .ais-Pagination-item--selected .ais-Pagination-link:hover {
    color: #fff;
}

/* ==========================================================================
   Typesense i headern - kompakt läge ([typesense_search_compact], se
   header-v1.php). Panelen (öppna/stäng vid klick utanför, Escape, m.m.)
   styrs helt av pluginets egen assets/js/instant-search-compact.js - här
   stylas bara utseendet, inget i pluginet rörs. #ts-woo-search-compact-root
   som prefix av samma skäl som för #ts-woo-search-root: pluginets css
   laddas i wp_footer, efter child-style i <head>. */

#ts-woo-search-compact-root {
    width: 100%;
}

#ts-woo-search-compact-root .ts-compact {
    max-width: none;
    width: 100%;
}

#ts-woo-search-compact-root .ts-compact-box .ais-SearchBox-form {
    height: 46px;
}

#ts-woo-search-compact-root .ts-compact-box .ais-SearchBox-input {
    height: 46px;
    border: none;
    border-radius: 60px;
    background-color: #f0f0f0;
    padding: 11px 44px;
    font-size: 14px;
    color: #000;
    box-shadow: none;
}

#ts-woo-search-compact-root .ts-compact-box .ais-SearchBox-input:focus {
    background-color: #ebebeb;
    outline: none;
}

#ts-woo-search-compact-root .ts-compact-box .ais-SearchBox-input::placeholder {
    color: #999;
}

#ts-woo-search-compact-root .ts-compact-box .ais-SearchBox-form:before {
    left: 18px;
    top: 50%;
    width: 16px;
    height: 16px;
    margin-top: 0;
    transform: translateY(-50%);
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2300B412' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><circle cx='11' cy='11' r='8'></circle><line x1='21' y1='21' x2='16.65' y2='16.65'></line></svg>");
}

#ts-woo-search-compact-root .ts-compact-box .ais-SearchBox-reset {
    top: 50%;
    margin-top: 0;
    transform: translateY(-50%);
    fill: #999;
}

#ts-woo-search-compact-root .ts-compact-box .ais-SearchBox-reset:hover,
#ts-woo-search-compact-root .ts-compact-box .ais-SearchBox-reset:focus {
    background: #dcdcdc;
    fill: #333;
}

/* Flytande dropdown-panel med resultat - samma bredd som sökrutan självt,
   inte pluginets fasta 320px (som gjorde panelen smalare än fältet). */
#ts-woo-search-compact-root .ts-compact-panel {
    width: 100%;
    max-width: none;
    margin-top: 8px;
    padding: 10px;
    border: none;
    border-radius: 10px;
    box-shadow: 0 10px 30px 0 rgba(0, 0, 0, .15);
    z-index: 999;
    box-sizing: border-box;
}

/* satellite-temat sätter .ais-Hits-item (raden runt varje träff) till
   display:flex. Utan min-width:0 här får .ts-compact-hit (flex-item i den
   raden) sitt default min-width:auto, vilket för långa produktnamn (med
   white-space:nowrap på .ts-compact-hit-name) tvingar hela raden att bli
   bredare än listan - därav sidoscrollet. */
#ts-woo-search-compact-root .ts-compact-hit {
    min-width: 0;
    width: 100%;
    box-sizing: border-box;
    border-radius: 6px;
}

#ts-woo-search-compact-root .ts-compact-hit:hover {
    background: #f2f2f2;
}

#ts-woo-search-compact-root .ts-compact-hit img {
    background: #fff;
    object-fit: contain;
}

#ts-woo-search-compact-root .ts-compact-hit-name {
    font-size: 13px;
    font-weight: 500;
    color: #000;
}

#ts-woo-search-compact-root .ts-compact-hit-price {
    color: #00B412;
    font-size: 13px;
    font-weight: 700;
}

#ts-woo-search-compact-root .ts-compact-see-all {
    color: #00B412;
    font-weight: 700;
    font-size: 13px;
    border-top: 1px solid #f2f2f2;
}

#ts-woo-search-compact-root .ts-compact-see-all:hover {
    opacity: 0.7;
}

#ts-woo-search-compact-root .ts-compact-empty {
    text-align: center;
    color: #666;
    font-size: 13px;
}

/* Varumärkes loggor */
.ts-product-brand-wrapper .item > a {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 70px;
}

.ts-product-brand-wrapper .item > a img {
    width: auto;
    height: 100%;
    max-width: 100%;
    object-fit: contain;
}

.ts-product-brand-wrapper .item .meta-wrapper {
    text-align: center;
}

/* Order notes moved into "Din beställning" (inc/checkout-functions.php) */
.woocommerce-checkout #payment .mhk-order-notes {
    margin: 20px 0;
}
.woocommerce-checkout #payment .mhk-order-notes textarea {
    width: 100%;
    min-height: 80px;
}
