/* @tailwind base;
@tailwind components; */

/* CSS personalizado */
@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{
    --primary-color:#1B58A8;
    --orange-color:#F26622;
    --primary-text-color:#747E8B;
    --gray-borders: #D4D4D8;
    --white:#ffffff;
    --primary-font:"Roboto", serif;
    --primary-bg:#0C192C;
    --secondary-bg:#E7EAF7;
    --blue-text:#263238;
    --text-small-color:#CCCED6;
    --green-success:#2BD700;
    --error-color:#DC2626;
}

.primary_blue{
    color: var(--primary-color);
}
.primary_white{
    color: var(--white);
}
.text-blue-600{
    color: var(--primary-color) !important;
}
.border-blue-600{
    border-color: var(--primary-color)!important;
}
.bg_blue-primary{
    background-color: var(--primary-color) !important;
}
.header_background-blue{
    background-color: var(--primary-bg);
    color: var(--white);
}
.btn_add-file{
    text-align: center;
    background-color: var(--orange-color);
    padding: 10px 20px;
    color: white;
    font-weight: 400;
    border-radius: 50px;
    width: max-content;
    text-transform: capitalize;
    line-height: 24px;
}
.btn_add-custom{
    padding: 0.8em 1.8em;
    border: 2px solid var(--orange-color);
    border-radius: 50px;
    position: relative;
    overflow: hidden;
    background-color:  var(--orange-color) !important;
    text-align: center;
    text-transform: capitalize;
    font-size: 16px;
    transition: .3s;
    z-index: 1;
    color: var(--white);
    display: block;
    max-width: fit-content;
}
.btn_add-custom::before {
    content: '';
    width: 0;
    height: 500%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) rotate(45deg);
    background: var(--white);
    transition: .5s ease;
    display: block;
    z-index: -1;
   }
   .btn_add-custom:hover::before {
    width: 105%;
   }

   .btn_add-custom:hover {
    color:var(--orange-color);
   }
.btn_add-custom-inverted {
    padding: 0.8em 1.8em;
    border: 2px solid var(--orange-color);
    border-radius: 50px;
    position: relative;
    overflow: hidden;
    background-color: var(--white) !important;
    text-align: center;
    text-transform: capitalize;
    font-size: 16px;
    transition: .3s;
    z-index: 1;
    color: var(--orange-color);
    display: block;
    max-width: fit-content;
}

.btn_add-custom-inverted::before {
    content: '';
    width: 0;
    height: 500%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) rotate(45deg);
    background: var(--orange-color);
    transition: .5s ease;
    display: block;
    z-index: -1;
}

.btn_add-custom-inverted:hover::before {
    width: 105%;
}

.btn_add-custom-inverted:hover {
    color: var(--white);
}

.btn_add-custom-success {
    padding: 0.8em 1.8em;
    border: 2px solid var(--green-success);
    border-radius: 50px;
    position: relative;
    overflow: hidden;
    background-color: var(--white) !important;
    text-align: center;
    text-transform: capitalize;
    font-size: 16px;
    transition: .3s;
    z-index: 1;
    color: var(--green-success);
    display: block;
    max-width: fit-content;
}

.btn_add-custom-success::before {
    content: '';
    width: 0;
    height: 500%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) rotate(45deg);
    background: var(--green-success);
    transition: .5s ease;
    display: block;
    z-index: -1;
}

.btn_add-custom-success:hover::before {
    width: 105%;
}

.btn_add-custom-success:hover {
    color: var(--white);
}

.btn_cancel{
    padding: 0.8em 1.8em;
    border: 2px solid var(--error-color);
    border-radius: 50px;
    position: relative;
    overflow: hidden;
    background-color: var(--white) !important;
    text-align: center;
    text-transform: capitalize;
    font-size: 16px;
    transition: .3s;
    z-index: 1;
    color: var(--error-color);
    display: block;
    max-width: fit-content;
}

.btn_cancel::before {
    content: '';
    width: 0;
    height: 500%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) rotate(45deg);
    background: var(--error-color);
    transition: .5s ease;
    display: block;
    z-index: -1;
}

.btn_cancel:hover::before {
    width: 105%;
}

.btn_cancel:hover {
    color: var(--white);
}

/* new btn blue */

.btn_blue{
    padding: 0.8em 1.8em;
    border: 2px solid var(--primary-color);
    border-radius: 50px;
    position: relative;
    overflow: hidden;
    background-color: var(--white) !important;
    text-align: center;
    text-transform: capitalize;
    font-size: 16px;
    transition: .3s;
    z-index: 1;
    color: var(--primary-color);
    display: block;
    max-width: fit-content;
}

.btn_blue::before {
    content: '';
    width: 0;
    height: 500%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) rotate(45deg);
    background: var(--primary-color);
    transition: .5s ease;
    display: block;
    z-index: -1;
}

.btn_blue:hover::before {
    width: 105%;
}

.btn_blue:hover {
    color: var(--white);
}

