/* -------------------------------------
// elementos
------------------------------------- */

.weather-cast{
    /*animation: floating 2s ease-in-out infinite;*/
}
.weather-cast.weather-cast--sun{
    background: url(../../../img/inicio/weather/sun.svg) top left no-repeat;
}
.weather-cast.weather-cast--sun-white-cloud{
    background: url(../../../img/inicio/weather/sun-white-cloud.svg) top left no-repeat;
}
.weather-cast.weather-cast--gray-cloud{
    background: url(../../../img/inicio/weather/sun-gray-cloud.svg) top left no-repeat;
}
.weather-cast.weather-cast--cloud{
    background: url(../../../img/inicio/weather/cloudy.svg) top left no-repeat;
}
.night-time .weather-cast{
    background: url(../../../img/inicio/weather/moon.svg) top left no-repeat;
}

/* estimacion solar */
.estimated-power-box{
    position: absolute;
    width: 3.75%;
    height: 31.3%;
    overflow: hidden;
    bottom: 4.3%;
    left: 5.8%;
    z-index: 2;
}
.estimated-power-box__fill{
    background: rgba(255,244,128,1);
    background: -moz-linear-gradient(top, rgba(255,244,128,1) 0%, rgba(242,193,121,1) 100%);
    background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,244,128,1)), color-stop(100%, rgba(242,193,121,1)));
    background: -webkit-linear-gradient(top, rgba(255,244,128,1) 0%, rgba(242,193,121,1) 100%);
    background: -o-linear-gradient(top, rgba(255,244,128,1) 0%, rgba(242,193,121,1) 100%);
    background: -ms-linear-gradient(top, rgba(255,244,128,1) 0%, rgba(242,193,121,1) 100%);
    background: linear-gradient(to bottom, rgba(255,244,128,1) 0%, rgba(242,193,121,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fff480', endColorstr='#f2c179', GradientType=0 );
    width: 100%;
    position: absolute;
    left: 0;
    bottom: 0;
}
.estimated-power-box-numbers{
    position: absolute;
    right: 95%;
    bottom: 3%;
    text-align: right;
    font-size: 1.125rem;
    font-weight: bold;
    height: 32.5%;
    color:#000;
}
.night-time .estimated-power-box-numbers{
    color:#fff;
}
.estimated-power-box-numbers div{
    height: 18%;
}



/* panel solar 1 */
.solar-panel-1{
    background: url(../../../img/inicio/solar-panels/solar-panel-1.svg) top left no-repeat;
    opacity: 0.9;
    /*transform: rotate(15deg);*/
    transform: skew(-40deg, 20deg);
    left: -12%;
    width: 125%;
}
.solar-panel-1.panel-tejado {
    top: 14%;
}
.solar-panel-1.panel-tejado2 {
    top: 7%;
}
.solar-panel-1.panel-tejado3 {
    top: 0%;
}
.solar-panel-1.panel-parking {
    top: 45%;
}
.solar-panel-1.panel-parking2 {
    top: 38%;
}
.solar-panel-1.panel-parking3 {
    top: 28%;
}
.solar-panel-1.panel-leyenda {
    background: url(../../../img/inicio/solar-panels/solar-panel-1.svg) no-repeat;
    top: 18%;
    background-position-x: 24.4%;
    background-position-y: 26%;
    height: 100%;
    background-size: 643.4%;
    position: relative;
}
.solar-panel-1__flow-right{
    background: url(../../../img/inicio/solar-panels/solar-panel-1__flow-right.svg) top left no-repeat;
}
.solar-panel-1__flow-down{
    background: url(../../../img/inicio/solar-panels/solar-panel-1__flow-down.svg) top left no-repeat;
}
.night-time .solar-panel-1,
.solar-panel-1--off{
    opacity:.35;
    background-image: url(../../../img/inicio/solar-panels/solar-panel-1--off.svg);
}
.night-time .solar-panel-1 *,
.solar-panel-1--off *{
    display: none;
}

/* panel solar 2 */
.solar-panel-2{
    z-index: 2;
    background: url(../../../img/inicio/solar-panels/solar-panel-2.svg) top left no-repeat;
}
.solar-panel-2__flow-right{
    background: url(../../../img/inicio/solar-panels/solar-panel-2__flow-right.svg) top left no-repeat;
}
.solar-panel-2__flow-down{
    background: url(../../../img/inicio/solar-panels/solar-panel-2__flow-down.svg) top left no-repeat;
}
.solar-panel-2__flow-down-2{
    background: url(../../../img/inicio/solar-panels/solar-panel-2__flow-down-2.svg) top left no-repeat;
}
.night-time .solar-panel-2,
.solar-panel-2--off{
    opacity:.35;
    background-image: url(../../../img/inicio/solar-panels/solar-panel-2--off.svg);
}
.night-time .solar-panel-2 *,
.solar-panel-2--off *{
    display: none;
}

/* generador 1 */
.generator{
    background: url(../../../img/inicio/generator/generator.svg) top left no-repeat;
}
.generator__flow-right{
    background: url(../../../img/inicio/generator/generator__flow-right.svg) top left no-repeat;
}
.generator__flow-up{
    background: url(../../../img/inicio/generator/generator__flow-up.svg) top left no-repeat;
}
.generator--off{
    opacity:.35;
    background-image: url(../../../img/inicio/generator/generator--off.svg);
}
.generator--off *{
    display: none;
}

/* torre electrica */
.transmission-tower{
    /*display: none;*/
    background: url(../../../img/inicio/transmission-tower/transmission-tower.svg) top left no-repeat;
    background-size: 75% !important
}
.transmission-tower__flow-right{
    background: url(../../../img/inicio/transmission-tower/transmission-tower__flow-right.svg) top left no-repeat;
}
.transmission-tower__flow-up{
    background: url(../../../img/inicio/transmission-tower/transmission-tower__flow-up.svg) top left no-repeat;
}
.transmission-tower--off{
    opacity:.35;
    background-image: url(../../../img/inicio/transmission-tower/transmission-tower--off.svg);
}
.transmission-tower--off *{
    display: none;
}
.transmission-tower.towerLeyenda{
    background: url(../../../img/inicio/transmission-tower/transmission-tower.svg) no-repeat;
    top: 18%;
    background-position-x: 25.8%;
    background-position-y: 59.7%;
    height: 100%;
    background-size: 980.6% !important;
    position: relative;
}
.power-transmission-tower .transmission-tower{
    display: block;
}
.power-transmission-tower .generator{
    display: none;
}

/* inversor */
.inversor{
    background-image: url(../../../img/inicio/loose-parts/inversor.svg);
}
.inversor__flow-right{
    background: url(../../../img/inicio/loose-parts/inversor__flow-right.svg) top left no-repeat;
}

/* consumos */
.power-consumption-box{
    position: absolute;
    width: 4.05%;
    height: 53.2%;
    overflow: hidden;
    bottom: 14.3%;
    left: -25%;
    z-index: 2;
}
.power-consumption-box__fill{
    width: 100%;
    position: absolute;
    left: 0;
    bottom: 0;
}
.power-consumption-box-numbers{
    position: absolute;
    right: 27%;
    bottom: 13.5%;
    text-align: right;
    font-size: 1.125rem;
    font-weight: bold;
    height: 54.5%;
    color:#000;
}
.night-time .power-consumption-box-numbers{
    color:#fff;
}
.power-consumption-box-numbers div{
    height: 23.5%;
}
.power-consumption-box-arrow{
    background-image: url(../../../img/inicio/sectors/sector-arrow-black.svg);
}
.night-time .power-consumption-box-arrow{
    background-image: url(../../../img/inicio/sectors/sector-arrow-white.svg);
}
.power-consumption-type.power-consumption-type-agricultural{
    background-image: url(../../../img/inicio/sectors/sector-agricultural.svg);
}
.power-consumption-type.power-consumption-type-domestic{
    background-image: url(../../../img/inicio/sectors/sector-domestic.svg);
}
.power-consumption-type.power-consumption-type-industrial{
    background-image: url(../../../img/inicio/sectors/eringenieria.svg);
}

/* ---- Doble barra Generación / Consumo ---- */
.dual-power-bar {
    position: absolute;
    left: 70%;
    bottom: 8%;
    height: 70%;
    width: 11%;
    display: flex;
    flex-direction: column;
    z-index: 3;
}
.dual-power-bar__titles {
    display: flex;
    height: 10%;
    align-items: flex-end;
    text-align: center;
    font-size: 0.78rem;
    font-weight: bold;
    padding-bottom: 0.3rem;
    width: calc(100% + 5px);
    overflow: hidden;
}
.dual-power-bar__title--gen {
    flex: 1;
    color: #fff;
    padding-left: 2.5px;
    word-break: break-word;
    line-height: 1.1;
    margin-left: -4px;
}
.dual-power-bar__title--scale {
    flex: 0.6;
}
.dual-power-bar__title--con {
    flex: 1;
    color: #fff;
    word-break: break-word;
    line-height: 1.1;
    margin-left: -6px;
}
.dual-power-bar__bars-wrap {
    flex: 1;
    display: flex;
    min-height: 0;
    gap: 2px;
    position: relative;
    padding: 0 4px;
}
.dual-power-bar__bar {
    flex: 0.75;
    position: relative;
    overflow: hidden;
    background: rgba(255,255,255,0.15);
    border-radius: 0.2rem;
    border: 1px solid black;
}
.dual-power-bar__bar:last-child {
    flex: 0.75;
}
.dual-power-bar__fill--gen {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    min-height: 2px;
}
.dual-power-bar__fill--con {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    min-height: 2px;
}
.dual-power-bar__bar::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' preserveAspectRatio='none'%3E%3Cline x1='0' y1='10' x2='100' y2='10' stroke='rgba(0,0,0,0.7)' stroke-width='1' stroke-dasharray='5,4'/%3E%3Cline x1='0' y1='20' x2='100' y2='20' stroke='rgba(0,0,0,0.7)' stroke-width='1' stroke-dasharray='5,4'/%3E%3Cline x1='0' y1='30' x2='100' y2='30' stroke='rgba(0,0,0,0.7)' stroke-width='1' stroke-dasharray='5,4'/%3E%3Cline x1='0' y1='40' x2='100' y2='40' stroke='rgba(0,0,0,0.7)' stroke-width='1' stroke-dasharray='5,4'/%3E%3Cline x1='0' y1='50' x2='100' y2='50' stroke='rgba(0,0,0,0.7)' stroke-width='1' stroke-dasharray='5,4'/%3E%3Cline x1='0' y1='60' x2='100' y2='60' stroke='rgba(0,0,0,0.7)' stroke-width='1' stroke-dasharray='5,4'/%3E%3Cline x1='0' y1='70' x2='100' y2='70' stroke='rgba(0,0,0,0.7)' stroke-width='1' stroke-dasharray='5,4'/%3E%3Cline x1='0' y1='80' x2='100' y2='80' stroke='rgba(0,0,0,0.7)' stroke-width='1' stroke-dasharray='5,4'/%3E%3Cline x1='0' y1='90' x2='100' y2='90' stroke='rgba(0,0,0,0.7)' stroke-width='1' stroke-dasharray='5,4'/%3E%3C/svg%3E");
    background-size: 100% 100%;
    z-index: 5;
    pointer-events: none;
    border-radius: inherit;
}
.dual-power-bar__scale {
    flex: 0.6;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    font-size: 0.75rem;
    font-weight: bold;
    color: #000;
    padding: 0 2px;
}
.night-time .dual-power-bar__scale {
    color: #fff;
}
.dual-power-bar__legend {
    height: 22%;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 0.25rem 0.5rem;
    padding-top: 0.6rem;
}
.dual-power-bar__legend--top {
    position: absolute;
    left: 70%;
    bottom: calc(8% + 70% + 1%);
    width: 11%;
    height: auto;
    padding: 0.3rem 0.4rem;
    z-index: 4;
    background: #4793ad;
    border-radius: 0.25rem;
}
.dual-power-bar__legend--top .dual-power-bar__legend-item {
    color: #fff;
    font-size: 1rem;
}
.dual-power-bar__legend--top .dual-power-bar__legend-dot {
    width: 0.8rem;
    height: 0.8rem;
}
.night-time .dual-power-bar__legend--top .dual-power-bar__legend-item {
    color: #fff;
}

