/*
Theme Name: Zento Child
Theme URI: https://estudiopatagon.com/projects/zento-for-wordpress/
Author: EstudioPatagon
Author URI: https://estudiopatagon.com/
Description:  Child theme, based on Zento
Template: zento

*/


.notice.text {
    background:#068727!important;
    line-height: 1.3!important;
    font-size: 14px!important;
    border-bottom: 0px solid var(--epcl-boxes-border-color)!important; 
}


.prognose-guide {
color: #066c87
} 

.prognose-guide:hover {
    text-decoration: underline;
}

/* Add your custom code just below */
@media screen and (min-width: 1024px) {
    .grid-60 {
        width: 70%!important;
    }
}

@media screen and (max-width: 767px) {
    .title.ularge {margin-bottom: 25px!important;}
     #header .grid-wrapper {padding: 7px 20px !important;}
     .title ularge fw-medium {text-align: left!important;font-size:13px!important;}

}


div.text ol, div.text ul {
    margin: 0 0 0 8px!important;
}

.title.medium {
    font-size: 22px;
}

div.text h2 {
    padding-top: 20px;
    margin-bottom: 5px;
    line-height: 1.4;
}

.intro-text {
    padding-left: 0;
    padding-right: 0;
}
.intro-text .right {
    margin-top: 105px;
    margin-left: 15px;
}

.epcl-weather-module{
    margin-top: 30px;
}
.epcl-weather-module #location-select{
    border: 1px solid var(--epcl-border-color);
    margin: 0 !;
}
.epcl-weather-module.selected-location #location-select,
.epcl-weather-module.selected-location .select2{
    display: none;
}
.epcl-weather-module .location-item{ display: none; }
.epcl-weather-module .location-item[data-index="0"]{ display: table-row; }
.epcl-weather-module .last-update small{
    /* background: #fff; */
    color: var(--epcl-main-color); 
    /* border: 1px solid rgba(0, 0, 0, 0.02); */
    padding: 5px 10px;
    border-radius: 5px;;
}

/* Select2 */

.epcl-weather-module .select2-container{
    margin-bottom: 15px;
    font-size: 17px;
    color: var(--epcl-text-color); 
}
.epcl-weather-module .select2-container--default .select2-selection--single,
.epcl-weather-module .select2-container--default .select2-selection--single .select2-selection__arrow{
    height: 50px;
}
.epcl-weather-module .select2-container--default .select2-selection--single .select2-selection__rendered{
    line-height: 50px;
}
.epcl-weather-module .select2-container--default .select2-selection--single,
.select2-container--default .select2-search--dropdown .select2-search__field,
.select2-dropdown{
    border-color: var(--epcl-border-color) !important;
}
.select2-container--default .select2-results__option--highlighted[aria-selected]{
    background-color: var(--epcl-main-color) !important;
}
.select2-results__option {
    padding: 2px!important;
    padding-left: 7px!important;
}
 
.select2-container--default .select2-selection--single {

    border-radius: 12px!important;
}
div.text .epcl-weather-module table{
    border: 0;
    border-collapse: collapse;
    width: 100%; /* Ensure table takes up the full width */
    table-layout: auto; /* Keep the default table layout */

}
div.text .epcl-weather-module table th,
div.text .epcl-weather-module table td{
    padding: 10px 6px 10px 6px; /* Top, Right, Bottom, Left */
    border: 0;
    line-height: 1.6;
    font-size: 13px;
}
div.text .epcl-weather-module table th{
    line-height: 1.3;
    text-align: center; /* Ensure text in header cells is left-aligned */
}
div.text .epcl-weather-module table td span{
    display: inline-block;
    padding: 4px 8px;
    border-radius: 5px;
    background: #cccaca;
    white-space: nowrap;
}
div.text .epcl-weather-module table td.day{
    padding-left: 0;
    padding-right: 0;
}
div.text .epcl-weather-module table td.day span{
    background: none;
    padding: 0;
    padding-right: 10px;
}
div.text .epcl-weather-module table td.amber-high-chance span{
    background: #2f642f; color: white; width: 51px;
}
div.text .epcl-weather-module table td.amber-medium-chance span{
    background: #ddb218; color: white; width: 51px;
}
div.text .epcl-weather-module table td.amber-low-chance span{
    background: #a51a13; color: white; width: 51px;
}
div.text .epcl-weather-module table td.lowhigh1 span{
    background: #cec8bc;
}
div.text .epcl-weather-module table td.lowhigh2 span{
    background: #cec8bc;
}