.btn_primary{
    padding: 0.8em 1.8em;
    border: 2px solid var(--primary-color);
    border-radius: 50px;
    position: relative;
    overflow: hidden;
    background-color: var(--primary-color) !important;
    text-align: center;
    text-transform: capitalize;
    font-size: 16px;
    transition: .3s;
    z-index: 1;
    color: var(--white);
    display: block;
    max-width: fit-content;
}

.btn_primary::before {
    content: '';
    width: 0;
    height: 500%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) rotate(45deg);
    background: var(--white);
    transition: .5s ease;
    display: block;
    z-index: -1;
}

.btn_primary:hover::before {
    width: 105%;
}

.btn_primary:hover {
    color: var(--primary-color);
}

/* end new btn blue */

.btn_add-file:hover{
    opacity: 0.8;
    color: var(--orange-color);
}
.btn-upload-cloud svg{
    margin: 0 18px;
}
.form_container-limited{
    max-width: 1140px;
    margin: 0 auto;
}
.custom-head_table{
    background-color: var(--primary-bg);
    color: var(--white);
}
.btn-upload-cloud:hover svg path{
    stroke: var(--primary-color);
}
.icon_aside--dashboard:hover{
    background-color: var(--secondary-bg);
    color: var(--primary-color);
}
.icon_aside--dashboard:hover svg{
    fill: var(--primary-color);
}
.text_dropdown{
    color: var(--text-small-color);
    font-size: 10px;
}
#change-picture {
    margin-top: 20px!important;
}
.avatar-preview img {
    margin: auto;
    margin-bottom: 0px!important;
}

.notification-body a div {
    line-height: 1.1;
}

button.p-2\.5.ml-2.text-sm.font-medium.text-white.bg-blue-500.rounded-sm.border.border-blue-500.hover\:bg-blue-800 {
    border: none!important;
    border-radius: 10px;
    padding: 10px 20px;
}
.title_gbl{
    color: var(--blue-text);
    font-size: 16px;
    font-weight: 500;
}
.text_primary{
    font-size: 12px;
    color: var(--text-small-color);
    font-weight: 500;
}


form#details-form .form-group label {
    color: gray;
}

form#details-form .form-group {
    margin-bottom: 12px;
}

/* {
  color: white!important;
}*/

form#login-details-form .form-group label {
    color: gray;
}

form#login-details-form .form-group {
    margin-bottom: 12px;
}

/*form#login-details-form  button {
  color: white!important;
}*/

.btn-primary {
    white-space: nowrap;
}

/* form button {
    color: inherit!important;
} */

[colspan="6"] {
    padding: 20px;
}

#gestionDatosContent button i {
    display: none;
}

#gestionDatosContent .show-icon button i {
    display: inline !important;
}

#gestionDatosContent li a i {
    display: none;
}

/*#gestionUsuarioContent a i {
    display: none;
}*/

/*#gestionUsuarioContent button i {
    display: none;
}

#gestionUsuarioContent a i {
    display: none;
}*/

#gestionUsuarioContent table a i {
    display: inline;
}

#gestionUsuarioContent form a i {
    display: inline;
}

#gestionUsuarioContent form button i {
    display: inline;
}

/* #gestionDatosContent .pb-2.flex.justify-between.mt-2 a {
    background: #fafcff;
    border: none!important;
    color: var(--primary-color);
    border-radius: 10px;
    font-weight: 600;
    padding: 12px 20px!important;
    font-size: 16px;
} */

/* #gestionDatosContent .pb-2.flex.justify-between.mt-2 button {
    background: #fafcff;
    border: none!important;
    color: var(--primary-color);
    border-radius: 10px;
    font-weight: 600;
    padding: 12px 20px!important;
    font-size: 16px;
} */


/*#configuracionesContent .pb-2.flex.justify-between.mt-2 a {
    background: #fafcff;
    border: none!important;
    color: var(--primary-color)!important;
    border-radius: 10px;
    font-weight: 600;
    padding: 12px 20px!important;
    font-size: 16px;
}*/

#gestionUsuarioContent .pb-2.flex.justify-between.mt-2 a {
    background: #fafcff;
    border: none!important;
    color: var(--primary-color)!important;
    border-radius: 10px;
    font-weight: 600;
    padding: 12px 20px!important;
    font-size: 16px;
}

#gestionUsuarioContent .pb-2.flex.justify-between.mt-2 button {
    background: #fafcff;
    border: none!important;
    color: var(--primary-color)!important;
    border-radius: 10px;
    font-weight: 600;
    padding: 12px 20px!important;
    font-size: 16px;
}

#gestionDatosContent .pb-2.flex.justify-between.mt-2 a:hover {
    background: #ecf4ff;

}

#gestionDatosContent .pb-2.flex.justify-between.mt-2 button:hover {
    background: #ecf4ff;

}


#configuracionesContent .pb-2.flex.justify-between.mt-2 a:hover {
       background: #ecf4ff;

}