.dual-power-bar__legend-item {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.75rem;
    font-weight: bold;
    color: #000;
    white-space: nowrap;
}
.night-time .dual-power-bar__legend-item {
    color: #fff;
}
.dual-power-bar__legend-dot {
    display: inline-block;
    width: 0.55rem;
    height: 0.55rem;
    border-radius: 0.1rem;
    flex-shrink: 0;
}


/* reloj */
.watch{
    background: url(../../../img/inicio/watch/fondoReloj.png) top left no-repeat;
    background-size: 100% auto;
    position: absolute;
    top: 14%;
    right: 3%;
    width: 10.6%;
    height: 28.1%;
}
.watch__small-watch-needle,
.watch__big-watch-needle{
    position: absolute;
    left: 0;
    top:0;
    width: 100%;
    height: 100%;
}
.watch__big-watch-needle{
    z-index: 2;
    background: url(../../../img/inicio/watch/watch__big-watch-needle.svg) top left no-repeat;
}
.watch__small-watch-needle{
    z-index: 2;
    background: url(../../../img/inicio/watch/watch__small-watch-needle.svg) top left no-repeat;
}

.overlay-graphics{
    z-index: 3;
    background: url(../../../img/inicio/loose-parts/graphic-lines.svg) top left no-repeat;
}

