@tailwind base;
@tailwind components;
@tailwind utilities;

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

input[type=number] { -moz-appearance:textfield; }

.active {
    background-color: #334155 ;
    color: #fff ;
}
.alinear
{
    @apply ml-60 ;
}
.modal-big
{
    width: 90px ;
}
.mini{
    @apply w-12;
}
.quitarmargen
{
    @apply my-0 ;
}
.margenpequeñotop
{
    @apply mt-2 ;
}
.seccion-menu{
    @apply flex flex-row items-center phone:w-full;
    @apply px-3 py-2 mr-4 phone:mr-0 text-sm phone:text-base font-medium text-gray-300 active:text-white active:bg-gray-900;
    @apply rounded-md hover:text-white hover:bg-gray-700 focus:outline-none focus:text-white focus:bg-gray-700;

}

.drown-menu-nav{
    @apply absolute right-0 w-48 mt-2 origin-top-right rounded-md shadow-lg;
}

.item-drown-menu-nav{
    @apply flex flex-row items-center;
    @apply px-4 py-2 text-sm;
    @apply text-gray-700 focus:text-gray-900 hover:text-gray-900 focus:outline-none hover:bg-blue-300 focus:bg-blue-300;
}


.item-siderbar-menu{
    @apply flex items-center p-2 text-base font-normal rounded-lg;
    @apply text-white hover:bg-gray-700 active:text-white active:bg-gray-900 hover:text-white;
    @apply focus:outline-none focus:text-white focus:bg-gray-700;
}

.item-siderbar-menu > i{
    @apply w-6 h-6 transition duration-75 text-gray-400 flex justify-center items-center;
}

.subitem-siderbar-menu{
    @apply flex items-center w-full p-2  text-base font-normal rounded-lg pl-11;
    @apply text-white hover:bg-gray-700 active:text-white active:bg-gray-900 hover:text-white;
    @apply focus:outline-none focus:text-white focus:bg-gray-700;
}

.ul-menu{
    transition: max-height 0.10s, padding 0.10s, opacity 0.10s;
    -webkit-transition: all 1s;
    -moz-transition: all 1s;
    -mos-transition: all 1s;
    -o-transition: all 1s;
    transition: all 1s;
}

/* --------------- LOGIN ------------------ */
.input-login {
    @apply block w-full bg-white text-text-modal;
    @apply px-4 py-2 mt-2;
    @apply border rounded-lg;
    @apply focus:border-blue-500;
    @apply focus:ring-blue-500;
    @apply focus:ring;
    @apply focus:ring-opacity-40;
}

/* --------------- //LOGIN ------------------ */



/* --------------- DASHBOARD ------------------ */
.container-dashboard {
    @apply container mx-auto my-10 rounded-lg bg-white border border-gray-200 shadow-lg;
}

.container-dashboard-93 {
    @apply max-w-[93%] container mx-auto my-10 rounded-lg bg-white border  border-gray-200 shadow-lg;
}

.div-header-dashboard{
    @apply grid grid-flow-col auto-cols-auto my-9 rounded-lg overflow-hidden shadow-lg bg-white border border-gray-200 text-center;
    @apply phone:my-4;
}

.title-dashboard{
    @apply font-bold text-3xl phone:text-2xl phone:text-center mt-2;
}

.subTitle-dashboard{
    @apply font-bold text-2xl phone:text-2xl phone:text-center mt-2;
}
/* --------------- //DASHBOARD ------------------ */

/* --------------- BEADCRUMBS ------------------ */
.li-beadcrumbs{
    @apply flex items-center text-sm phone:text-xs;
}

.i-beadcrumbs{
    @apply w-5 h-5 grid justify-center content-center text-gray-400
}

.a-beadcrumbs{
    @apply ml-1 text-gray-700;
}

.a-beadcrumbs-hover{
    @apply ml-1 font-medium text-gray-700 hover:text-red-800;
}
/* --------------- //BEADCRUMBS ------------------ */