div.text .epcl-weather-module table td.waveheight span{
    background: #cccaca;
}


#single.fullcover .left-content {margin-top: -175px!important;}

/* Wrapper for the table to enable horizontal scrolling */
.responsive-table {
    overflow-x: auto;
    display: block;
    margin-bottom: 20px;
    width: 100%; /* Ensure the wrapper takes full width */
}

/* Sticky first column */
div.text .epcl-weather-module table th:first-child,
div.text .epcl-weather-module table td:first-child {
    position: sticky;
    left: 0;
    background: #eee; /* Background for sticky columns */
    z-index: 2;
    min-width: 80px; /* Custom width for the first column */
    width: 80px;
    background: linear-gradient(90deg, rgba(238,238,238,1) 80%, rgba(238,238,238,0) 100%);
}

/* bg box shadow */
.bg-box {box-shadow: 0px 3px 3px 0px rgba(0, 0, 0, 0.03);}

/* decoration counter */
.epcl-decoration-counter {
    width: 25px;
    height: 25px;
    line-height: 24px;
    font-size: 13px;
}

/* Footer */
.widget_nav_menu ul>li {border-bottom:none;padding-bottom:6px;margin-bottom:6px;}
#footer {background: linear-gradient(to top, #29303a, #333b47);}
.grid-container {padding-top: 40px;}
#footer .published {margin: 50px 20px 20px;}


/* Black search icon */
#header .epcl-search-button svg {color: black;}

/* Cursor Animation */

.sticky-wrapper{
    transform: translateZ(0);
}
.responsive-table{
    position: relative;
    z-index: 2;
}
.epcl-cursor-animation{
    position: fixed;
    right: 0;
    top: 0;
    height: 100%;
    width: 100px;
    /* height: 200px; */
    background: #eee;
    background: linear-gradient(90deg, rgba(238,238,238,0) 5%, rgba(238,238,238,1) 100%);
    z-index: 2;
    opacity: 1;
    transition: all 300ms ease;
    overflow: hidden;
    pointer-events: none;
}
.epcl-cursor-animation.removed{
    opacity: 0;
    visibility: hidden;
}
.swipe-text{
    position: sticky;
    left: 0;
    bottom: 10px;
    text-align: right !important;
    z-index: 10;
}
.promptBox {
	height: 30px;
	width: 30px;
	transform: translate(-50%, -50%);
	position: absolute;
	top: 50%;
	right: -15px;
	opacity: 1;
	transition: 300ms;
	pointer-events: none;
	z-index: 1000;
}

.tapperoo {
	height: 48px;
	width: 100px;
	position: absolute;
	top: -5px;
	left: 15px;
	border-radius: 100px;
	background-color: #066c87;
	z-index: -1;
	animation: tapperoo 3s infinite ease;
}

@keyframes tapperoo {
	0% {
		height: 25%;
		width: 25%;
	}

	50% {
		height: 5%;
		width: 35%;
		opacity: 0;
		transform: translate(-250%);
	}

	100% {
		opacity: 0;
	}
}

#tap-gesture {
	position: absolute;
	transform: rotate(30deg);
	animation: handMove 3s infinite ease;
}

@keyframes handMove {
	0% {
		transform: rotate(30deg);
	}

	50% {
		transform: translate(-60%, -10%) rotate(-30deg) scale(0.9);
	}

	100% {
		transform: rotate(30deg);
	}
}


/* Vertical Table & Mobile */

@media (max-width: 1023px) {
    .intro-text .left{ width: auto; }
    .intro-text .right{  display: none;}  
    .intro-text .right.mobile-only{
        display: block !important;
        margin: 0 auto 25px;
        /* width: 45%; */
        float: none;
    }
}

@media (max-width: 767px) {
    .responsive-table {
        max-width: calc(100vw - 40px);
        overflow-x: auto;
    }
        .mobile-grid-60 {
        float: left;
        width: 90%;
    }
}



/*
a {
    position: relative;
    text-decoration: none;  
    color: #056c89;  
}

a::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 1.5px;  
    background-color:#056c89;  
    transform: scaleX(0); 
    transform-origin: left;  
    transition: transform 0.35s ease;
}

a:hover::after {
    transform: scaleX(1);  
}
*/