﻿/* =========================================================
   LA VELA – NEWSLETTER
   ZÁKLADNÍ VZHLED
   ========================================================= */

.footer-newsletter {
    width: 100%!important;
    max-width: none!important;
    margin: 0!important;
    padding: 34px 5%!important;
    background: #f6f1e9!important;
    border-top: 1px solid #eee5da!important;
    border-bottom: 1px solid #e4d9cc!important;
    box-sizing: border-box!important;

    display: flex!important;
    align-items: center!important;
    gap: 45px!important;
}


/* =========================================================
   LEVÁ ČÁST – NADPIS A LÍSTEK
   ========================================================= */

.footer-newsletter .newsletter-header {
    width: 48%!important;
    flex: 1 1 48%!important;
    position: relative!important;
    margin: 0!important;
    padding: 8px 0 8px 100px!important;
    box-sizing: border-box!important;
}


/* Tvůj obrázek lístku */

.footer-newsletter .newsletter-header:before {
    content: ""!important;
    position: absolute!important;
    left: -95px!important;
    top: 50%!important;
    transform: translateY(-50%)!important;

    width: 190px!important;
    height: 220px!important;

    background: url("https://www.svickylavela.cz/user/documents/upload/La%20Vela%20-%20česká%20značka%20svíček.png")
        center/contain no-repeat!important;
}


/* Hlavní nadpis */

.footer-newsletter .newsletter-header h3 {
    margin: 0 0 10px!important;
    font: 400 34px/1.1 Georgia, "Times New Roman", serif!important;
    color: #4d4037!important;
}

.footer-newsletter .newsletter-header h3:after {
    content: "Buďte v obraze"!important;
    font: inherit!important;
}

.footer-newsletter .newsletter-header h3 {
    font-size: 0!important;
}

.footer-newsletter .newsletter-header h3:after {
    font-size: 34px!important;
}

/* Podnadpis */

.footer-newsletter .newsletter-header p {
    margin: 0 0 20px!important;
    font: 14px/1.5 "Open Sans", Arial, sans-serif!important;
    color: #806f62!important;
}
.footer-newsletter .newsletter-header p {
    font-size: 0!important;
}

.footer-newsletter .newsletter-header p:before {
    content: "Novinky a inspirace ze světa La Vela"!important;
    font: 14px/1.5 "Open Sans",Arial,sans-serif!important;
    color: #806f62!important;
}
/* Text s výhodami */

.footer-newsletter .newsletter-header p:after {
    content: "❧  Esenciální oleje    ♡  Pečlivá ruční výroba    ⌂  Vůně pro váš domov"!important;
    display: block!important;
    margin-top: 18px!important;

    font: 13px/1.5 "Open Sans", Arial, sans-serif!important;
    color: #806f62!important;

    white-space: nowrap!important;
}


/* =========================================================
   PRAVÁ ČÁST – FORMULÁŘ
   ========================================================= */

.footer-newsletter form {
    width: 52%!important;
    flex: 1 1 52%!important;
    position: relative!important;
    margin: 0!important;
    padding: 32px 0 0!important;
    box-sizing: border-box!important;
}


/* "Děkujeme, že jste s námi" */

.footer-newsletter form:before {
    content: "Děkujeme, že jste s námi ♡"!important;
    position: absolute!important;
    top: -4px!important;
    left: 0!important;
    width: 100%!important;

    font: italic 22px/1.2 "Brush Script MT", "Segoe Script", cursive!important;
    color: #a48a75!important;

    white-space: nowrap!important;
}


/* =========================================================
   FORMULÁŘ – ZÁKLAD
   ========================================================= */

.footer-newsletter fieldset {
    display: flex!important;
    align-items: flex-end!important;
    gap: 14px!important;
    width: 100%!important;
    margin: 0!important;
    padding: 0!important;
    border: 0!important;
}


/* Skrytá pole */

.footer-newsletter .no-display,
.footer-newsletter input[name="surname"],
.footer-newsletter input[name="formId"] {
    display: none!important;
}


/* Formulářové skupiny */

.footer-newsletter .form-group {
    margin: 0!important;
}


/* =========================================================
   E-MAIL
   ========================================================= */

.footer-newsletter .smart-label-wrapper {
    width: 240px!important;
    flex: 0 1 240px!important;
}

.footer-newsletter .smart-label-wrapper label {
    display: block!important;
    margin: 0 0 6px!important;

    font: 12px/1.2 "Open Sans", Arial, sans-serif!important;
    color: #604f43!important;
}

.footer-newsletter input[type="email"] {
    display: block!important;
    width: 100%!important;
    height: 42px!important;
    margin: 0!important;
    padding: 0 12px!important;

    box-sizing: border-box!important;

    border: 1px solid #d7c9bb!important;
    border-radius: 0!important;
    background: #fff!important;

    color: #4d4037!important;
    font-size: 13px!important;
}


