/* ===== ESTILOS GENERALES ===== */

body{
    margin:0;
    padding:0;
    font-family:Segoe UI, Arial, sans-serif;
    background:#f4f6f9;
    color:#333;
}

/* Encabezado */

.header{
    background:#6B1238;
    color:white;
    padding:28px 20px 22px 20px;
    text-align:center;
    box-shadow:0 3px 8px rgba(0,0,0,.15);

border-bottom:4px solid #c9a34e;
}

.header h1{
    margin:0;
    font-size:30px;
}

.header h2{
    margin:5px 0;
    font-size:20px;
    font-weight:normal;
}

.header h3{
    margin-top:15px;
    font-size:18px;
    color:#F8E6A0;
}

/* Caja principal */

.contenedor{
    width:90%;
    max-width:1100px;
    margin:30px auto;
    background:white;
    border-radius:10px;
    padding:25px;
    box-shadow:0 5px 15px rgba(0,0,0,.15);
}

/* Tabla de filtros */

.filtros{
    width:100%;
    border-collapse:collapse;
    margin-bottom:20px;
}

.filtros td{
    padding:10px;
}

.filtros tr:first-child{
    background:#6B1238;
    color:white;
    font-weight:bold;
}

/* Combos */

select{
    width:100%;
    padding:8px;
    border:1px solid #CCC;
    border-radius:5px;
    font-size:15px;
}

/* Botón */

input[type=submit]{

    background:#6B1238;
    color:white;
    border:none;
    padding:10px 30px;
    border-radius:5px;
    cursor:pointer;
    font-size:16px;
}

input[type=submit]:hover{

    background:#8B184A;
}

/* Tabla de resultados */

.EGpos{

    width:100%;
    border-collapse:collapse;
    margin-top:20px;
}

.TitTabla2{

    background:#6B1238;
    color:white;
    font-weight:bold;
    text-align:center;
}

.TitTabla2 td{

    padding:12px;
}

.Datos td,
.Datos2 td{

    padding:10px;
    border-bottom:1px solid #DDD;
}

.Datos{

    background:white;
	text-align:center;
}

.Datos2{

    background:#F7F7F7;
	text-align:center;
}

.Datos:hover,
.Datos2:hover{

    background:#FFF6DA;
}

/* ===== CONTROLES ASP.NET ===== */

select,
input[type=submit]{

    font-size:15px;
    height:40px;
}

select{

    width:100%;
}

input[type=submit]{

    min-width:170px;
}

/* DropDownList ASP.NET */

select{

    border-radius:6px;
    border:1px solid #cfcfcf;
}

/* Centrar botón */

.filtros tr:last-child td{

    text-align:center;
    padding:18px;
}

/*=========================
    TABLA RESPONSIVE
=========================*/

.tabla-responsive{

    width:100%;
    overflow-x:auto;
    overflow-y:hidden;

    -webkit-overflow-scrolling:touch;

}

.EGpos{

    min-width:850px;

}

/*=====================================
        DISEÑO RESPONSIVE
======================================*/

@media (max-width:768px){

    .header{

        padding:40px 20px;

    }

    .header h1{

        font-size:38px;

    }

    .header h2{

        font-size:22px;

    }

    .header h3{

        font-size:18px;

    }

    .header h4{

        font-size:18px;

        margin-top:12px;

    }

    .contenedor{

        width:95%;

        padding:20px;

    }

    .filtros{

        display:block;

    }

    .filtros tbody{

        display:block;

    }

    .filtros tr{

        display:block;

        width:100%;

    }

    .filtros td{

        display:block;

        width:100%;

        padding:8px 0;

    }

    select{

        width:100%;

    }

    input[type=submit]{

        width:100%;

    }

}

/*=========================================
        ENCABEZADO INSTITUCIONAL
=========================================*/

.header-top{

    display:grid;

    grid-template-columns:140px 1fr 140px;

    align-items:center;

}

.logo-ipn{
    width:85px;
    height:auto;
}

.logo-esime{
    width:120px;
    height:auto;
}

.titulo{

    text-align:center;

}

.linea{

    width:160px;

    height:4px;

    background:#c9a34e;

    margin:15px auto;

    border-radius:3px;

}