/* --------------- CARD ------------------ */
.card{
    @apply grid grid-rows-2 grid-flow-col gap-6 w-full h-fit py-6 px-6 justify-items-center items-center rounded-lg overflow-hidden shadow-lg bg-white border border-gray-200;
    @apply phone:py-3 phone:px-3 phone:w-fit phone:gap-3;
    @apply phone:grid-rows-2 phone:grid-flow-row;
}

.card-fit{
    @apply grid grid-rows-2 grid-flow-col gap-6 w-fit h-fit py-6 px-6 justify-items-center items-center rounded-lg overflow-hidden shadow-lg bg-white border border-gray-200;
    @apply phone:py-3 phone:px-3 phone:w-fit phone:gap-3;
    @apply phone:grid-rows-2 phone:grid-flow-row;
}
.card-fit-graficas{
    @apply grid grid-rows-2 grid-flow-col gap-6 h-72 py-6 justify-items-center items-center rounded-lg overflow-hidden shadow-lg bg-white border border-gray-200;
    @apply phone:py-3 phone:px-3 phone:w-fit phone:gap-3;
    @apply phone:grid-rows-2 phone:grid-flow-row;
}

.card-17{
    @apply grid grid-rows-2 grid-flow-col gap-6 w-[17%] h-fit py-6 px-6 justify-items-center items-center rounded-lg overflow-hidden shadow-lg bg-white border border-gray-200;
    @apply phone:py-3 phone:px-3 phone:w-fit phone:gap-3;
    @apply phone:grid-rows-2 phone:grid-flow-row;
}

.icon-card{
    @apply row-span-2 text-gray-500 text-3xl;
    @apply phone:text-2xl;
}

.content-card{
    @apply grid w-full h-fit justify-start text-black;
    @apply desktop:row-span-2 desktop:col-span-2;
}

.title-card{
    @apply h-fit font-semibold text-sm;
    @apply phone:text-xs;
}

.description-card{
    @apply text-blue-700 text-lg font-bold;
    @apply phone:text-sm;
}
.description-card-v{
    @apply text-green-700 text-lg font-bold;
    @apply phone:text-sm;
}
.description-card-r{
    @apply text-red-700 text-lg font-bold;
    @apply phone:text-sm;
}
.description-card-n{
    @apply text-orange-500 text-lg font-bold;
    @apply phone:text-sm;
}
/* --------------- //CARD ------------------ */

/* --------------- MENU ------------------ */
.background-menu {
    @apply absolute w-full h-full bg-gray-900 opacity-50 z-30;
}

.btn-drawer-menu{
    @apply h-fit w-fit px-3 py-3 ;
    @apply text-sm tracking-wide font-bold text-white ;
    @apply bg-red-800 hover:bg-red-700 transition-colors duration-200 transform rounded-lg shadow-lg overflow-hidden ;
    @apply disabled:bg-boton-recepcion-disabled disabled:cursor-not-allowed ;
}

/* --------------- //MENU ------------------ */

/* --------------- BUTTONS ------------------ */
.btn-primary-login{
    @apply w-full py-4 px-6 ;
    @apply text-base tracking-wide font-bold text-white ;
    @apply bg-red-800 hover:bg-red-700 transition-colors duration-200 transform rounded-lg shadow-lg overflow-hidden ;
    @apply disabled:bg-boton-recepcion-disabled disabled:cursor-not-allowed ;
}



.btn-primary-fit{
    @apply h-fit w-fit px-5 py-4 ;
    @apply text-sm tracking-wide font-bold text-white ;
    @apply bg-red-800 hover:bg-red-700 transition-colors duration-200 transform rounded-lg shadow-lg overflow-hidden ;
    @apply disabled:bg-boton-recepcion-disabled disabled:cursor-not-allowed ;
}

.btn-primary-full{
    @apply h-full w-full px-5 py-4 ;
    @apply text-sm tracking-wide font-bold text-white text-center ;
    @apply bg-red-800 hover:bg-red-700 transition-colors duration-200 transform rounded-lg shadow-lg overflow-hidden ;
    @apply disabled:bg-boton-recepcion-disabled disabled:cursor-not-allowed ;
}