/* =========================================================
   CHECKBOX – SOUHLAS
   ========================================================= */

.footer-newsletter .consents-first {
    display: flex!important;
    align-items: flex-start!important;
    gap: 9px!important;

    width: auto!important;
    min-width: 0!important;
    flex: 1 1 260px!important;

    margin: 0!important;
    box-sizing: border-box!important;
}


/* Samotné zaškrtávací políčko */

.footer-newsletter .consents-first input[type="checkbox"] {
    display: block!important;
    visibility: visible!important;
    opacity: 1!important;

    appearance: auto!important;
    -webkit-appearance: checkbox!important;

    width: 18px!important;
    height: 18px!important;
    min-width: 18px!important;

    margin: 1px 0 0!important;

    flex: 0 0 18px!important;

    position: static!important;

    accent-color: #806653!important;
}


/* Text vedle checkboxu */

.footer-newsletter .consents-first label,
.footer-newsletter .consents-first label.whole-width {
    display: block!important;
    position: static!important;

    width: auto!important;
    min-width: 0!important;
    flex: 1 1 auto!important;

    margin: 0!important;
    padding: 0!important;

    font: 10px/1.35 "Open Sans", Arial, sans-serif!important;
    color: #6f6259!important;

    text-align: left!important;
}


/* Zrušení případných vlastních checkboxů */

.footer-newsletter .consents-first label:before,
.footer-newsletter .consents-first label:after {
    content: none!important;
    display: none!important;
}


/* Odkazy v souhlasu */

.footer-newsletter .consents-first label a {
    color: #6f6259!important;
    text-decoration: underline!important;
}


/* Druhý souhlas skrýt */

.footer-newsletter .consents:not(.consents-first) {
    display: none!important;
}


/* =========================================================
   TLAČÍTKO PŘIHLÁSIT SE
   ========================================================= */

.footer-newsletter button {
    display: flex!important;
    align-items: center!important;
    justify-content: center!important;

    width: 125px!important;
    min-width: 125px!important;
    height: 42px!important;

    margin: 0!important;
    padding: 0 12px!important;

    border: 0!important;
    border-radius: 2px!important;

    background: #806653!important;
    color: #fff!important;

    font: 600 11px/1 "Open Sans", Arial, sans-serif!important;
    letter-spacing: .3px!important;
    text-align: center!important;
    white-space: nowrap!important;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 1050px) {

    .footer-newsletter {
        gap: 25px!important;
        padding: 30px 4%!important;
    }

    .footer-newsletter .newsletter-header {
        padding-left: 80px!important;
    }

    .footer-newsletter .newsletter-header:before {
        left: -15px!important;
        width: 90px!important;
        height: 120px!important;
    }

    .footer-newsletter .newsletter-header h3 {
        font-size: 29px!important;
    }

    .footer-newsletter .newsletter-header p {
        font-size: 13px!important;
    }

    .footer-newsletter .newsletter-header p:after {
        font-size: 10px!important;
    }

    .footer-newsletter form {
        padding-top: 30px!important;
    }

    .footer-newsletter form:before {
        font-size: 19px!important;
    }

    .footer-newsletter fieldset {
        gap: 9px!important;
    }

    .footer-newsletter .smart-label-wrapper {
        flex-basis: 180px!important;
    }

    .footer-newsletter .consents-first {
        flex-basis: 190px!important;
    }

    .footer-newsletter button {
        width: 100px!important;
        min-width: 100px!important;
        font-size: 10px!important;
    }
}


/* =========================================================
   MOBIL
   ========================================================= */