#configuracionesContent .pb-2.flex.justify-between.mt-2 button:hover {
     background: #ecf4ff;

}

#gestionUsuarioContent .pb-2.flex.justify-between.mt-2 a:hover {
      background: #ecf4ff;

}

#gestionUsuarioContent .pb-2.flex.justify-between.mt-2 button:hover {
    background: #ecf4ff;

}


#gestionDatosContent .pb-2.flex.justify-between.mt-2 a::after {
    font-weight: 100;
    line-height: 0;
    content: '+';
    font-size: 2em;
    padding-left: 10px;
    position: relative;
    top: 5px;
    right: -3px;
}



#gestionDatosContent .pb-2.flex.justify-between.mt-2 button::after {
    font-weight: 100;
    line-height: 0;
    content: '+';
    font-size: 2em;
    padding-left: 10px;
    position: relative;
    top: 5px;
    right: -3px;
}


/*#configuracionesContent .pb-2.flex.justify-between.mt-2 a::after {
    font-weight: 100;
    line-height: 0;
    content: '+';
    font-size: 2em;
    padding-left: 10px;
    position: relative;
    top: 5px;
    right: -3px;
}*/

#gestionUsuarioContent .pb-2.flex.justify-between.mt-2 a::after {
    font-weight: 100;
    line-height: 0;
    content: '+';
    font-size: 2em;
    padding-left: 10px;
    position: relative;
    top: 5px;
    right: -3px;
}

#gestionUsuarioContent .pb-2.flex.justify-between.mt-2 button::after {
    font-weight: 100;
    line-height: 0;
    content: '+';
    font-size: 2em;
    padding-left: 10px;
    position: relative;
    top: 5px;
    right: -3px;
}

#gestionDatosContent .card {
    border: none;
 }

 #gestionDatosContent .card .card-body {
     padding: 0px!important;
 }


 #configuracionesContent .card {
   border: none;
 }

 #configuracionesContent .card .card-body {
     padding: 0px!important;
 }

 #gestionUsuarioContent  .card {
      border: none;
 }

 #gestionUsuarioContent .card .card-body {
     padding: 0px!important;
 }



 #gestionDatosContent  table tr td button#dropdownMenuButton::before {
    content: 'Acciones';
}


#configuracionesContent  table tr td button#dropdownMenuButton::before {
    content: 'Acciones';
}


#gestionUsuarioContent .table tr td button#dropdownMenuButton::before {
    content: 'Acciones';
}




 #gestionDatosContent  .pagination {
    margin-bottom: 20px;
}

#configuracionesContent .pagination {
    margin-bottom: 20px;
}

#gestionUsuarioContent .pagination {
    margin-bottom: 20px;
}



 #gestionDatosContent h5 {
    color: var(--primary-color);
    font-weight: bold;
    font-size: 1.6em!important;
}

#configuracionesContent h5 {
    color: var(--primary-color);
    font-weight: bold;
    font-size: 1.6em!important;
}

#gestionUsuarioContent h5 {
    color: var(--primary-color);
    font-weight: bold;
    font-size: 1.6em!important;
}

 #gestionDatosContent .row.mb-3.pb-3.border-bottom-light a {
    background: #fafcff;
    border: none!important;
    color: var(--primary-color)!important;
    border-radius: 10px;
    font-weight: 600;
    padding: 12px 20px!important;
    font-size: 16px;
}

#configuracionesContent  .row.mb-3.pb-3.border-bottom-light  a {
    background: #fafcff;
    border: none!important;
    color: var(--primary-color)!important;
    border-radius: 10px;
    font-weight: 600;
    padding: 12px 20px!important;
    font-size: 16px;
}

/*#gestionUsuarioContent  .row.mb-3.pb-3.border-bottom-light  a {
    background: #fafcff;
    border: none!important;
    color: var(--primary-color)!important;
    border-radius: 10px;
    font-weight: 600;
    padding: 12px 20px!important;
    font-size: 16px;
}*/

 #gestionDatosContent .row my-3 flex-md-row flex-column-reverse a {
    background: #fafcff;
    border: none!important;
    color: var(--primary-color)!important;
    border-radius: 10px;
    font-weight: 600;
    padding: 12px 20px!important;
    font-size: 16px;
}

#configuracionesContent  .row my-3 flex-md-row flex-column-reverse  a {
    background: #fafcff;
    border: none!important;
    color: var(--primary-color)!important;
    border-radius: 10px;
    font-weight: 600;
    padding: 12px 20px!important;
    font-size: 16px;
}

#gestionUsuarioContent  .row my-3 flex-md-row flex-column-reverse  a {
    background: #fafcff;
    border: none!important;
    color: var(--primary-color)!important;
    border-radius: 10px;
    font-weight: 600;
    padding: 12px 20px!important;
    font-size: 16px;
}


.chat {
    margin-bottom: 10px;
}

.chat .chat-time {
    font-size: small;
    margin-bottom: -30px;
    display: block;
}

