/* ESTILOS GENERALES */
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap');
:root {
  --azul-principal: #004171;
  --azul-secundario1: #0d5575;
  --azul-secundario2: #297ba2;
  --azul-secundario3: #389eb0;
  --color-destacado: #FF9154;
  --gris-fondo: #f9f9f9;
  --color-destacado2: #00FCDF;
}
/* =========================
   INSCRIPCIONES - CARDS
========================= */
.grid-inscripciones {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.8rem;
    margin-top: 2rem;
    width: 100%;
}

.inscripcion-card {
    background: #fff;
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
    border-radius: 14px;
    padding: 1.6rem;
    box-shadow: 0 5px 18px rgba(0,0,0,0.30);
    display: flex;
    flex-direction: column;
    min-height: 360px;
    transition: transform .25s ease,
                box-shadow .25s ease;
}

.inscripcion-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 25px rgba(0,0,0,0.12);
}

/* TITULO UNIDAD */
.unidad-titulo {
    width: auto;
    text-align: left;
    font-size: 1.35rem;
    line-height: 1.3;
    color: var(--azul-principal);
    margin: 0 0 .8rem;
}

/* SEDE */
.unidad-sede {
    display: flex;
    align-items: center;
    gap: .5rem;
    color: var(--azul-principal);
    font-weight: 600;
    margin-bottom: 1rem;
}

.unidad-sede i {
    color: var(--azul-principal);
}

/* LINEA */
.inscripcion-card hr {
    border: 0;
    height: 2px;
    background: var(--color-destacado2);
    margin: .5rem 0 1.2rem;
}

/* CONTENIDO */
.inscripcion-contenido {
    padding: 0;
    flex: 1;
    min-width: 0;
    max-width: 100%;
}

.inscripcion-contenido p {
    display: flex;
    align-items: flex-start;
    gap: .8rem;
    margin: .7rem 0;
    font-size: 1rem;
    color: #34454d;
    overflow-wrap: anywhere;
    word-break: break-word;
    min-width: 0;
    max-width: 100%;
}

.inscripcion-contenido p i {
    width: 18px;
    margin-top: 3px;
    flex-shrink: 0;
    text-align: center;
    color:#373334;
}

.inscripcion-contenido p span {
    flex: 1 1 auto;
    min-width: 0;
    overflow-wrap: anywhere;
    word-break: break-word;
}

/* BOTONES */
.btn-inscripcion,
.btn-mas-info {
    text-align: center;
    margin-top: .8rem;
    padding: .75rem 1rem;
    border-radius: 8px;
    font-weight: 700;
    text-decoration: none;
    display: block;

}

.btn-inscripcion {
    background: var(--azul-principal);
    color: #fff;
}

.btn-inscripcion:hover {
    background: var(--azul-secundario2);
}

.btn-mas-info {
    color: var(--azul-secundario2);
    text-decoration: underline;
}

.btn-mas-info:hover {
    color: var(--color-destacado2);
}
.inscripcion-card{
    display:flex;
    flex-direction:column;
}

.inscripcion-contenido{
    display:flex;
    flex-direction:column;
    flex:1;
}

.inscripcion-datos{
    min-height:140px;
    min-width: 0;
    max-width: 100%;
}

.inscripcion-botones{
    margin-top:auto;
}

/* =========================
   BLOQUE INSCRIPCION
========================= */
.bloque-periodo {
    display:flex;
    align-items:center;
    gap:1rem;
    background:#E5E5E5;
    padding:1rem;
    border-radius:10px;
    margin-bottom:1.2rem;
    border-left: 5px solid var(--azul-principal);
}

.periodo-icono {
    width:45px;
    height:45px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:#fff;
    color:var(--azul-principal);
    font-size:1.4rem;
    background-color: #E5E5E5;
}

.periodo-texto {
    display:flex;
    flex-direction:column;
}

.periodo-titulo {
    color:var(--azul-principal);
    font-size:1rem;
    font-weight:700;
    text-transform:uppercase;
}

.periodo-fecha {
    font-size:1rem;
}

.unidad-titulo {
    font-size:1.45rem;
    font-weight:700;
    color:var(--azul-principal);
    margin-bottom:.5rem;
}

.bloque-inscripcion {
    padding: 1rem 1.2rem;
    border-radius: 10px;
    margin-bottom: 1.2rem;
    border-left: 6px solid;
}

.estado-inscripcion {
    font-size: 1rem;
    font-weight: 700;
    margin-bottom: .35rem;
    text-transform: uppercase;
    letter-spacing: .5px;
}

.periodo-fecha {
    font-size: .95rem;
    line-height: 1.5;
}
.bloque-inscripcion {
    padding: 1rem 1.2rem;
    border-radius: 10px;
    margin-bottom: 1.2rem;
    border-left: 5px solid;
}

.estado-inscripcion {
    display: flex;
    align-items: center;
    gap: .6rem;
    font-weight: 700;
    margin-bottom: .4rem;
    color: var(--azul-principal);
}

.estado-punto {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    flex-shrink: 0;
}

.periodo-fecha {
    font-size: .95rem;
    line-height: 1.5;
    color: black;
    font-weight: bold;
}
.bloque-inscripcion.abierta {
    background: #E8F5E9;
    color: #2E7D32;
    border-left-color: #2E7D32;
}

.bloque-inscripcion.abierta .estado-punto {
    background: #2E7D32;
}
.bloque-inscripcion.cerrada {
    background: #FDECEC;
    color: #C62828;
    border-left-color: #C62828;
}

.bloque-inscripcion.cerrada .estado-punto {
    background: #C62828;
}

/* =========================
   TABLET
========================= */
@media (max-width: 991px){
 .grid-inscripciones {
        grid-template-columns: minmax(0, 1fr) !important;
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }

    .tab-content {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        overflow-x: hidden;
    }

    .inscripcion-card {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        box-sizing: border-box;
    }

    .inscripcion-contenido {
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }

    .inscripcion-datos {
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }

    .unidad-titulo {
        font-size: 3rem;
        line-height: 1.3;
        overflow-wrap: anywhere;
    }

    .unidad-sede {
        font-size: 2.5rem;
    }

    .estado-inscripcion {
        font-size: 2.5rem;
    }

    .periodo-fecha {
        font-size: 2rem;
        line-height: 1.5;
        overflow-wrap: anywhere;
    }

    .inscripcion-contenido p {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        font-size: 2.5rem;
        line-height: 1.5;
        overflow-wrap: anywhere;
        word-break: break-word;
        align-items: center;
    }

    .inscripcion-contenido p i {
        width: 25px;
        min-width: 25px;
        flex-shrink: 0;
        font-size: 2rem;
    }

    .btn-inscripcion,
    .btn-mas-info {
        font-size: 2.5rem;
        line-height: 1.4;
    }
}