/* ============================================
   INSTITUTO CULTURAL ARGENTINO - CSS PERSONALIZADO
   Colores institucionales y tipografía académica
   ============================================ */

/* === IMPORTAR FUENTES GOOGLE === */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700;800&family=Open+Sans:wght@300;400;500;600;700&display=swap');

/* === VARIABLES DE COLORES ICA === */
:root {
    /* Colores principales del ICA */
    --ica-rojo: #C41E3A;
    --ica-rojo-oscuro: #9E1830;
    --ica-rojo-claro: #E63950;
    --ica-azul-marino: #1E3A5F;
    --ica-azul-oscuro: #152A45;
    --ica-celeste: #74ACDF;
    --ica-celeste-claro: #A8D0F0;
    --ica-blanco: #FFFFFF;
    --ica-gris-claro: #F5F5F5;
    --ica-gris: #6c757d;
    --ica-texto: #333333;
    
    /* Sobrescribir variables Bootstrap */
    --primary: #C41E3A !important;
    --secondary: #1E3A5F !important;
    --info: #74ACDF !important;
    
    /* Tipografías */
    --font-family-sans-serif: 'Open Sans', sans-serif;
    --font-titulos: 'Montserrat', sans-serif;
}

/* === TIPOGRAFÍA GENERAL === */
body {
    font-family: 'Open Sans', sans-serif !important;
    color: var(--ica-texto);
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 600 !important;
    color: var(--ica-azul-marino);
}

.navbar-brand span {
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 700 !important;
}

/* === COLORES PRIMARIOS === */
.bg-primary {
    background-color: var(--ica-rojo) !important;
}

.bg-secondary {
    background-color: var(--ica-azul-marino) !important;
}

.text-primary {
    color: var(--ica-rojo) !important;
}

.text-secondary {
    color: var(--ica-azul-marino) !important;
}

/* === BOTONES === */
.btn-primary {
    background-color: var(--ica-rojo) !important;
    border-color: var(--ica-rojo) !important;
    font-family: 'Montserrat', sans-serif;
    font-weight: 500;
}

.btn-primary:hover,
.btn-primary:focus {
    background-color: var(--ica-rojo-oscuro) !important;
    border-color: var(--ica-rojo-oscuro) !important;
}

.btn-secondary {
    background-color: var(--ica-azul-marino) !important;
    border-color: var(--ica-azul-marino) !important;
    font-family: 'Montserrat', sans-serif;
    font-weight: 500;
}

.btn-secondary:hover,
.btn-secondary:focus {
    background-color: var(--ica-azul-oscuro) !important;
    border-color: var(--ica-azul-oscuro) !important;
}

.btn-outline-primary {
    color: var(--ica-rojo) !important;
    border-color: var(--ica-rojo) !important;
}

.btn-outline-primary:hover {
    background-color: var(--ica-rojo) !important;
    border-color: var(--ica-rojo) !important;
    color: white !important;
}

.btn-outline-light:hover {
    color: var(--ica-rojo) !important;
}

/* === NAVBAR === */
.navbar-brand span.text-primary {
    color: var(--ica-rojo) !important;
}

.navbar-nav .nav-link {
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 500 !important;
    text-transform: uppercase;
    font-size: 0.9rem;
    letter-spacing: 0.5px;
}

.navbar-nav .nav-link:hover,
.navbar-nav .nav-link.active {
    color: var(--ica-rojo) !important;
}

/* === SECTION TITLES === */
.section-title {
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 600;
}

.section-title span {
    background: linear-gradient(135deg, var(--ica-rojo), var(--ica-rojo-claro));
    color: white;
}

/* === LINKS === */
a {
    color: var(--ica-rojo);
}

a:hover {
    color: var(--ica-rojo-oscuro);
}

/* === CARDS === */
.card-title {
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 600 !important;
    color: var(--ica-azul-marino);
}

/* === BORDER TOP ACCENT (cards de facilities) === */
.border-top {
    border-top-color: var(--ica-rojo) !important;
}

/* === ICONOS === */
.fa.text-primary,
.fas.text-primary,
.far.text-primary,
.fab.text-primary {
    color: var(--ica-rojo) !important;
}

/* === FOOTER === */
.bg-secondary .text-primary {
    color: var(--ica-celeste) !important;
}

.bg-secondary h3.text-primary,
.bg-secondary h4.text-primary,
.bg-secondary h5.text-primary {
    color: var(--ica-celeste) !important;
}

