﻿/*Copyright 2005-2020 Charles Wilfred Queeman Concepción - All Rights Reserved
  Author:  Charles Wilfred Queeman Concepción*/



fieldset {
    border: 1px solid #ccc;
    margin: 0px;
    padding: 1em;
}

    fieldset legend {
        padding-left: 0.265em;
        padding-right: 0.265em;
    }

#divBody {
    /*height: 100%;*/
    display: none;
    width: 100vw;
    height: 100vh;
    -moz-transition: filter 0ms ease;
    -o-transition: filter 0ms ease;
    -webkit-transition: filter 0ms ease;
    transition: filter 0ms ease;
}

    #divBody.sy-blur {
        -moz-filter: blur(2px);
        -webkit-filter: blur(2px);
        filter: blur(2px);
        -moz-transition: filter 15s ease-in;
        -o-transition: filter 15s ease-in;
        -webkit-transition: filter 15s ease-in;
        transition: filter 15s ease-in;
    }

.sy-reset-width {
    width: auto;
}

.sy-brand-color-1 {
    background-color: #4596ce;
}

.sy-success-color {
    color: #398218;
}

.sy-font-xs {
    font-size: 10px;
}

.sy-font-sm {
    font-size: 12px;
}

.sy-font-md {
    font-size: 14px !important;
}

.sy-font-lg {
    font-size: 18px !important;
}

.sy-font-xl {
    font-size: 24px;
}

.sy-mr-1 {
    margin-right: 1rem;
}

.sy-mr-2 {
    margin-right: 2rem;
}

.sy-ml-1 {
    margin-left: 1rem;
}

.sy-ml-2 {
    margin-left: 2rem;
}

.sy-text {
    height: 30px;
    border: 1px solid #cccccc;
    padding: 3px 6px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    -moz-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    -webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    width: 100%;
}

.sy-non-editable:not(td) {
    background: #dddddd !important;
    cursor: not-allowed !important;
    pointer-events: none;
    font-weight: 700;
    padding: 2px 5px !important;
}

.sy-text:focus {
    border-color: #66afe9;
    outline: none;
    -moz-box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6);
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6);
}

.sy-clickable {
    cursor: pointer;
}

.sy-label-clickable {
    color: blue;
    cursor: pointer;
}

.sy-container {
    padding: 7px !important;
    /*display: table;*/
    display: block;
    width: 100%;
    height: 100%;
}

.sy-container-grid {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
}

.sy-container-flex {
    display: flex;
}

.sy-container-flex-row {
    display: flex;
    flex-flow: row;
    height: 100%;
    margin-top: 2px;
    box-sizing: border-box;
    overflow: auto;
}

.sy-container-flex-column {
    display: flex;
    flex-flow: column;
    height: 100%;
    box-sizing: border-box;
}

.sy-flex-0 {
    flex-grow: 0;
}

.sy-flex-1 {
    flex-grow: 1;
}

.sy-flex-2 {
    flex-grow: 2;
}

.sy-flex-3 {
    flex-grow: 3;
}

.sy-flex-1, .sy-flex-2, .sy-flex-3 {
    position: relative;
}

.k-panelbar .k-item > .sy-container {
    width: auto;
}

.sy-header, .sy-navigation-bar {
    background-color: #C0C0C0;
    width: 100%;
    height: 30px;
    margin: auto;
    padding: 5px;
    top: 0;
    left: 0;
    right: 0;
    position: fixed;
    /*flex-grow: 0;
    flex-shrink: 0;*/
    z-index: 9000;
}

.sy-navigation-bar {
    background-color: #4596ce;
    color: #ffffff;
}

.sy-header-flex {
    background: lightblue;
    flex: 1;
    overflow: auto;
}

.sy-content {
    background-color: #ffffff;
    width: 100%;
}

.sy-content-flex {
    background: yellow;
    flex: 2;
    overflow: auto;
}

.sy-footer {
    background: #f5f5f5;
    border: 1px solid black;
    width: 100%;
    margin: auto;
    /*padding: 5px 5px 0px 5px;*/
    padding-top: 2px;
    left: 0;
    right: 0;
    /*
    bottom: 0px;
    position: fixed;
    flex-grow: 0;
    flex-shrink: 0;*/
    z-index: 9000;
    bottom: 0px; /*dmd: Added*/
    position: absolute; /*dmb: Added*/
}

.sy-footer-flex {
    background: lightgreen;
    flex: 1;
    overflow: auto;
}

.sy-footer-info {
    background-color: #C0C0C0;
    /*height: 25px;*/
    /*}

.sy-footer-info > div#divAppFooter
{*/
    /*height: 100%;*/
    line-height: 1.2;
    padding: 5px;
}

.sy-text-left {
    text-align: left;
}