.btn-primary-full-movimientos{
    @apply h-fit w-full px-5 py-4 ;
    @apply text-sm tracking-wide font-bold text-white text-center ;
    @apply bg-red-800 hover:bg-red-700 transition-colors duration-200 transform rounded-lg shadow-lg overflow-hidden ;
    @apply disabled:bg-boton-recepcion-disabled disabled:cursor-not-allowed ;
}

.btn-primary-full-base{
    @apply h-full w-full px-5 py-4 ;
    @apply text-base tracking-wide font-bold text-white text-center ;
    @apply bg-red-800 hover:bg-red-700 transition-colors duration-200 transform rounded-lg shadow-lg overflow-hidden ;
    @apply disabled:bg-boton-recepcion-disabled disabled:cursor-not-allowed ;
}

.btn-primary-fit-base{
    @apply h-fit w-fit py-4 px-6 ;
    @apply text-base tracking-wide font-bold text-white text-center ;
    @apply bg-red-800 hover:bg-red-700 transition-colors duration-200 transform rounded-lg shadow-lg overflow-hidden ;
    @apply disabled:bg-boton-recepcion-disabled disabled:cursor-not-allowed ;
}

.btn-primary-fit-modal{
    @apply h-fit w-fit py-3 px-4 ;
    @apply text-sm tracking-wide font-bold text-white text-center ;
    @apply bg-red-800 hover:bg-red-700 transition-colors duration-200 transform rounded-lg shadow-lg overflow-hidden ;
    @apply disabled:bg-boton-recepcion-disabled disabled:cursor-not-allowed ;
}
.btn-primary-fit-fit-modal{
    @apply h-fit w-32 px-5 py-4 ;
    @apply text-sm tracking-wide font-bold text-white ;
    @apply bg-red-800 hover:bg-red-700 transition-colors duration-200 transform rounded-lg shadow-lg overflow-hidden ;
    @apply disabled:bg-boton-recepcion-disabled disabled:cursor-not-allowed ;
}
.btn-warning-fit-fit-modal{
    @apply h-fit w-32 px-5 py-4 ;
    @apply text-sm tracking-wide font-bold text-white ;
    @apply bg-yellow-500 hover:bg-yellow-600 transition-colors duration-200 transform rounded-lg shadow-lg overflow-hidden ;
    @apply disabled:bg-boton-recepcion-disabled disabled:cursor-not-allowed ;
}
.btn-action-fit-modal{
    @apply h-fit w-fit py-3 px-4 ;
    @apply text-sm tracking-wide font-bold text-white text-center ;
    @apply bg-green-600 hover:bg-green-700 transition-colors duration-200 transform rounded-lg shadow-lg overflow-hidden ;
    @apply disabled:bg-boton-recepcion-disabled disabled:cursor-not-allowed ;
}
.btn-danger-fit-modal{
    @apply h-fit w-fit py-3 px-4 ;
    @apply text-sm tracking-wide font-bold text-white text-center ;
    @apply bg-red-700 hover:bg-red-800 transition-colors duration-200 transform rounded-lg shadow-lg overflow-hidden ;
    @apply disabled:bg-boton-recepcion-disabled disabled:cursor-not-allowed ;
}
.label-danger-fit-modal{
    @apply h-fit w-fit py-3 px-4 ;
    @apply text-sm tracking-wide font-bold text-red-700 text-center ;
    @apply border border-red-700 ;
    @apply bg-input-disabled transition-colors duration-200 transform rounded-lg overflow-hidden ;
    @apply disabled:bg-boton-recepcion-disabled disabled:cursor-not-allowed ;
}
.label-action-fit-modal{
    @apply h-fit w-fit py-3 px-4 ;
    @apply text-sm tracking-wide font-bold text-green-700 text-center ;
    @apply border border-green-700 ;
    @apply bg-input-disabled transition-colors duration-200 transform rounded-lg overflow-hidden ;
    @apply disabled:bg-boton-recepcion-disabled disabled:cursor-not-allowed ;
}
.btn-select-fit-modal
{
    @apply h-fit w-fit py-3 px-4 ;
    @apply text-sm tracking-wide font-bold text-white text-center ;
    @apply bg-gray-500 hover:bg-gray-700 transition-colors duration-200 transform rounded-lg shadow-lg overflow-hidden ;
    @apply disabled:bg-boton-recepcion-disabled disabled:cursor-not-allowed ;
}
.btn-primary-full-modal{
    @apply h-fit w-full py-3 px-4 ;
    @apply text-sm tracking-wide font-bold text-white text-center ;
    @apply bg-red-800 hover:bg-red-700 transition-colors duration-200 transform rounded-lg shadow-lg overflow-hidden ;
    @apply disabled:bg-boton-recepcion-disabled disabled:cursor-not-allowed ;
}
.juntutos{
    @apply leading-tight ease-in-out ;
}