.bg-secondary .btn-outline-primary {
    color: var(--ica-celeste) !important;
    border-color: var(--ica-celeste) !important;
}

.bg-secondary .btn-outline-primary:hover {
    background-color: var(--ica-celeste) !important;
    color: var(--ica-azul-marino) !important;
}

/* === FORMULARIOS === */
.form-control:focus {
    border-color: var(--ica-rojo);
    box-shadow: 0 0 0 0.2rem rgba(196, 30, 58, 0.25);
}

/* === BACK TO TOP === */
.back-to-top {
    background-color: var(--ica-rojo) !important;
}

.back-to-top:hover {
    background-color: var(--ica-rojo-oscuro) !important;
}

/* === TESTIMONIALS === */
.testimonial-carousel .owl-dot.active span {
    background-color: var(--ica-rojo) !important;
}

/* === DROPDOWN === */
.dropdown-item:hover,
.dropdown-item:focus,
.dropdown-item.active {
    background-color: var(--ica-rojo) !important;
    color: white !important;
}

/* === LIST GROUP (Plan de estudios) === */
.list-group-item {
    font-family: 'Open Sans', sans-serif;
    border-left: 3px solid transparent;
    transition: all 0.3s ease;
}

.list-group-item:hover {
    border-left-color: var(--ica-rojo);
    background-color: var(--ica-gris-claro);
}

/* === ALERTS === */
.alert-info {
    background-color: rgba(116, 172, 223, 0.2);
    border-color: var(--ica-celeste);
    color: var(--ica-azul-marino);
}

.alert-info .fa,
.alert-info .fas {
    color: var(--ica-azul-marino);
}

/* === HEADER PAGES === */
.bg-primary h1,
.bg-primary h2,
.bg-primary h3,
.bg-primary h4,
.bg-primary p {
    font-family: 'Montserrat', sans-serif !important;
}

/* === AJUSTES GENERALES === */
.shadow-sm {
    box-shadow: 0 0.125rem 0.5rem rgba(30, 58, 95, 0.1) !important;
}