.sy-text-center {
    text-align: center !important;
    /*margin: auto;
    width: 100%;*/
}

.sy-text-right {
    text-align: right;
}

    .sy-text-right .k-numeric-wrap {
        padding-right: 28px;
    }

    .sy-text-right .k-input /*,
	.sy-non-editable*/ {
        text-align: right;
        padding-right: 5px;
    }

.sy-image-center {
    display: block;
    margin: auto;
}

.sy-right {
    float: right !important;
}

.sy-center-vertical {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.sy-row {
    width: 100%;
    height: auto;
    margin-top: 2px;
    /*margin-bottom: 2px;*/
}

.sy-row-empty {
    height: 30px;
}

.sy-row span {
    /*line-height: 1;*/
}

.sy-row label {
    /*line-height: 1.5;*/
}

.sy-checkbox-container {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: inline-flex;
    -ms-flex-direction: column;
    -webkit-flex-direction: column;
    flex-direction: column;
    -webkit-justify-content: center;
    justify-content: center;
    /*	padding: 0 !important;*/
    padding: calc((30px - 16px) / 2) 0;
    float: none !important;
    vertical-align: middle;
    /*	margin-top: 7px;*/
}

/*    .sy-checkbox-container input {
        display: none;
    }

    .sy-checkbox-container label {
        margin: 0;
    }
*/
.sy-row .sy-checkbox-container .sy-font-md {
    /*line-height: 2.5;*/
}

.sy-row .sy-checkbox-container .sy-font-lg {
    /*line-height: 2;*/
}

.sy-row:after {
    content: "";
    display: table;
    clear: both;
}

.sy-column-padding-left {
    padding-left: 5px;
}

.sy-column-1 {
    width: 8.333333333333333%;
    max-width: 8.333333333333333%;
}

.sy-column-2 {
    width: 16.66666666666667%;
    max-width: 16.66666666666667%;
}

.sy-column-3 {
    width: 25%;
    max-width: 25%;
}

.sy-column-4 {
    width: 33.33333333333333%;
    max-width: 33.33333333333333%;
}

.sy-column-5 {
    width: 41.66666666666667%;
    max-width: 41.66666666666667%;
}

.sy-column-6 {
    width: 50%;
    max-width: 50%;
}

.sy-column-7 {
    width: 58.33333333333333%;
    max-width: 58.33333333333333%;
}

.sy-column-8 {
    width: 66.66666666666667%;
    max-width: 66.66666666666667%;
}

.sy-column-9 {
    width: 75%;
    max-width: 75%;
}

.sy-column-10 {
    width: 83.33333333333333%;
    max-width: 83.33333333333333%;
}

.sy-column-11 {
    width: 91.66666666666667%;
    max-width: 91.66666666666667%;
}

.sy-column-12 {
    width: 100%;
    max-width: 100%;
}

.sy-column-1, .sy-column-2, .sy-column-3, .sy-column-4, .sy-column-5, .sy-column-6, .sy-column-7, .sy-column-8, .sy-column-9, .sy-column-10, .sy-column-11, .sy-column-12 {
    float: left;
    position: relative;
    /*padding-top: 2px;*/
}

.sy-well {
    /*min-width: 300px;
    min-height: 100px;*/
    padding: 10px;
    margin-bottom: 5px;
    background-color: #eaf5ff;
    border: 1px solid #e3e3e3;
    /*-moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;*/
    -moz-box-shadow: inset 0 1px 1px rgba(0,0,0,.05);
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.05);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.05);
}

.k-content .sy-well {
    box-sizing: border-box;
}

.sy-input-button-group label {
    padding-top: 6px;
}

.sy-input-button-group div:first-child {
    float: left;
    margin-right: 3px;
}

.sy-input-button-group div:last-child {
    display: flex;
}

.sy-input-group {
    position: relative;
    display: table;
    border-collapse: separate;
}

    .sy-input-group .sy-text:first-child, .sy-input-group .k-textbox:first-child {
        border-right: 0;
        border-top-right-radius: 0px;
        border-bottom-right-radius: 0px;
    }

    .sy-input-group .sy-text:last-child, .sy-input-group .k-textbox:last-child {
        border-left: 0;
        border-top-left-radius: 0px;
        border-bottom-left-radius: 0px;
    }

.sy-input-group-add-on {
    width: 1%;
    vertical-align: middle;
    display: table-cell;
    padding: 6px 12px;
    font-size: .99em;
    font-weight: 400;
    line-height: 1;
    color: #555555;
    text-align: center;
    background-color: #eee;
    border: 1px solid #ccc;
    border-radius: 4px;
}

    .sy-input-group-add-on:first-child {
        border-right: 0;
        border-top-right-radius: 0px;
        border-bottom-right-radius: 0px;
    }

    .sy-input-group-add-on:last-child {
        border-left: 0;
        border-top-left-radius: 0px;
        border-bottom-left-radius: 0px;
    }

