:root {
    /*--color-principal: #33658a;*/
    /*--color-principal: #aecbeb;*/
    /*--color-secundario: #a7bed3;*/
    /*--color-secundario: #b9bfc5;*/
    --color-principal: #6b9080;
    --color-secundario: #a4c3b2;
}

a, .btn-link {
    color: #006bb7;
}

.btn-primary {
    color: #fff;
    background-color: #1b6ec2;
    border-color: #1861ac;
}

.btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus, input:focus, form-select:focus {
    box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem var(--color-principal)!important;
}

.form-control:focus, .form-check-input:focus, input:focus, form-select:focus {
    border-color: white!important;
}

.form-check-input:checked {
    background-color: var(--color-principal)!important;
}

.content {
    padding-top: 1.1rem;
}

h1:focus {
    outline: none;
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid #e50000;
}

.validation-message {
    color: #e50000;
}

.a:hover {
    cursor: pointer!important;
}

.cursor-pointer:hover {
    cursor:pointer;
}

.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
    padding: 1rem 1rem 1rem 3.7rem;
    color: white;
}

    .blazor-error-boundary::after {
        content: "An error has occurred."
    }

.darker-border-checkbox.form-check-input {
    border-color: var(--color-principal);
}

.backgroundColorAiconClaimFixVerde {
    background-color: var(--color-principal) !important;
}
.backgroundColorAiconClaimFixSecundario {
    background-color: var(--color-secundario) !important;
}

.inputsFormularios:focus {
    border-color: var(--color-principal) !important;
    border-color: white !important;
}

.my-custom-button-class {
    border: 1px solid var(--color-principal);
    color: white;
    background-color: var(--color-principal);
    min-width: 5rem;
}

.my-custom-button-class:hover {
    background-color: var(--color-secundario)
}

    .my-custom-button-class:focus-visible {
        box-shadow: 0 0 0 3px var(--color-principal);
    }

.fixed-bottom-waticket {
    /*margin-top: auto;
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1030;*/
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 999;
}

.small-font-size {
    font-size: .8rem!important;
}

.background-semitransparente {
    /*background-color: #ffffff57;*/
    background-color: white
}

.ancho-maximo-input {
    max-width: 12rem;
}

/*.select-form {
    border-color: transparent !important;
    outline: 0;
    box-shadow: 0 0 0 .25rem transparent !important;
}*/

    .form-select:hover {
        border-color: var(--color-principal) !important;
        outline: 0;
        box-shadow: 0 0 0 .09rem var(--color-principal) !important;
    }

    .form-select:active {
        border-color: transparent!important;
        outline: 0;
        box-shadow: 0 0 0 .09rem transparent !important;
    }
input:focus-visible {
    border: none;
    outline: 0;
    box-shadow: 0 0 0 0!important;
}

.form-select:focus {
    border-color: transparent;
    outline: 0;
    box-shadow: 0 0 0 .25rem transparent;
}
    /*INPUTS*/
    /*ANIMACIONES*/
    /*SLIDE-TOP*/
    /*------------------------------------------------------------------------------------------*/
    .slide-top {
    -webkit-animation: slide-top 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
    animation: slide-top 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}

@-webkit-keyframes slide-top {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }

    100% {
        -webkit-transform: translateY(-50px);
        transform: translateY(-50px);
    }
}