.chat .chat-username {
    font-weight: bold;
    display: block;
    font-size: 12px;
}

.chat .chat-message p  {
   padding-bottom:20px;

}

.chat-left .chat-message {
    background: #edf7ff!important;
    border-radius: 10px!important;
    padding: 10px!important;
    line-height: 1.1!important;
    color: #1a5584!important;
    margin-left: 4px!important;
}

.chat .chat-message {
    background: #e7f8ed;
    display: inline-block;
    border-radius: 10px;
    padding: 10px;
    line-height: 1.1;
    color: #5b7263;
    margin-left: 20px;
}

.chat .chat-body {
    text-align: right;

}

.chat-left .chat-body {
    text-align: left;
    width: 90%;
}


@keyframes timer {
    0%   {width: 40px}

    50%  {width: 130px}
    100% {width: 40px}
  }



div#frameContainer .card {
    border: none;
    border-radius: 15px;
    box-shadow: 0px 10px 10px #e5e6ee;
}

div#timerCounterContainer {
    border: none;
    border-radius: 20px;
    padding: 0px;
    height: 85%;
}

div#bcolorTime {
    padding: 40px 10px;
}

div#bcolorTime div {
    text-align: center;
}

div#bcolorTime::after {
    content: '';
    width: 100px;
    display: block;
    height: 5px;
    margin: auto;
    background: #ffffff5c;
    border-radius: 99px;
    animation-name: timer;
   animation-duration: 4s;
  animation-iteration-count: infinite;
}

#tab_deuda li button.active svg {
    color: var(--primary-color);
    float: left;
    margin-right: 10px;
    background: #f3f8ff;
    width: 40px;
    height: 40px;
    border-radius: 10px;
    border: 1px solid #f3f8ff!important;
}

.col-md-9 .content-setting1 {
    height: auto;
}

label {

    font-weight: bold;
}
ul#monedas_tab li.active a {
    font-weight: bold;
    background: #f97316;
    color: white;
}

ul#monedas_tab li {
    display: inline-block;
    margin: 10px;
    margin-right: 10px!important;
    margin-left: 0px!important;
}

ul#tab_deuda li button.active {
    border-bottom: var(--primary-color) solid 4px;
}

ul#tab_deuda li button.active svg {
    stroke: var(--primary-color)!important;
}

ul#tab-info-deuda li button.active {
    background: white!important;
    border-radius: 15px 15px 0px 0px;
    color: var(--primary-color)!important;
}

ul#tab-info-deuda li button.active::after {
    content: '';
    width: 68px;
    height: 5px;
    background: #dfe8f6;
    position: absolute;
    margin-top: 49px;
    border-radius: 10px;
}


span.select2-search.select2-search--inline {
    display: none;
}

span.select2-selection.select2-selection--multiple.select2-selection--clearable {
    height: auto;
}

.select2-container--default .select2-selection--multiple {
    height: 45px;
    border: 1px solid #d4d4d4;
    border-radius: 6px;
}

.select2-container--default .select2-search--inline .select2-search__field {
  border: none!important;
    line-height: 2;
}

textarea.select2-search__field {
    height: 45px!important;
}

div#gbTabContent {
    height: unset!important;
}


.form-control {
    height: 45px;
    line-height: 1;
    border-radius: 0.375rem!important;
    border: 1px solid #ced4da!important;
    color: var(--primary-text-color);
}

tr.bg-red-200 {
    background: transparent;
    border-left: 3px solid #f18787!important;
}

.red {
    color: red;
}

#caso_complete h4 {
    color: var(--primary-color);
    font-size: 1.5em;
    font-weight: bold;
    border-bottom: 1px solid #f9f9f9;
    padding-bottom: 10px;
    margin-bottom: 10px;
}

.input-append {
    display: flex;
}

.ui-datepicker select.ui-datepicker-month, .ui-datepicker select.ui-datepicker-year {
    width: 45%!important;
    float: left!important;
    margin: 5px!important;
}


.ui-datepicker .ui-datepicker-title {
    margin: 0 1.3em!important;
}

.select2-container {
    width: 100%!important;
}

.select2-container .select2-selection--single {
    height: 45px!important;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 45px!important;
    color: var(--primary-text-color);
}


div#gestionDatosContent table tr td button#dropdownMenuButton i::before {
    content: 'Acciones';
    font-family: var(--primary-font);
    font-size: 15px;
    color: var(--primary-color);
}

div#gestionDatosContent table tr td button#dropdownMenuButton {
    background: #fafcff;
    color: var(--primary-color);
}

div#gestionDatosContent table tr td:first-of-type a {
}

div#gestionDatosContent table tr {

    border-bottom: 1px solid #e5e7eb;
}

div#gestionDatosContent .border.border-gray-300.rounded-lg {
    box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
}


div#configuracionesContent  table tr td button#dropdownMenuButton i::before {
    content: 'Acciones';
    font-family: var(--primary-font);
    font-size: 15px;
    color: var(--primary-color);
}