.btn-warning-fit-modal{
    @apply h-fit w-fit px-3 py-3 ;
    @apply text-sm tracking-wide font-bold text-white ;
    @apply bg-yellow-500 hover:bg-yellow-600 transition-colors duration-200 transform rounded-lg shadow-lg overflow-hidden ;
    @apply disabled:bg-boton-recepcion-disabled disabled:cursor-not-allowed ;

    /*bt-modal modal-open focus:outline-none text-white bg-boton-actualizar hover:border-boton-actualizar-hover focus:ring-4 focus:ring-ring-boton-actualizar font-bold shadow-lg rounded-lg text-sm px-5 py-2.5 mr-2 mb-2*/
}
.btn-cancel-fit-modal{
    @apply h-fit w-fit py-3 px-4 ;
    @apply text-sm tracking-wide font-bold text-gray-900 text-center ;
    @apply border border-gray-300 ;
    @apply bg-white hover:bg-zinc-300 transition-colors duration-200 transform rounded-lg shadow-lg overflow-hidden ;
    @apply disabled:bg-boton-recepcion-disabled disabled:cursor-not-allowed ;
}
.btn-cancel-fit-fit-modal{
    @apply h-fit w-fit py-1 px-4 ;
    @apply text-sm tracking-wide font-bold text-gray-900 text-center ;
    @apply border border-gray-300 ;
    @apply bg-white hover:bg-zinc-300 transition-colors duration-200 transform rounded-lg shadow-lg overflow-hidden ;
    @apply disabled:bg-boton-recepcion-disabled disabled:cursor-not-allowed ;
}

.btn-cancel-full-modal{
    @apply h-fit w-full py-3 px-4 ;
    @apply text-sm tracking-wide font-bold text-gray-900 text-center ;
    @apply border border-gray-300 ;
    @apply bg-white hover:bg-zinc-300 transition-colors duration-200 transform rounded-lg shadow-lg overflow-hidden ;
    @apply disabled:bg-boton-recepcion-disabled disabled:cursor-not-allowed ;
}




.btn-danger-fit{
    @apply h-fit w-fit px-5 py-4 ;
    @apply text-sm tracking-wide font-bold text-white ;
    @apply bg-red-700 hover:bg-red-800 transition-colors duration-200 transform rounded-lg shadow-lg overflow-hidden ;
    @apply disabled:bg-boton-recepcion-disabled disabled:cursor-not-allowed ;

    /*focus:outline-none text-white bg-boton-eliminar hover:bg-boton-eliminar-hover focus:ring-4 focus:ring-ring-boton-eliminar font-bold rounded-lg shadow-lg text-sm px-5 py-2.5 mr-2 mb-2*/
}

.btn-warning-fit{
    @apply h-fit w-fit px-5 py-4 ;
    @apply text-sm tracking-wide font-bold text-white ;
    @apply bg-yellow-500 hover:bg-yellow-600 transition-colors duration-200 transform rounded-lg shadow-lg overflow-hidden ;
    @apply disabled:bg-boton-recepcion-disabled disabled:cursor-not-allowed ;

    /*bt-modal modal-open focus:outline-none text-white bg-boton-actualizar hover:border-boton-actualizar-hover focus:ring-4 focus:ring-ring-boton-actualizar font-bold shadow-lg rounded-lg text-sm px-5 py-2.5 mr-2 mb-2*/
}

