:root {
    --select-arrow: url('/icons/arrow.svg');
    --icon-calendar: url('/icons/calendar.svg');

    --max-width: 1536px;
    --navbar-height: 95px;
    --border-radius: 12px;

    --background-color: white;
    --background-light-color: white;
    --background-dark-color: white;

    --txt-color: black;

    --header-height: 48px;
    --sidebar-small-width: 56px;
    --sidebar-width: 240px;
    --aside-atenciones-width: 350px;

    --cheung-color: #003d54;
    --cheung-light-color: #396781;
    --cheung-dark-color: #00172b;

    --success-main-color: #66bb6a;
    --success-light-color: #81c784;
    --success-dark-color: #388e3c;

    --error-main-color: #f44336;
    --error-light-color: #e57373;
    --error-dark-color: #d32f2f;

    --warning-main-color: #ffa726;
    --warning-light-color: #ffb74d;
    --warning-dark-color: #f57c00;

    --info-main-color: #29b6f6;
    --info-light-color: #4fc3f7;
    --info-dark-color: #0288d1;

    --secondary-main-color: #ce93d8;
    --secondary-light-color: #f3e5f5;
    --secondary-dark-color: #ab47bc;

    --scrollbar-color: var(--cheung-light-color);
    --scrollbar-thumb-color: var(--cheung-color);
    --scrollbar-bg-color: #dfdfdf;
    --scrollbar-bg-track-color: #eee;
    --scrollbar-bg-border-color: lightgray;

    /* THEME COLORS */
    --color-app-primary: #003d54;
    --color-onAppPrimary: white;
    --color-app-secondary: #006879;
    --color-app-tertiary: #4d4ec8;
    --color-app-success: #126d27;
    --color-app-error: #ba1a1a;
    --color-app-background: #fbfcfe;
    --color-onAppBackground: #191c1e;
    --color-table-primary: #003d54;
    --color-table-secondary: rgb(233, 233, 233);
    --color-input-field: #003d54;
    --color-proforma-cobrado: rgb(137, 214, 137);
    --color-proforma-enviar: red;
    --color-proforma-pendiente: rgb(243, 67, 243);
    --color-miscelaneo-secondary: rgb(249, 195, 249);
    --color-itbms-secondary: rgb(163, 240, 245);
    --color-seguro-secondary: rgb(163, 240, 245);
    --color-seguro-tertiary: rgb(249, 195, 249);
    --color-seguro-quater: rgb(253, 214, 140);
    --color-seguro-descuento: rgb(250, 152, 116);
    --color-disabled-button: rgb(216, 216, 216);

    /** APP COLORS **/

    /* Color Primary */
    --color-primary: 0, 61, 84;
    --color-primary-hsl: 196, 100%, 16%;
    --color-primary-hsl-part: 196, 100%;
    /* Color On Primary */
    --color-onPrimary: 255, 255, 255;
    --color-onPrimary-hsl: 0, 0%, 100%;
    --color-onPrimary-hsl-part: 0, 0%;
    /* Color Secondary */
    --color-secondary: 108, 117, 125;
    --color-secondary-hsl: 208, 7%, 46%;
    --color-secondary-hsl-part: 208, 7%;
    /* Color On Secondary */
    --color-onSecondary: 255, 255, 255;
    --color-onSecondary-hsl: 0, 0%, 100%;
    --color-onSecondary-hsl-part: 0, 0%;
    /* Color Error */
    --color-error: 185, 28, 28;
    --color-error-hsl: 0, 74%, 42%;
    --color-error-hsl-part: 0, 74%;
    /* Color On Error */
    --color-onError: 255, 255, 255;
    --color-onError-hsl: 0, 0%, 100%;
    --color-onError-hsl-part: 0, 0%;
    /* Color Warning */
    --color-warning: 245, 158, 11;
    --color-warning-hsl: 38, 92%, 50%;
    --color-warning-hsl-part: 38, 92%;
    /* Color On Warning */
    --color-onWarning: 255, 255, 255;
    --color-onWarning-hsl: 0, 0%, 100%;
    --color-onWarning-hsl-part: 0, 0%;
    /* Color Success */
    --color-success: 22, 162, 55;
    --color-success-hsl: 134, 76%, 36%;
    --color-success-hsl-part: 134, 76%;
    /* Color On Success */
    --color-onSuccess: 255, 255, 255;
    --color-onSuccess-hsl: 0, 0%, 100%;
    --color-onSuccess-hsl-part: 0, 0%;
    /* Color Info */
    --color-info: 23, 162, 184;
    --color-info-hsl: 188, 78%, 41%;
    --color-info-hsl-part: 188, 78%;
    /* Color On Info */
    --color-onInfo: 255, 255, 255;
    --color-onInfo-hsl: 0, 0%, 100%;
    --color-onInfo-hsl-part: 0, 0%;
    /* Color Tertiary */
    --color-tertiary: 90, 69, 148;
    --color-tertiary-hsl: 256, 36%, 43%;
    --color-tertiary-hsl-part: 256, 36%;
    /* Color On Tertiary */
    --color-onTertiary: 255, 255, 255;
    --color-onTertiary-hsl: 0, 0%, 100%;
    --color-onTertiary-hsl-part: 0, 0%;
    /* Color Gray */
    --color-gray-50: 249, 250, 251;
    --color-gray-100: 243, 244, 246;
    --color-gray-200: 229, 231, 235;
    --color-gray-300: 209, 213, 219;
    --color-gray-400: 156, 163, 175;
    --color-gray-500: 107, 114, 128;
    --color-gray-600: 75, 85, 99;
    --color-gray-700: 55, 65, 81;
    --color-gray-800: 31, 41, 55;
    --color-gray-900: 17, 24, 39;
}

