body{
    /* background: url("./fondo.webp"); 
     background-size: cover; 
     background-position: center; */
    padding-top: 50px;
}

#buscar{
    margin: 10px;
}

.footer{
    height: 80%;
}

.scroll{
    overflow-x: scroll;
}

#modal{
    overflow-y: scroll;
}


.skeleton {
    margin: 10px;
    height: 60px;
    background: linear-gradient(90deg, #e0e0e0 25%, #f0f0f0 50%, #e0e0e0 75%);
    background-size: 200% 100%;
    animation: shimmer 1.5s infinite linear;
    border-radius: 4px;
}

@keyframes shimmer {
    0% { background-position: -200% 0; }
    100% { background-position: 200% 0; }
}


.pyp {
    /* position: fixed; */
    bottom: 0;
}

.pyp a, .pyp img{
    margin: 0;
    padding: 0;
}

/* Cambiar el color de los botones primary */
.btn-primary {
    background-color: #9fcd3e !important;
    border-color: #8fb934 !important;
    color: white !important;
}

.btn-primary:hover {
    background-color: #729c18 !important;
}

.btn-primary:focus,
.btn-primary:focus-visible, 
.btn-primary:active {
    background-color: #7ea62c !important;
    outline-color: #6c921e !important;
    border-color: #6c921e !important;
    box-shadow: 0 0 5px rgba(159, 205, 62, 0.5) !important;
}

/* 🔹 Estilos para el estado disabled en primary */
.btn-primary:disabled, 
.btn-primary[disabled] {
    /* background-color: #b6db7c !important; */
    background-color: #767676 !important;
    border-color: #6e6e6e !important;
    color: #ecececea !important; /* Blanco con opacidad */
    cursor: not-allowed !important;
    opacity: 0.6 !important;
}

/* Cambiar el color de los botones info */
.btn-info {
    background-color: #08a7df !important;
    border-color: #0795c7 !important;
    color: white !important;
}

.btn-info:hover {
    background-color: #0787b6 !important;
}

.btn-info:focus, 
.btn-info:active {
    background-color: #0684b0 !important;
    border-color: #05739a !important;
    box-shadow: 0 0 5px rgba(8, 167, 223, 0.5) !important;
}

/* 🔹 Estilos para el estado disabled en info */
.btn-info:disabled, 
.btn-info[disabled] {
    background-color: #6ccbe7 !important;
    border-color: #5ab8d5 !important;
    color: #ffffff80 !important;
    cursor: not-allowed !important;
    opacity: 0.6 !important;
}

/*badge-info*/
.badge-info{
    background-color: #08a7df    !important;
}

/*alert-success*/
.alert-success, .badge-success{
    background-color: #9fcd3e    !important;
    color: white !important;
}

/* collapse altura */
.collapse  {
    min-height: auto !important;
    height: auto !important;
}
.collapse-title {
    padding: 0 !important;
    margin: 0 !important;
}

/* tamaño nombre profesional */
#doctorMuestra, #fechaTurnoMuestra, #horaTurnoMuestra {
    font-size: clamp(1rem, 5vw, 2rem); /* Tamaño mínimo 1rem, máximo 2rem, flexible entre ellos */
}

.stat{
    padding-left: 15px;
    padding-right: 15px;
}

.collapse-btn {
    width: 100%;
    /* padding: 10px; */
    /* background-color: #007BFF; */
    /* color: white; */
    border: none;
    cursor: pointer;
    text-align: left;
    font-size: 16px;
}

.collapse-content {
    overflow: hidden;
    transition: max-height 0.3s ease-out;
    max-height: 0;
    /* background-color: #f1f1f1; */
    /* padding: 0 10px; */
}

.collapse-content.open {
    max-height: 200px; /* Ajusta la altura máxima según el contenido */
    padding: 0;
}