div#configuracionesContent table tr td button#dropdownMenuButton {
    background: #fafcff;
    color: var(--primary-color);

}

/*
div#configuracionesContent table tr td:first-of-type a {
    background: #fff7ed;
    padding: 8px 12px;
    color: #f97316!important;
    text-decoration: none!important;
    border-radius: 8px;
    white-space: nowrap;
}*/

div#configuracionesContent table tr {

    border-bottom: 1px solid #e5e7eb;
}

div#configuracionesContent .border.border-gray-300.rounded-lg {
    box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
}

div#configuracionesContent table thead {
    background: #fafcff!important;
    color: var(--primary-color);
    font-size: inherit;
}


div#gestionUsuarioContent  table tr td button#dropdownMenuButton i::before {
    content: 'Acciones';
    font-family: var(--primary-font);
    font-size: 15px;
    color: var(--primary-color);
}

div#gestionUsuarioContent table tr td button#dropdownMenuButton {
    background: #fafcff;
    color: var(--primary-color);
}

div#gestionUsuarioContent table tr td:first-of-type a {
    background: #fff7ed;
    padding: 8px 12px;
    color: #f97316!important;
    text-decoration: none!important;
    border-radius: 8px;
    white-space: nowrap;
}

div#gestionUsuarioContent table tr {

    border-bottom: 1px solid #e5e7eb;
}

div#gestionUsuarioContent .border.border-gray-300.rounded-lg {
    box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
}

div#gestionUsuarioContent table thead {
    background: #fafcff!important;
    color: var(--primary-color);
    font-size: inherit;
}

ul#gdTab li div a span {
    margin-left: 5px;
    transition: all ease 0s;
}
ul#gdTab li div {
    text-align: left;
    padding: 0!important;
    border-bottom: 1px solid #f0f3f9;
}

ul#gdTab li div a {
    padding: 10px 15px;
    display: block;
    border-radius: 10px;
 transition: all ease 0s;

}




ul#rTab li div a span {
    margin-left: 5px;
    transition: all ease 0s;
}

ul#rTab li {
    text-align: left;
    padding: 0!important;
    border-bottom: 1px solid #f0f3f9;
}

ul#rTab li a {
    padding: 10px 15px;
    display: block;
    border-radius: 10px;
 transition: all ease 0s;

}





.dropdown-menu i {
    color: var(--primary-color);
}
.dropdown-menu {
    box-shadow: 0 50px 100px -20px rgba(50,50,93,0.25), 0 30px 60px -30px rgba(0,0,0,0.3)!important;
}

.dropdown-menu .dropdown-item:hover {
    border-radius: 8px;
    background: #fafcff;
    color: var(--primary-color);
}


.dropdown-menu .dropdown-item {
        padding: 5px 8px!important;
}



ul#gdTab li div a:hover span::after {
    background: var(--primary-color);
    color: #fff;
}


ul#gdTab li div a:hover {
    font-weight: bold;
    transition: all ease 0s;
    background: var(--primary-color);
    color: var(--white);
}

ul#gdTab a.sub_menu--link.active {
    font-weight: bold;
}

ul#gdTab a.sub_menu--link.active .menu--label::after {
    background: var(--primary-color);
    color: white;
}


ul#gdTab li div a span::after {
    content: '\EA6E';
    background: #f3f7fd;
    float: right;
    font-family: remixicon!important;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-size: 1.5em;
    border-radius: 6px;
    padding: 2px 10px;
    margin-top: -2px;
}

div#gbTabContent form {
    margin: 0!important;
}

.close-x {
    background: #fafcff;
    color: var(--primary-color);
    width: 40px;
    height: 40px;
    border-radius: 99px;
    font-size: 1.5em;
  cursor: pointer;
}

.modal table tr td {
    border: none;
}

.modal .row .col-md-12, .col-md-4, .col-md-3, .col-md-6 {
    margin-bottom: 10px;
}

.modal label {
    display: block;
    width: 100%;
    font-weight: bold;
    color: #5a5a5a;
}


#add_expediente .nav-tabs .nav-link i {
    margin-right: 5px;
    background: #fff;
    width: 40px;
    height: 40px;
    padding: 8px;
    border-radius: 10px;
    border: 1px solid #ddd;
    font-size: 1.2em;
}

#add_expediente .nav-tabs .nav-link:hover {
    border-bottom: 4px solid #e5e5e5;
}

#add_expediente .nav-tabs .nav-link {
    padding: 15px;
    margin: 0;
    border: none;
    background: transparent;
    border-radius: 0px;
    border-bottom: 4px solid #f5f5f5;
}

#add_expediente  .nav-tabs .nav-link.active {
    border-bottom: 4px solid var(--primary-color)!important;
}

