@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');

:root {
    --main-color: #0c1e3e;
    --main-color-2: #183568;
    --secondary-color: rgba(8,225,136,1);
    --gradient: linear-gradient(51deg, rgba(12,30,62,1) 0%, rgba(12,33,63,1) 50%, rgba(11,36,64,1) 55%, rgba(11,41,66,1) 59%, rgba(10,53,70,1) 65%, rgba(9,70,75,1) 71%, rgba(8,87,81,1) 75%, rgba(7,103,86,1) 80%, rgba(7,104,86,1) 84%, rgba(7,110,88,1) 88%, rgba(6,121,92,1) 95%, rgba(7,104,86,1) 100%, rgba(0,138,80,1) 100%);
}

/* GRAL */
*{
    font-family: "Roboto", sans-serif;
}
input:focus{
    -webkit-box-shadow: none;
            box-shadow: none;
    border: 1px solid transparent;
}
.btn{
    background-color: #2E1FDF;
    border: 1px solid #2E1FDF;
    font-size: 16px;
}
.margin__r{
    margin-right: 10px;

}
.error{
    color: red;
    font-weight: 700;
    margin-top: 14px;
}
/* Home */
.home{
    height: 100vh;
    width: 100vw;
    background: var(--main-color);
    background: var(--gradient);
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
/* Auth */
.login{
    font-size: 14px;
    color: white;
    height: 100vh;
    width: 100vw;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    background: var(--main-color);
    background: var(--gradient);
}
.login__container{
    background-color: #0C1E3E;
    -webkit-box-shadow: -6px -6px 24px -9px #08ff882b;
            box-shadow: -6px -6px 24px -9px #08ff882b;
    border-radius: 20px;
}
/* Nav */
.nav__navbar{
    background: var(--main-color);
    background: var(--gradient);
    color: white;
    height: 70px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
}
.nav__navbar .nav__container{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
}
/* Dasboard */
.dashboard__title{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
}
.dashboard__card .actions{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    min-height: 60px;
}
.dashboard__card .actions button{
    background-color: transparent;
    border: none;
}
#time{
    font-weight: 700;
}
.dashboard__card-action{
    cursor: pointer;
}
.dashboard__card-action:hover{
    background-color: var(--main-color-2);
    -webkit-transition: 0.2s;
    -o-transition: 0.2s;
    transition: 0.2s;
}
.dashboard__card{
    background-color: var(--main-color);
    height: 80px;
    padding: 10px;
    color: white;
    border-radius: 10px;
}
.dashboard__card-subtitle{
    font-size: 24px;
    font-weight: 700;
}
.table{
    font-size: 14px;
}
.done{
    color: white;
    background-color: var(--secondary-color);
    background: var(--gradient);
    border-radius: 3px;
    padding: 2px;
    text-align: center;
}
.pending{
    border-radius: 3px;
    padding: 2px;
}

/* Data table */
.dt-layout-row{
    font-size: 13px !important;
    margin-bottom: 15px;
}


div.dt-search {
    float: right;
}
 
div.dt-info {
    float: left;
    margin-top: 0.8em;
}
 
div.dt-paging {
    float: right;
    margin-top: 0.5em;
}

#guestTable_wrapper .dt-buttons {
    float: left;
}

.qr__link svg{
    margin-right: 0.5rem;
}
div.dt-buttons .dt-button.buttons-csv,
div.dt-buttons .dt-button.buttons-excel{
    background: var(--gradient) !important;
    color: #fff !important;
    border: none !important;
    font-weight: 500;
    letter-spacing: 0.125em;
    border-radius: 0.25rem;
}

.logout__button {
    text-decoration: none;
}
.logout__button svg {
    stroke: #fff;
}