.periodo{

    margin-top:12px;

    font-size:18px;

    font-weight:500;

}

.descripcion{

    margin-top:15px;

    opacity:.90;

    font-size:17px;

}

/*=========================
    CELULAR
=========================*/

@media (max-width:768px){

	.header-top{

        grid-template-columns:70px 1fr 70px;
    }

    .logo-ipn{
        width:60px;
    }

    .logo-esime{
        width:70px;
    }

}

.linea{

    width:90px;

}

/*=============================
    BOTÓN VER HORARIO
==============================*/

.btnHorario{

    display:inline-block;

    background:#6B1238;

    color:#fff !important;

    text-decoration:none;

    padding:7px 16px;

    border-radius:6px;

    font-size:13px;

    font-weight:600;

    transition:.25s;

}

.btnHorario:hover{

    background:#8A1A4B;

    transform:translateY(-2px);

    box-shadow:0 3px 8px rgba(0,0,0,.25);

}

/*==================================
      MENSAJE SIN RESULTADOS
===================================*/

.sinResultados{

    margin:25px auto;

    max-width:650px;

    background:#fff8e6;

    border-left:6px solid #c9a34e;

    color:#6B1238;

    padding:18px;

    border-radius:8px;

    text-align:center;

    font-size:16px;

    box-shadow:0 2px 8px rgba(0,0,0,.08);

}

.sinResultados strong{

    display:block;

    font-size:19px;

    margin-bottom:8px;

}

/*==================================
            FOOTER
===================================*/

.footer{

    margin-top:60px;

    background:#5E0F2D;

    color:#ffffff;

    border-top:4px solid #c9a34e;

	box-shadow:0 -3px 12px rgba(0,0,0,.18);

}

.footer-contenido{

    max-width:1200px;

    margin:auto;

    padding:25px 20px;

    text-align:center;

}

.dependencia{

    font-size:16px;

    font-weight:700;

    color:#fff;

    line-height:1.8;

	letter-spacing:.4px;

}

.copyright{

    margin-top:18px;

    font-size:13px;

    color:#fff;

	line-height:1.7;

}

.periodo strong{

    font-size:24px;

    color:#ffffff;

}

/*======================================
        TABLA HORARIO
======================================*/

.tablaHorario{

    width:98%;
    margin:30px auto;
    border-collapse:collapse;
	background:#fff;
	border-radius:12px;
	overflow:hidden;
    font-family:Segoe UI,Arial;
    box-shadow:0 4px 15px rgba(0,0,0,.15);

}

.tituloHorario td{

    background:#6B1238;
    color:white;
    font-size:26px;
    font-weight:bold;
    text-align:center;
    padding:18px;

}

.encabezadoHorario td{

    background:#7B163F;
    color:white;
    text-align:center;
    font-weight:bold;
    padding:14px;
    border:1px solid #8b2a57;

}

.filaHorario td{

    padding:14px 10px;
	border:1px solid #ececec;
    font-size:14px;
    color:#444;
    vertical-align:middle;

}

.filaHorario td:first-child{

    font-weight:700;
	color:#2f2f2f;
	width:42%;
	text-align:left;

}

.filaHorario td:last-child{

    text-align:left;

}

.filaHorario:nth-child(2){

    background:#f7f7f7;
	text-align:center;
	font-weight:600;
    width:90px;

}

.filaHorario td:nth-child(3),
.filaHorario td:nth-child(4),
.filaHorario td:nth-child(5),
.filaHorario td:nth-child(6),
.filaHorario td:nth-child(7){

    text-align:center;
    width:70px;
    font-weight:600;
    color:#4b4b4b;

}

.filaHorario:hover{

    background:#FFF4D7;
	transition:.20s;

}

.profe{

    font-size:12px;
    color:#555;
	font-weight:bold;
    line-height:18px;
	padding-left:10px;

}

.tablaHorario td{

    vertical-align:middle;

}

/* Filas alternadas */

.tablaHorario tr.filaHorario:nth-child(odd){

    background:#ffffff;

}

.tablaHorario tr.filaHorario:nth-child(even){

    background:#f7f8fa;

}