.modal [type='text'], [type='email'], [type='url'], [type='number'], [type='date'], [type='datetime-local'], [type='month'], [type='search'], [type='tel'], [type='time'], [type='week'], [multiple], textarea, select {
    display: block;
    width: 100%;
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #212529;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da!important;
    -webkit-appearance: none!important;
    -moz-appearance: none;
    appearance: none!important;
    border-radius: 0.375rem!important;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

.input-group .btn {
    background: #fafcff;
    border: none;
    position: absolute;
    right: 5px;
    height: 35px;
    width: 35px;
    color: var(--primary-color);
    line-height: 1;
    top: 5px;
}


div#modal-main .relative {
    border-radius: 30px;
    /*overflow: hidden;*/
    box-shadow: 0px 15px 30px #0000002c;
    background: #fff;
    border: none;
    margin-bottom: 50px;
}


div#modal-main .relative .flex:first-child {
    border-bottom: 1px solid #ddd;
}

div#modal-main .relative::before {
    top: 0px;
    width: 200px;
    height: 10px;
    content: '';
    position: absolute;
    background: var(--primary-color);
    transform: translateX(50%);
    left: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    border-radius: 9px;
}

div#modal-main input, select, textarea {
   /* background-color: transparent!important;*/
}

.hide{
    display: none;
}

div#modal-main #titulo {
    background: #fafcff;
    color: var(--primary-color);
    padding: 5px 20px;
    border-radius: 15px;
    line-height: 1.6;
}


.modal-header::before {
    top: 0px;
    width: 200px;
    height: 10px;
    content: '';
    position: absolute;
    background: var(--primary-color);
    transform: translateX(50%);
    left: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    border-radius: 9px;
}

.modal-header {
    font-size: 1.5em;
    background: #fff!important;
    font-weight: bold;
    line-height: 1;
}

.modal-header h5 {
    background: #fafcff;
    color: var(--primary-color);
    padding: 5px 20px;
    border-radius: 15px;
}

.modal button.close {
    background: #fafcff;
    color: var(--primary-color);
    width: 40px;
    height: 40px;
    border-radius: 99px;
    font-size: 1.5em;
    -webkit-text-stroke: 2px #fafcff;
}

.modal-content {
    border-radius: 30px;
    overflow: hidden;
    box-shadow: 0px 30px 40px #0000005e;
    background: #fff;

    border: none;
}

.modal-footer .btn-secondary {
    background: #fff;
    color: #898989;
    width: 140px;
    border: 1px solid #ddd;
}

.modal-footer button#btnSave {
    background: var(--primary-color);
    border: none;
    /*width: 150px;*/
}
.status-data{
    justify-content: center;
    display: flex
;
    line-height: 24px;
    gap: 10px;
}

/*.modal-footer button#btnSave::after {
    content: '\F0B3';
    font-family: remixicon!important;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    margin-left: 5px;
}*/

.modal-footer {
    border: none;
    text-align: center;
    justify-content: center;
    padding-top: 0;
}


div, span, a, button {
    transition: 0.3s all ease;
}

div#financiero div span:last-child {
    color: var(--primary-color);
    font-size: 1.3em;
    font-weight: bold;
}

div#financiero div span {
    display: block;
    margin: 0;
    font-size: 13px;
}

ul#myTab li {
    white-space: nowrap;
}

ul#myTab:hover {
    overflow-x: scroll!important;
}
/* #personal_data .bullet_item::after {
    height: 32px;
    width: 5px;
    background: var(--primary-color);
    display: block;
    content: '';
    border-radius: 0px 10px 10px 0px;
    position: absolute;
    margin-top: -40px;
    margin-left: -20px;
} */


ul#myTab li a.active span {
    font-weight: 600;
    color: var(--primary-color)!important;
}
ul#myTab li a.active {
    border-bottom: 4px solid var(--primary-color);
}
ul#myTab li a.active:focus-visible{
    outline: none;
}
ul#myTab li a {
    margin: 0;
    border: none;
    border-radius: 0;
    padding: 20px;
    border-bottom: 4px solid #ededed;
    background: transparent;
}
ul#myTab li a:hover{
    border-bottom: 4px solid var(--primary-color);
}

ul#myTab li a.active i {
    color: var(--primary-color);
    margin-right: 5px;
    background: #f3f8ff;
    width: 40px;
    height: 40px;
    padding: 8px;
    border-radius: 10px;
    border: 1px solid #f3f8ff;
}

ul#myTab li i {
    margin-right: 5px;
    background: #fff;
    width: 40px;
    height: 40px;
    padding: 8px;
    border-radius: 10px;
    border: 1px solid #ddd;
    font-size: 1.3em;
    line-height: 1;
}

a#dropdownUser4::after {
    display: none;
}
a#dropdownUser4 {
    margin: 10px;
    border-radius: 10px;
    background: white;
}

a#dropdownUser5::after {
    display: none;
}
a#dropdownUser5 {
    margin: 10px;
    border-radius: 10px;
    background: white;
}


