/* RESET */
body {
    margin: 0;
    background: #f4f6f9;
    font-family: Arial, sans-serif;
}

img{
    user-select: none;
}

/* ===================== */
/* HEADER / NAVBAR */
/* ===================== */

.navbar {
    position: relative;
    z-index: 1050; /* SIEMPRE encima del sidebar */
}

.navbar-collapse {
    z-index: 1100;
}

/* ===================== */
/* SIDEBAR */
/* ===================== */

.sidebar {
    width: 220px;
    min-height: 100vh;
    background: #2f3b52;
    color: white;
    transition: all 0.3s ease;
    z-index: 1000;
}

/* Links sidebar */
.sidebar .nav-link {
    color: #cfd8e3;
    padding: 10px 12px;
    border-radius: 6px;
    margin-bottom: 5px;
    display: block;
}

.sidebar .nav-link:hover,
.sidebar .nav-link.active {
    background: #1f2a3d;
    color: #ffffff;
}

/* ===================== */
/* MAIN CONTENT */
/* ===================== */

.main-content {
    background: #f4f6f9;
    min-height: 100vh;
}

#filecarga
{
    position:relative;
    padding:5px;
    height: 35px;
    width:40%;
    margin:auto;
    cursor:pointer;
    border-radius: 5px;
    border: 1px solid #e3e3e3;
}

#textocarga
{
    text-align: center;
    color:#000;
}
#btn_photocarga
{
    position:absolute;
    top:0px;
    left:0px;
    right:0px;
    bottom:0px;
    width:100%;
    height:100%;
    opacity:0;
    cursor:pointer;
}

.foto-modal{
    width:100%;
    height:300px;
    object-fit:cover;
    border-radius:10px;
    transition:0.3s;
}

.foto-modal:hover{
    transform:scale(1.02);
}

.card{
    overflow:hidden;
    border:none;
    box-shadow:0 4px 10px rgba(0,0,0,.1);
}


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

@media (max-width: 768px) {

    /* NAVBAR MENU (blanco desplegable) */
    .navbar-collapse {
        background: #ffffff;
        padding: 15px;
        border-top: 1px solid #ddd;
        position: relative;
        z-index: 1100; /* más alto que sidebar */
    }

    /* SIDEBAR MOBILE */
    .sidebar {
        position: fixed;
        left: -220px;
        top: 56px; /* altura del navbar */
        height: 100%;
        z-index: 1000;
    }

    .sidebar.active {
        left: 0;
    }

    .input_search
    {
        width:100%;
    }
}

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

.btn-warning {
    color: #000;
    font-weight: 500;
}

/* ===================== */
/* TARJETAS */
/* ===================== */

.card {
    border-radius: 10px;
    border: 1px solid #e0e0e0;
}

.logo-gradient {
    background: linear-gradient(
        90deg,
        #0d6efd 0%,
        #20c997 25%,
        #ffffff 50%,   /* brillo fuerte */
        #20c997 75%,
        #0d6efd 100%
    );
    background-size: 300% auto; /* más recorrido */
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    text-shadow: 0 0 8px rgba(13, 110, 253, 0.05);
    animation: shineMove 3s linear infinite;
}

@keyframes shineMove {
    0% {
        background-position: 0% center;
    }
    100% {
        background-position: 300% center;
    }
}