.sy-input-group button {
    display: inline-block;
    margin: 0;
    height: 30px !important;
}

.sy-inner-addon {
    position: relative;
}

    .sy-inner-addon .sy-glyphicon {
        position: absolute;
        padding: 10px;
        /*pointer-events: none;*/
    }

.sy-left-addon .sy-glyphicon {
    left: 0px;
}

.sy-right-addon .sy-glyphicon {
    right: 0px;
}

.sy-left-addon input {
    padding-left: 30px;
}

.sy-right-addon input {
    padding-right: 30px;
}

.sy-list-view,
.sy-list-view-bordered {
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    /*padding: 5px;*/
}

.sy-list-view-bordered {
    border: 1px solid #e3e3e3;
}

ul[id^='ulAppReportsFormSelect'],
ul[id^='ulTimeCardSelect'] {
    border: 1px solid #e3e3e3;
    height: 225px;
    overflow-y: scroll;
    /*margin-top: -1px;*/
}

    ul[id^='ulAppReportsFormsSelect'] li,
    ul[id^='ulTimeCardSelect'] li {
        border: 1px solid #dddddd;
        margin-top: -1px;
    }

.sy-list-view li {
    line-height: 25px;
    background-color: #f9f9f9;
    padding-left: 5px;
    cursor: pointer;
}

    .sy-list-view li:hover {
        background-color: #cccccc;
    }

.sy-line-space-1-2 {
    margin-top: 7px;
}

.sy-line-space-1 {
    margin-top: 15px;
}

.sy-line-space-2 {
    margin-top: 30px;
}

.sy-draggable {
    cursor: move;
}

.sy-disabled:not(tbody) {
    cursor: not-allowed !important;
    pointer-events: none;
    opacity: 0.5;
}

.sy-disabled li, .sy-disabled button, .sy-disabled tr, .sy-disabled i {
    pointer-events: none;
    opacity: 0.5;
}

.sy-horizontal-line {
    border-top: 1px solid #000000;
}

.sy-vertical-line {
    border-left: 1px solid #000000;
}

.sy-uppercase {
    text-transform: uppercase;
}

.sy-reports-selectall-unselectall-buttons {
    padding-top: 65px;
}

.sy-textarea-container label {
    vertical-align: top;
}

.sy-allow-overflow {
    overflow: visible !important;
}

.sy-checkbox-in-a-row {
    vertical-align: middle;
}

.sy-glyphicon-pushpin.set {
    -moz-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
}

.sy-modal-textarea {
    resize: none;
    display: block;
    border: 1px solid #c3c3c3;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    width: 100%;
    height: 250px;
    /*margin-top: 5px;*/
    padding: 5px;
}

.sy-bold {
    font-weight: bold;
}

.sy-italic {
    font-style: italic;
}

.sy-context-menu {
    padding: 3px;
    width: 175px;
    -moz-box-shadow: 0px 9px 17px -2px black !important;
    -webkit-box-shadow: 0px 9px 17px -2px black !important;
    box-shadow: 0px 9px 17px -2px black !important;
}

.sy-text-titlecase {
    text-transform: capitalize;
}

.sy-cursor-pointer {
    cursor: pointer;
}

.sy-border-total {
    border-top: 1px solid #000000;
}

.sy-blink {
    animation: sy-blink 700ms infinite alternate;
}

.sy-error-color,
.fa.fa-trash-alt {
    color: #d9534f !important;
}

    .sy-error-color span {
        color: #d9534f !important;
    }

.fa.fa-cloud-download-alt,
.fa.fa-cloud-upload-alt {
    color: #034ea2;
}

.fa.fa-edit {
    color: #398218;
}

.sy-currency-total-lbl {
    width: 100% !important;
    height: 23px;
    background-color: #333333;
    color: #85bb65;
}

.sy-from-to-dates label {
    width: 50px;
    display: inline-block;
}

.sy-date-text {
    /*width: 150px; esto lo retiro por que quita el icono de los calendarios*/ 
    max-width: 150px;
}

.sy-time-text {
    width: 100px !important;
    max-width: 100px;
}

.sy-hour-number-text,
.sy-day-number-text,
.sy-minute-number-text {
    width: 85px;
    max-width: 85px;
}

.sy-year-ddl {
    width: 80px;
    max-width: 80px;
}

.sy-month-ddl {
    width: 110px;
    max-width: 110px;
}

.sy-numeric-text {
    width: 125px;
    max-width: 125px;
}



.sy-numeric-text-lg {
    width: 200px;
    max-width: 200px;
}
/*Heidy 03/21/2024*/

.sy-total-width {
    width: 125px !important;
}

.sy-number-text {
    width: 75px;
    max-width: 75px;
}