#deuda .row .col-md-8 .col-md-3::after {
    height: 50px;
    width: 5px;
    background: var(--primary-color);
    display: block;
    content: '';
    border-radius: 0px 10px 10px 0px;
    position: absolute;
    margin-top: -65px;
    margin-left: 0px;
}

.wd-20 {
    width: 4rem;
}

/* .border-left-box::after {
    height: 50px;
    width: 5px;
    background: var(--primary-color);
    display: block;
    content: '';
    border-radius: 0px 10px 10px 0px;
    position: absolute;
    margin-top: 10px;
    margin-left: 0px;
} */

body{
  min-height: 100vh;
  font-family: var(--primary-font);
}

.nav-tabs {
    border: none;
}

.accordion-button:not(.collapsed) td {
    color: #0c63e4;
}
.accordion-button:not(.collapsed) {
    font-weight: bold;
    background: #fff;
    box-shadow: 0px 5px 20px #0000000f;
}

.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
    color: var(--primary-color);
    background: #f3f8ff;
    border-radius: 10px;
    border: 1px solid #f3f8ff;
}

.nav-tabs .nav-link {
    margin-right: 10px;
    background: #fff;
    padding: 8px;
    border-radius: 10px;
    border: 1px solid #ddd;
    color:var(--primary-color);
    padding: 8px 12px;
}

#tab_informativo #tab-informacion:hover {
    overflow-x: scroll!important;
    padding-bottom: 11px!important;
}




#tab_informativo #tab-informacion li svg {
    margin-right: 10px;
    background: #fff;
    width: 40px;
    height: 40px;
    padding: 8px;
    border-radius: 10px;
    border: 1px solid #ddd;
}

#tab_informativo #tab-informacion li [aria-selected="true"] svg {
    color: var(--primary-color);
    float: left;
    margin-right: 10px;
    background: #f3f8ff;
    width: 40px;
    height: 40px;
    padding: 8px;
    border-radius: 10px;
    border: 1px solid #f3f8ff;
}


#deuda .row .col-md-8 .col-md-2 {
    margin-bottom: 20px;
}

#deuda .row .col-md-8 .col-md-2 .grid span {
    color: #184fa1;
    line-height: 1;
}

#deuda .row .col-md-8 .col-md-2 .grid {
    line-height: 1.3;
}

#deuda .row .col-md-8 svg {
    color: #f97316;
    float: left;
    margin-right: 10px;
    background: #f3f8ff;
    width: 40px;
    height: 40px;
    padding: 8px;
    border-radius: 10px;
}

/* width */
::-webkit-scrollbar {
  width: 5px;
  height: 5px;
}

/* Track */
::-webkit-scrollbar-track {
  background: #f1f1f1;
}

/* Handle */
::-webkit-scrollbar-thumb {
  background: #888;
 border-radius: 20px;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #555;
}



#users_active .card .card-header {
    background: transparent;
    border-bottom: 4px solid #f3f3f3;
    margin-bottom: 10px;
}

.pagination {
    justify-content: center;
    margin-top: 20px;
}

.ChatBox {
    position: fixed;
    z-index: 11111;
    bottom: 0;
    width: 360px;
    right: 0;
    margin: 25px;
}

.input-group.mb-3.chatboxItem2 {
    padding: 20px;
    border-bottom: 1px solid #f7f7f7;
    margin-bottom: 0!important;
}

ul#content-mini-chat {
    padding: 20px;
}

input.form-control.chatboxItem {
    border: none;
    background: #f1f7ff;
    color: #0a58ca;
    border-radius: 10px 0px 0px 10px;
}

span#basic-addon2 {
    border: none;
    background: var(--primary-color);
    border-radius: 0px 10px 10px 0px;
    color: #fff;
}

img.chatImage {
    height: 50px;
    width: 50px;
    border: 2px solid #ddd;
    border-radius: 99px;
    text-align: center;
    margin: 0;
}

.chatItem {
    margin-bottom: 10px;
}

a.text-decoration-none.flex.items-center.text-gray-500.hover\:bg-\[\#E7EAF7\].justify-center.w-10.h-10.rounded-full.p-2.transition.duration-75.hover\:primary_blue.active\:primary_blue.active\:bg-\[\#E7EAF7\] {
    margin: 10px;
    border-radius: 10px;
    background: white;
}

.page-link {
    border: none;
    background: #f1f7ff;
    margin: 5px;
    border-radius: 8px;
}


.shadow-lg-100 {
    --tw-shadow: 0 10px 25px -3px rgb(0 0 0 / 2%), 0 4px 6px -4px rgb(0 0 0 / 0%);
    --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--primary-color, 0 0 #0000), var(--tw-shadow);
}


.page-container {
  min-height: 100vh;
  background-color: rgba(247.00000047683716, 247.00000047683716, 250.00000029802322, 1);
}
/* Styles login */
.container-form-login {
  background: rgba(156, 34, 34, 0.4);
  box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37);
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
  border-radius: 10px;
  border: 1px solid rgba(255, 255, 255, 0.18);
}