.btn-action-fit{
    @apply h-fit w-fit px-5 py-4 ;
    @apply text-sm tracking-wide font-bold text-white ;
    @apply bg-green-600 hover:bg-green-700 transition-colors duration-200 transform rounded-lg shadow-lg overflow-hidden ;
    @apply disabled:bg-boton-recepcion-disabled disabled:cursor-not-allowed ;

    /*focus:outline-none text-white bg-boton-descargar hover:bg-boton-descargar-hover focus:ring-4 focus:ring-ring-boton-descargar font-bold rounded-lg shadow-lg text-sm px-5 py-2.5 mr-2 mb-2*/
}
.btn-orange-fit{
    @apply h-fit w-fit px-5 py-4 ;
    @apply text-sm tracking-wide font-bold text-white ;
    @apply bg-orange-400 hover:bg-orange-500 transition-colors duration-200 transform rounded-lg shadow-lg overflow-hidden ;
    @apply disabled:bg-boton-recepcion-disabled disabled:cursor-not-allowed ;
}



.btn-primary-48{
    @apply h-fit w-48 px-5 py-4 ;
    @apply text-sm tracking-wide font-bold text-white ;
    @apply bg-red-800 hover:bg-red-700 transition-colors duration-200 transform rounded-lg shadow-lg overflow-hidden ;
    @apply disabled:bg-boton-recepcion-disabled disabled:cursor-not-allowed ;
}

.btn-primary-48-base{
    @apply h-fit w-48 px-5 py-4 ;
    @apply text-base tracking-wide font-bold text-white ;
    @apply bg-red-800 hover:bg-red-700 transition-colors duration-200 transform rounded-lg shadow-lg overflow-hidden ;
    @apply disabled:bg-boton-recepcion-disabled disabled:cursor-not-allowed ;
}
/* --------------- //BUTTONS ------------------ */




/* --------------- MODAL ------------------ */
.modal {
    @apply bg-modal transition-opacity ease-in-out duration-300;
    @apply  fixed w-full h-full top-0 left-0 flex items-center justify-center;
}

.backgroud-modal {
    @apply absolute w-full h-full bg-gray-900 opacity-50;
}

.content-modal-25 {
    @apply bg-white w-1/4 mx-auto rounded-lg shadow-lg z-50 overflow-y-auto;
    @apply phone:w-11/12;
    @apply phone:mx-2
}

.content-modal-33 {
    @apply bg-white w-2/6 mx-auto rounded-lg shadow-lg z-50 overflow-y-auto;
    @apply phone:w-11/12;
    @apply phone:mx-2
}

.content-modal-35 {
    @apply bg-white w-[35%] mx-auto rounded-lg shadow-lg z-50 overflow-y-auto;
    @apply phone:w-11/12;
    @apply phone:mx-2
}

.content-modal-40 {
    @apply bg-white w-2/5 mx-auto rounded-lg shadow-lg z-50 overflow-y-auto;
    @apply phone:w-11/12;
    @apply phone:mx-2
}
.content-modal-50 {
    @apply bg-white w-2/4 mx-auto rounded-lg shadow-lg z-50 overflow-y-auto;
    @apply phone:w-11/12;
    @apply phone:mx-2
}
.content-modal-70 {
    @apply bg-white w-3/4 mx-auto rounded-lg shadow-lg z-50 overflow-y-auto;
    @apply phone:w-11/12;
    @apply phone:mx-2
}
.content-modal-90
{
    @apply bg-white w-[90%] h-[80%] mx-auto rounded-lg shadow-lg z-50 overflow-y-auto;
    @apply phone:w-11/12;
    @apply phone:mx-2
}

.chechgrande{
    @apply h-4 w-4 border border-gray-300 rounded-sm bg-white checked:bg-blue-600 checked:border-blue-600 focus:outline-none transition duration-200 mt-1 align-top bg-no-repeat bg-center bg-contain float-left mr-2 cursor-pointer;
}
.imagendetalles{
    @apply text-9xl;
}