.sy-address-text {
    width: 200px;
    max-width: 200px;
}

.sy-zipcode-text {
    width: 100px;
    max-width: 100px;
}

.sy-city-text {
    width: 200px;
    max-width: 200px;
}

.sy-state-text {
    width: 200px;
    max-width: 200px;
}

.sy-country-text {
    width: 200px;
    max-width: 200px;
}

.sy-email-text {
    width: 350px;
    max-width: 350px;
}

.sy-phone-text {
    width: 155px;
    max-width: 155px;
}

.sy-url-text {
    width: 315px;
    max-width: 315px;
}

.sy-btnurl-width {
    width: 35px;
    max-width: 35px;
}

.sy-decimalplaces-ddl {
    width: 55px;
}

.sy-input-sm {
    width: 100px;
    min-width: 100px;
    max-width: 100px;
}

.sy-input-md {
    width: 150px;
    min-width: 150px;
    max-width: 150px;
}

.sy-input-lg {
    width: 230px; /*le puse 230 por que recorta los cbo de tax_deduction*/
    min-width: 230px;
    max-width: 230px;
}

    .sy-input-lg.k-numerictextbox,
    .sy-input-lg.k-numerictextbox input,
    .sy-input-lg.k-combobox,
    .sy-input-lg.k-combobox input {
        min-width: auto;
    }

.sy-input-xl {
    width: 300px;
    min-width: 300px;
    max-width: 300px;
}

.sy-input-xxl {
    width: 400px;
    min-width: 400px;
    max-width: 400px;
}

.sy-code-sm-txt-width {
    width: 100px;
    max-width: 100px;
}

.sy-code-md-txt-width {
    width: 150px;
    max-width: 150px;
}

.sy-code-lg-txt-width {
    width: 200px !important;
    max-width: 200px !important;
}

.sy-code-xl-txt-width {
    width: 250px !important;
    max-width: 250px !important;
}

.sy-code-xxl-txt-width {
    width: 300px !important;
    max-width: 300px !important;
}

.sy-code-sm-ddl-width {
    width: 100px;
    max-width: 100px;
}

.sy-code-md-ddl-width {
    width: 150px;
    max-width: 150px;
}

.sy-code-lg-ddl-width {
    width: 200px;
    max-width: 200px;
}

.sy-code-xl-ddl-width {
    width: 250px;
    max-width: 250px;
}

.sy-code-xxl-ddl-width {
    width: 300px;
    max-width: 300px;
}

.sy-code-sm-cbo-width {
    width: 100px;
    max-width: 100px;
}

.sy-code-md-1-2-cbo-width {
    width: 125px;
    max-width: 125px;
}

.sy-code-md-cbo-width {
    width: 150px;
    max-width: 150px;
}

.sy-code-lg-1-2-cbo-width {
    width: 175px;
    max-width: 175px;
}

.sy-code-lg-cbo-width {
    width: 200px;
    max-width: 200px;
}

.sy-code-xl-1-2-cbo-width {
    width: 225px;
    max-width: 250px;
}

.sy-code-xl-cbo-width {
    width: 250px;
    max-width: 250px;
}

.sy-code-xxl-cbo-width {
    width: 300px;
    max-width: 300px;
}

.sy-code-xxxl-cbo-width {
    width: 350px;
    max-width: 350px;
}

.sy-name-description-cbo-width {
    width: 250px;
    max-width: 250px;
}

.sy-name-description-sm-cbo-width {
    width: 150px;
    max-width: 150px;
}

.sy-name-description-md-cbo-width {
    width: 200px;
    max-width: 200px;
}

.sy-name-description-lg-cbo-width {
    width: 250px;
    max-width: 250px;
}

.sy-name-description-xl-cbo-width {
    width: 300px;
    max-width: 300px;
}

.sy-name-description-xxl-cbo-width {
    width: 350px;
    max-width: 350px;
}

.sy-name-description-xxlc-cbo-width {
    width: 400px;
    max-width: 400px;
}

.sy-taxes-code-width {
    width: 175px;
    max-width: 175px;
}

.sy-txt-md-width {
    width: 175px;
    max-width: 175px;
}

.sy-groups-code-width {
    width: 250px;
}

.sy-gl-accountcode-width {
    width: 300px;
}

.sy-ap-vendorcode-width {
    width: 250px;
}

.sy-ar-customercode-width {
    width: 250px;
}

.sy-pr-earningcode-width {
    width: 250px;
}

.sy-br-bankcode-width {
    width: 100px;
}

.sy-im-warehousecode-width {
    width: 110px;
    max-width: 110px;
}

.sy-im-warehousename-width {
    width: 250px;
    max-width: 250px;
}

.sy-im-unitofmeasure-width {
    width: 125px;
}

.sy-im-binlocation-width {
    width: 250px;
}