#main_login .btn-main--login{
    background-color: var(--orange-color);
    text-align: center;
    width: 100%;
    border-radius: 50px;
    padding: 8px;
    color: white;
    font-weight: 500;
}

#main_login .btn-main--login:hover{
    background-color: var(--primary-color);
}
#main_login label, #main_login input[type='password'] {
    color: var(--primary-text-color);
}
#main_login input[type='text'], #main_login input[type='password']{
    width: 100%;
    border-radius: 4px;
    border: 1px solid var(--gray-borders);
    background-color: transparent;
}

.login-area{
  box-shadow: 4px 8px 20px rgba(0, 0, 0, 0.30000001192092896);
  background: rgba(255, 255, 255, 1);
  width: 845px;
  height: 418px;
  border-radius: 20px;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

#img-login {
  width: 351.86572265625px;
  height: 354.2320861816406px;
  background-image: url(/assets/img/img_login.png);
}
.page-container{
    background: linear-gradient(90deg, #1B58A8 0%, #0C192C 100%);
}
.brand-group {
    width: 208px;
    height: 135px;
    right: calc(25% - 18px);
    transform: translateX(25%);
    top: 15px;
    background-image:url('../img/logo_login.svg') ;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}
#btnforgotPassword{
    color: var(--primary-color);
}
#btnforgotPassword:hover{
    color: var(--orange-color);
}
.brand-icon {
  width: 30px;
  height: 30px;
  top: 6px;
  background-image: url(/assets/img/icon_brand.png);
}

.brand-text {
  color: rgba(97.00000181794167, 147.00000643730164, 243.00000071525574, 1);
  width: 99px;
  height: 34px;
  font-family: Helvetica;
  font-size: 30px;
  letter-spacing: 0;
}

.circle-blue {
    border-radius: 500px;
    background-image: linear-gradient(0deg, rgba(239.7119915485382, 231.00000143051147, 247.00000047683716, 1) 0%, rgba(72.00000330805779, 128.0000075697899, 234.00000125169754, 1) 100%);
    filter: blur(60px);
}

.login-area-form {
  width: 342px;
  height: 237px;
  left: 431px;
}

.login-form-inputs {
  width: 342px;
  height: 140px;
}

.login-form-submit {
  width: 342px;
  height: 69px;
  top: 168px;
}

.form-submit-forgot-area  {
  width: 339px;
  left: 0.5px;
}

.form-submit-forgot-area > a:hover {
  color: rgba(110.00000104308128, 166.00000530481339, 170.0000050663948, 1);
  letter-spacing: 0;
}

.line-style {
  transform: rotate(9.939920591964408e-17deg);
  border: 2px solid var(--primary-color);
}

footer {
  letter-spacing: 0;
}

/* @tailwind utilities; */

/* FINANCIERO */
.title-pagos{
  color: var(--primary-color);
  font-size: 20px;
  font-weight: 600;
}
.btn-financiero, .btn-search, .btn-anular{
  border-color: var(--primary-color);
  border-width: 2px;
  color:var(--primary-color);
  padding: 8px 16px;
  margin: auto;
  margin-right: 0;
  display: block;
}
.btn-financiero:hover, .btn-search:hover, .btn-anular:hover{
  background: rgba(96, 165, 250, 0.4);
}
.title-pago_currency-type{
  font-weight: 600;
  font-size: 18px;
  color: #395995;
}
.table-list_confirm th{
  color: var(--primary-color);
  text-align: center;
  text-transform: capitalize;
}
.link-expediente{
  color: #f97316;
  text-decoration: underline;
}
.btn-positivo{
  background: #e1fbe9;
  color: #54ae72;
}
.btn-negativo{
  background: #F7E7E7;
  color: #DC2626;
}
.link-comprobante{
  color: #f97316;
  text-decoration: underline;
}
.title-info_pago{
  font-weight: 600;
  color: var(--primary-color);
  margin-bottom: 4px;
}
.table-list_anular b{
  color: var(--primary-color);
  text-align: center;
  text-transform: capitalize;
}
.title-table_pago{
  color: var(--primary-color);
}

.loader {
    --uib-size: 37px;
    --uib-color: #1B58A8;
    --uib-speed: .9s;
    --uib-bg-opacity: .1;
    height: var(--uib-size);
    width: var(--uib-size);
    transform-origin: center;
    overflow: visible;
    margin: 50px auto;
}

.car {
    fill: none;
    stroke: var(--uib-color);
    stroke-dasharray: 15, 85;
    stroke-dashoffset: 0;
    stroke-linecap: round;
    animation: travel var(--uib-speed) linear infinite;
    will-change: stroke-dasharray, stroke-dashoffset;
    transition: stroke 0.5s ease;
}

.track {
    stroke: var(--uib-color);
    opacity: var(--uib-bg-opacity);
    transition: stroke 0.5s ease;
}

@keyframes travel {
    0% {
    stroke-dashoffset: 0;
    }

    100% {
    stroke-dashoffset: 100;
    }
}