/* Comun */

.actividades-listado-container{
    display:flex;
    flex-direction: column;

    --taxonomia-108: #40BBD8; /* Adaptación al cambio climático*/
    --taxonomia-111: #E30A4F; /*Movilidad*/
    --taxonomia-113: #9E9C9F; /*Transversal*/
    --taxonomia-115: #A71968; /*Economía circular*/
    --taxonomia-116: #F29608; /*Energía*/
    --taxonomia-117: #94C120; /*Infraestructura verde*/

}

.actividades-listado-title{
    font-weight: 500;
    color: #000;
    text-align: center;
    font-size: 1.5rem;
    margin-bottom: 1.5rem;
}
.actividades-listado-title span{
    color: var(--e-global-color-secondary);
}

.actividades-listado-modo{
    display:flex;
    list-style: none;
    padding: 0.75rem 1.125rem;
    align-items: center;
    gap: 0.625rem;
    border-radius: 3.125rem;
    border: 1px solid #D7DADD;
    background: #FFF;
    margin: 0 auto;
}
.actividades-listado-modo li{

}
.actividades-listado-modo li a{
    display:block;
    padding: 0.5rem 1.25rem;
    border-radius: 3rem;
    background: #fff;
    color: #000;
    transition: all .3s;
}
.actividades-listado-modo a:hover,
.actividades-listado-modo a.active{
    background: #1E1E2F;
    color: #fff;
}

.actividades-dia{
    font-size: 2.25rem;
    font-weight: 500;
    color: #000;
    text-transform: uppercase;
    margin: 1.5rem 0;
}

.actividades-dia-vacio{
    font-size: 1.125rem;
    font-weight: 600;
}

.actividades-turno-div{
    display:flex;
    margin-bottom: 1.25rem;
}

/* Por dia */

.actividades-x-dia .actividades-turno{
    background: #E7E7E9;
    padding: 1.5625rem;
    margin-right: 1.5rem;
    color: #000;
    font-weight: 700;
    text-transform: uppercase;
    text-align:center;
    writing-mode: vertical-lr;
    font-size: 1.25rem;
}
.actividades-x-dia .actividades-turno div {
    transform: rotate(180deg);
}

.actividades-x-dia .actividades-turno-div.dia2099-01-01 .actividades-turno{
    display: none;
}

.actividades-x-dia .actividades-listado{
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    align-items: center;
    gap: 1.25rem;
    width: 100%;
}

.actividades-x-dia .actividades-listado .item{
    flex: 0 0 calc(20% - 1rem);
    color: #fff;
    background: #757575;
    padding: 1.125rem 1.125rem;
}
.actividades-x-dia .actividades-listado .item .item-inner{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    aspect-ratio: 1 / 1;
}
.actividades-x-dia .actividades-listado .item .abreviatura{
    display: block;
    flex: 0 0 1%;
    font-weight: 300;
    font-size: 1.125rem;
    line-height: 1.3;
}
.actividades-x-dia .actividades-listado .item .alias{
    display: block;
    max-height: 6rem;
    overflow: hidden;
    font-weight: 500;
    font-size: 1.125rem;
    line-height: 1.3;
}
.actividades-x-dia .actividades-listado .item .horas{
    display: block;
    flex: 0 0 1%;
    font-weight: 300;
    font-size: 1.125rem;
    line-height: 1.3;
}
.actividades-x-dia .actividades-listado .item .sala{
    display: block;
    font-weight: 400;
    font-size: 1rem;
    line-height: 1;
}

/* Colores */

.actividades-x-dia .actividades-listado .item.taxonomia-116{ background: var(--taxonomia-116); }
.actividades-x-dia .actividades-listado .item.taxonomia-111{ background: var(--taxonomia-111); }
.actividades-x-dia .actividades-listado .item.taxonomia-81 { background: var(--taxonomia-81); }
.actividades-x-dia .actividades-listado .item.taxonomia-114{ background: var(--taxonomia-114); }
.actividades-x-dia .actividades-listado .item.taxonomia-117{ background: var(--taxonomia-117); }
.actividades-x-dia .actividades-listado .item.taxonomia-108{ background: var(--taxonomia-108); }
.actividades-x-dia .actividades-listado .item.taxonomia-110{ background: var(--taxonomia-110); }
.actividades-x-dia .actividades-listado .item.taxonomia-115{ background: var(--taxonomia-115); }
.actividades-x-dia .actividades-listado .item.taxonomia-113{ background: var(--taxonomia-113); }
.actividades-x-dia .actividades-listado .item.taxonomia-128{ background: var(--taxonomia-128); }
.actividades-x-dia .actividades-listado .item.taxonomia-129{ background: var(--taxonomia-129); }
.actividades-x-dia .actividades-listado .item.taxonomia-130{ background: var(--taxonomia-130); }

