@import url("https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700&display=swap");
@import url('buttons.css');
@import url('layout.css');

body {
    font-family: 'Poppins', 'Segoe UI Regular','Nunito','Helvetica Neue','arial';
    color:#545a6d;
}

.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
    color: #545a6d;
}

.table {
    color: #545a6d;
}

@media (max-width:414px) {

    .d-xs-none {display: none !important}
    .d-xs-block {display: block !important}
    .text-xs-center {text-align: center}
    .mt-xs-5 {margin-top:3rem !important;}
    .mb-xs-5 {margin-bottom:3rem !important;}

    .fm-t {margin-top:15px}
    .fm-b {margin-bottom:15px}

    /*.footer {font-size:10px}*/
}

/* General ------------------------------------------------ */


a:hover {
    color: rgba(141, 141, 141, 0.69);
    text-decoration:underline
}

a.disabled, label.disabled {
    pointer-events: none;
}

a.muted {
    color: #a0a0a0;
}

.text-height-2 {line-height: 1.7 !important;}
.text-light {color: #a0a0a0 !important;}

button:disabled {
    cursor: not-allowed;
    pointer-events: all !important;
}

.form-control:disabled {
    cursor: not-allowed;
    pointer-events: all !important;
    background-color: #eaf0f3;
}

.form-select {
    display: block;
    width: 100%;
    padding: .47rem 1.75rem .47rem .75rem;
    -moz-padding-start: calc(.75rem - 3px);
    font-size: .8125rem;
    font-weight: 400;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    border: 1px solid #ced4da;
    border-radius: .25rem;
    background-color: #fff;
}

.list-menu-item {
    position: relative;
    display: block;
    padding: .5rem 1.25rem .5rem 0;
}

.datepicker table tr td.range, .datepicker table tr td.range.disabled, .datepicker table tr td.range.disabled:hover, .datepicker table tr td.range:hover {
    background-color: #eaf0f3;
}

fieldset {border: 0px solid #ddd;}
legend {font-size: 90%; font-weight: bold; text-transform: uppercase}

.border {
    border: 1px solid #ddd !important;
}

.select2-search__field {
    padding: 0;
   background: url("../images/icon-search.png") 4px 4px no-repeat;
   padding: 4px 4px 4px 30px;
}
.select2-search--dropdown .select2-search__field {
    padding: 4px 4px 4px 28px;
}



/* Menus -------------------------------------------------- */

.dropdown-menu {
    border: 1px solid #ccc;
}

.dropdown a.dropdown-item:hover {background-color: #fff}
.dropdown-item {color:#545a6d}
a.dropdown-item:hover {color: #3b79b3}


/* TopBar ------------------------------------------------- */

.header-profile-user {
    padding:1px
}


body[data-topbar="dark"] .header-profile-user {
    background-color: #828282;
}


label.btn {cursor: default}

.app-search .form-control {
    border-radius: 3px;
    background-color: #efefef;
}

.topnav {
    border-bottom: 1px solid #c3c3c3;
    box-shadow: 0 0 16px rgba(58,60,62,0.3);
    z-index: 1000 !important;
    /*box-shadow: 1px 1px 5px 3px #ccc;*/
}

@media (min-width:700px) {

    .navbar-brand-box {
        padding: 0 0 0 12px;
    }
}


@media (min-width:992px) {

    .topnav .dropdown-item {
        padding: 4px 35px 4px 16px;
    }

    .topnav .dropdown .dropdown-menu .dropdown .dropdown-menu {
        top: -9px !important;
    }

    .topnav .dropdown .dropdown-menu .arrow-down::after {
        margin-left: 20px;
    }

    .topnav .dropdown .dropdown-menu .dropdown .dropdown-menu {
        left: 98%;
    }

}

.topnav .navbar-nav .nav-link {
    padding: 1rem 1rem;
}


.noti-icon .badge {
    position: absolute;
    top: 13px;
    left: 19px;
}

.right-bar .right-bar-toggle {
    height: 18px;
    width: 18px;
    line-height: 19px;
    color: #fff;
}

/* Calendar ----------------------------------------------- */

.fc-content {color:#fff; cursor: pointer; padding:4px}
.fc-toolbar {margin-bottom: 2em}
.fc-center h2 {font-size: 16px; line-height: 0;text-transform: uppercase}


/* Cards -------------------------------------------------- */


.card {
    border: 1px solid #c6c6c6;
    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.175);
}

.card-header {
    background-color: #fff;
    border-bottom: 1px solid #ededed;
    padding: 17px 1.25rem;

}
.card-header h4 {
    font-size: 15px;
    font-weight: 600;
    margin:0
}

.card-header p {
    font-size: .8125rem;
    margin: 3px 0 0 0;
}

.card-footer {
    border-top: 1px solid #ededed;
    background-color: #fff;
    padding: 1.25rem 1.25rem;
}

.card-header div.breadcrumb {
    padding:0; background-color: #fff; margin:3px 0 0 0; text-transform: uppercase;
}

.breadcrumb-item + .breadcrumb-item {
    padding-left: 5px;
}

.breadcrumb-item + .breadcrumb-item::before {
    display: inline-block;
    padding-right: 5px;
    content: "\203A";
}

/* Modal -------------------------------------------------- */

.modal-footer {
    border-top: 1px solid #ededed;
}

.modal-header {
    border-bottom: 1px solid #ededed;
}

.modal-dialog{
    overflow-y: initial !important
}
.modal-body{
    max-height: calc(100vh - 200px);
    overflow-y: auto;
}


/* Tabs --------------------------------------------------- */

.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
    border-top: 3px solid #3b79b3;
}

.nav-tabs .nav-link:hover {
    border-bottom: none;
}

.tab-content {
    border-bottom:  1px solid #ccc;
    min-height:294px; border-left: 1px solid #c6c6c6; border-right: 1px solid #c6c6c6; box-shadow: 0 1px 5px rgba(0, 0, 0, 0.175);
}

/* Datatables --------------------------------------------- */

.table td, .table th {vertical-align: middle}

table.dataTable {
    margin-top: 20px !important;
    margin-bottom: 20px !important;
}

table.dataTable.dtr-inline.collapsed > tbody > tr[role="row"] > td:first-child::before, table.dataTable.dtr-inline.collapsed > tbody > tr[role="row"] > th:first-child::before {
    box-shadow: 0 0 1px #444;
    background-color: #3b79b3;
}
table.dataTable.dtr-inline.collapsed > tbody > tr.parent > td:first-child::before, table.dataTable.dtr-inline.collapsed > tbody > tr.parent > th:first-child::before {
    background-color: #f46a6a;
}

.table thead th, .table tfoot th {
    background: #eaf0f3;
    font-weight: 600;
}

.table-bordered th, .table-bordered td {
    border: 1px solid #ddd;
    vertical-align: middle;
    padding: 9px;
}

.table-bordered {
    border: 1px solid #efefef;
}

.table-striped tbody tr:nth-of-type(2n+1) {
    background-color: #ececec;
}



.table.table-95 th, .table.table-95 td { font-size: 95%}
.table.table-90 th, .table.table-90 td { font-size: 90%}
.table.table-85 th, .table.table-85 td { font-size: 85%}
.table.table-80 th, .table.table-80 td { font-size: 80%}



.table.th.p1 {width:1%}
.f85         {font-size: 75%}

.table-noline td, .table-noline th {border-top:none; padding: 1.5px 0;}
.table-notopline td, .table-notopline th {border-top:none}


.table tr.yellow {background-color: #fcf9ee}


table.dataTable thead .sorting:before,
table.dataTable thead .sorting_asc:before,
table.dataTable thead .sorting_desc:before,
table.dataTable thead .sorting_asc_disabled:before,
table.dataTable thead .sorting_desc_disabled:before {
    right: 0 !important;
    content: "" !important;
}
table.dataTable thead .sorting:after,
table.dataTable thead .sorting_asc:after,
table.dataTable thead .sorting_desc:after,
table.dataTable thead .sorting_asc_disabled:after,
table.dataTable thead .sorting_desc_disabled:after {
    right: 0 !important;
    content: "" !important;
}

table.dataTable thead th {
    position: relative;
    background-image: none !important;
}

table.dataTable thead th.sorting:after,
table.dataTable thead th.sorting_asc:after,
table.dataTable thead th.sorting_desc:after {
    position: absolute !important;
    top: 8px !important;
    right: 10px !important;
    display: block !important;
    font-family: boxicons !important;
    font-size: 12px !important;
}
table.dataTable thead th.sorting:after {
    content: "\e98c" !important;
    color: #989898 !important;

}
table.dataTable thead th.sorting_asc:after {
    content: "\e995" !important;
    opacity: 1;
}
table.dataTable thead th.sorting_desc:after {
    content: "\e98c" !important;
    opacity: 1;
}


table.filtertable thead input, thead select  {
    width: 100%;
    color: #495057;
    background-color: #fff;
    border: 1px solid #ced4da;
    border-radius: .25rem;
    padding:6px 10px 6px 6px
}


table.filtertable td.action  {
    cursor:pointer;
}

table.dataTable thead th.nosort::after {
    content: "" !important;
}


/* Tabla Sidebar */

ul.news-bar {
    list-style: none;
    margin-left: 0;
    padding-left: 14px;
}


ul.news-bar li::before {
    content: "\2022";
    font-weight: bold;
    display: inline-block;
    width: 1em;
}

.border-bottom, .border-top {
    border-bottom: 1px solid #e7e7e7 !important;
}

@media screen and (max-width: 767px) {

    div.dataTables_wrapper div.dataTables_info {
        padding-bottom: 0.85em;
    }

    div.dataTables_wrapper div.dataTables_length {
        padding-bottom: 0.85em;
    }

    div.dataTables_wrapper div.dataTables_paginate ul.pagination {
        justify-content: center;
    }
}


/* Botones de tablas */

td.bt {
    width:1%;
    white-space: nowrap;
}



td.bt img {display: inline-block}

td.bt a, td.bt button {color:#3b79b3; padding:5px 7px 3px; margin: 0 3px 0 0;}
td.bt a:hover, td.bt button:hover {color:#f46a6a}
td.bt a > i, td.bt button > i {font-size: 17px}

div.bt button {color:#3b79b3}


/* Forms -------------------------------------------------- */

::placeholder {
    color: #ababab;
}

input.nota-entry {
    padding:3px 6px;
    text-align:right;
    height:auto;
    margin-bottom:0;
}

.custom-control-label {
    cursor:pointer;
}

.toggle.btn-sm {
    min-height: 28px;
}

.toggle-group .btn {
    cursor: pointer;
}

.input-group-text {
    font-size: 16px
}

textarea {
    outline: none !important;
    border: 1px solid #ced4da;
    padding: 14px;
}

.form-check-input {
    margin-top: 4px;
}

.custom-file-input {
    cursor: pointer;
}

/*
.custom-file-label {
    overflow-x: auto;
    font-size: 10px;
}
*/

.form-control-sm {
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: .25rem;
    background-position-y: 2px;
}

/* Images con lupas por encima */

.thumb-foto {
    position:absolute;
    width: 100%;
    height:100%;
    background-color: #6f6f6f;
    z-index: 10;
    opacity: 0.3;

}
.icon-foto {
    font-size: 8em;
    position: absolute;
    color: white;
    z-index: 12;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}


/* Profile ------------------------------------------------ */

.img-thumbnail {
    max-width: 80px;
}
.profile-user-wid {
    margin-top: -42px;
}

.header-profile-user {
    height: 50px;
    width: 50px;
}

/* Footer ------------------------------------------------- */

.footer {height:53px;}

@media (max-width:414px) {

    /*.header-profile-user {height: 30px; width: 30px;}*/
    .header-item {padding: 0 6px}

}


/* Carousel ----------------------------------------------- */

.owl-theme .owl-nav.disabled + .owl-dots {
    margin-top: 20px;
}

.navs-carousel .owl-nav button {

    border-radius: .2rem !important;
    background-color: #ececec !important;
    border: 1px solid #d1d1d1;
    border-color: #d1d1d1;
    color: #212529 !important;
}

.youtube-video i {
    top: 50%;
    left: 40%;
    position: absolute;
    font-size: 60px;
    color:#efefef;
    opacity: 0.5;
}


/* Previo Imagen ----------------------------------------- */

.preview {display: none}
/*
.link:hover .preview { display: inline-block; background-color: #000; width:70px; height:70px; border:1px solid #efefef;padding: 10px; border-radius: 2px}
*/

/* Boostrap ----------------------------------------------- */

.btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, .show > .btn-primary.dropdown-toggle, .btn-primary:hover, .btn-primary.focus, .btn-primary:focus  {
    color: #fff;
    background-color: #2f5a88;
    border-color: #2F5A88;
}

.bg-primary-soft {
background-color: #eaf0f3;
}

.header-item {
    height: 60px;
    padding: 0 9px;
}

.nav > .custom-select {
    padding: 2px 26px 2px 6px;
    height: 30px;
}

.btn-sm {
    padding: .25rem .5rem;
    font-size: .71094rem;
    line-height: 1.5;
    border-radius: .2rem;
}


select {
    -webkit-appearance: none;
    -moz-appearance: none;
    background: transparent;
    background-image: url("data:image/svg+xml;utf8,<svg fill='grey' height='24' viewBox='0 0 24 24' width='24' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/><path d='M0 0h24v24H0z' fill='none'/></svg>");
    background-repeat: no-repeat;
    background-position-x: 99%;
    background-position-y: 5px;
    padding: .47rem .75rem .47rem 10px;
}

.lf {left:-129px}

.bt-primary {border-top: 3px solid #3b79b3;}
.bt-secondary {border-top: 3px solid #74788d; background-color: #9195aa}
.bt-success {border-top: 3px solid #2ca579;}
.bt-warning {border-top: 3px solid #e59e28;}
.bt-danger {border-top: 3px solid #f46a6a;}
.bt-info {border-top: 3px solid #50a5f1;}
.btn-light {color: #212529; background-color: #ececec;border-color: #d1d1d1;}
.btn-light:hover {background-color:#e3e3e3;}
.bg-success {background-color: #5cb85c !important;}

.border-secondary {
    border-color: #b4b4b4 !important;
}

body[data-layout="horizontal"] .main-content {
    background-color: #f0f0f0
}




table.dataTable.dtr-inline.collapsed > tbody > tr[role="row"] > td:first-child {
    position: relative; /* El contenedor necesita ser posicionado */
    padding-left: 25px; /* O un valor adecuado para dejar espacio al icono */
}

table.dataTable.dtr-inline.collapsed > tbody > tr[role="row"] > td:first-child::before {
    content: '+'; /* Asegúrate de que el contenido sea el correcto (puede variar) */
    position: absolute;
    top: 50%;
    left: 2px; /* Ajusta la posición horizontal del icono */
    transform: translateY(-50%);
    font-size: 1.2em; /* Ajusta el tamaño del icono si es necesario */
    /* Otros estilos que DataTables pueda aplicar, como el color de fondo, bordes, etc. */
    /* Puedes añadir más estilos para personalizar la apariencia del icono */
}




.dtr-data a {
    color: #3b79b3;
    padding: 5px 7px 3px;
    margin: 0 3px 0 0;
    font-size: inherit;
}


.table-expan {
    border: none; /* Elimina cualquier borde de la tabla */
    margin-top:10px;
    margin-bottom:10px;
}

.table-expan td {
    border: none; /* Elimina el borde de cada celda */
    padding: 5px; /* Opcional: agrega espacio dentro de las celdas */

}

.table-expan td a {
    padding: 0;
    margin: 0;
}

body[data-layout="horizontal"] .page-content {
    padding: calc(81px) calc(24px / 2) 56px calc(24px / 2);
}


.dropdown-menu.auto-width {
    min-width: auto; /* Establece el ancho mínimo automático */
    width: auto !important; /* Ancho automático */
}

@media (max-width: 767px) {
    .dropdown-menu.auto-width {
        min-width: 10rem; /* Ancho mínimo deseado para el menú desplegable */
        width: auto !important; /* Ancho automático */
        max-width: 100%; /* Máximo ancho permitido */
        left: auto !important; /* Asegura que el menú no esté alineado a la izquierda */
        right: 0; /* Alinea el menú a la derecha */
    }
}

.navbar-header {
    padding:0;
}

.img-flag {
    margin-right: 7px;
    height: 15px;
    width: 18px;
}


.alert-icon {
    display: flex;
    align-items: center; /* Centrar verticalmente el texto y el icono */
    padding: 15px;
    border-radius: 5px;
}

.alert-icon .bx {
    margin-right: 10px; /* Espacio entre el icono y el texto */
    font-size: 28px;
}
