@charset "utf-8";

/* CSS Document */

.img-login                            { max-height:120px; }



/* Rules for icon sizes Material:*/

.material-icons                       { max-width:24px; display:inline-flex; vertical-align:middle; }

.material-icons.md-18                 { font-size:18px; }

.material-icons.md-24                 { font-size:24px; }

/* Default */

.material-icons.md-36                 { font-size:36px; }

.material-icons.md-48                 { font-size:48px }



/*  TDIL:Added to the original components */

.brand-form                           { overflow-x:hidden; }

.dropdown-menu-title                  { color:white; padding:11px 22px; font-weight:700; clear:both; display:inline-block; overflow:hidden; white-space:nowrap; }

.image-preview                        { width:96px; height:96px; background-color:aliceblue; background-image:url(../images/image-preview.jpeg); background-repeat:no-repeat; background-size:cover; }

.image-preview-large                  { width:164px; height:164px; background-color:aliceblue; background-image:url(../images/image-preview.jpeg); background-repeat:no-repeat; background-size:cover; border:1px solid #999; border-radius:4px; }

.row.card.card-special                { display:flex; width:100%; margin:15px auto; flex-direction:inherit; padding:0 10px; }

input.w-button                        { min-height:44px; }

h3.form-section                       { display:inline-block; padding-top:3.3125rem; padding-bottom:0.3125rem; margin-right:1rem; font-size:1.15rem; line-height:inherit; white-space:nowrap; border-bottom:1px solid #eaeaea; width:100%; }

.custom-control.custom-switch         { padding-left:57px; padding-top:37px; }

.custom-control.custom-switch         { padding-left:57px; padding-top:10px; }



.brand-form .form-group               { margin-bottom:1rem; display:inline-grid; }

.row.button-container                 { margin:15px 0; text-align:right; display:block; }

p.tutorial,

label span.tutorial                   { color:#3e3e3e; font-size:0.8rem; font-weight:300; }

label.error                           { color:#b10909; font-size:1rem; font-weight:500;  }

a.btn-collapser                       { color:#000; width:100%; display:block; background-color:aliceblue; padding:10px 6px 7px; }

.btn-square                           { aspect-ratio:1; width:164px; max-width:164px; margin:0; padding:0; cursor:auto!important; overflow:hidden; }

.btn-square span                      { position:absolute; z-index:10; width:162px; height:162px; top:109px; left:6px; }

.no-file                              { background-color:#eaeaea; border:1px solid #999; border-radius:4px; text-align:center; padding-top:25%; }

input.search-special                  { outline:none; width:calc(40vw - 150px); margin-right:150px; }

button.aside-list                     { position:absolute; right:15px; top:46px; z-index:1000; }

.t-medium                               { font-size:0.8rem; }

/* BOOTSTRAP REWRITES */



.btn-primary                          { color: #fff!important; }

.list-group-item                      { border: 0px solid rgba(0, 0, 0, 0.125); }

@media (min-width: 1200px){

    .container_user-per {

        max-width: 96%;

    }

}



/* Titles */



.title_container{

    display: grid;

    grid-template-columns: auto 1fr;

    align-items: center;

    justify-content: center;

    margin-bottom: 40px;

}

.title{

    text-align: center;

    letter-spacing: 0em;

    margin-left: 50px;

    margin-right: 50px;

}

@media (max-width: 1000px) {

    .title{

        margin-left: 25px;

        margin-right: 25px;

    }

}

.h1_title {

    font-size: 28px;

    font-weight: 300;

    line-height: 34px;

    color: #3579F6;

}

.p_sub_title {

    font-size: 16px;

    font-weight: 300;

    line-height: 19px;

}

.return {

    font-weight: 300;

}



/* editar-rol.php */

.users_container {

    height: 65vh;

}

.permissions_container {

    height: 65vh;

    border: solid 4px #0077F7;

    border-radius: 4px;

    padding: 20px;

}



.users_container .list-group-item { color: #3579F6;} /* boostrap styles editado */

.users_container .list-group-item.active {color: #fff;} /* boostrap styles editado */

.list-group-x   { padding:0 }



/* material-swhit */

.material-switch>input[type="checkbox"] {

    display: none;

}



.material-switch>label {

    cursor: pointer;

    height: 0px;

    position: relative;

    width: 40px;

}



.material-switch>label::before {

    background: rgb(0, 0, 0);

    box-shadow: inset 0px 0px 10px rgba(0, 0, 0, 0.5);

    border-radius: 8px;

    content: '';

    height: 16px;

    margin-top: -8px;

    position: absolute;

    opacity: 0.3;

    transition: all 0.4s ease-in-out;

    width: 40px;

}



.material-switch>label::after {

    background: rgb(255, 255, 255);

    border-radius: 16px;

    box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.3);

    content: '';

    height: 24px;

    left: -4px;

    margin-top: -8px;

    position: absolute;

    top: -4px;

    transition: all 0.3s ease-in-out;

    width: 24px;

}



.material-switch>input[type="checkbox"]:checked+label::before {

    background: #0077F7;

    opacity: 0.5;

}



.material-switch>input[type="checkbox"]:checked+label::after {

    background: #0077F7;;

    left: 20px;

}



.btn-primary                          { color:#fff!important; }



/** new styles 20230726 **/

h1,h2,h3,h4,h5,bold,strong,.h1,.h2,.h3{ font-family: 'Urbanist', open-sans, arial, sans-serif;  font-weight:900;}

a, span, label, p, div, body,td, th { font-family: 'Urbanist'}



.form-group label{font-weight: bold;}



body.login{background-color:#007bb5;

/*

background-image:url('../images/venta-explora-bg-bottom.png') ;

background-repeat:no-repeat;

background-position: bottom ;

	background-size:contain  ;*/

}

.wrapper {display: flex;

    justify-content: center;

    align-content: normal;

    min-height: 100vh;

    min-width: 100vw;}

main{width: 100%;}



.container-login{}



.container.login .card {border-radius: 30px;box-shadow:0px 0px 15px 3px #545454;}

.card-body .form-group {font-weight: bold; }

.card-header{background:#fff;}

.login .btn.btn-primary{border-radius:30px;padding:5px 15px;}



/**new boton menu **/

#sidebarToggle{border-radius: 5px;}

.navbar-dark .navbar-toggler-icon{background-image:none;}

.navbar-toggler-icon{height:auto!important; width:auto!important;}

#sidebarToggle .navbar-toggler-icon{font-size:30px; }



#layoutSidenav{}

.btn {border-radius:30px; font-weight: bold; text-transform: uppercase}

.navbar-dark .navbar-brand {font-weight: bold;}

.card{border-radius:30px}

.navbar-dark .navbar-text{color: rgba(255, 255, 255, 0.75);}

.navbar-dark .navbar-nav .nav-link { color: rgba(255, 255, 255, 0.75);}

.navbar-dark .navbar-nav .nav-link:hover, .navbar-dark .navbar-nav .nav-link:focus{ color: rgba(255, 255, 255, 1);}

.btn.btn-block.btn-primary{font-size:14px;}



.card.shadow-sm{transition: all .2s;position:relative;bottom:0px; box-shadow:0 0.125rem 1rem 1px rgba(0, 0, 0, 0.075) !important;}

.card.shadow-sm:hover { position:relative;bottom:5px;}



#layoutSidenav { background-image:url("../images/bg-marcadeagua.png"); background-repeat: no-repeat;background-size: auto; background-position: bottom right; }



.form-control {border-radius:30px;}



.input-group > .input-group-prepend > .form-control{

  border-top-right-radius: 0;

  border-bottom-right-radius: 0;

}



.custom-file-label::after, .custom-file-input:lang(en) ~ .custom-file-label::after{content:'examinar'}





/*#divPdfTemplate {padding-top:20px;}*/

/*.custom-file-label{font-style: italic;}*/



.modal-body .btn.btn-lg.btn-success {margin-top:30px;}



.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active{background:#fff!important; color:#212529!important; border: 1px solid #fff}

.ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited{ color:#212529!important}



#fromInputCardNumber2do, #toInputCardNumber2do {max-width:60px;}

#fromInputCardNumber3er, #toInputCardNumber3er {max-width:50px;}

#fromInputCardNumber4to, #toInputCardNumber4to {max-width:100px;}

#inputCardVtoMonthGCRango, #inputCardVtoYearGCRango{max-width: 75px;}



#formVentaRangoGiftCard > input.form-control ::placeholder{font-style: italic; color:#ddd}



.input-group > .input-group-prepend > .input-group-text {border-radius: 2rem}



/**instructivos **/

.instructivos{padding-left:30px;padding-right: 30px;}

.instructivos h5 {padding-bottom:18px; border-bottom: 1px solid #ccc;}

.instructivos h5 a {text-decoration: none;}

.btn-rounded-icon {border-radius:50px; padding: 5px;}