.sy-pos-storecode-width {
    width: 200px;
}

.sy-text-readonly {
    background-color: #fff;
    border: none;
    color: #333;
    font-size: 100%;
    font-family: inherit;
    -webkit-appearance: none;
    background: 0 0;
    line-height: 1.65em;
    text-indent: 0.571em;
    padding: 0.17857143em 0;
    width: 100%;
    outline: 0;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    display: inline-block;
    vertical-align: middle;
    position: relative;
    overflow: visible;
    box-sizing: border-box;
    pointer-events: none;
    cursor: not-allowed;
}

    .sy-text-readonly.bordered {
        border: 1px solid #ccc;
        -moz-border-radius: 4px;
        -webkit-border-radius: 4px;
        border-radius: 4px;
    }

    .sy-text-readonly.bordered-bottom {
        border: none;
        border-bottom: 1px solid #ccc;
        -moz-border-radius: 0;
        -webkit-border-radius: 0;
        border-radius: 0;
    }

.sy-relative-pos {
    position: relative !important;
}
/*#region (Esteban) grid SO View Orders*/
.sy-so-shared-btn {
    background-color: var(--main-color-default);
    border: 1px solid #f0f8ffa3;
    border-radius: 4px;
    padding: 7px;
    color: white;
    cursor: pointer;
    transition: all .3s ease-in-out;
}

    .sy-so-shared-btn:hover {
        background-color: white;
        color: var(--main-color-default);
        border: 1px solid var(--main-color-default);
    }

.sy-so-shared-btnviewmodal {
    padding: 0px !important;
    text-align: center;
    top: 0;
    width: 100%;
}
/*#endregion (Esteban) grid SO View Orders*/

/*#region (Arnaldo): Resets*/
fieldset legend {
    font-weight: bold;
    font-size: 14px;
}

hr:not(.v) {
    width: 100%;
}

