/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) {

}

/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {
}
/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {
}

/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {	
}

/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {

}

@media screen and (min-width: 320px) and (max-width: 767px) and (orientation: portrait) {


}

@media (width <= 991.98px) {
    .footer .grid-child {
       flex-direction: row;
    }
}

@media only screen and (max-width: 932px) {
    .container-header .mod-menu>li+li {
		margin-left: 0.5em;
	}
    .menu-horizontal img {
        max-width: 25px;
        max-height: 25px;
        margin: 0 auto 5px;
    }
    .menu-horizontal span {
        font-size: 0.9em;
    }
    .logo-centro {
        max-width: 75px;
    }
    .grid-child.container-nav {
        margin-right: 0;
    }
    .container-header .grid-child{
        padding: .3rem .5rem;
    }
    .contGrupoIdioma {
        gap: 0.2em;
        margin-left: 1em;
        margin-top: 0;
        flex-direction: row;
        align-items: center;
    }
    .contunidades {
        gap: 1em;
    }
    .enlaceuni {
        color: #FFF;
        font-weight: 700;
        font-size: 1rem;
        padding: 0;
    }
    #enlaceTitCat{
        cursor: pointer;
        height: 70lvh;
    }
    .back-button i {
        font-size: 3rem;
    }
    .aulah2unidad {
        text-transform: uppercase;
        font-weight: 900;
        font-size: 2rem;
        margin-left: .1em;
    }
    .activity-title {
        font-weight: 900;
        font-size: 1.2em;
        margin: 0.5em 0;
    }
    .unioptions img {
        max-width: 35px;
    }
    .unioptions span {
        font-size: .8em;
    }
    .unicabecera{
        margin-bottom: 1.5em;
        padding: .5em 1em 0;
    }
    .contunidad {
        height: 100%;
        background: #fff;
        border-radius: 1em;
        height: 100%;
        background: #fff;
        border-radius: 1em;
        justify-content: start;
        flex-direction: column;
        display: flex;
    }
    .aulaGrupo{
        margin: .5em 0;
    }
    .progress-bar-custom{
        font-size: .8em;
    }
    .nombre-estudiante{
        font-size: .8em;
    }
    span.alumnTitle {
        font-size: 1.5em;
        font-weight: 800;
    }
    .profile-download img {
        max-width: 25px;
    }
    .aulaprogunihead {
        font-weight: 900;
        font-size: .8em;
        margin-bottom: .5em;
    }
    .cabeceraProg {
        margin-top: .5em;
    }
    .listadoprogresos {
        max-height: 70lvh;
    }
    .aulaj{
        display: none;
    }
    .progress-container{
        height: 20px;
    }
    .tarea-titulo {
        width: 60%;
    }
    .panel-options {
        grid-gap: 1em;
    }
    .fw-bold-aulaEncabezado {
        font-weight: 900;
        font-size: 1.5em;
    }
    h3.d-flex.align-items-center.gap-2.fw-bold-aulaEncabezado svg {
        width: 30px;
    }
    h3.d-flex.align-items-center.gap-2.fw-bold-aulaEncabezado {
        margin-bottom: 0;
    }
    .curButton {
        float: left;
        display: block;
        padding: 0.4em 0.1em;
        font-size: 0.8rem;
    }
    .selGrupoProfe {
        font-size: 0.8rem;
    }
    .cont-filtros {
        padding: 0 1em 0.5em;
    }
    #addnewmens, #addnew {
        padding: 0.5em;
        font-size: 1em;
    }
    #add-txtmens {
        margin-top: 0.5em;
    }
    .cabeceramensajes, .cabeceratareas { 
        padding: 0.5em;
    }
    .info-miaula, .image-title{
        margin-bottom: 0;
    }
    .panel-cont {
        margin-top: 1em;
    }
    .opt-img {
        max-width: 120px;
    }
    .cont-gestaula{
        font-size: 0.8rem;
    }
    .containerBandeja {
        max-height: calc(100vh - 50vh);
        overflow: auto;
        padding-left: 1em;
    }
    .form-control {
        padding: .3rem 1rem;
    }
    .selCurButton {
        margin: 0 0.2em;
    }
    #profesorGlobal {
        max-width: 20vw;
    }
    .cabeceragestion{
        padding: 0.5em 1em;
    }
    .divBuscar {
        display: none;
    }
    .panel-options .image-title{
        font-size: 1em;
    }
    .avatarImg {
        max-width: 130px;
    }
    #mod-aulanotificaciones{
        display: none;
    }
    .contaula main {
        min-height: calc(100vh - 30vh);
    }
    .cont-gestaula {
        max-height: calc(100vh - 30vh);
    }
    .gestalum {
        max-height: calc(100vh - 55vh);
    }
    .col-md-2 {
        flex: none;
        width: 16.6667%;
    }
    .swal2-popup.selectCursosProf {
    width: 80dvw !important;
    max-width: none !important;
    }
    .aula-summary{margin-top:14px;text-align:left;font-size:.8em;line-height:1.45}
    .aula-summary__title{margin-bottom:10px;color:#444;font-weight:600; text-align: center;font-size:1rem;}
    .aula-summary__subtitle{display:none;}
    .aula-summary__head{display:flex;justify-content:space-between;gap:8px;padding:0.2rem;border:1px solid #ccc;background:#f7f7f7;border-radius:6px 6px 0 0}
    .aula-summary__head .aula-summary__cell{font-weight:600}
    .aula-summary__body{border:1px solid #ccc;border-top:0;border-radius:0 0 6px 6px}
    .aula-summary__row{display:flex;justify-content:space-between;gap:8px;padding:0.2rem;border-top:1px solid #eee}
    .aula-summary__cell{ }
    .aula-summary__cell--count{min-width:72px;text-align:right}
    .aula-summary__row.is-context .aula-summary__cell{font-weight:700;text-decoration:underline}
    /* Mensaje superior */
    .aula-summary__msg{margin:0 0 12px;font-size:15px}

}

@media only screen and (min-width: 1025px) and (max-width: 1366px) {
}

@media only screen and (min-width: 1364px) and (max-width: 1680px) {
}

@media screen and (min-width: 320px) and (max-width: 1192px) and (orientation: landscape) {
	#rotate{
		display: none;
	}
    .swal2-warning
    {
        display: none !important;
    }

}

@media screen and (min-width: 320px) and (max-width: 767px) and (orientation: portrait) {
	#wrapper, header, footer, .site-grid {
	    display: none;
	}
    .acceso-elemental #wrapper, .acceso-elemental header, .acceso-elemental footer{
	    display: block;
    }
    .acceso-elemental .site-grid {
        display: grid;
    }
    .head-login img {
        max-width: 60dvw;
    }
    .btn-pastel {
        width: 90%;
    }
	#rotate{
		display: block;
		margin: 0 auto;
		height: 100%;
		text-align: center;
	}
	#rotate img{
		margin-top: 34vh;
	    width: 30vh;
	}
    /* 1. Overlay fullscreen que bloquea todo */
    #rotator-overlay {
    position: fixed;
    top: 0; left: 0;
    width: 100%; height: 100%;
    background: rgba(0,0,0,0.75);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;         /* por encima de todo */
    pointer-events: auto;  /* captura todos los clics */
    }

    /* 2. Contenedor del móvil */
    .rotator {
        display: block;
    position: relative;
    width: 200px;      /* ajusta al tamaño real de tu móvil */
    height: 400px;
    overflow: hidden;
    }

    /* 3. Capa de fondo que rota (la silueta del móvil) */
    .rotator-bg {
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    background: url('/images/aulavirtual/movil.png') no-repeat center/contain;
    transform-origin: 50% 50%;
    animation: girar 2s linear infinite;
    }

    /* 4. Icono fijo en el centro */
    .icono {
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    max-width: 50px;
    pointer-events: none;  /* permite capturar clics en el overlay, no en el icono */
    }

    /* 5. Keyframes de la rotación */
    @keyframes girar {
    from { transform: rotate(0deg); }
    to   { transform: rotate(-90deg); }
    }

}

/* 2K (2560x1440 o superior, pero menos que 4K) */
@media screen and (min-width: 2560px) and (max-width: 3839px) and (min-height: 1440px) {
    /* Estilos para pantallas 2K */
    .view-progresos .site-grid, .view-category .site-grid,  .view-article .site-grid {
        margin: 1em auto; 
    }
}

/* 4K (3840x2160 o superior) */
@media screen and (min-width: 3840px) and (min-height: 2160px) {
    /* Estilos para pantallas 4K */
    .view-progresos .site-grid, .view-category .site-grid, .view-article .site-grid {
        margin: 1em auto; 
    }
}
@media (width <= 991.98px) {
    .container-header {
        position: sticky !important;
    }
}