/* Hover effect en cards */
.card {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.card:hover {
    transform: translateY(-5px);
    box-shadow: 0 0.5rem 1.5rem rgba(30, 58, 95, 0.15) !important;
}

/* === RESPONSIVE === */
@media (max-width: 768px) {
    .navbar-brand span {
        font-size: 18px !important;
    }
    
    h1, .h1 {
        font-size: 1.75rem;
    }
    
    h2, .h2 {
        font-size: 1.5rem;
    }
}

/* === SELECTION COLOR === */
::selection {
    background-color: var(--ica-rojo);
    color: white;
}

::-moz-selection {
    background-color: var(--ica-rojo);
    color: white;
}

/* === ÍCONOS DE REDES SOCIALES (SVG embebido - no dependen de Font Awesome) === */
.ico-social {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-indent: -9999px;
    overflow: hidden;
    color: inherit;
}
.ico-facebook {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23C41E3A'%3E%3Cpath d='M24 12.073c0-6.627-5.373-12-12-12s-12 5.373-12 12c0 5.99 4.388 10.954 10.125 11.854v-8.385H7.078v-3.47h3.047V9.43c0-3.007 1.792-4.669 4.533-4.669 1.312 0 2.686.235 2.686.235v2.953H15.83c-1.491 0-1.956.925-1.956 1.874v2.25h3.328l-.532 3.47h-2.796v8.385C19.612 23.027 24 18.062 24 12.073z'/%3E%3C/svg%3E") no-repeat center;
    background-size: 18px 18px;
}
.ico-instagram {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23C41E3A'%3E%3Cpath d='M12 2.163c3.204 0 3.584.012 4.85.07 3.252.148 4.771 1.691 4.919 4.919.058 1.265.069 1.645.069 4.849 0 3.205-.012 3.584-.069 4.849-.149 3.225-1.664 4.771-4.919 4.919-1.266.058-1.644.07-4.85.07-3.204 0-3.584-.012-4.849-.07-3.26-.149-4.771-1.699-4.919-4.92-.058-1.265-.07-1.644-.07-4.849 0-3.204.013-3.583.07-4.849.149-3.227 1.664-4.771 4.919-4.919 1.266-.057 1.645-.069 4.849-.069zm0-2.163c-3.259 0-3.667.014-4.947.072-4.358.2-6.78 2.618-6.98 6.98-.059 1.281-.073 1.689-.073 4.948 0 3.259.014 3.668.072 4.948.2 4.358 2.618 6.78 6.98 6.98 1.281.058 1.689.072 4.948.072 3.259 0 3.668-.014 4.948-.072 4.354-.2 6.782-2.618 6.979-6.98.059-1.28.073-1.689.073-4.948 0-3.259-.014-3.667-.072-4.947-.196-4.354-2.617-6.78-6.979-6.98-1.281-.059-1.69-.073-4.949-.073zm0 5.838c-3.403 0-6.162 2.759-6.162 6.162s2.759 6.163 6.162 6.163 6.162-2.759 6.162-6.163c0-3.403-2.759-6.162-6.162-6.162zm0 10.162c-2.209 0-4-1.79-4-4 0-2.209 1.791-4 4-4s4 1.791 4 4c0 2.21-1.791 4-4 4zm6.406-11.845c-.796 0-1.441.645-1.441 1.44s.645 1.44 1.441 1.44c.795 0 1.439-.645 1.439-1.44s-.644-1.44-1.439-1.44z'/%3E%3C/svg%3E") no-repeat center;
    background-size: 18px 18px;
}
/* Variante blanca para fondo rojo (sección contacto) */
.ico-facebook-white {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffffff'%3E%3Cpath d='M24 12.073c0-6.627-5.373-12-12-12s-12 5.373-12 12c0 5.99 4.388 10.954 10.125 11.854v-8.385H7.078v-3.47h3.047V9.43c0-3.007 1.792-4.669 4.533-4.669 1.312 0 2.686.235 2.686.235v2.953H15.83c-1.491 0-1.956.925-1.956 1.874v2.25h3.328l-.532 3.47h-2.796v8.385C19.612 23.027 24 18.062 24 12.073z'/%3E%3C/svg%3E") no-repeat center;
    background-size: 20px 20px;
}
.ico-instagram-white {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffffff'%3E%3Cpath d='M12 2.163c3.204 0 3.584.012 4.85.07 3.252.148 4.771 1.691 4.919 4.919.058 1.265.069 1.645.069 4.849 0 3.205-.012 3.584-.069 4.849-.149 3.225-1.664 4.771-4.919 4.919-1.266.058-1.644.07-4.85.07-3.204 0-3.584-.012-4.849-.07-3.26-.149-4.771-1.699-4.919-4.92-.058-1.265-.07-1.644-.07-4.849 0-3.204.013-3.583.07-4.849.149-3.227 1.664-4.771 4.919-4.919 1.266-.057 1.645-.069 4.849-.069zm0-2.163c-3.259 0-3.667.014-4.947.072-4.358.2-6.78 2.618-6.98 6.98-.059 1.281-.073 1.689-.073 4.948 0 3.259.014 3.668.072 4.948.2 4.358 2.618 6.78 6.98 6.98 1.281.058 1.689.072 4.948.072 3.259 0 3.668-.014 4.948-.072 4.354-.2 6.782-2.618 6.979-6.98.059-1.28.073-1.689.073-4.948 0-3.259-.014-3.667-.072-4.947-.196-4.354-2.617-6.78-6.979-6.98-1.281-.059-1.69-.073-4.949-.073zm0 5.838c-3.403 0-6.162 2.759-6.162 6.162s2.759 6.163 6.162 6.163 6.162-2.759 6.162-6.163c0-3.403-2.759-6.162-6.162-6.162zm0 10.162c-2.209 0-4-1.79-4-4 0-2.209 1.791-4 4-4s4 1.791 4 4c0 2.21-1.791 4-4 4zm6.406-11.845c-.796 0-1.441.645-1.441 1.44s.645 1.44 1.441 1.44c.795 0 1.439-.645 1.439-1.44s-.644-1.44-1.439-1.44z'/%3E%3C/svg%3E") no-repeat center;
    background-size: 20px 20px;
}

/* === CARRUSEL HEADER (flechas e indicadores visibles sobre fondo rojo) === */
#headerCarousel .carousel-control-prev-icon,
#headerCarousel .carousel-control-next-icon {
    background-color: rgba(255,255,255,0.3);
    border-radius: 50%;
    padding: 1.5rem;
}
#headerCarousel .carousel-control-prev-icon:hover,
#headerCarousel .carousel-control-next-icon:hover {
    background-color: rgba(255,255,255,0.5);
}
#headerCarousel .carousel-indicators li {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background-color: rgba(255,255,255,0.5);
    border: 2px solid white;
}
#headerCarousel .carousel-indicators li.active {
    background-color: white;
}