hr.gradient:not(.v) {
    clear: both;
    background: linear-gradient(to right, transparent,#ccc,transparent);
    height: 1.5px;
    border: none;
}

hr.v {
    height: 100%;
    margin-top: 0;
    margin-bottom: 0;
}

hr.gradient.v {
    clear: both;
    background: linear-gradient(to top, transparent,#ccc,transparent);
    width: 1.5px;
    border: none;
}


.sy-brandbd-primary {
    background-color: #2983d9;
}

.sy-brandft-primary {
    color: #2983d9;
}

.sy-brandbg-green {
    background-color: #8abd3a;
}

.sy-brandft-green {
    color: #8abd3a;
}

.sy-brandbg-yellow {
    background-color: #ded92e;
}

.sy-brandft-yellow {
    color: #ded92e;
}

.sy-brandbd-teal {
    background-color: #4b95af;
}

.sy-brandft-teal {
    color: #4b95af;
}
/*#endregion*/

/*#region (Arnaldo): Custom document previewer*/
.sy-document-preview-container {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: flex;
    -ms-flex-direction: column;
    -webkit-flex-direction: column;
    flex-direction: column;
    -ms-flex-wrap: nowrap;
    -webkit-flex-wrap: nowrap;
    flex-wrap: nowrap;
    flex-shrink: 0;
    -webkit-flex-grow: 1;
    flex-grow: 1;
    min-width: 320px;
    width: 550px;
    max-width: 550px;
    background-color: #ddd;
    padding: 1em;
}

    .sy-document-preview-container > label {
        font-weight: bold;
        font-size: 14px;
        margin: 0 0.5em 0.5em 0.5em;
    }

    table.k-editor.sy-document-preview-inner,
    .sy-document-preview-container > table.k-editor {
        background-color: white;
        border: 1px solid black;
        -moz-border-radius: 0;
        -webkit-border-radius: 0;
        border-radius: 0;
        -webkit-flex-grow: 1;
        flex-grow: 1;
        flex-shrink: 0;
        width: 100%;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        padding: 1em;
        overflow-y: auto;
        /*Added*/
        display: block;
    }

        table.k-editor.sy-document-preview-inner > tbody,
        .sy-document-preview-container > table.k-editor > tbody {
            height: 100%;
            /*Added*/
            display: table;
            width: 100%;
        }

            table.k-editor.sy-document-preview-inner > tbody > tr:not([role="presentation"]),
            .sy-document-preview-container > table.k-editor > tbody > tr:not([role="presentation"]) {
                height: 100%;
                width: 100%;
                display: block;
            }

                table.k-editor.sy-document-preview-inner > tbody > tr:not([role="presentation"]) > td.k-editable-area,
                .sy-document-preview-container > table.k-editor > tbody > tr:not([role="presentation"]) > td.k-editable-area {
                    display: block;
                }

                    table.k-editor.sy-document-preview-inner > tbody > tr:not([role="presentation"]) > td.k-editable-area > iframe,
                    .sy-document-preview-container > table.k-editor > tbody > tr:not([role="presentation"]) > td.k-editable-area > iframe {
                        height: 100%;
                        width: 100%;
                        border: none;
                    }
/*#endregion*/

/*#region (Arnaldo): Control Containers */
.sy-container.outer {
    display: flex;
    box-sizing: border-box;
    flex-direction: column;
    position: relative;
}

    .sy-container.outer > *:not(#divMain) {
        flex-grow: 0;
        flex-shrink: 0;
        position: relative;
    }

    .sy-container.outer > #divMain {
        flex-grow: 1;
        flex-shrink: 1;
        box-sizing: border-box;
        /*display: flex;
		flex-direction: column;
		flex-wrap: nowrap;*/
        position: relative;
    }

.sy-controls-group {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: flex;
    position: relative;
}

    .sy-controls-group.h {
        -ms-flex-direction: row;
        -webkit-flex-direction: row;
        flex-direction: row;
        -webkit-align-items: center;
        align-items: center;
    }

        .sy-controls-group.h > *:not(:last-child):not(.trimmed) {
            margin-right: 0.5em;
        }

    .sy-controls-group.v {
        -ms-flex-direction: column;
        -webkit-flex-direction: column;
        flex-direction: column;
        /*-webkit-justify-content: center;
		justify-content: center;*/
    }

        .sy-controls-group.v > *:not([class^=sy-spinner]) {
            width: 100%;
        }

.sy-flex-gap {
    gap: 50px;
}

.sy-justify-content-space-between {
    justify-content: space-between
}
/*#endregion*/

/*#region (Arnaldo): Field Containers*/
.sy-field-container,
.sy-url-input-container {
    -ms-flex-direction: row;
    -webkit-flex-direction: row;
    flex-direction: row;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    -webkit-align-items: center;
    align-items: center;
    display: inline-flex;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    position: relative;
}

.sy-controls-group.v .sy-field-container:not(:first-of-type) {
    margin-top: 2px;
}
/*.sy-controls-group.v .sy-field-container:not(:first-of-type):not(.trimmed) {
    margin-top: 2px;
}
*/
.sy-field-container:not(.v) label {
    margin-right: 5px;
    -webkit-flex-grow: 0;
    flex-grow: 0;
    flex-shrink: 0;
}

.sy-field-container:not(.v):not(.sy-checkbox-container) > *:not(label):not(i) {
    -webkit-flex-grow: 1;
    flex-grow: 1;
    flex-shrink: 1;
}
/**/
/*.sy-field-container:not(.sy-checkbox-container) > *:not(label):not(i) {
    -webkit-flex-grow: 0 !important;
    flex-grow: 0 !important;
    width: 0;
}
*/
.sy-field-container.v {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: flex;
    -ms-flex-direction: column;
    -webkit-flex-direction: column;
    flex-direction: column;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    -webkit-align-items: flex-start;
    align-items: flex-start;
    position: relative;
}

    .sy-field-container.v > * {
        -webkit-flex-grow: 0;
        flex-grow: 0;
        flex-shrink: 0;
    }

    .sy-field-container.v.sy-checkbox-container {
        -webkit-align-items: stretch;
        align-items: stretch;
    }

.sy-field-container:not(:last-child):not(.trimmed) {
    margin-right: 0.5em;
}

.sy-url-input-container {
    -webkit-flex-grow: 1;
    flex-grow: 1;
    flex-shrink: 0;
}
/*#endregion*/

/*#region (Arnaldo): Custom Controls*/

/*#region Badge*/
.sy-badge {
    position: relative;
    box-sizing: border-box;
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
}

.sy-badge-data {
    background: transparent;
    color: transparent;
    font-weight: normal;
    font-size: 0.55em;
    position: relative;
    right: 0;
    text-align: center;
}

    .sy-badge-data.hidden {
        opacity: 0;
        display: none;
    }

    /*#region Positions*/
    .sy-badge-data.top:not(.side) {
        top: -1em;
        margin-left: 0.265em;
    }

    .sy-badge-data.side:not(.top) {
        margin-left: 1em;
    }
    /*#endregion*/

    /*#region Shapes*/
    .sy-badge-data.circular:not(.rectangular):not(.padded) {
        border-radius: 50%;
    }

    .sy-badge-data.rectangular:not(.circular):not(.padded) {
        border-radius: 0;
        padding: 0.3em;
    }

    .sy-badge-data.padded:not(.rectangular):not(.circular) {
        border-radius: 5px;
    }
    /*#endregion*/

    /*#region Colors*/

    .sy-badge-data.blank {
        background: transparent;
        color: #ffffff;
        border: 1px solid #cccccc;
    }

    .sy-badge-data.positive {
        background: green;
        color: #ffffff;
    }

    .sy-badge-data.negative {
        background: #d9534f;
        color: #ffffff;
    }

    .sy-badge-data.warning {
        background: #fdce3e;
        color: #000000;
    }

    .sy-badge-data.information {
        background: #3e80ed;
        color: #ffffff;
    }

    /*#endregion*/

    /*#region Combinations*/
    .sy-badge-data.circular.top:not(.side):not(.rectangular):not(.padded) {
        padding: 0.3em;
        width: 2em;
        height: 2em;
        line-height: 2em;
        white-space: nowrap;
        overflow: hidden;
        -ms-text-overflow: ellipsis;
        -o-text-overflow: ellipsis;
        text-overflow: ellipsis;
    }

    .sy-badge-data.circular.side:not(.top):not(.rectangular):not(.padded) {
        padding: 0.3em;
        font-size: 14px;
        width: 2em;
        height: 2em;
        line-height: 2em;
        white-space: nowrap;
        overflow: hidden;
        -ms-text-overflow: ellipsis;
        -o-text-overflow: ellipsis;
        text-overflow: ellipsis;
    }

    .sy-badge-data.rectangular.side:not(.circular):not(.padded):not(.top) {
        font-size: 14px;
        padding: 0.3em 0.75em;
    }

    .sy-badge-data.padded.top:not(.circular):not(.rectangular):not(.side) {
        padding: 0.3em 0.75em;
        height: 2em;
        line-height: 2em;
        white-space: nowrap;
        overflow: hidden;
        -ms-text-overflow: ellipsis;
        -o-text-overflow: ellipsis;
        text-overflow: ellipsis;
    }

    .sy-badge-data.padded.side:not(.circular):not(.rectangular):not(.top) {
        font-size: 14px;
        padding: 0.3em 0.75em;
    }
/*#endregion*/

/*#endregion Badge*/

/*#region InfoBox*/
.sy-info-box {
    background-color: #e1f3f8;
    border: 1px solid #02bfe7;
    box-sizing: border-box;
    display: flex;
    margin: 0.5em 0;
    -moz-box-sizing: border-box;
    padding: 1em;
    position: relative;
    width: 100%;
    -webkit-box-sizing: border-box;
}

.sy-info-box__close {
    align-items: center;
    background-color: #777;
    border-radius: 100%;
    box-sizing: border-box;
    color: white;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    font-weight: bold;
    height: 1.8em;
    justify-content: center;
    -moz-border-radius: 100%;
    -moz-box-sizing: border-box;
    -ms-flex-direction: column;
    position: absolute;
    right: 0;
    top: 0;
    transform: translate(40%, -40%);
    -webkit-align-items: center;
    -webkit-border-radius: 100%;
    -webkit-box-sizing: border-box;
    -webkit-flex-direction: column;
    -webkit-justify-content: center;
    width: 1.8em;
}

.sy-info-box__icon-container {
    align-items: stretch;
    box-sizing: border-box;
    color: #2983d9;
    display: flex;
    flex: 0 0 auto;
    flex-direction: column;
    font-size: 2em;
    justify-content: center;
    margin-right: 0.5em;
}

.sy-info-box__content {
    box-sizing: border-box;
    display: flex;
    flex: 1 1 100%;
    flex-direction: column;
    flex-wrap: nowrap;
    -moz-box-sizing: border-box;
    -ms-flex-direction: column;
    -ms-flex-wrap: nowrap;
    -webkit-box-sizing: border-box;
    -webkit-flex-direction: column;
    -webkit-flex-wrap: nowrap;
}

    .sy-info-box__content h1,
    .sy-info-box__content h2,
    .sy-info-box__content h3,
    .sy-info-box__content h4,
    .sy-info-box__content h5,
    .sy-info-box__content h6 {
        font-weight: bold;
        margin: 0.2em 0;
    }

    .sy-info-box__content h1 {
        font-size: 32px;
    }

    .sy-info-box__content h2 {
        font-size: 24px;
    }

    .sy-info-box__content h3 {
        font-size: 18.73px;
    }

    .sy-info-box__content h4 {
        font-size: 16px;
    }

    .sy-info-box__content h5 {
        font-size: 13.26px;
    }

    .sy-info-box__content h6 {
        font-size: 10.73px;
    }

    .sy-info-box__content *:not(h1):not(h2):not(h3):not(h4):not(h5):not(h6):not(small) {
        font-size: 14px;
    }

    .sy-info-box__content small {
        font-size: 12px;
        opacity: 0.5;
    }

.sy-info-box__content--row {
    -ms-flex: 0 0 auto;
    -webkit-flex: 0 0 auto;
    flex: 0 0 auto;
}

    .sy-info-box__content--row.stretch {
        -ms-flex: 1 1 auto;
        -webkit-flex: 1 1 auto;
        flex: 1 1 auto;
    }
/*#endregion*/

/*#region DateRangeSelector*/
.sy-range-selection-value-label {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: flex;
    -ms-flex-direction: column;
    -webkit-flex-direction: column;
    flex-direction: column;
    -ms-flex-wrap: nowrap;
    -webkit-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-justify-content: center;
    justify-content: center;
    height: 100%;
    width: 100%;
}

.sy-range-selection-mode-selector,
.sy-range-selection-payperiods-selector {
    width: 15em;
}

/*#endregion*/

/*#endregion Custom Controls*/

/*#region (Arnaldo): Pseudo-Selectors*/
input:focus {
    outline: 0;
}

.k-numeric-wrap:focus {
    outline: 0;
}

.k-numeric-wrap:focus-visible {
    outline: 0;
}

input:focus-visible {
    outline: 0;
}

select:focus-visible {
    outline: 1px solid #4596ce;
}

.focus-visible {
    outline: 0;
}
/*#endregion*/

/*#region - MEDIA QUERIES -*/
@media (max-width: 760px) {
    /*#region - Los de arriba bajados acá -*/
    .sy-text, .k-textbox, .k-numerictextbox:not(.sy-input-group-exclude, .sy-input-lg, .sy-input-md, .k-combobox), .k-dropdown, .k-datepicker {
        display: block !important;
    }

    .sy-input-lg,
    .sy-input-md {
        width: 100%;
        max-width: 100%;
    }

    .sy-container-flex-row {
        display: block;
        width: 100%;
    }

    .sy-total-width {
        width: 100% !important;
    }

    .sy-flex-1, sy-flex-2, sy-flex-3 {
        width: 100%;
    }

    /*    .sy-footer .sy-footer-info .sy-container-flex-row {
        display: inline-flex;
    }
*/
    .sy-column-1, .sy-column-2, .sy-column-3, .sy-column-4, .sy-column-5, .sy-column-6, .sy-column-7, .sy-column-8, .sy-column-9, .sy-column-10, .sy-column-11, .sy-column-12 {
        width: 100%;
        max-width: 100%;
    }

    .sy-input-button-group {
        display: grid;
    }

        .sy-input-button-group label {
            padding-top: 0px;
        }
    /*#endregion*/

    .sy-container.outer > *:not(#divMain) {
        -ms-flex-wrap: wrap;
        -webkit-flex-wrap: wrap;
        flex-wrap: wrap;
    }

    .sy-controls-group {
        -ms-flex-direction: column !important;
        -webkit-flex-direction: column !important;
        flex-direction: column !important;
        /*-webkit-justify-content: center;
        justify-content: center; */ 
        -webkit-align-items: flex-start;
        align-items: flex-start;
        width: 100% !important;
    }

        .sy-controls-group.h > *:not(.trimmed) {
            /*margin: 0 !important;REM revisar si se anade de nuevo o no*/
            padding-left: 0.5em;
            padding-right: 0.5em;
        }

    .sy-field-container {
        display: inline-flex;
        box-sizing: border-box;
        -ms-flex-direction: column !important;
        -webkit-flex-direction: column !important;
        flex-direction: column !important;
        width: 100% !important;
        -webkit-align-items: flex-start;
        align-items: flex-start;
        -webkit-justify-content: center;
        justify-content: center;
        /*margin-right: 7px;
		margin-left: 7px;*/
        margin: 0.265em 0 !important;
    }

    .sy-checkbox-container {
        /*		margin-top: 7px;*/
    }

    .sy-field-container.sy-checkbox-container {
        display: inline;
    }

    .sy-field-container:not(.sy-checkbox-container) > *:not(label):not(i) {
        margin-right: 0 !important;
        -webkit-flex-grow: 0;
        flex-grow: 0;
        flex-shrink: 0;
        width: 100%;
        max-width: 100%;
    }

    .sy-field-container.sy-checkbox-container > label {
        -webkit-flex-grow: 0;
        flex-grow: 0;
        flex-shrink: 0;
        width: 100%;
    }

    /*    input[type="radio"].sy-field-radio-button,
    label.sy-radio-label {
        display: inline-block;
        margin-right: .8rem;
    } */
    .sy-field-container > #lbleMail {
        width: 100%;
        max-width: 100%;
    }

    .sy-url-input-container > input.sy-url-text {
        -webkit-flex-grow: 1;
        flex-grow: 1;
        flex-shrink: 0;
        width: auto;
        max-width: 100%;
    }

    .sy-date-text {
        width: 100%;
        max-width: 100%;
    }

    .sy-flex-gap {
        gap: initial;
    }
}
/*#endregion*/

/*#region - KEYFRAMES -*/
@keyframes sy-blink {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
    }
}
/*#endregion*/