@media (max-width: 700px) {

    .footer-newsletter {
        display: block!important;
        padding: 32px 20px 30px!important;
        text-align: center!important;
    }

    .footer-newsletter .newsletter-header {
        width: 100%!important;
        padding: 80px 0 0!important;
        text-align: center!important;
    }

    .footer-newsletter .newsletter-header:before {
        left: 50%!important;
        top: 0!important;
        transform: translateX(-50%)!important;

        width: 90px!important;
        height: 75px!important;
    }

    .footer-newsletter .newsletter-header h3 {
        font-size: 27px!important;
    }

    .footer-newsletter .newsletter-header p {
        font-size: 13px!important;
        margin-bottom: 14px!important;
    }

    .footer-newsletter .newsletter-header p:after {
        white-space: normal!important;
        max-width: 330px!important;
        margin: 14px auto 0!important;

        font-size: 11px!important;
        line-height: 1.7!important;
    }

    .footer-newsletter form {
        width: 100%!important;
        padding: 46px 0 0!important;
    }

    .footer-newsletter form:before {
        top: 8px!important;
        left: 0!important;
        width: 100%!important;

        font-size: 20px!important;
        text-align: center!important;
    }

    .footer-newsletter fieldset {
        display: grid!important;
        grid-template-columns: 1fr!important;
        gap: 11px!important;
    }

    .footer-newsletter .smart-label-wrapper {
        width: 100%!important;
        flex: none!important;
    }

    .footer-newsletter .smart-label-wrapper label {
        text-align: left!important;
        font-size: 12px!important;
        margin-bottom: 5px!important;
    }

    .footer-newsletter input[type="email"] {
        height: 44px!important;
    }

    .footer-newsletter .consents-first {
        width: 100%!important;
        flex: none!important;
        gap: 9px!important;
    }

    .footer-newsletter .consents-first input[type="checkbox"] {
        display: block!important;
        visibility: visible!important;
        opacity: 1!important;

        width: 18px!important;
        height: 18px!important;
        min-width: 18px!important;

        flex: 0 0 18px!important;
    }

    .footer-newsletter .consents-first label {
        font-size: 10px!important;
        line-height: 1.4!important;
    }

    .footer-newsletter button {
        width: 100%!important;
        min-width: 0!important;
        height: 44px!important;

        font-size: 11px!important;
        margin-top: 3px!important;
    }
}


/* =========================================================
   MALÝ TELEFON
   ========================================================= */

@media (max-width: 400px) {

    .footer-newsletter {
        padding: 28px 16px 27px!important;
    }

    .footer-newsletter .newsletter-header {
        padding-top: 72px!important;
    }

    .footer-newsletter .newsletter-header:before {
        width: 80px!important;
        height: 68px!important;
    }

    .footer-newsletter .newsletter-header h3 {
        font-size: 25px!important;
    }

    .footer-newsletter .newsletter-header p {
        font-size: 12px!important;
    }

    .footer-newsletter .newsletter-header p:after {
        font-size: 10px!important;
    }

    .footer-newsletter form {
        padding-top: 43px!important;
    }

    .footer-newsletter form:before {
        font-size: 18px!important;
    }

    .footer-newsletter .consents-first label {
        font-size: 9px!important;
    }
}
/* =========================================================
   MOBIL – SKRYTÍ PŮVODNÍCH TEXTŮ NEWSLETTERU
   ========================================================= */

@media (max-width: 700px) {

    /* Skryje původní "Odebírat newsletter" */
    .footer-newsletter .newsletter-header h3 {
        font-size: 0 !important;
        line-height: 0 !important;
        margin: 0 0 10px !important;
    }

    /* Zobrazí pouze nový nadpis */
    .footer-newsletter .newsletter-header h3:after {
        content: "Buďte v obraze" !important;
        display: block !important;

        font: 400 27px/1.15 Georgia,
        "Times New Roman", serif !important;

        color: #4d4037 !important;
    }


    /* Skryje původní text */
    .footer-newsletter .newsletter-header p {
        font-size: 0 !important;
        line-height: 0 !important;
    }

    /* Zobrazí pouze nový text */
    .footer-newsletter .newsletter-header p:before {
        content: "Novinky a inspirace ze světa La Vela" !important;
        display: block !important;

        font: 13px/1.5 "Open Sans",
        Arial, sans-serif !important;

        color: #806f62 !important;
    }
}


/* =========================================================
   MALÝ TELEFON
   ========================================================= */

@media (max-width: 400px) {

    .footer-newsletter .newsletter-header h3 {
        font-size: 0 !important;
        line-height: 0 !important;
    }

    .footer-newsletter .newsletter-header h3:after {
        font-size: 25px !important;
    }

    .footer-newsletter .newsletter-header p {
        font-size: 0 !important;
        line-height: 0 !important;
    }

    .footer-newsletter .newsletter-header p:before {
        font-size: 12px !important;
    }
}
/* =========================================================
   INSTAGRAM GALERIE – NADPIS NA MOBILU V JEDNOM ŘÁDKU
   ========================================================= */

@media (max-width: 550px) {

    .lavela-gallery-head h2 {
        font-size: 21px !important;
        line-height: 1.2 !important;
        white-space: nowrap !important;
        letter-spacing: -0.3px !important;
    }







document.addEventListener("DOMContentLoaded",function(){var p=location.pathname.replace(/\/+$/,"");if(p==="/personalizovana-svicka-se-jmenem-psa-darek-pro-milovniky-psu"||p==="/svicka-s-venovanim-a-vlastnim-potiskem"){document.querySelectorAll(".p-detail .flags-default,.p-detail .flags-under-image").forEach(function(e){e.remove()})}});





@media(max-width:767px){.header-info-bar{position:relative!important;z-index:1!important}#header{position:relative!important;z-index:100!important}.navigation-window,.navigation-window-visible{z-index:9999!important}}









