:root {
    --nx-box-soft-backcolor: #eaeef7;
    --nx-box-soft-bordercolor: #e2e6f0;
    --nx-color-primary: #687aae;
    --nx-color-primary-hover: #414e76;
    --nx-color-secondary: var(--nsop-theme-palette-secondary-color);
    --nx-text-general-color: #726b9f;
    --nx-text-general-neg-color: white;
    --nx-text-general-highlight-color: navy;
    --nx-link-general-color: #726b9f;
    --nx-link-general-color-hover: royalblue;
    --nx-sec-title-color: var(--nx-color-primary, dimgray);
    --nx-sec-subtitle-color: var(--nx-text-general-color, dimgray);
    --nx-text-title-color: var(--nx-text-general-color, dimgray);
    --nx-text-title-highlight-color: var(--nx-text-general-highlight-color, black);
    --nx-text-subtitle-color: var(--nx-text-general-color, dimgray);
    --nx-cta-backcolor: var(--nx-box-soft-backcolor, whitesmoke);
    --nx-cta-bordercolor: var(--nx-box-soft-backcolor, whitesmoke);
    --nx-cta-text-color: var(--nx-text-general-color, navy);
    --nx-cta-backcolor-hover: var(--nx-color-primary, #6d6da2);
    --nx-cta-bordercolor-hover: var(--nx-color-primary, #6d6da2);
    --nx-cta-text-color-hover: var(--nx-text-general-neg-color, white);
    --nx-navmenu-backcolor: #3e3e6ce6;
    --nx-footer-backcolor: #36364d;
}

/* Page */
:root {
    --page-global-padding: .5rem;
    --page-global-pane-backcolor: #363442;
    --page-items-width: 18rem;
    --page-items-backcolor: var(--page-global-pane-backcolor);
    --page-items-color: #a7bcce;
    --page-items-sep-color: #434959;
    --page-items-logo-height: 5rem;
    --page-header-backcolor: #ddd;
    --page-header-hieght: 3rem;
    --page-header-dropbox-width: 20rem;
    --page-content-backcolor: whitesmoke;
    --page-tabbar-height: 3rem;
    --page-text-typical-color: #506583;
    --page-text-typical-color-focus: #5c5c6f;
    --page-text-typical-color-hover: #28282f;
    --page-text-typical-color-dimmed: #8d8dac;
    --page-text-typical-color-highlight: navy;
    --page-toolbar-height: 3rem;
    --page-toolbar-backcolor: #e1e1e8;
    --page-toolbar-bordercolor: #d4d8e8;
    --page-toolbar-backcolor-hover: #d4d8e8;
    --page-toolbar-bordercolor-hover: #babdca;
    --page-toolbar-focuscolor: rgba(159, 165, 174, 0.5);
    --page-box-backcolor-hover: #e9ecf7;
    --page-image-empty-backcolor: #dbdde7;
    --page-opration-btn-color: white;
    --page-opration-btn-backcolor: #55b7ff;
    --page-opration-btn-bordercolor: #55b7ff;
    --page-opration-btn-backcolor-hover: #0072c5;
    --page-opration-btn-sec-color: var(--page-text-typical-color);
    --page-opration-btn-sec-backcolor: rgb(220 239 253);
    --page-opration-btn-sec-bordercolor: rgb(220 239 253);
    --page-opration-btn-sec-backcolor-hover: rgb(186 225 253);
    --page-opration-btn-inactive-color: var(--page-text-typical-color);
    --page-opration-btn-inactive-backcolor: #f0f2f6;
    --page-opration-btn-inactive-bordercolor: #f0f2f6;
    --page-opration-btn-inactive-backcolor-hover: #e3e3e3;
    --page-opration-btn-danger-color: white;
    --page-opration-btn-danger-backcolor: #f26a6a;
    --page-opration-btn-danger-bordercolor: #f26a6a;
    --page-opration-btn-danger-backcolor-hover: #c14040;
    --page-titlebar-bordercolor: #dee2e6;
}

/* BS */
:root {
    --bs-btn-disabled-opacity: .5;
}

/* BSXs */
:root {
    --bsx-table-hover-color: var(--nx-box-soft-backcolor, whitesmoke);
    --bsx-formcontrol-text-color: var(--page-text-typical-color);
    --bsx-formcontrol-text-color-focus: var(--page-text-typical-color-highlight);
    --bsx-tab-text-inactive: var(--page-text-typical-color);
    --bsx-formcontrol-border-color: #b2b7d0;
    --bsx-formcontrol-outline-color: rgba(103, 129, 170, 0.2);
    --bsx-toolbar-btn-light-backcolor: white;
    --bsx-toolbar-btn-light-backcolor-hover: #e9ecf7;
    --bsx-toolbar-btn-semilight-backcolor: #f0f0f4;
    --bsx-toolbar-btn-semilight-backcolor-hover: #d5d5e1;
    --bsx-toolbar-btn-semilight-border-color: #cfd2df;
    --bsx-toolbar-btn-semilight-border-color-hover: #babdca;
    --bsx-toolbar-btn-light-border-color: #d4d8e8;
    --bsx-toolbar-btn-light-border-color-hover: #d1d4e1;
    --bsx-toolbar-btn-color: #3d5982;
    --bsx-toolbar-btn-color-hover: #152d51;
    --bsx-toolbar-btn-outline-color: rgba(103, 129, 170, 0.4);
    --bsx-opration-btn-backcolor: var(--nx-color-primary,royalblue);
    --bsx-opration-btn-backcolor-hover: var(--nx-color-primary-hover,navy);
}

/* Panel Logins */
:root {
    --pl-color-success: green;
    --pl-color-error: #c00;
    --pl-color-info: royalblue;
    --pl-color-inactive: silver;
    --pl-label-color: #685184;
    --pl-txt-colormain: #685184;
    --pl-txt-colordimmed: #8b7a9f;
    --pl-txt-colorbright: #a1259a;
    --pl-btn-pri-forecolor: white;
    --pl-btn-pri-backcolor: #613291;
    --pl-btn-pri-bordercolor: #2c2995;
    --pl-btn-pri-forecolor-hover: white;
    --pl-btn-pri-backcolor-hover: #992799;
    --pl-btn-pri-bordercolor-hover: #842384;
    --pl-btn-pri-oulinecolor: #61329136;
    --pl-btn-sec-forecolor: #b4229d;
    --pl-btn-sec-backcolor: #faf8fb;
    --pl-btn-sec-bordercolor: #faf8fb;
    --pl-btn-sec-forecolor-hover: #4b296f;
    --pl-btn-sec-backcolor-hover: #f5f0f9;
    --pl-btn-sec-bordercolor-hover: #f5f0f9;
    --pl-btn-sec-oulinecolor: #f0e7f9;
    --pl-txtbtn-color: #8f47d7;
    --pl-txtbtn-color-hover: #2e218a;
    --pl-page-backcolor: whitesmoke;
    --pl-header-mobile-backcolor: white;
    --pl-header-mobile-prvbtn-color: var(--pl-btn-pri-backcolor-hover);
    --pl-header-mobile-prvbtn-top: .5rem;
}