/* .oj-web-applayout-max-width {
  max-width: 80%;
} */

html,
body {
    width: 100%;
    height: 100%;
    margin: 0px;
    padding: 0px;
    overflow-x: hidden;
}

:root {
    --primary-color: #1a2542;
    --secondary-color: #1a2542;
    --grid-tbl-nth-child: #f8f8f8;
}

img {
    vertical-align: middle;
}

.img-une {
    width: 10rem;
}

.img-une-header {
    width: 15rem;
}

.sendOffScreen {
    position: absolute;
    left: -10000px;
    top: auto;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

/* LOADING */
.loaderResources {
    width: fit-content;
    font-weight: bold;
    font-family: sans-serif;
    font-size: 30px;
    padding-bottom: 8px;
    background: linear-gradient(currentColor 0 0) 0 100%/0% 3px no-repeat;
    animation: l2 2s linear infinite;
}

.loaderResources:before {
    content: "Cargando Recursos..."
}

@keyframes l2 {
    to {
        background-size: 100% 3px
    }
}


#k-mask {
    display: none;
    z-index: 9999;
    position: fixed;
    ;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(58, 54, 50, 0.400);
}

.loader {
    position: relative;
    top: 40%;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;

    border: 16px solid #f3f3f3;
    border-radius: 50%;
    border-top: 16px solid var(--primary-color);
    border-bottom: 16px solid var(--primary-color);
    width: 90px;
    height: 90px;
    -webkit-animation: spin 2s linear infinite;
    /* Safari */
    animation: spin 2s linear infinite;
}

/* Safari */
@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
    }
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

/* FIN LOADER */


/* Header */
/* Header azul unedl */
.oj-web-applayout-main-header {
    background-image: linear-gradient(to right, var(--primary-color), var(--secondary-color));
}

.oj-web-applayout-header-title {
    font-family: Verdana, Geneva, Tahoma, sans-serif;
    font-stretch: expanded;
    font-weight: 800;
}

.oj-web-applayout-header {
    background-color: rgb(251, 249, 248);
}

.oj-web-applayout-header-title {
    color: white;
}

/* Menú del usuario */
.k-usermenu {
    margin-right: 10px;
}

#userMenu {
    background-color: rgba(255, 255, 255, 1);
    border-radius: 5px;
    height: 30px;
}

#userMenu span.oj-c-button-icon.oj-end.oj-component-icon.oj-c-button-menu-dropdown-icon {
    font-size: 16px;
}

/* Hamburguesa */
.oj-web-applayout-offcanvas-icon {
    color: #fff;
}

.kimple-icon {
    width: 120px;
    height: 70px;
    margin-top: 10px;
    margin-bottom: 10px;
}

.kimple-icon:before {
    margin-top: 15px;
    margin-left: 15px;
    content: url(images/krdx1-w-48x70.png);
    /* height: 70px; */
}

html:not([dir="rtl"]) .demo-oracle-icon {
    padding-right: 50px
}

html[dir="rtl"] .demo-oracle-icon {
    padding-left: 50px
}

.demo-oracle-icon:before {
    display: inline
}

.k-divide {
    margin-bottom: 10px;
}

.right {
    text-align: right;
}

.right INPUT {
    text-align: left;
}

/*
  Overrides
  */
.oj-form-control {
    max-width: 100% !important;
}

.btn {
    color: white !important;
    ;
    border-radius: .25rem !important;
}

.btn-new {
    color: rgb(14, 88, 161) !important;
}

.btn-edit {
    color: rgb(0, 128, 0) !important;
}

.btn-del {
    color: rgb(252, 95, 67) !important;
}

.btn-danger {
    color: rgb(212, 32, 0) !important;
}

.btn-back {
    color: #f08d23 !important;
}

.btn-go {
    color: #65ae2c !important;
}

.btn-print {
    color: #2d5a0b !important;
}

.app-table {
    width: 100%;
    /* margin-top: 15px; */
    margin-bottom: 20px;
    min-height: 80px;
    max-height: 400px;
    overflow: auto;
    /* overflow-x: hidden; */
}

.app-table-sm {
    width: 100%;
    min-height: 80px;
    max-height: 165px;
    overflow: auto;
}

.app-table-md {
    width: 100%;
    min-height: 80px;
    max-height: 250px;
    overflow: auto;
}

.app-table td:first-child {
    white-space: normal;
}

.app-table tr:nth-child(even),
.table-content tr:nth-child(even) {
    background-color: var(--grid-tbl-nth-child);
}

.app-table-sm tbody tr:nth-child(even),
.table-content-sm tbody tr:nth-child(even) {
    background-color: var(--grid-tbl-nth-child);
}

.app-table-md tbody tr:nth-child(even),
.table-content-sm tbody tr:nth-child(even) {
    background-color: var(--grid-tbl-nth-child);
}

.action-cell {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
}

.div-center {
    width: 100%;
    padding-top: 10px;
    padding-bottom: 10px;
    display: flex;
    justify-content: center;
}

.div-right {
    width: 100%;
    padding: 10px;
    display: flex;
    justify-content: flex-end;
}

/* Popup */
/*
Forma en la que se usan las clases del popup
<oj-popup class="k-popup"
  <div class="k-popup-body">
    <div class="k-popup-header"> </div>
    <div class="k-popup-content"> </div>
    <div class="k-popup-center"> </div>
    <div class="k-popup-footer"> </div>
  </div>
</oj-popup>
*/