.info-box_logo_bat {
    z-index: 3;
    background: url(../../../img/inicio/batteryIconVerde.svg) top left / 100% auto no-repeat;
    width: 23%;
    height: 15%;
    position: absolute;
    margin-left: 10%;
    margin-top: 3%;
}
.info-box_logo_placa {
    z-index: 3;
    background: url(../../../img/inicio/loose-parts/fondo_placa.png) top left no-repeat;
    width: 23%;
    height: 15%;
    position: absolute;
    background-size: 100%;
    margin-left: 10%;
    margin-top: 3%;
}
.info-box_logo_tn {
    z-index: 3;
    background: url(../../../img/inicio/loose-parts/fondo_fabrica.png) top left no-repeat;
    width: 22%;
    height: 20%;
    position: absolute;
    background-size: 100%;
    margin-left: 10%;
}
.info-box_logo_red {
    z-index: 3;
    background: url(../../../img/inicio/transmission-tower/transmission-tower.svg) no-repeat;
    background-position-x: 25.8%;
    background-position-y: 59.7%;
    background-size: 990.6%;
    width: 38%;
    height: 25%;
    position: absolute;
    margin-left: 5%;
    margin-top: -6%;
}
.info-box_logo_arboles {
    z-index: 3;
    background: url(../../../img/inicio/loose-parts/fondo_arboles.png) top left no-repeat;
    width: 18%;
    height: 20%;
    position: absolute;
    background-size: 100%;
    margin-left: 10%;
}

/* Torre de red (icono de la red electrica) — esquina superior derecha.
   margin-left para mover izq/dcha, margin-top negativo para subir. */
.desplazar_derecha_fondo {
    margin-left: -1%;
    margin-top: -12%;
}