@keyframes slide-top {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }

    100% {
        -webkit-transform: translateY(-50px);
        transform: translateY(-50px);
    }
}
/*------------------------------------------------------------------------------------------*/
.scale-up-center {
    -webkit-animation: scale-up-center 0.4s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
    animation: scale-up-center 0.4s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
}
@-webkit-keyframes scale-up-center {
    0% {
        -webkit-transform: scale(0.5);
        transform: scale(0.5);
    }

    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

@keyframes scale-up-center {
    0% {
        -webkit-transform: scale(0.5);
        transform: scale(0.5);
    }

    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}



/*MEDIAS QUERY*/

html {
    font-size: 14px;
    scroll-behavior: smooth;
    font-family: Calibri !important;
}

body {
    font-family: Calibri !important;
}

@media (min-width: 768px) {
    html {
        font-size: 16px;
    }
}

/* Sticky footer styles
-------------------------------------------------- */
html {
    position: relative;
    min-height: 100%;
}

body {
    /*Margin bottom by footer height */
    margin-bottom: 227px;
}

.footer {
    position: absolute;
    bottom: 0;
    width: 100%;
    white-space: nowrap;
    line-height: 45px; /* Vertically center the text there */
    background-color: var(--color-secundario);
    /*background-color: #1b4052*/
}

.botones {
    border: 1px solid var(--color-principal) !important;
    color: white !important;
    background-color: var(--color-principal) !important
}
    .botones:hover {
        color: var(--color-principal) !important;
        background-color: white !important
    }
.botones:active {
   transform: scale(0.95)
}
.labels {
    border: 1px solid var(--color-principal);
    color: white;
    background-color: var(--color-principal)
}


/*-------FONDO MOVIMIENTO-------------*/
/*---------FONDO GRADIENTE FIJO--------------*/
/*html, body {
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;*/
/*background-color: var(--color-secundario);*/
/*background: -webkit-linear-gradient(90deg, #d6d6d6,#26b564);*/ /* Chrome 10-25, Safari 5.1-6 */
/*background: linear-gradient(90deg, #d6d6d6,#26b564);*/ /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
/*background: rgb(255,255,255);*/
/*background: linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(38,181,100,1) 100%);*/
/*background: linear-gradient(90deg, rgba(255,255,255,1) 0%, rgb(141, 225, 178) 100%);*/
/*height: 100vh*/
/*}*/

/*FONDO MOVIMIENTO*/
/*@keyframes hero-gradient-animation {
    0% {
        --c-0: hsla(121, 61%, 77%, 0);
        --x-0: 95%;
        --y-0: 70%;
        --s-start-0: 5%;
        --s-end-0: 67%;
        --c-1: hsla(139, 92%, 80%, 0.26);
        --x-1: 63%;
        --y-1: 59%;
        --s-start-1: 5%;
        --s-end-1: 61%;
        --c-2: hsla(122, 71%, 95%, 1);
        --x-2: 58%;
        --y-2: 8%;
        --s-start-2: 6%;
        --s-end-2: 71%;
        --c-3: hsla(120, 66%, 76%, 0);
        --x-3: 78%;
        --y-3: 78%;
        --s-start-3: 12%;
        --s-end-3: 50%;
        --c-4: hsla(126.00000000000006, 74%, 80%, 0.66);
        --x-4: 2%;
        --y-4: 100%;
        --s-start-4: 2%;
        --s-end-4: 68%;
        --c-5: hsla(108, 93%, 61%, 0);
        --x-5: 52%;
        --y-5: 98%;
        --s-start-5: 17%;
        --s-end-5: 60%;
        --c-6: hsla(108, 59%, 97%, 1);
        --x-6: 47%;
        --y-6: 90%;
        --s-start-6: 13%;
        --s-end-6: 52%;
    }

    50% {
        --c-0: hsla(127, 65%, 66%, 0);
        --x-0: 24%;
        --y-0: 93%;
        --s-start-0: 11%;
        --s-end-0: 82%;
        --c-1: hsla(111.99999999999999, 88%, 86%, 0.83);
        --x-1: 92%;
        --y-1: 62%;
        --s-start-1: 20%;
        --s-end-1: 86%;
        --c-2: hsla(114, 96%, 94%, 1);
        --x-2: 22%;
        --y-2: 11%;
        --s-start-2: 1%;
        --s-end-2: 50%;
        --c-3: hsla(133, 71%, 66%, 0);
        --x-3: 16%;
        --y-3: 69%;
        --s-start-3: 14%;
        --s-end-3: 50%;
        --c-4: hsla(128, 77%, 85%, 0.36);
        --x-4: 15%;
        --y-4: 67%;
        --s-start-4: 0%;
        --s-end-4: 72%;
        --c-5: hsla(120, 93%, 73%, 0);
        --x-5: 59%;
        --y-5: 18%;
        --s-start-5: 5%;
        --s-end-5: 85%;
        --c-6: hsla(110.99999999999999, 63%, 70%, 0.71);
        --x-6: 13%;
        --y-6: 68%;
        --s-start-6: 12%;
        --s-end-6: 62%;
    }

    100% {
        --c-0: hsla(105, 80%, 83%, 0);
        --x-0: 66%;
        --y-0: 13%;
        --s-start-0: 19%;
        --s-end-0: 53%;
        --c-1: hsla(120, 56%, 68%, 0.66);
        --x-1: 35%;
        --y-1: 51%;
        --s-start-1: 5%;
        --s-end-1: 75%;
        --c-2: hsla(120, 68%, 100%, 1);
        --x-2: 57%;
        --y-2: 20%;
        --s-start-2: 14%;
        --s-end-2: 66%;
        --c-3: hsla(102, 81%, 89%, 0);
        --x-3: 15%;
        --y-3: 52%;
        --s-start-3: 4%;
        --s-end-3: 86%;
        --c-4: hsla(100, 86%, 98%, 1);
        --x-4: 12%;
        --y-4: 50%;
        --s-start-4: 3%;
        --s-end-4: 78%;
        --c-5: hsla(107, 97%, 70%, 0);
        --x-5: 96%;
        --y-5: 55%;
        --s-start-5: 12%;
        --s-end-5: 51%;
        --c-6: hsla(120, 65%, 90%, 1);
        --x-6: 30%;
        --y-6: 86%;
        --s-start-6: 3%;
        --s-end-6: 80%;
    }
}

@property --c-0 {
    syntax: '<color>';
    inherits: false;
    initial-value: hsla(121, 61%, 77%, 0)
}

@property --x-0 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 95%
}

@property --y-0 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 70%
}

@property --s-start-0 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 5%
}

@property --s-end-0 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 67%
}

@property --c-1 {
    syntax: '<color>';
    inherits: false;
    initial-value: hsla(139, 92%, 80%, 0.26)
}

@property --x-1 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 63%
}

@property --y-1 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 59%
}

@property --s-start-1 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 5%
}

@property --s-end-1 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 61%
}

@property --c-2 {
    syntax: '<color>';
    inherits: false;
    initial-value: hsla(122, 71%, 95%, 1)
}

@property --x-2 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 58%
}

@property --y-2 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 8%
}

@property --s-start-2 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 6%
}

@property --s-end-2 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 71%
}

@property --c-3 {
    syntax: '<color>';
    inherits: false;
    initial-value: hsla(120, 66%, 76%, 0)
}

@property --x-3 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 78%
}

@property --y-3 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 78%
}

@property --s-start-3 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 12%
}

@property --s-end-3 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 50%
}

@property --c-4 {
    syntax: '<color>';
    inherits: false;
    initial-value: hsla(126.00000000000006, 74%, 80%, 0.66)
}

@property --x-4 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 2%
}

@property --y-4 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 100%
}

@property --s-start-4 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 2%
}

@property --s-end-4 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 68%
}

@property --c-5 {
    syntax: '<color>';
    inherits: false;
    initial-value: hsla(108, 93%, 61%, 0)
}

@property --x-5 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 52%
}

@property --y-5 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 98%
}

@property --s-start-5 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 17%
}

@property --s-end-5 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 60%
}

@property --c-6 {
    syntax: '<color>';
    inherits: false;
    initial-value: hsla(108, 59%, 97%, 1)
}

@property --x-6 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 47%
}

@property --y-6 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 90%
}

@property --s-start-6 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 13%
}

@property --s-end-6 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 52%
}

html {
    --c-0: hsla(121, 61%, 77%, 0);
    --x-0: 95%;
    --y-0: 70%;
    --c-1: hsla(139, 92%, 80%, 0.26);
    --x-1: 63%;
    --y-1: 59%;
    --c-2: hsla(122, 71%, 95%, 1);
    --x-2: 58%;
    --y-2: 8%;
    --c-3: hsla(120, 66%, 76%, 0);
    --x-3: 78%;
    --y-3: 78%;
    --c-4: hsla(126.00000000000006, 74%, 80%, 0.66);
    --x-4: 2%;
    --y-4: 100%;
    --c-5: hsla(108, 93%, 61%, 0);
    --x-5: 52%;
    --y-5: 98%;
    --c-6: hsla(108, 59%, 97%, 1);
    --x-6: 47%;
    --y-6: 90%;
    background-color: hsla(146.42857142857142, 58%, 71%, 0.46);
    background-image: radial-gradient(circle at var(--x-0) var(--y-0), var(--c-0) var(--s-start-0), transparent var(--s-end-0)), radial-gradient(circle at var(--x-1) var(--y-1), var(--c-1) var(--s-start-1), transparent var(--s-end-1)), radial-gradient(circle at var(--x-2) var(--y-2), var(--c-2) var(--s-start-2), transparent var(--s-end-2)), radial-gradient(circle at var(--x-3) var(--y-3), var(--c-3) var(--s-start-3), transparent var(--s-end-3)), radial-gradient(circle at var(--x-4) var(--y-4), var(--c-4) var(--s-start-4), transparent var(--s-end-4)), radial-gradient(circle at var(--x-5) var(--y-5), var(--c-5) var(--s-start-5), transparent var(--s-end-5)), radial-gradient(circle at var(--x-6) var(--y-6), var(--c-6) var(--s-start-6), transparent var(--s-end-6));
    animation: hero-gradient-animation 10s linear infinite alternate;
    background-blend-mode: normal, normal, normal, normal, normal, normal, normal;
}*/
/*@keyframes hero-gradient-animation {
    0% {
        --c-0: hsla(121, 61%, 77%, 0);
        --x-0: 95%;
        --y-0: 70%;
        --s-start-0: 5%;
        --s-end-0: 67%;
        --c-1: hsla(139, 92%, 80%, 1);
        --x-1: 63%;
        --y-1: 59%;
        --s-start-1: 5%;
        --s-end-1: 61%;
        --c-2: hsla(122, 71%, 95%, 1);
        --x-2: 58%;
        --y-2: 8%;
        --s-start-2: 6%;
        --s-end-2: 71%;
        --c-3: hsla(120, 66%, 76%, 0);
        --x-3: 78%;
        --y-3: 78%;
        --s-start-3: 12%;
        --s-end-3: 50%;
        --c-4: hsla(126, 78%, 80%, 1);
        --x-4: 2%;
        --y-4: 100%;
        --s-start-4: 2%;
        --s-end-4: 68%;
        --c-5: hsla(108, 93%, 61%, 0);
        --x-5: 52%;
        --y-5: 98%;
        --s-start-5: 17%;
        --s-end-5: 60%;
        --c-6: hsla(108, 59%, 97%, 1);
        --x-6: 47%;
        --y-6: 90%;
        --s-start-6: 13%;
        --s-end-6: 52%;
    }

    50% {
        --c-0: hsla(127, 65%, 66%, 0);
        --x-0: 24%;
        --y-0: 93%;
        --s-start-0: 11%;
        --s-end-0: 82%;
        --c-1: hsla(112, 89%, 86%, 1);
        --x-1: 92%;
        --y-1: 62%;
        --s-start-1: 20%;
        --s-end-1: 86%;
        --c-2: hsla(114, 96%, 94%, 1);
        --x-2: 22%;
        --y-2: 11%;
        --s-start-2: 1%;
        --s-end-2: 50%;
        --c-3: hsla(133, 71%, 66%, 0);
        --x-3: 16%;
        --y-3: 69%;
        --s-start-3: 14%;
        --s-end-3: 50%;
        --c-4: hsla(128, 77%, 85%, 1);
        --x-4: 15%;
        --y-4: 67%;
        --s-start-4: 0%;
        --s-end-4: 72%;
        --c-5: hsla(120, 93%, 73%, 0);
        --x-5: 59%;
        --y-5: 18%;
        --s-start-5: 5%;
        --s-end-5: 85%;
        --c-6: hsla(110.99999999999999, 63%, 70%, 1);
        --x-6: 13%;
        --y-6: 68%;
        --s-start-6: 12%;
        --s-end-6: 62%;
    }

    100% {
        --c-0: hsla(105, 80%, 83%, 0);
        --x-0: 66%;
        --y-0: 13%;
        --s-start-0: 19%;
        --s-end-0: 53%;
        --c-1: hsla(120, 56%, 68%, 0.87);
        --x-1: 35%;
        --y-1: 51%;
        --s-start-1: 5%;
        --s-end-1: 75%;
        --c-2: hsla(120, 68%, 100%, 1);
        --x-2: 57%;
        --y-2: 20%;
        --s-start-2: 14%;
        --s-end-2: 66%;
        --c-3: hsla(102, 81%, 89%, 0);
        --x-3: 15%;
        --y-3: 52%;
        --s-start-3: 4%;
        --s-end-3: 86%;
        --c-4: hsla(100, 86%, 98%, 1);
        --x-4: 12%;
        --y-4: 50%;
        --s-start-4: 3%;
        --s-end-4: 78%;
        --c-5: hsla(107, 97%, 70%, 0);
        --x-5: 96%;
        --y-5: 55%;
        --s-start-5: 12%;
        --s-end-5: 51%;
        --c-6: hsla(120, 65%, 90%, 1);
        --x-6: 30%;
        --y-6: 86%;
        --s-start-6: 3%;
        --s-end-6: 80%;
    }
}

@property --c-0 {
    syntax: '<color>';
    inherits: false;
    initial-value: hsla(121, 61%, 77%, 0)
}

@property --x-0 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 95%
}

@property --y-0 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 70%
}

@property --s-start-0 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 5%
}

@property --s-end-0 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 67%
}

@property --c-1 {
    syntax: '<color>';
    inherits: false;
    initial-value: hsla(139, 92%, 80%, 1)
}

@property --x-1 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 63%
}

@property --y-1 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 59%
}

@property --s-start-1 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 5%
}

@property --s-end-1 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 61%
}

@property --c-2 {
    syntax: '<color>';
    inherits: false;
    initial-value: hsla(122, 71%, 95%, 1)
}

@property --x-2 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 58%
}

@property --y-2 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 8%
}

@property --s-start-2 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 6%
}

@property --s-end-2 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 71%
}

@property --c-3 {
    syntax: '<color>';
    inherits: false;
    initial-value: hsla(120, 66%, 76%, 0)
}

@property --x-3 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 78%
}

@property --y-3 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 78%
}

@property --s-start-3 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 12%
}

@property --s-end-3 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 50%
}

@property --c-4 {
    syntax: '<color>';
    inherits: false;
    initial-value: hsla(126, 78%, 80%, 1)
}

@property --x-4 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 2%
}

@property --y-4 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 100%
}

@property --s-start-4 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 2%
}

@property --s-end-4 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 68%
}

@property --c-5 {
    syntax: '<color>';
    inherits: false;
    initial-value: hsla(108, 93%, 61%, 0)
}

@property --x-5 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 52%
}

@property --y-5 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 98%
}

@property --s-start-5 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 17%
}

@property --s-end-5 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 60%
}

@property --c-6 {
    syntax: '<color>';
    inherits: false;
    initial-value: hsla(108, 59%, 97%, 1)
}

@property --x-6 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 47%
}

@property --y-6 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 90%
}

@property --s-start-6 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 13%
}

@property --s-end-6 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 52%
}

html {
    --c-0: hsla(121, 61%, 77%, 0);
    --x-0: 95%;
    --y-0: 70%;
    --c-1: hsla(139, 92%, 80%, 1);
    --x-1: 63%;
    --y-1: 59%;
    --c-2: hsla(122, 71%, 95%, 1);
    --x-2: 58%;
    --y-2: 8%;
    --c-3: hsla(120, 66%, 76%, 0);
    --x-3: 78%;
    --y-3: 78%;
    --c-4: hsla(126, 78%, 80%, 1);
    --x-4: 2%;
    --y-4: 100%;
    --c-5: hsla(108, 93%, 61%, 0);
    --x-5: 52%;
    --y-5: 98%;
    --c-6: hsla(108, 59%, 97%, 1);
    --x-6: 47%;
    --y-6: 90%;
    background-color: hsla(146.42857142857142, 58%, 71%, 1);
    background-image: radial-gradient(circle at var(--x-0) var(--y-0), var(--c-0) var(--s-start-0), transparent var(--s-end-0)), radial-gradient(circle at var(--x-1) var(--y-1), var(--c-1) var(--s-start-1), transparent var(--s-end-1)), radial-gradient(circle at var(--x-2) var(--y-2), var(--c-2) var(--s-start-2), transparent var(--s-end-2)), radial-gradient(circle at var(--x-3) var(--y-3), var(--c-3) var(--s-start-3), transparent var(--s-end-3)), radial-gradient(circle at var(--x-4) var(--y-4), var(--c-4) var(--s-start-4), transparent var(--s-end-4)), radial-gradient(circle at var(--x-5) var(--y-5), var(--c-5) var(--s-start-5), transparent var(--s-end-5)), radial-gradient(circle at var(--x-6) var(--y-6), var(--c-6) var(--s-start-6), transparent var(--s-end-6));
    animation: hero-gradient-animation 10s linear infinite alternate;
    background-blend-mode: normal, normal, normal, normal, normal, normal, normal;
}*/
body {
    /*background-color:transparent;*/
    background-color: var(--color-secundario);
}

/*[type="date"] {
    background: #fff url(https://cdn1.iconfinder.com/data/icons/cc_mono_icon_set/blacks/16x16/calendar_2.png) 97% 50% no-repeat;
}

    [type="date"]::-webkit-inner-spin-button {
        display: none;
    }

    [type="date"]::-webkit-calendar-picker-indicator {
        opacity: 0;
    }

date-time-picker {
    border: 1px solid #c4c4c4;
    border-radius: 5px;
    background-color: #fff;
    padding: 3px 5px;
    box-shadow: inset 0 3px 6px rgba(0,0,0,0.1);
    width: 190px;
}*/



/*@keyframes hero-gradient-animation {
    0% {
        --c-0: hsla(127, 19%, 70%, 1);
        --x-0: 96%;
        --y-0: 27%;
        --s-start-0: 2%;
        --s-end-0: 58%;
        --c-1: hsla(159, 24%, 87%, 1);
        --x-1: 7%;
        --y-1: 9%;
        --s-start-1: 2%;
        --s-end-1: 58%;
        --c-2: hsla(111, 13%, 68%, 1);
        --x-2: 30%;
        --y-2: 21%;
        --s-start-2: 2%;
        --s-end-2: 58%;
        --c-3: hsla(97, 42%, 86%, 1);
        --x-3: 13%;
        --y-3: 14%;
        --s-start-3: 2%;
        --s-end-3: 58%;
        --c-4: hsla(104, 44%, 82%, 1);
        --x-4: 28%;
        --y-4: 65%;
        --s-start-4: 2%;
        --s-end-4: 58%;
    }

    100% {
        --c-0: hsla(153, 14%, 91%, 1);
        --x-0: 41%;
        --y-0: 50%;
        --s-start-0: 2%;
        --s-end-0: 58%;
        --c-1: hsla(165, 39%, 61%, 1);
        --x-1: 5%;
        --y-1: 6%;
        --s-start-1: 2%;
        --s-end-1: 58%;
        --c-2: hsla(112, 48%, 83%, 1);
        --x-2: 8%;
        --y-2: 16%;
        --s-start-2: 2%;
        --s-end-2: 58%;
        --c-3: hsla(153, 12%, 79%, 1);
        --x-3: 22%;
        --y-3: 94%;
        --s-start-3: 2%;
        --s-end-3: 58%;
        --c-4: hsla(153, 44%, 80%, 1);
        --x-4: 56%;
        --y-4: 36%;
        --s-start-4: 2%;
        --s-end-4: 58%;
    }
}

@property --c-0 {
    syntax: '<color>';
    inherits: false;
    initial-value: hsla(127, 19%, 70%, 1)
}

@property --x-0 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 96%
}

@property --y-0 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 27%
}

@property --s-start-0 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 2%
}

@property --s-end-0 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 58%
}

@property --c-1 {
    syntax: '<color>';
    inherits: false;
    initial-value: hsla(159, 24%, 87%, 1)
}

@property --x-1 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 7%
}

@property --y-1 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 9%
}

@property --s-start-1 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 2%
}

@property --s-end-1 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 58%
}

@property --c-2 {
    syntax: '<color>';
    inherits: false;
    initial-value: hsla(111, 13%, 68%, 1)
}

@property --x-2 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 30%
}

@property --y-2 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 21%
}

@property --s-start-2 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 2%
}

@property --s-end-2 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 58%
}

@property --c-3 {
    syntax: '<color>';
    inherits: false;
    initial-value: hsla(97, 42%, 86%, 1)
}

@property --x-3 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 13%
}

@property --y-3 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 14%
}

@property --s-start-3 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 2%
}

@property --s-end-3 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 58%
}

@property --c-4 {
    syntax: '<color>';
    inherits: false;
    initial-value: hsla(104, 44%, 82%, 1)
}

@property --x-4 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 28%
}

@property --y-4 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 65%
}

@property --s-start-4 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 2%
}

@property --s-end-4 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 58%
}

html {
    --c-0: hsla(127, 19%, 70%, 1);
    --x-0: 96%;
    --y-0: 27%;
    --c-1: hsla(159, 24%, 87%, 1);
    --x-1: 7%;
    --y-1: 9%;
    --c-2: hsla(111, 13%, 68%, 1);
    --x-2: 30%;
    --y-2: 21%;
    --c-3: hsla(97, 42%, 86%, 1);
    --x-3: 13%;
    --y-3: 14%;
    --c-4: hsla(104, 44%, 82%, 1);
    --x-4: 28%;
    --y-4: 65%;
    ;
    background-color: hsla(155, 43%, 77%, 1);
    background-image: radial-gradient(circle at var(--x-0) var(--y-0), var(--c-0) var(--s-start-0), transparent var(--s-end-0)), radial-gradient(circle at var(--x-1) var(--y-1), var(--c-1) var(--s-start-1), transparent var(--s-end-1)), radial-gradient(circle at var(--x-2) var(--y-2), var(--c-2) var(--s-start-2), transparent var(--s-end-2)), radial-gradient(circle at var(--x-3) var(--y-3), var(--c-3) var(--s-start-3), transparent var(--s-end-3)), radial-gradient(circle at var(--x-4) var(--y-4), var(--c-4) var(--s-start-4), transparent var(--s-end-4));
    animation: hero-gradient-animation 10s linear infinite alternate;
    background-blend-mode: normal, normal, normal, normal, normal;
}*/
/*html {
    background-color: hsla(258, 85%, 86%, 1);
    background-image: radial-gradient(circle at 70% 83%, hsla(221, 92%, 88%, 1) 7%, transparent 64%), radial-gradient(circle at 23% 37%, hsla(265, 73%, 92%, 1) 7%, transparent 64%), radial-gradient(circle at 64% 91%, hsla(294, 72%, 83%, 1) 7%, transparent 64%), radial-gradient(circle at 24% 55%, hsla(338, 75%, 99%, 1) 7%, transparent 64%), radial-gradient(circle at 75% 13%, hsla(196, 79%, 98%, 1) 7%, transparent 64%), radial-gradient(circle at 62% 84%, hsla(262, 100%, 80%, 1) 7%, transparent 64%), radial-gradient(circle at 82% 34%, hsla(255, 72%, 89%, 1) 7%, transparent 64%), radial-gradient(circle at 33% 83%, hsla(167, 79%, 96%, 1) 7%, transparent 64%), radial-gradient(circle at 23% 57%, hsla(315, 82%, 85%, 1) 7%, transparent 64%), radial-gradient(circle at 82% 51%, hsla(286, 82%, 85%, 1) 7%, transparent 64%);
    background-blend-mode: normal, normal, normal, normal, normal, normal, normal, normal, normal, normal;
}*/
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Firefox */
input[type=number] {
    -moz-appearance: textfield; /* Esto quita los spinners en Firefox */
}

.min-max-width {
    max-width: 10rem;
    min-width: 8rem;
}
.min-max-width-mensaje {
    min-width: 3.5rem;
    max-width: 3.5rem;
}
.scale-in-center {
    -webkit-animation: scale-in-center 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
    animation: scale-in-center 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}
@-webkit-keyframes scale-in-center {
    0% {
        -webkit-transform: scale(0);
        transform: scale(0);
        opacity: 1;
    }

    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
        opacity: 1;
    }
}

