.elementor-247497 .elementor-element.elementor-element-6edce137{--spacer-size:20px;}.elementor-247497 .elementor-element.elementor-element-233afdf2{--spacer-size:20px;}.elementor-247497 .elementor-element.elementor-element-39d04f79{--spacer-size:20px;}.elementor-247497 .elementor-element.elementor-element-44bbd865{--spacer-size:20px;}.elementor-247497 .elementor-element.elementor-element-2eb024f0{--spacer-size:20px;}body.elementor-page-247497:not(.elementor-motion-effects-element-type-background), body.elementor-page-247497 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#F5F2EE;}/* Start custom CSS *//* =========================================================
   SOCIALA KANALER
   ========================================================= */

/* Behållaren för alla kanaler */
form div:has(> div > input#social-tiktok),
form div:has(> div > input#social-facebook),
form div:has(> div > input#social-instagram),
form div:has(> div > input#social-blogg),
form div:has(> div > input#social-youtube) {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    width: 100%;
}


/* Varje knapp */
form div:has(> input#social-tiktok),
form div:has(> input#social-facebook),
form div:has(> input#social-instagram),
form div:has(> input#social-blogg),
form div:has(> input#social-youtube) {
    position: relative;
    display: flex;

    width: auto !important;
    flex: 0 0 auto !important;

    min-height: 56px;

    align-items: center;
    justify-content: center;
    gap: 10px;

    padding: 14px 24px;

    background: #FAF8F5;
    border: 1px solid #D9D9D9;
    border-radius: 999px;

    box-sizing: border-box;
    white-space: nowrap;

    cursor: pointer;

    transition:
        background-color 0.2s ease,
        border-color 0.2s ease,
        box-shadow 0.2s ease,
        transform 0.2s ease;
}


/* Hover */
form div:has(> input#social-tiktok):hover,
form div:has(> input#social-facebook):hover,
form div:has(> input#social-instagram):hover,
form div:has(> input#social-blogg):hover,
form div:has(> input#social-youtube):hover {
    background: #467D99;
    border-color: #467D99;
    box-shadow: 0 3px 10px rgba(0,0,0,0.06);
    transform: translateY(-1px);
}

form div:has(> input#social-tiktok):hover::after,
form div:has(> input#social-facebook):hover::after,
form div:has(> input#social-instagram):hover::after,
form div:has(> input#social-blogg):hover::after,
form div:has(> input#social-youtube):hover::after {
    color: #ffffff;
}

form div:has(> input#social-tiktok):hover .e-svg-base,
form div:has(> input#social-facebook):hover .e-svg-base,
form div:has(> input#social-instagram):hover .e-svg-base,
form div:has(> input#social-blogg):hover .e-svg-base,
form div:has(> input#social-youtube):hover .e-svg-base {
    color: #ffffff;
}

form div:has(> input#social-tiktok):hover svg path,
form div:has(> input#social-facebook):hover svg path,
form div:has(> input#social-instagram):hover svg path,
form div:has(> input#social-blogg):hover svg path,
form div:has(> input#social-youtube):hover svg path {
    fill: currentColor;
}


/* Ikoner */
form div:has(> input#social-tiktok) .e-svg-base,
form div:has(> input#social-facebook) .e-svg-base,
form div:has(> input#social-instagram) .e-svg-base,
form div:has(> input#social-blogg) .e-svg-base,
form div:has(> input#social-youtube) .e-svg-base {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 20px;
    height: 20px;

    flex: 0 0 20px;
}

form div:has(> input#social-tiktok) .e-svg-base svg,
form div:has(> input#social-facebook) .e-svg-base svg,
form div:has(> input#social-instagram) .e-svg-base svg,
form div:has(> input#social-blogg) .e-svg-base svg,
form div:has(> input#social-youtube) .e-svg-base svg {
    width: 20px;
    height: 20px;
    display: block;
}


/* Text */
form div:has(> input#social-tiktok)::after {
    content: "TikTok";
}

form div:has(> input#social-facebook)::after {
    content: "Facebook";
}

form div:has(> input#social-instagram)::after {
    content: "Instagram";
}

form div:has(> input#social-blogg)::after {
    content: "Blogg";
}

form div:has(> input#social-youtube)::after {
    content: "YouTube";
}

form div:has(> input#social-tiktok)::after,
form div:has(> input#social-facebook)::after,
form div:has(> input#social-instagram)::after,
form div:has(> input#social-blogg)::after,
form div:has(> input#social-youtube)::after {
    font-size: 16px;
    font-weight: 600;
    line-height: 1;
    color: #222222;

    position: relative;
    z-index: 1;
}


/* Gör hela knappen klickbar */
form div:has(> input#social-tiktok) > input[type="checkbox"],
form div:has(> input#social-facebook) > input[type="checkbox"],
form div:has(> input#social-instagram) > input[type="checkbox"],
form div:has(> input#social-blogg) > input[type="checkbox"],
form div:has(> input#social-youtube) > input[type="checkbox"] {
    -webkit-appearance: none;
    appearance: none;

    position: absolute;
    inset: 0;

    width: 100%;
    height: 100%;

    margin: 0;
    opacity: 0;

    cursor: pointer;
    z-index: 5;
}


/* Vald knapp */
form div:has(> input#social-tiktok:checked),
form div:has(> input#social-facebook:checked),
form div:has(> input#social-instagram:checked),
form div:has(> input#social-blogg:checked),
form div:has(> input#social-youtube:checked) {
    background: #467D99;
    border-color: #467D99;
    box-shadow: 0 3px 12px rgba(0,0,0,0.12);
}

form div:has(> input#social-tiktok:checked)::after,
form div:has(> input#social-facebook:checked)::after,
form div:has(> input#social-instagram:checked)::after,
form div:has(> input#social-blogg:checked)::after,
form div:has(> input#social-youtube:checked)::after {
    color: #ffffff;
}

form div:has(> input#social-tiktok:checked) .e-svg-base,
form div:has(> input#social-facebook:checked) .e-svg-base,
form div:has(> input#social-instagram:checked) .e-svg-base,
form div:has(> input#social-blogg:checked) .e-svg-base,
form div:has(> input#social-youtube:checked) .e-svg-base {
    color: #ffffff;
}

form div:has(> input#social-tiktok:checked) svg path,
form div:has(> input#social-facebook:checked) svg path,
form div:has(> input#social-instagram:checked) svg path,
form div:has(> input#social-blogg:checked) svg path,
form div:has(> input#social-youtube:checked) svg path {
    fill: currentColor;
}


/* Blogger-ikonen */
form div:has(> input#social-blogg:hover) svg path,
form div:has(> input#social-blogg:checked) svg path {
    fill: #ffffff !important;
}


/* Mobil */
@media (max-width: 767px) {

    form div:has(> input#social-tiktok),
    form div:has(> input#social-facebook),
    form div:has(> input#social-instagram),
    form div:has(> input#social-blogg),
    form div:has(> input#social-youtube) {
        min-height: 50px;
        padding: 12px 18px;
    }

    form div:has(> input#social-tiktok)::after,
    form div:has(> input#social-facebook)::after,
    form div:has(> input#social-instagram)::after,
    form div:has(> input#social-blogg)::after,
    form div:has(> input#social-youtube)::after {
        font-size: 14px;
    }
}



/* =========================================================
   PRODUKTER
   ========================================================= */

/* Behållare – 2 kolumner */
form div:has(> div > input#product-vibrationsplatta),
form div:has(> div > input#product-pemf),
form div:has(> div > input#product-massage),
form div:has(> div > input#product-jordning),
form div:has(> div > input#product-ovrigt) {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px;
    width: 100%;
}


/* Produktkort */
div:has(> input#product-vibrationsplatta),
div:has(> input#product-pemf),
div:has(> input#product-massage),
div:has(> input#product-jordning),
div:has(> input#product-ovrigt) {
    position: relative;
    display: flex;

    align-items: center;
    justify-content: flex-start;
    gap: 14px;

    min-height: 64px;
    padding: 16px 20px;

    background: #FAF8F5;
    border: 1px solid #D9D9D9;
    border-radius: 14px;

    box-sizing: border-box;
    cursor: pointer;

    transition:
        background-color 0.2s ease,
        border-color 0.2s ease,
        box-shadow 0.2s ease,
        transform 0.2s ease;
}


/* Kryssruta */
div:has(> input#product-vibrationsplatta)::before,
div:has(> input#product-pemf)::before,
div:has(> input#product-massage)::before,
div:has(> input#product-jordning)::before,
div:has(> input#product-ovrigt)::before {
    content: "✓";

    flex: 0 0 22px;
    width: 22px;
    height: 22px;

    display: flex;
    align-items: center;
    justify-content: center;

    font-size: 14px;
    font-weight: 700;

    color: transparent;

    background: #ffffff;
    border: 2px solid #D9D9D9;
    border-radius: 6px;

    box-sizing: border-box;
    position: relative;
    z-index: 1;

    transition:
        background-color 0.2s ease,
        border-color 0.2s ease,
        color 0.2s ease;
}


/* Produktnamn */
div:has(> input#product-vibrationsplatta)::after {
    content: "Vibrationsplatta";
}

div:has(> input#product-pemf)::after {
    content: "Ljus, värme- & PEMF-terapi";
}

div:has(> input#product-massage)::after {
    content: "Massageprodukt";
}

div:has(> input#product-jordning)::after {
    content: "Jordningsprodukter";
}

div:has(> input#product-ovrigt)::after {
    content: "Övrigt";
}

div:has(> input#product-vibrationsplatta)::after,
div:has(> input#product-pemf)::after,
div:has(> input#product-massage)::after,
div:has(> input#product-jordning)::after,
div:has(> input#product-ovrigt)::after {
    position: relative;
    z-index: 1;

    font-size: 16px;
    font-weight: 600;
    line-height: 1.3;
    text-align: left;

    color: #222222;
}


/* Gör hela kortet klickbart */
div:has(> input#product-vibrationsplatta) > input[type="checkbox"],
div:has(> input#product-pemf) > input[type="checkbox"],
div:has(> input#product-massage) > input[type="checkbox"],
div:has(> input#product-jordning) > input[type="checkbox"],
div:has(> input#product-ovrigt) > input[type="checkbox"] {
    -webkit-appearance: none;
    appearance: none;

    position: absolute;
    inset: 0;

    width: 100%;
    height: 100%;

    margin: 0;
    opacity: 0;

    cursor: pointer;
    z-index: 5;
}


/* Hover */
div:has(> input#product-vibrationsplatta):hover,
div:has(> input#product-pemf):hover,
div:has(> input#product-massage):hover,
div:has(> input#product-jordning):hover,
div:has(> input#product-ovrigt):hover {
    border-color: #467D99;
    box-shadow: 0 3px 10px rgba(0,0,0,0.06);
}

div:has(> input#product-vibrationsplatta):hover::before,
div:has(> input#product-pemf):hover::before,
div:has(> input#product-massage):hover::before,
div:has(> input#product-jordning):hover::before,
div:has(> input#product-ovrigt):hover::before {
    border-color: #467D99;
}


/* Vald produkt */
div:has(> input#product-vibrationsplatta:checked),
div:has(> input#product-pemf:checked),
div:has(> input#product-massage:checked),
div:has(> input#product-jordning:checked),
div:has(> input#product-ovrigt:checked) {
    background: rgba(70, 125, 153, 0.06);
    border-color: #467D99;
    box-shadow: 0 3px 12px rgba(70, 125, 153, 0.15);
}


/* Vald kryssruta */
div:has(> input#product-vibrationsplatta:checked)::before,
div:has(> input#product-pemf:checked)::before,
div:has(> input#product-massage:checked)::before,
div:has(> input#product-jordning:checked)::before,
div:has(> input#product-ovrigt:checked)::before {
    background: #467D99;
    border-color: #467D99;
    color: #ffffff;
}


/* Övrigt – textfältet styrs av JS */
#product-ovrigt-field {
    width: 100%;
    grid-column: 1 / -1;
}


/* Mobil */
@media (max-width: 767px) {

    form div:has(> div > input#product-vibrationsplatta),
    form div:has(> div > input#product-pemf),
    form div:has(> div > input#product-massage),
    form div:has(> div > input#product-jordning),
    form div:has(> div > input#product-ovrigt) {
        grid-template-columns: 1fr !important;
        gap: 10px;
    }

    div:has(> input#product-vibrationsplatta),
    div:has(> input#product-pemf),
    div:has(> input#product-massage),
    div:has(> input#product-jordning),
    div:has(> input#product-ovrigt) {
        min-height: 58px;
        padding: 14px 16px;
        gap: 12px;
    }

    div:has(> input#product-vibrationsplatta)::after,
    div:has(> input#product-pemf)::after,
    div:has(> input#product-massage)::after,
    div:has(> input#product-jordning)::after,
    div:has(> input#product-ovrigt)::after {
        font-size: 14px;
    }

    div:has(> input#product-vibrationsplatta)::before,
    div:has(> input#product-pemf)::before,
    div:has(> input#product-massage)::before,
    div:has(> input#product-jordning)::before,
    div:has(> input#product-ovrigt)::before {
        flex: 0 0 20px;
        width: 20px;
        height: 20px;
    }
}



/* =========================================================
   BEKRÄFTA ÅTAGANDE – JA / NEJ
   ========================================================= */

div:has(> #ambassador-ja),
div:has(> #ambassador-nej) {
    position: relative;

    display: flex;
    align-items: center;
    justify-content: center;

    min-height: 54px;
    padding: 12px 20px;

    background: #FAF8F5;
    border: 1px solid #D9D9D9;
    border-radius: 14px;

    box-sizing: border-box;
    cursor: pointer;

    transition:
        background-color 0.2s ease,
        border-color 0.2s ease,
        box-shadow 0.2s ease;
}


/* Hela knappen klickbar */
div:has(> #ambassador-ja) > input[type="checkbox"],
div:has(> #ambassador-nej) > input[type="checkbox"] {
    -webkit-appearance: none;
    appearance: none;

    position: absolute;
    inset: 0;

    width: 100%;
    height: 100%;

    margin: 0;
    opacity: 0;

    cursor: pointer;
    z-index: 5;
}


/* Text */
div:has(> #ambassador-ja)::after {
    content: "Ja";
}

div:has(> #ambassador-nej)::after {
    content: "Nej";
}

div:has(> #ambassador-ja)::after,
div:has(> #ambassador-nej)::after {
    position: relative;
    z-index: 1;

    font-size: 18px;
    font-weight: 600;
    line-height: 1;

    color: #222222;
}


/* Hover */
div:has(> #ambassador-ja):hover,
div:has(> #ambassador-nej):hover {
    border-color: #467D99;
}


/* Vald */
div:has(> #ambassador-ja:checked),
div:has(> #ambassador-nej:checked) {
    background: #467D99;
    border-color: #467D99;
}

div:has(> #ambassador-ja:checked)::after,
div:has(> #ambassador-nej:checked)::after {
    color: #ffffff;
}


/* Mobil */
@media (max-width: 767px) {

    div:has(> #ambassador-ja),
    div:has(> #ambassador-nej) {
        min-height: 52px;
        padding: 12px 18px;
    }

    div:has(> #ambassador-ja) {
        margin-bottom: 12px;
    }

    div:has(> #ambassador-ja)::after,
    div:has(> #ambassador-nej)::after {
        font-size: 16px;
    }
}


/* Mellanrum Ja / Nej */
div:has(> #ambassador-ja):not(:has(#ambassador-nej)) {
    margin-right: 12px;
}/* End custom CSS */