.oj-popup {
    border-radius: 10px;
}

/*Popup Medium*/
.k-popup-md {
    min-width: 25vw;
    max-width: 80vw;
    min-height: 30vh;
    display: flex;
    overflow: auto;
}

.k-popup-body-md {
    min-width: 23vw;
    min-height: 25vh;
    max-height: 75vh;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: stretch;
    overflow: auto;
}

/*Popup Small*/
.k-popup-sm {
    min-width: 55vw;
    max-width: 80vw;
    min-height: 30vh;
    display: flex;
    overflow: auto;
}

.k-popup-body-sm {
    min-width: 48vw;
    min-height: 25vh;
    max-height: 75vh;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    flex-wrap: nowrap;
    overflow: auto;
}

.k-popup-header {
    /* align-self: flex-start; */
    align-self: center;
    margin-bottom: 10px;
}

/* Cubre todo el popup sin tener footer */
.k-popup-content-all {
    align-self: stretch;
    overflow: auto;
}

/* Contenido del popup con footer*/
.k-popup-content {
    flex: 1;
    align-self: center;
    overflow: auto;
    padding-left: 15px;
    padding-right: 15px;
    max-width: 70vw;
}

/* Footer centrado */
.k-popup-center {
    align-self: center;
    margin-top: 10px;
}

/* Footer a la derecha */
.k-popup-footer {
    align-self: flex-end;
    margin-top: 10px;
    margin-bottom: 10px;
}

.k-edge-bottom {
    flex-direction: column;
}

#noDataDiv {
    margin-top: 15px;
}

.disabled {
    pointer-events: none;
    opacity: 0.6;
}

.blocked {
    pointer-events: none;
}

.oj-toolbar>oj-c-button:not(:last-child),
oj-c-input-text:not(:last-child) {
    margin-inline-end: .5rem;
}

.selector-manual {
    width: 1.75rem;
    height: 1.75rem;
}

.selector-manual>.oj-selector-wrapper {
    max-height: 1.75rem !important;
    max-width: 1.75rem !important;
}


.table-wrapper table {
    border-collapse: collapse;
    width: 100%;
}

.table-wrapper td,
.table-wrapper th {
    border: 1px solid #dddddd;
    text-align: left;
    padding: 8px;
}


.center-flex {
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.left-center {
    height: 100%;
    display: flex;
    justify-content: left;
    align-items: center;
}

.right-down {
    display: flex;
    justify-content: right;
    align-items: end;
}

.menu-box {
    display: flex;
    flex-flow: column;
    height: 100%;
}

.menu-box .row.header {
    flex: 0 1 auto;
}

.menu-box .row.content {
    flex: 1 1 auto;
}

.menu-box .row.footer {
    flex: 0 1 10px;
}

/* crm */
.percentDialog {
    width: 70vw;
    height: 70vh;
}

.demo-container {
    position: relative;
    width: 100%;
    min-height: 20rem;
    overflow: hidden;
}

.demo-tables-container {
    width: 100%;
    max-height: 50vh;
}

.demo-panel {
    height: calc(100% - 6.25rem);
}

.demo-page {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    padding: 0.625rem;
    box-sizing: border-box;
    overflow: auto;
    transition: transform 0.25s;
}

.demo-page1-hide {
    transform: translate3d(-100%, 0, 0);
}

.demo-page2-hide {
    transform: translate3d(100%, 0, 0);
}

html[dir='rtl'] .demo-page1-hide {
    transform: translate3d(100%, 0, 0);
}

html[dir='rtl'] .demo-page2-hide {
    transform: translate3d(-100%, 0, 0);
}

.demo-list-view {
    max-width: 61.25rem;
}

.listbtn {
    min-width: 20rem;
}

.avatar-def>* {
    background-color: white !important;
    color: rgb(0, 0, 0) !important;
}

.avatar-def>*>.oj-avatar-background {
    background-image: none !important;
}

.paginator * button[aria-label="Aumentar"]>span>span>.IconStyle_currentColor__sdo2n67 path {
    d: path('M5 12h13M12 5l7 7-7 7') !important;
}

.paginator * button[aria-label="Disminuir"]>span>span>.IconStyle_currentColor__sdo2n67 path {
    d: path('M19 12H6M12 5l-7 7 7 7') !important;
}

.paginator *>.TextFieldInputVariants_multiVariantStyles_startContent_hasStartContent__1c85q7ne {
    padding-inline-start: 0;
    text-align: center !important;
}

.oj-icon-color-favorite {
    color: rgb(255, 193, 7) !important;
}

.navlist-container {
    max-width: 20rem;
}

.oj-navigationlist-toolbar {
    width: 100% !important;
}

.oj-navigationlist-previous-link {
    width: 80% !important;
    display: inline-block !important;
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
}

.breadcrumbs * {
    margin-inline-start: 0 !important;
    margin-inline-end: 0 !important;
}

.breadcrumbs-point {
    display: inline-block;
    text-align: center;
    padding-left: .857rem;
    padding-right: .857rem;
    font-size: 14px;
}

.module-pad {
    padding-top: 0;
    padding-bottom: 0;
}

.menus-module {
    display: flex !important;
    flex-direction: column !important;
    /* flex: 1 0 auto; */
}

.flx-grow {
    flex-grow: 1;
}

.masterView {
    position: relative;
}