@keyframes scale-in-center {
    0% {
        -webkit-transform: scale(0);
        transform: scale(0);
        opacity: 1;
    }

    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
        opacity: 1;
    }
}




/** ----------------------------------------
* animation slide-in-fwd-left
* ----------------------------------------*/

.slide-in-fwd-left {
    -webkit-animation: slide-in-fwd-left 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
    animation: slide-in-fwd-left 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}

@-webkit-keyframes slide-in-fwd-left {
    0% {
        -webkit-transform: translateZ(-1400px) translateX(-1000px);
        transform: translateZ(-1400px) translateX(-1000px);
        opacity: 0;
    }

    100% {
        -webkit-transform: translateZ(0) translateX(0);
        transform: translateZ(0) translateX(0);
        opacity: 1;
    }
}

@keyframes slide-in-fwd-left {
    0% {
        -webkit-transform: translateZ(-1400px) translateX(-1000px);
        transform: translateZ(-1400px) translateX(-1000px);
        opacity: 0;
    }

    100% {
        -webkit-transform: translateZ(0) translateX(0);
        transform: translateZ(0) translateX(0);
        opacity: 1;
    }
}
/**
 * ----------------------------------------
 * animation slide-in-fwd-right
 * ----------------------------------------
 */

.slide-in-fwd-right {
    -webkit-animation: slide-in-fwd-right 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
    animation: slide-in-fwd-right 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}
