*{
    font-family: 'Ubuntu', 'sans-serif';
}

/* Sidebar */
.side-left {
    background-color: #1e1e2f;
    color: white;
    width: 80px;
    transition: width 0.3s;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 1rem;
}
.side-left.expanded {
    width: 250px;
}
.side-left h1 {
    font-size: 1.2rem;
    margin: 1rem 0;
}
.side-left img {
    max-width: 150px;
    margin-top: 1rem;
    cursor: pointer;
}

.hamburger-icon .line{
    transition: all 0.3s ease;
    transform-origin: center;
}

/* estado abierto */

#sidebar:not(.expanded) .line1{
    transform: rotate(45deg) translate(3px,-2px);
}

#sidebar:not(.expanded) .line2{
    opacity:0;
}

#sidebar:not(.expanded) .line3{
    transform: rotate(-45deg) translate(-15px,-3px);
}


/* Layout */
.container-full {
    display: flex;
    height: 100vh;
    overflow: hidden;
}
.side-right {
    flex: 1;
    overflow-y: auto;
}
.side-left{
    width:220px;
    transition:0.3s;
}

.side-left.expanded{
    width:70px;
}

.side-left.expanded .menu-text{
    display:none;
}

.menu-list .nav-link{
    padding:12px 0px;
    font-size:16px;
    color:#fff;
}



/* Contenedor de la paginación */
#regsTable_paginate {
    display: flex;
    justify-content: flex-end;
    margin-top: 1rem;
}

/* Botones de paginación normales */
#regsTable_paginate .page-item .page-link {
    background-color: #f8f9fa; /* gris muy claro */
    color: #212529;             /* gris oscuro / casi negro */
    border: 1px solid #dee2e6;  /* borde gris suave */
    border-radius: 4px;
    margin: 0 2px;
    transition: all 0.2s;
}

/* Hover */
#regsTable_paginate .page-item .page-link:hover {
    background-color: #343a40; /* gris oscuro */
    color: #fff;               /* texto blanco */
    border-color: #343a40;
}

/* Botón activo */
#regsTable_paginate .page-item.active .page-link {
    background-color: #212529; /* casi negro */
    color: #fff;               /* texto blanco */
    border-color: #212529;
}

/* Botones deshabilitados */
#regsTable_paginate .page-item.disabled .page-link {
    background-color: #e9ecef; /* gris claro */
    color: #6c757d;            /* gris medio */
    cursor: not-allowed;
    border-color: #dee2e6;
}

.img-thumbnail{
    background-color: transparent !important;
    border: unset !important;
}

#imageModal .modal-content{
    border: unset;
}


/*Formulario*/
.ql-editor,
.quill-editor{
    min-height:250px;   /* altura del editor */
    background:#fff;
}

.ql-container{
    border-radius:8px;
}
#progress-bar{
    transition:width .4s ease;
}

.step{
    display:flex;
    align-items:center;
    gap:6px;
}

.step .badge{
    transition:all .3s;
}

.step.done .badge{
    background:#198754 !important;
    color:#fff !important;
}

.step.active .badge{
    background:#0d6efd !important;
    color:#fff !important;
}

.step.error .badge{
    background:#dc3545 !important;
    color:#fff !important;
}

#progress-bar{
    transition:width .4s ease;
}
.required-error{
    border:2px solid #dc3545 !important;
}