/* academicBackgroundStyle.css
   Armoniza Formación Académica con el tema dark del sitio.
   Sin :deep / ::deep: todo se acota a .academic-page
*/

.academic-page{
    /* Tokens */
    --ab-bg: #0b0f14;
    --ab-text: #e6edf3;
    --ab-muted: #c9d1d9;

    --ab-border: rgba(255,255,255,.10);
    --ab-glass: rgba(255,255,255,.04);
    --ab-glass-strong: rgba(255,255,255,.06);
    --ab-shadow: 0 18px 50px rgba(0,0,0,.45);

    --ab-accent: #7ee787;

    min-height: 100vh;
    color: var(--ab-text);

    background:
            radial-gradient(1200px 600px at 20% 20%, #1f2937 0%, var(--ab-bg) 60%),
            radial-gradient(1000px 520px at 80% 70%, #111827 0%, var(--ab-bg) 55%);
}

/* Base tipográfica dentro de la página */
.academic-page h1,
.academic-page h2,
.academic-page h3{
    color: var(--ab-text);
    letter-spacing: .2px;
}

.academic-page p{
    color: var(--ab-muted);
}

.academic-page .container{
    background: transparent;
}

/* Bootstrap helpers (solo dentro de academic) */
.academic-page .text-muted{
    color: rgba(201,209,217,.75) !important;
}
.academic-page .text-body-secondary{
    color: rgba(201,209,217,.78) !important;
}

/* Links */
.academic-page a{
    color: var(--ab-accent);
    text-decoration: none;
    font-weight: 700;
}
.academic-page a:hover{
    text-decoration: underline;
}

/* HR */
.academic-page hr{
    border-color: rgba(255,255,255,.12);
    opacity: 1;
}

/* Badges */
.academic-page .badge{
    border: 1px solid rgba(255,255,255,.10);
}
.academic-page .badge.text-bg-primary{
    background: rgba(13,110,253,.18) !important;
    color: rgba(230,237,243,.92) !important;
}
.academic-page .badge.text-bg-light{
    background: rgba(255,255,255,.05) !important;
    color: rgba(230,237,243,.85) !important;
}

/* Botones outline */
.academic-page .btn-outline-primary{
    color: rgba(230,237,243,.86);
    border-color: rgba(13,110,253,.45);
    background: rgba(13,110,253,.07);
}
.academic-page .btn-outline-primary:hover{
    background: rgba(13,110,253,.14);
    border-color: rgba(13,110,253,.65);
}
.edu-site-btn{
    white-space: nowrap;
}

/* Título con subrayado */
.ab-title{
    position: relative;
    display: inline-block;
    padding-bottom: .4rem;
    letter-spacing: .2px;
}
.ab-title::after{
    content:"";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 58%;
    height: 3px;
    background: linear-gradient(
            to right,
            var(--bs-primary),
            rgba(13,110,253,.25)
    );
    border-radius: 3px;
}

/* ===== Timeline ===== */
.timeline{
    position: relative;
    padding-left: 2rem;
}

/* Línea vertical en dark */
.timeline::before{
    content: "";
    position: absolute;
    left: 0.75rem;
    top: 0;
    bottom: 0;
    width: 2px;
    background: rgba(255,255,255,.12);
}

/* Item */
.timeline-item{
    position: relative;
    margin-bottom: 1rem;
}

/* Punto */
.timeline-dot{
    position: absolute;
    left: 0.42rem;
    top: 1.15rem;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: var(--bs-primary);
    box-shadow: 0 0 0 4px rgba(13,110,253,.18);
}

/* ===== Cards (glass) ===== */

/* Cards principales dentro del timeline */
.academic-page .timeline-item .card{
    border-radius: 18px;
    border: 1px solid var(--ab-border) !important;
    background: linear-gradient(180deg, var(--ab-glass), rgba(255,255,255,.02)) !important;
    box-shadow: var(--ab-shadow) !important;
    backdrop-filter: blur(10px);
}

/* Evitar que el card-body herede tonos claros */
.academic-page .card-body{
    color: rgba(230,237,243,.88);
}

/* Logos (se quedan claros para legibilidad) */
.edu-logo{
    width: 56px;
    height: 56px;
    object-fit: contain;
    border-radius: 12px;
    background: rgba(255,255,255,.92);
    border: 1px solid rgba(255,255,255,.14);
    padding: 6px;
    box-shadow: 0 10px 28px rgba(0,0,0,.35);
}

/* ===== Insignias ===== */
.badge-logo{
    width: 72px;
    height: 72px;
    object-fit: contain;
    border-radius: 14px;
    background: rgba(255,255,255,.92);
    border: 1px solid rgba(255,255,255,.14);
    padding: 4px;
    flex: 0 0 auto;
    box-shadow: 0 10px 28px rgba(0,0,0,.35);
}

/* Tarjeta de insignia (glass + hover) */
.badge-card{
    border-radius: 18px;
    border: 1px solid var(--ab-border) !important;
    background: linear-gradient(180deg, var(--ab-glass), rgba(255,255,255,.02)) !important;
    box-shadow: var(--ab-shadow) !important;
    backdrop-filter: blur(10px);

    transition: transform .15s ease, box-shadow .15s ease, background-color .15s ease;
}
.badge-card:hover{
    transform: translateY(-2px);
    box-shadow: 0 .9rem 1.8rem rgba(0,0,0,.55) !important;
    background: linear-gradient(180deg, var(--ab-glass-strong), rgba(255,255,255,.03)) !important;
}

/* Listas */
.academic-page ul{
    padding-left: 1.15rem;
}
.academic-page li{
    margin: .25rem 0;
}

/* Responsive */
@media (max-width: 768px){
    .timeline{ padding-left: 1.6rem; }
    .timeline::before{ left: 0.62rem; }
    .timeline-dot{ left: 0.29rem; }
}