body {
    overflow-x: hidden;
}

.sodla-logo {
    font-family: 'Rye', serif;
}

/* Mantener todas las imágenes con la misma altura */
#carouselTimeLine .carousel-item img {
    width: 100%;
    height: 450px;
    /* altura fija en pantallas pequeñas */
    object-fit: cover;
    /* recorta sin deformar */
}

/* Fondo semitransparente para el texto */
.carousel-caption {
    background: rgba(0, 0, 0, 0.5);
    padding: 15px;
    border-radius: 10px;
}

/* Ajustes de texto para pantallas pequeñas */
@media (max-width: 576px) {
    .carousel-caption h5 {
        font-size: 1rem;
    }

    .carousel-caption p {
        font-size: 0.85rem;
    }
}

/* En pantallas más grandes aumentamos la altura */
@media (min-width: 768px) {
    #carouselTimeLine .carousel-item img {
        height: 450px;
    }
}

@media (min-width: 1200px) {
    #carouselTimeLine .carousel-item img {
        height: 450px;
    }
}

#site-logo {
    transition: filter 0.3s ease, opacity 0.3s ease;
}

[data-bs-theme="dark"] {
    --bs-body-bg: #29354e;
    /* Color de fondo (si no tiene color) oscuro */
    --bs-body-color: #e8e8e8;
    --bs-primary: #ff7b00;
    --bs-secondary-bg-subtle: #262f45;
    --bs-link-color: #ffb74d;
    --bs-tertiary-bg-rgb: 30, 30, 30;
    /* --bs-navbar-bg: #1b1c1f; */
    /* --bs-bg-body-tertiary: #1b1c1f; */

}
/* Variables para los botones según tema */
[data-bs-theme="light"] {
    --btn-turquesa-bg: #1F8A93;
    --btn-turquesa-bg-hover: #1d6e75;
    --btn-turquesa-bg-active: #063438;
    --btn-turquesa-border-active: #000a11;
    --btn-turquesa-color-hover:var(--bs-secondary-bg-subtle);

    --btn-naranja-bg: #E66B4D;
    --btn-naranja-bg-hover: #a94f38;
    --btn-naranja-bg-active: #431c13;
    --btn-naranja-border-active: #000a11;
}

[data-bs-theme="dark"] {
    --btn-turquesa-bg: #E66B4D;
    --btn-turquesa-bg-hover: #a94f38;
    --btn-turquesa-bg-active: #431c13;
    --btn-turquesa-border-active: #000a11;

    --btn-naranja-bg: #E66B4D; /* mismo color que turquesa en dark */
    --btn-naranja-bg-hover: #a94f38;
    --btn-naranja-bg-active: #431c13;
    --btn-naranja-border-active: #000a11;
}

/* Estilos generales de botones personalizados */
.btn-turquesa,
.btn-naranja {
    color: #fff;
    transition: background-color 0.3s ease, border-color 0.3s ease;
}

/* Botón turquesa */
.btn-turquesa {
    background-color: var(--btn-turquesa-bg);
}

.btn-turquesa:hover {
    background-color: var(--btn-turquesa-bg-hover);
    color: var(--btn-turquesa-color-hover);
}

.btn-turquesa:active {
    background-color: var(--btn-turquesa-bg-active);
    border-color: var(--btn-turquesa-border-active);
}

/* Botón naranja */
.btn-naranja {
    background-color: var(--btn-naranja-bg);
}

.btn-naranja:hover {
    background-color: var(--btn-naranja-bg-hover);
}

.btn-naranja:active {
    background-color: var(--btn-naranja-bg-active);
    border-color: var(--btn-naranja-border-active);
}


/* Fondos de ccajas / componentes */
[data-bs-theme="light"] {
    --color-turquesa: #1F8A93;
    --color-naranja: #E66B4D;
    --color-turquesa-transparente: rgba(31, 138, 147, 0.3);
    --color-secondary-transparente: rgba(226, 227, 229, 0.1);
}

[data-bs-theme="dark"] {
    --color-turquesa: #E66B4D;
    --color-naranja: #1F8A93;
    --color-turquesa-transparente: rgba(147, 50, 31, 0.3);
    --color-secondary-transparente: rgba(41, 53, 78, 0.9);
}

/*clases de fondos*/
.bg-turquesa {
    background-color: var(--color-turquesa) !important;
}

.bg-naranja {
    background-color: var(--color-naranja) !important;
}

.bg-turquesa-transparente {
    background-color: var(--color-turquesa-transparente) !important;
}

.bg-secondary-subtle-opacity {
    background-color: var(--color-secondary-transparente) !important;
}

/* Textos */
.text-turquesa {
    color: #1F8A93 !important;
}

/* sombra en texto */
.text-shadow {
    text-shadow: 1px 1px 8px currentColor !important;
}

.card .img-members {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    border-radius: 10px;
}

.card .img-members:hover {
    cursor: pointer;
    transform: scale(1.05);
    box-shadow: 0 6px 15px rgba(0, 0, 0, 0.2);
}