/*
Theme Name: Tecnoprogress ~ Camping Maso Trenti
Theme URI: https://tecnoprogress.net
Author: Francesco Nardelli
Author URI: https://tecnoprogress.net
Description: Tema per Camping Maso Trenti
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: campingmasotrenti
*/

@import url("./assets/css/variables.css");
@import url("./assets/css/common.css");
@import url("./assets/css/header.css");
@import url("./assets/css/footer.css");
@import url("./assets/css/homepage.css");
@import url("./assets/css/location-e-comfort.css");
@import url("./assets/css/campeggio.css");
@import url("./assets/css/embla.css");
@import url("./assets/css/piazzola.css");
@import url("./assets/css/post.css");
@import url("./assets/css/offerta.css");
@import url("./assets/css/contatti.css");
@import url("./assets/css/le-piazzole.css");
@import url("./assets/css/il-maso-racconta.css");
@import url("./assets/css/pacchetti-vacanza.css");
@import url("./assets/css/404.css");
@import url("./assets/css/mobile-button.css");
@import url("./assets/css/responsive.css");

html { margin-top:0 !important; scrollbar-width: none; }
#wpadminbar { opacity:0.1; transition:0.2s ease all; transform:translateY(-50%); }
#wpadminbar:hover { opacity:0.9; transform:translateY(0%); }

body { font-size:20px; color:var(--colore-5); background-color:var(--colore-2); font-family:var(--font-family-2-light); letter-spacing:0.5px; }
p { margin-top:0; margin-bottom:0; }
a { color:inherit; text-decoration:inherit; }

h1, h2, h3, h4, h5, h6 { margin-top:0; margin-bottom:0; }

.font-1 { font-family:var(--font-family-1); }
.font-2 { font-family:var(--font-family-2); }
.font-2-light { font-family:var(--font-family-2-light); font-weight:100; }
.font-3 { font-family:var(--font-family-3); }

.colore { height:64px; aspect-ratio:1/1; border-radius:50%; display:inline-block; border:1px solid black; }
.colore-1 { background-color:var(--colore-1); }
.colore-2 { background-color:var(--colore-2); }
.colore-3 { background-color:var(--colore-3); }
.colore-4 { background-color:var(--colore-4); }
.colore-5 { background-color:var(--colore-5); }

.tp-pulse {
    box-shadow: 0px 0px 0px 0px var(--colore-1);
    animation-name: pulseAnimation;
    animation-duration: 2s;
    animation-iteration-count: infinite;
}
.tp-pulse.open {
    box-shadow: 0px 0px 0px 0px var(--colore-2);
    animation-name: pulseAnimationOpen;
}
.tp-pulse.brown {
    box-shadow: 0px 0px 0px 0px var(--colore-4);
    animation-name: pulseAnimationBrown;
}
@keyframes pulseAnimation {
    0%, 50% { box-shadow: 0px 0px 0px 0px var(--colore-1); }
    100% { box-shadow: 0px 0px 0px 12px #7d806200; }
}
@keyframes pulseAnimationOpen {
    0%, 50% { box-shadow: 0px 0px 0px 0px var(--colore-2); }
    100% { box-shadow: 0px 0px 0px 12px #f6f1e800; }
}
@keyframes pulseAnimationBrown {
    0%, 50% { box-shadow: 0px 0px 0px 0px var(--colore-4); }
    100% { box-shadow: 0px 0px 0px 12px #a46f3d00; }
}

a.button {
    display:flex;
    align-items:center;
    padding:12px 28px;
    background-color:var(--colore-2);
    color:var(--colore-1);
    font-family:var(--font-family-1);
    text-transform:uppercase;
    transition:0.3s ease all;

    font-size:14px;
    font-weight:200;
    border-radius:49px;
    white-space:nowrap;
}
a.button.alt {
    background-color:var(--colore-4);
    color:var(--colore-2);
}
a.button.icon:before {
    content:'';
    display:inline-block;
    background-image:url('./assets/images/foglia.svg');
    background-size:contain;
    background-repeat:no-repeat;
    width:32px;
    height:18px;
    transition:0.3s ease all;
}
a.button.alt.icon:before {
    background-image:url('./assets/images/foglia-white.svg');
}
a.button:hover { background-color:var(--colore-1); color:var(--colore-2); }
a.button.alt:hover { background-color:var(--colore-2); color:var(--colore-4); }
a.button.icon:hover:before { filter: brightness(10); }
a.button.alt.icon:hover { color:black; }
a.button.alt.icon:hover:before { filter:invert(1); }

.to-1,
.from-1,
.from-1-to-2 { position:relative; }
.to-1:after {
    content:'';
    width:100%;
    position:absolute;
    bottom:-1px;
    left:0;
    background: #7D8062;
    background: linear-gradient(180deg,rgba(125, 128, 98, 0) 5%, rgba(125, 128, 98, 1) 95%);
}
.from-1:after {
    content:'';
    width:100%;
    position:absolute;
    bottom:-1px;
    left:0;
    background: #7D8062;
    background: linear-gradient(180deg,rgba(125, 128, 98, 1) 5%, rgba(125, 128, 98, 0) 95%);
}
.from-1-to-2:after {
    content:'';
    width:100%;
    position:absolute;
    bottom:-1px;
    left:0;
    background: #7D8062;
    background: linear-gradient(180deg,rgba(125, 128, 98, 1) 0%, rgba(246, 241, 232, 1) 100%);
}

section.alt {
    background-color:var(--colore-1);
}
section.alt-2 {
    background-color:var(--colore-3);
}

section.alt:has(+ section.alt) { margin-bottom:-1px; }

[on-click-link]:hover { cursor:pointer; }

.tp-hide { pointer-events:none; opacity:0; }

.whatsapp-button { position:fixed; bottom:22px; right:22px; border-radius:50%; box-shadow:0px 3px 16px 0px #FFFFFF88; }
.whatsapp-button .whatsapp-button-wrapper { background-color:#25d366; width:64px; height:64px; border-radius:50%; display:flex; justify-content:center; align-items:center; }
.whatsapp-button .whatsapp-button-wrapper .whatsapp-button-icon-wrapper { width:40px; height:40px; transform:translate(1px, -2px); }
.whatsapp-button .whatsapp-button-wrapper .whatsapp-button-icon-wrapper .whatsapp-button-icon { width:100%; height:100%; }