.footer-modal {
    @apply grid auto-rows-auto auto-cols-max grid-flow-col gap-3 justify-end py-4 px-4 bg-footer-modal;
}
.footer-modal1 {
    @apply grid auto-rows-auto auto-cols-max grid-flow-col gap-3 py-4 px-4 bg-footer-modal;
}
.footer-modal2 {
    @apply grid auto-rows-auto auto-cols-max grid-flow-col justify-end gap-3 py-4 px-4 bg-footer-modal;
}
.footer-modal-3 {
    @apply grid auto-rows-auto grid-flow-col gap-3 py-4 px-4 bg-footer-modal;
    @apply desktop:auto-cols-max desktop:justify-end;
    @apply phone:grid-flow-row;
}
/* --------------- //MODAL ------------------ */

.blanco
{
    @apply bg-white ;
}


/* --------------- FORM ------------------ */
.label-form{
    @apply block mb-2 text-base font-semibold text-gray-900;
}

.input-form{
    @apply block w-full bg-white text-gray-900 text-sm p-2.5;
    @apply border border-gray-400 rounded-lg;
    @apply focus:border-blue-500;
    @apply focus:ring-blue-500;
    @apply focus:ring;
    @apply focus:ring-opacity-40;
    @apply disabled:bg-select-disabled disabled:cursor-not-allowed
}
.alargar{
    @apply block w-full ;
}

.select-form{
    @apply block w-full bg-white text-gray-900 text-sm p-2.5;
    @apply border border-gray-400 rounded-lg;
    @apply focus:border-blue-500;
    @apply focus:ring-blue-500;
    @apply focus:ring;
    @apply focus:ring-opacity-40;
    @apply disabled:bg-select-disabled disabled:cursor-not-allowed
}

.select-form-2{
    @apply block bg-white text-gray-900 text-sm p-2.5;
    @apply border border-gray-400 rounded-lg;
    @apply focus:border-blue-500;
    @apply focus:ring-blue-500;
    @apply focus:ring;
    @apply focus:ring-opacity-40;
    @apply disabled:bg-select-disabled disabled:cursor-not-allowed
}
.personhi{
    width: 290px ;
}

.label-check-form{
    @apply block text-base font-semibold text-gray-900;
}

.input-check-form{
    @apply block w-4 h-4 bg-white text-gray-900 text-base p-2.5;
    @apply border border-gray-400 rounded-lg;
    @apply focus:border-blue-500;
    @apply disabled:bg-select-disabled disabled:cursor-not-allowed
}
/* --------------- //FORM ------------------ */



/* --------------- TABS ------------------ */
.btn-tabs{
    @apply inline-block p-4 rounded-t-lg border-b-2 font-bold border-transparent;
}

.btn-tabs:hover {
    @apply bg-white text-red-800 border-red-800;
}

.tabs-active {
    @apply bg-white text-red-800 border-red-800;
}
/* --------------- //TABS ------------------ */




/* --------------- ENVIO DE CORTES ------------------ */

.div-data-parcialidad-corte{
    @apply w-full h-fit pb-7 pt-4 px-5 rounded-lg overflow-hidden shadow-lg bg-white border border-gray-200;
}

/* --------------- //ENVIO DE CORTES ------------------ */



/* --------------- ERRORS ------------------ */
.content-error{
    @apply w-fit h-fit rounded-lg overflow-hidden shadow-lg bg-white border border-border-card-corte;
    @apply phone:mx-6;
}

.div-content-error{
    @apply w-fit mx-40 my-16 flex flex-col items-center;
    @apply phone:mx-5;
}
/* --------------- //ERRORS ------------------ */


.div-header-corte{
    @apply grid grid-flow-col auto-cols-auto my-9 rounded-lg overflow-hidden shadow-lg bg-white border border-gray-200 py-2;
    @apply phone:my-4;
}