@-webkit-keyframes slide-in-fwd-right {
    0% {
        -webkit-transform: translateZ(-1400px) translateX(1000px);
        transform: translateZ(-1400px) translateX(1000px);
        opacity: 0;
    }

    100% {
        -webkit-transform: translateZ(0) translateX(0);
        transform: translateZ(0) translateX(0);
        opacity: 1;
    }
}

@keyframes slide-in-fwd-right {
    0% {
        -webkit-transform: translateZ(-1400px) translateX(1000px);
        transform: translateZ(-1400px) translateX(1000px);
        opacity: 0;
    }

    100% {
        -webkit-transform: translateZ(0) translateX(0);
        transform: translateZ(0) translateX(0);
        opacity: 1;
    }
}


.message-textarea {
    width: 100%;
    padding: 10px;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-size: .9rem;
    resize: none;
    transition: border-color 0.4s ease, box-shadow 0.4s ease;
}

.message-item {
    background-color: #fff;
    padding: 10px;
    border: 1px solid #ddd;
    border-radius: 4px;
    margin-bottom: 10px;
    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1);
}

.message-textarea:focus {
    border-color: #00000021;
    box-shadow: 0 0 3px rgb(0 0 0 / 50%);
    outline: none;
}

.min-width-form-editar {
    min-width: 20rem;
}

.boton-volver {
    border: 1px solid white!important;
}
.header-usuario {
    min-height: 7rem;
}
.border-radius {
    border-radius: 1.25rem;
}
td {
    height: 3rem;
}
.alert {
    position: relative;
    padding: 1rem 1rem;
    margin-bottom: 1rem;
    border: 1px solid var(--color-principal);
    border-radius: .25rem;
    margin-top: 1rem;
}
.disabled-waticket {
    background-color: rgb(239 239 239 / 69%) !important;
    transition: none;
}
    .disabled-waticket:hover {
        background-color: rgb(239 239 239 / 69%)!important;
        cursor: initial;
    }
    .disabled-waticket:active {
        transform: scale(1)!important;
    }

.spanCantidadRegistros {
    z-index: 99;
    position: absolute;
    left: 173px;
    top: 12px;
    z-index: 999;
}

.mostrar {
    display: block;
}

.ocultar {
    display: none;
}
