
/* ==========================================
   HEMPLI.SE – QUANTITY OFFERS V2
   Light Hempli Design
   Main green: #375221
   ========================================== */

.hqo-offers {
    --hqo-green: #375221;
    --hqo-green-dark: #375221;
    --hqo-green-hover: #4A662F;
    --hqo-green-soft: #F4F8F1;
    --hqo-green-selected: #EDF3E8;
    --hqo-border: #E1E7DC;
    --hqo-text: #3D3B3B;
    --hqo-muted: #70766D;

    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 11px !important;
    width: 100% !important;
    min-width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
    align-self: stretch !important;
    clear: both !important;
    box-sizing: border-box !important;
    margin: 24px 0 4px !important;
    order: 999 !important;
}

/* WooCommerce / Elementor layout */
form.cart:has(.hqo-offers),
.woocommerce-variation-add-to-cart:has(.hqo-offers),
form.cart.hqo-has-offers,
.woocommerce-variation-add-to-cart.hqo-has-offers {
    flex-wrap: wrap !important;
}

form.cart .hqo-offers,
.woocommerce-variation-add-to-cart .hqo-offers {
    float: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* ==========================================
   MÄNGDRABATT – ALTERNATIV
   ========================================== */

.hqo-option {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;

    min-height: 54px !important;
    gap: 18px !important;

    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;

    box-sizing: border-box !important;

    padding: 13px 14px 13px 11px !important;
    margin: 0 !important;

    border: 1px solid var(--hqo-border) !important;
    border-radius: 8px !important;

    background: #FFFFFF !important;

    cursor: pointer !important;
    text-align: left !important;
    line-height: 1.2 !important;

    transition:
        border-color .18s ease,
        background-color .18s ease,
        box-shadow .18s ease !important;
}

/* Hover */
.hqo-option:hover:not(.is-disabled),
.hqo-option:focus-within:not(.is-disabled) {
    border-color: #A6B79B !important;
    background: #FAFCF9 !important;
}

/* Valt alternativ */
.hqo-option.is-selected {
    border-color: var(--hqo-green) !important;
    background: var(--hqo-green-selected) !important;
    box-shadow: none !important;
}

/* Inaktiverat alternativ */
.hqo-option.is-disabled {
    opacity: .45 !important;
    cursor: not-allowed !important;
}

/* ==========================================
   INNEHÅLL I ALTERNATIV
   ========================================== */

.hqo-option-main {
    display: flex !important;
    align-items: center !important;
    min-width: 0 !important;
    gap: 10px !important;
    flex: 1 1 auto !important;
}

/* Native radio input */
.hqo-radio {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

/* Anpassad radioknapp */
.hqo-radio-ui {
    position: relative !important;
    width: 21px !important;
    height: 21px !important;
    flex: 0 0 21px !important;

    border: 1px solid #D8DED3 !important;
    border-radius: 50% !important;
    background: #FFFFFF !important;

    box-sizing: border-box !important;

    transition:
        border-color .18s ease,
        box-shadow .18s ease !important;
}

/* Vald radioknapp */
.hqo-radio:checked + .hqo-radio-ui {
    border-color: var(--hqo-green) !important;
}

/* Prick i radioknapp */
.hqo-radio:checked + .hqo-radio-ui::after {
    content: "" !important;
    position: absolute !important;
    inset: 4px !important;
    border-radius: 50% !important;
    background: var(--hqo-green) !important;
}

/* ==========================================
   TEXT OCH PRIS
   ========================================== */

.hqo-label {
    color: var(--hqo-text) !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    white-space: normal !important;
}

/* Badge / spara */
.hqo-badge {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    min-height: 20px !important;
    padding: 3px 8px 2px !important;

    border-radius: 999px !important;
    background: var(--hqo-green-dark) !important;
    color: #FFFFFF !important;

    font-size: 10px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    letter-spacing: .02em !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
}

/* Pris */
.hqo-price {
    flex: 0 0 auto !important;
    color: var(--hqo-text) !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    white-space: nowrap !important;
    margin-left: auto !important;
}

.hqo-price .woocommerce-Price-amount,
.hqo-price .woocommerce-Price-currencySymbol {
    color: inherit !important;
    font: inherit !important;
}

/* ==========================================
   VARUKORG – RABATTINFORMATION
   ========================================== */

.hqo-cart-note {
    margin-top: 4px;
    color: #375221;
    font-size: 12px;
    font-weight: 700;
}

.hqo-cart-price del {
    opacity: .55;
    margin-right: 4px;
}

.hqo-cart-price ins {
    text-decoration: none;
}

/* ==========================================
   MOBIL
   ========================================== */

@media (max-width: 767px) {

    .hqo-offers {
        gap: 9px !important;
        margin-top: 20px !important;
    }

    .hqo-option {
        min-height: 55px !important;
        gap: 10px !important;
        padding: 12px 11px !important;
    }

    .hqo-option-main {
        gap: 8px !important;
        flex-wrap: wrap !important;
    }

    .hqo-label,
    .hqo-price {
        font-size: 15px !important;
    }

    .hqo-badge {
        margin-left: 29px !important;
        margin-top: -4px !important;
    }
}

/* ==========================================
   QUICK VIEW SUPPORT
   ========================================== */

.hqo-offers .hqo-option * {
    box-sizing: border-box !important;
}

.quick-view .hqo-offers,
.quickview .hqo-offers,
.woocommerce-quick-view .hqo-offers,
.wpcu-quick-view-content .hqo-offers,
.mfp-content .hqo-offers,
#cboxLoadedContent .hqo-offers,
.elementor-lightbox .hqo-offers {
    margin-top: 16px !important;
}

.quick-view form.cart:has(.hqo-offers),
.quickview form.cart:has(.hqo-offers),
.woocommerce-quick-view form.cart:has(.hqo-offers),
.wpcu-quick-view-content form.cart:has(.hqo-offers),
.mfp-content form.cart:has(.hqo-offers),
#cboxLoadedContent form.cart:has(.hqo-offers),
.elementor-lightbox form.cart:has(.hqo-offers) {
    width: 100% !important;
    align-items: stretch !important;
}

/* Behåll full bredd i dynamisk Quick View */
body .hqo-has-offers > .hqo-offers {
    flex-basis: 100% !important;
    width: 100% !important;
}

/* Side-cart priser */
.hqo-cart-price ins,
.hqo-cart-price del {
    white-space: nowrap;
}

/* ==========================================
   WPC SMART QUICK VIEW SPACING
   ========================================== */

html body #woosq-popup
.summary-content form.cart.hqo-has-offers > .hqo-offers,
html body #woosq-popup
.summary-content
.woocommerce-variation-add-to-cart.hqo-has-offers > .hqo-offers {
    margin-top: 0 !important;
    padding-top: 14px !important;
}

@media (max-width: 767px) {

    html body #woosq-popup
    .summary-content form.cart.hqo-has-offers > .hqo-offers,
    html body #woosq-popup
    .summary-content
    .woocommerce-variation-add-to-cart.hqo-has-offers > .hqo-offers {
        padding-top: 12px !important;
    }
}