.div-header-buttons-corte-resp{
    @apply grid grid-flow-col auto-cols-auto my-9 rounded-lg overflow-hidden shadow-lg bg-white border border-gray-200 py-2;
    @apply phone:my-4;
    @apply desktop:hidden;
}

.div-data-header-corte{
    @apply grid content-center text-2xl mx-7 my-4 py-4 px-4 w-fit;
    @apply phone:mx-4 phone:my-2 phone:py-2 phone:px-2;
}

.div-title-dashboard{
    @apply grid content-center text-2xl mx-7 my-4 py-4 px-4 w-fit;
    @apply phone:mx-auto phone:my-2 phone:py-2 phone:px-2 phone:w-full;
}

.div-buttons-header-corte{
    @apply grid grid-flow-col-dense auto-cols-max gap-3 content-center text-2xl mx-7 my-4 py-4 px-4 w-fit justify-self-end;
    @apply phone:hidden;
}

.div-buttons-header-corte-resp{
    @apply mx-3 my-3 pr-6 w-full;
    @apply grid grid-flow-row auto-rows-auto gap-1.5 content-center;
    @apply desktop:hidden;
}

.div-saludo{
    @apply grid content-center text-2xl mx-7 my-4 py-4 px-4 w-fit;
    @apply phone:mx-4 phone:my-2 phone:py-2 phone:px-2;

}

.div-content-dashboard{
    @apply mx-10 mb-10 mt-3;

    @apply phone:mx-5 phone:mb-5;
}

.div-content-dashboard{
    @apply mx-10 mb-10 mt-3;

    @apply phone:mx-5 phone:mb-5;
}

.div-content-card-dashboard{
    @apply mx-7 my-7 py-2 px-4;
    @apply phone:mx-4 phone:my-4 phone:py-2 phone:px-2;
}

.div-content-card{
    @apply mx-7 my-7;
    @apply phone:mx-4 phone:my-4 phone:py-2 phone:px-2;
}



















.header-nav{
    @apply bg-header-dashboard;
    @apply min-h-[35px] min-w-full w-fit pl-[12%];
    @apply grid grid-flow-col auto-cols-max gap-x-[65%];

    @apply phone:gap-x-9 phone:pl-5;
}
.card-user-nav{
    @apply grid grid-flow-col auto-rows-max content-center justify-items-end text-white
}

.ul-nav{
    @apply flex flex-col md:flex-row md:space-x-0 md:mt-0 md:text-sm md:font-medium min-h-full;
}

.div-drown-menu-nav{
    @apply w-full absolute z-10 hidden group-hover:block shadow-xl rounded-md overflow-hidden right-0;
}

.sub-div-drown-menu-nav{
    @apply px-2 py-2 bg-white shadow-lg grid grid-cols-1 gap-4 md:grid-cols-2;
}

.ul-item-drown-menu-nav{
    @apply py-1 text-sm w-full col-span-2;
}



.flagsucces{
    @apply rounded-full text-gray-200 bg-green-700 px-2 py-1 text-xs font-bold;
}
.flagwarning{
    @apply rounded-full text-gray-100 bg-orange-500 px-2 py-1 text-xs font-bold;
}
.flagdanger{
    @apply rounded-full text-gray-200 bg-red-700 px-2 py-1 text-xs font-bold;
}
.flagnothing{
    @apply rounded-full text-white bg-gray-700 px-2 py-1 text-xs font-bold;
}









body.modal-active {
    overflow-x: hidden;
    overflow-y: visible ;
}

.error {
    color: red;
    font-size: 0.85rem;
}



#tabla_mov tbody tr:last-child {
    color: #fff;
    background-color: #334155;
}


.dataTables_wrapper .dataTables_filter input {
    @apply border border-b-gray-500 rounded-md p-1 bg-transparent ml-1;
    @apply phone:w-full;
}

.hora{

    @apply text-[30px] text-green-600;

}
.fecha{
    @apply text-[30px] text-red-700;
}
.aviso
{
    @apply text-red-700;
}

.disabled{
    @apply bg-input-disabled cursor-not-allowed ;
}