/* Listado */
.actividades-x-listado .actividades-turno-div{
    align-items: flex-start;
}
.actividades-x-listado .actividades-turno{
    width: 200px;
    flex-shrink: 0;
    background: #E7E7E9;
    padding: 1.5625rem;
    margin-right: 4rem;
    color: #000;
    font-weight: 700;
    text-transform: uppercase;
    text-align:center;
    font-size: 1.25rem;
}
.actividades-x-listado .actividades-turno div {
}

.actividades-x-listado .actividades-listado .item{
    display: flex;
    align-items: center;
    margin: 0 0 1.25rem 0;
}
.actividades-x-listado .actividades-listado .item .circle{
    display:block;
    width: 100px;
    height: 100px;
    border-radius: 100px;
    margin-right: 2rem;
    flex-shrink: 0;
    background: #757575;
}
.actividades-x-listado .actividades-listado .item .abreviatura{
    display: block;
    color: #1E1E2F;
    font-size: 1.25rem;
}
.actividades-x-listado .actividades-listado .item .alias{
    display: block;
    color: #000;
    font-size: 2rem;
    font-weight: 500;
    line-height: 1.167;
}
.actividades-x-listado .actividades-listado .item .horas{
    display: block;
    color: #7A7A7A;
}

/* Colores */

.actividades-x-listado .actividades-listado .item.taxonomia-116 .circle{ background: var(--taxonomia-116); }
.actividades-x-listado .actividades-listado .item.taxonomia-111 .circle{ background: var(--taxonomia-111); }
.actividades-x-listado .actividades-listado .item.taxonomia-81  .circle{ background: var(--taxonomia-81); }
.actividades-x-listado .actividades-listado .item.taxonomia-114 .circle{ background: var(--taxonomia-114); }
.actividades-x-listado .actividades-listado .item.taxonomia-117 .circle{ background: var(--taxonomia-117); }
.actividades-x-listado .actividades-listado .item.taxonomia-108 .circle{ background: var(--taxonomia-108); }
.actividades-x-listado .actividades-listado .item.taxonomia-110 .circle{ background: var(--taxonomia-110); }
.actividades-x-listado .actividades-listado .item.taxonomia-115 .circle{ background: var(--taxonomia-115); }
.actividades-x-listado .actividades-listado .item.taxonomia-113 .circle{ background: var(--taxonomia-113); }
.actividades-x-listado .actividades-listado .item.taxonomia-128 .circle{ background: var(--taxonomia-128); }
.actividades-x-listado .actividades-listado .item.taxonomia-129 .circle{ background: var(--taxonomia-129); }
.actividades-x-listado .actividades-listado .item.taxonomia-130 .circle{ background: var(--taxonomia-130); }

/* Medium devices (vertical tablets) */
@media (max-width: 991px) {

}

/* Small devices (landscape phones)  */
@media (max-width: 767px) {

}

/* Small devices (vertical phones) */
@media (max-width: 575px) {
    .actividades-dia{
        text-align: center;
    }
    .actividades-x-dia .actividades-listado{
        align-items: stretch;
    }
    .actividades-x-dia .actividades-turno-div{
        flex-direction: column;
    }
    .actividades-x-dia .actividades-turno {
        margin: 0 0 1.25rem 0;
        writing-mode: initial;
    }
    .actividades-x-dia .actividades-turno div {
        transform: unset;
    }
    .actividades-x-dia .actividades-listado .item {
        flex: 0 0 calc(50% - 0.625rem);
    }
    .actividades-x-dia .actividades-listado .item .item-inner{
        aspect-ratio: unset;
        height: 100%;
    }

    .actividades-x-listado .actividades-turno-div{
        flex-direction: column;
    }
    .actividades-x-listado .actividades-turno{
        width: 100%;
        margin: 0 0 1rem 0;
    }
    .actividades-x-listado .actividades-listado .item{
        align-items: flex-start;
    }
    .actividades-x-listado .actividades-listado .item .circle{
        width: 60px;
        height: 60px;
        margin-right: 1rem;
    }
}