html{
    scroll-behavior: smooth;
}
/* Login - page */

.fixed-background{
    background: url(../img/background/bg-login.webp) no-repeat center center fixed;
}

@media(max-width: 992px){
    .fixed-background{
        background: url(../img/background/bg-login_mobile.webp) no-repeat center center fixed;
    }
}
/* navigation - logout */
@media (min-width: 992px){
html[data-placement=horizontal]:not([data-mobile=true]) .menu-icons .user .name, html[data-placement=horizontal]:not([data-mobile=true]) .user-container .user .name {
    display: block!important;
}
}


/* select add package */
span.select2.select2-container.select2-container--bootstrap4 {
    width: 100%!important;
}
.select2-container--bootstrap4 .select2-selection--single .select2-selection__placeholder {
    line-height: 1.8;
    color: #757575;
}
[type=search]:focus{
    --tw-ring-color:var(--primary);
}
/* custom-tooltip */
.custom-tooltip svg{
    width: 15px;
}


/* data-picker */
.datepicker.dropdown-menu{
    margin-top: 5px!important;
}
.datepicker table tr td.disabled.day{
    color: var(--separator);
    cursor: default;
}
.datepicker table tr td.disabled.day:hover, .datepicker table tr td.disabled.focused {
    background:0 0!important;
    cursor: pointer;
}
/* tooltip */
.tooltip .tooltip-inner{
background: white!important;
color: var(--primary)!important;
border: 1px solid var(--primary)!important;
}
.tooltip.show{
    opacity: 1!important;
}



/* pagination */
div.dataTables_wrapper div.dataTables_paginate ul.pagination{
    margin-top: 16px!important;
}


/* new class */
.mw-100px{
    max-width: 60px;
}
.object-fit-contain{
    object-fit: contain;
}

.w-300px{
width: 300px;
}
/* .custom-height{

    height: calc(100% - 2rem);
} */


span.text-muted.crossed:after {
    content: "";
    height: 2px;
    width: 110%;
    display: inline-block;
    position: absolute;
    background: #AFAFAF;
    left: -2px;
    transform: rotate(10deg);
    top: 50%;
}

span.text-muted.crossed {
    position: relative;
}


/* switcher */

/* .form-switch .form-check-input:checked {
    background-position: right center!important;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e");
    background-color: var(--primary)!important;
    background-size: auto!important;

}
.form-switch .form-check-input {
    background-position: left center!important;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e")!important;
    background-color: var(--primary)!important;
    background-size: auto!important;

} */

.form-check-input:checked[type="radio"] {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/%3e%3c/svg%3e")!important;
}
.form-check-input[type="radio"]{
border-radius: var(--border-radius-sm);

}

input.form-control[name="registration_number"] {
    text-transform: uppercase;
}

.spinner-border{
    width: 1rem!important;
    height: 1rem!important;
}

a.fb-button{
    width:100%;
    background: #1877F2;
    color:white;
}

a.google-button{
    width:100%;
    background: var(--background-light);
    color:#666;
}

a.google-button img ,a.fb-button img{
    max-width: 30px;
    margin-right: 20px;
}

@media (max-width: 480px){
    a.fb-button img ,a.google-button img{
        max-width: 25px;
        margin-right: 10px;
    }
    a.fb-button,a.google-button{
    padding: 10px 20px;
    }
}

.mt-6.divider {
    display: flex;
    justify-content: space-around;
    align-items: center;
}
.mt-6.divider hr:not([size]) {
    height: 1px;
    width: 40%;
}
.btn-outline-white:not(:disabled):not(.disabled):active,.btn-outline-white:hover{
    box-shadow: inset 0 0 0 1px var(--light-text) !important;
    color: var(--light-text) !important;
    background: transparent !important;
}
#toogle-type a svg:last-child{
    display:none;
}
#toogle-type a{
top: 50% !important;
    transform: translateY(-50%);
}

@media(max-width: 992px){
    .left-login {
        padding-right: 1.5rem !important;
        padding-left: 1.5rem !important;
        height: 100vh;
        margin-left: 0px!important;
    }
    .left-login+div .full-page-content-right-border{
        border-radius:var(--border-radius-lg) !important
            }
            
            
   
}


@media(min-width:480px) and (max-width:992px){
    .left-login img {
        max-width: 200px;
    }
}