/*=====================================
    TARJETA DE INFORMACIÓN DEL HORARIO
======================================*/

.infoHorario{

    width:98%;
    margin:35px auto;
    display:grid;
    grid-template-columns:240px 170px 220px 1fr;
    background:#fff;
    border:1px solid #ddd;
    border-radius:12px;
    overflow:hidden;
    box-shadow:0 10px 30px rgba(0,0,0,.15);

}

.grupoBox{

    background:#6B1238;
    color:#fff;
    display:flex;
    justify-content:center;
    align-items:center;
    font-size:56px;
    font-weight:700;
	letter-spacing:2px;

}

.dato{

    padding:18px;
    border-left:1px solid #ececec;
    border-top:1px solid #ececec;
    display:flex;
    flex-direction:column;
	justify-content:center;
	min-height:75px;

}

.tituloDato{

    font-size:11px;
    color:#8c8c8c;
	font-weight:600;
	letter-spacing:.8px;
    text-transform:uppercase;
    margin-bottom:8px;

}

.valorDato{

    font-size:18px;
    color:#6B1238;
    font-weight:700;
	line-height:1.3;

}

.programa .valorDato{

    font-size:16px;
    line-height:1.4;

}

.programa{

    grid-column:4;

}

.infoHorario .dato:nth-child(5){

    border-top:1px solid #ececec;

}

.infoHorario .dato:nth-child(6){

    border-top:1px solid #ececec;

}

.infoHorario .dato:nth-child(7){

    border-top:1px solid #ececec;

}

.infoHorario .dato:nth-child(8){

    border-top:1px solid #ececec;

}

/*=========================================
    ENCABEZADO INSTITUCIONAL
=========================================*/

.headerHorario{

    background:#6B1238;
    color:white;
    padding:18px 40px;
    border-bottom:4px solid #c9a34e;

}

.headerTop{

    display:grid;
    grid-template-columns:140px 1fr 140px;
    align-items:center;

}

.logoIPN{

    width:90px;

}

.logoESIME{

    width:95px;
    justify-self:end;

}

.tituloInstitucion{

    text-align:center;

}

.tituloInstitucion h1{

    margin:0;
    font-size:30px;
    font-weight:700;

}

.tituloInstitucion h2{

    margin-top:10px;
    font-size:16px;
    font-weight:400;

}

.tituloInstitucion h3{

    margin-top:12px;
    color:#E9C46A;
    font-size:17px;
	font-weight:600;

}

.lineaDorada{

    width:130px;
    height:4px;
    background:#c9a34e;
    margin:18px auto;
    border-radius:5px;

}

.tituloInstitucion p{

    font-size:17px;
    margin:0;

}

/*=========================================
        BOTONES
=========================================*/

.accionesHorario{

    width:96%;
    margin:35px auto;
    display:flex;
    justify-content:center;
    gap:18px;
    flex-wrap:wrap;

}

.btnAccion{

    background:#6B1238;
    color:#fff;
    border:none;
    padding:14px 24px;
    border-radius:8px;
    cursor:pointer;
    font-size:15px;
    font-weight:600;
    transition:.25s;

}

.btnAccion:hover{

    background:#8A1D4B;
    transform:translateY(-2px);

}


/*=========================================
        PIE DE PÁGINA
=========================================*/

.lineaFooter{

    width:180px;
    height:4px;
    background:#C9A34E;
    margin:0 auto 18px auto;
    border-radius:5px;

}

.fechaActualizacion{

    font-size:13px;
    color:#d0cfcf;
    margin-bottom:10px;

}

/*=========================
        IMPRESIÓN
=========================*/

@media print{

    body{

        background:white;
        zoom:65%;

    }

    .headerHorario{

        padding:10px;

    }

    .accionesHorario{

        display:none;

    }

    .footer{

        display:none;

    }

    .tablaHorario{

        box-shadow:none;
        margin-top:10px;

    }

    .infoHorario{

        box-shadow:none;
        margin-bottom:10px;

    }

    @page{

        size:landscape;
        margin:8mm;

    }

}

@media print{

    *{

        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;

    }

}