* {
    box-sizing: border-box;
    padding: 0;
    margin: 0;
    font-family: Nunito, sans-serif;
}

[data-theme='dark'] {
    --color-app-primary: #191c1e;
    --color-onAppPrimary: white;
    --color-app-secondary: #54d7f2;
    --color-app-tertiary: #c1c1ff;
    --color-app-success: #83da85;
    --color-app-error: #ffb4ab;
    --color-app-background: rgb(var(--color-gray-100));
    --color-onAppBackground: #e1e2e5;
    --scrollbar-color: rgb(var(--color-gray-500));
    --scrollbar-thumb-color: var(--color-app-primary);
    --scrollbar-bg-color: var(--color-app-primary);
    --scrollbar-bg-track-color: var(--color-app-primary);
    --scrollbar-bg-border-color: var(--color-app-primary);
    --color-table-primary: #8a9297;
    --color-table-secondary: #2b2e30;
    --color-input-field: #e1e2e5;
    --color-proforma-cobrado: rgb(59, 97, 59);
    --color-proforma-enviar: rgb(255, 177, 177);
    --color-proforma-pendiente: rgb(173, 46, 173);
    --color-miscelaneo-secondary: rgb(243, 67, 243);
    --color-itbms-secondary: rgb(40, 157, 166);
    --color-seguro-secondary: rgb(40, 157, 166);
    --color-seguro-tertiary: rgb(184, 101, 243);
    --color-seguro-quater: rgb(202, 146, 42);
    --color-seguro-descuento: rgb(248, 195, 176);
    --color-disabled-button: rgb(216, 216, 216);

    /** APP COLORS **/

    /* Color Primary */
    --color-primary: 60, 60, 60;
    --color-primary-hsl: 196, 100%, 16%;
    --color-primary-hsl-part: 196, 100%;
    /* Color On Primary */
    --color-onPrimary: 214, 214, 214;
    --color-onPrimary-hsl: 0, 0%, 84%;
    --color-onPrimary-hsl-part: 0, 0%;
    /* Color Secondary */
    --color-secondary: 108, 117, 125;
    --color-secondary-hsl: 208, 7%, 46%;
    --color-secondary-hsl-part: 208, 7%;
    /* Color On Secondary */
    --color-onSecondary: 235, 235, 235;
    --color-onSecondary-hsl: 0, 0%, 92%;
    --color-onSecondary-hsl-part: 0, 0%;
    /* Color Error */
    --color-error: 149, 6, 6;
    --color-error-hsl: 0, 92%, 30%;
    --color-error-hsl-part: 0, 92%;
    /* Color On Error */
    --color-onError: 225, 225, 225;
    --color-onError-hsl: 0, 0%, 88%;
    --color-onError-hsl-part: 0, 0%;
    /* Color Warning */
    --color-warning: 186, 142, 35;
    --color-warning-hsl: 43, 68%, 43%;
    --color-warning-hsl-part: 43, 68%;
    /* Color On Warning */
    --color-onWarning: 235, 235, 235;
    --color-onWarning-hsl: 0, 0%, 92%;
    --color-onWarning-hsl-part: 0, 0%;
    /* Color Success */
    /* --color-success: 6, 64, 43;
    --color-success-hsl: 158, 83%, 14%;
    --color-success-hsl-part: 158, 83%; */
    --color-success: 22, 162, 55;
    --color-success-hsl: 134, 76%, 36%;
    --color-success-hsl-part: 134, 76%;
    /* Color On Success */
    /* --color-onSuccess: 225, 225, 225;
    --color-onSuccess-hsl: 0, 0%, 88%;
    --color-onSuccess-hsl-part: 0, 0%; */
    --color-onSuccess: 255, 255, 255;
    --color-onSuccess-hsl: 0, 0%, 100%;
    --color-onSuccess-hsl-part: 0, 0%;
    /* Color Info */
    --color-info: 1, 87, 155;
    --color-info-hsl: 206, 99%, 31%;
    --color-info-hsl-part: 206, 99%;
    /* Color On Info */
    --color-onInfo: 225, 225, 225;
    --color-onInfo-hsl: 0, 0%, 88%;
    --color-onInfo-hsl-part: 0, 0%;
    /* Color Tertiary */
    --color-tertiary: 90, 69, 148;
    --color-tertiary-hsl: 256, 36%, 43%;
    --color-tertiary-hsl-part: 256, 36%;
    /* Color On Tertiary */
    --color-onTertiary: 255, 255, 255;
    --color-onTertiary-hsl: 0, 0%, 100%;
    --color-onTertiary-hsl-part: 0, 0%;
    /* Color Gray */
    --color-gray-50: 10, 10, 10;
    --color-gray-100: 23, 23, 23;
    --color-gray-200: 38, 38, 38;
    --color-gray-300: 55, 55, 55;
    --color-gray-400: 82, 82, 82;
    --color-gray-500: 138, 138, 138;
    --color-gray-600: 163, 163, 163;
    --color-gray-700: 212, 212, 212;
    --color-gray-800: 229, 229, 229;
    --color-gray-900: 245, 245, 245;
}

body {
    line-height: 1.37;
    letter-spacing: 0.00938em;
    font-size: 1rem;
    background-color: var(--color-app-background);
    color: var(--color-onAppBackground);
    overscroll-behavior: none;
}

[data-theme='dark'] body {
    color: rgb(var(--color-gray-700));
}

a {
    color: inherit;
    text-decoration: none;
}

.page {
    display: flex;
    flex-direction: column;
}

input::-ms-reveal,
input::-ms-clear {
    display: none;
}

/* body:has(> div + div#app) > div:has(> iframe) {
    padding: 0 !important;
}

body:has(> div + div#app) > div > iframe {
    border: none !important;
    border-radius: 0 !important;
} */