﻿:root {
    --bs-primary: #3a464f;
    --bs-primary-rgb: 58, 70, 79;
    --bs-secondary: #536865;
    --bs-secondary-rgb: 83, 104, 101;
    --bs-success: #126237;
    --bs-success-rgb: 18, 98, 55;
    --bs-info: #4b929e;
    --bs-info-rgb: 75, 146, 158;
    --bs-warning: #e1c82a;
    --bs-warning-rgb: 225, 200, 42;
    --bs-danger: #9d474a;
    --bs-danger-rgb: 157, 71, 74;
}

:root {
    /* =========================================================
       DARK
       ========================================================= */
    --dark: rgb(var(--bs-dark-rgb));
    --bs-dark-active: rgba(var(--bs-dark-rgb), 0.85);
    --bs-dark-light: rgba(var(--bs-dark-rgb), 0.15);
    --bs-dark-clarity: rgba(var(--bs-dark-rgb), 0.08);
    --bs-dark-inverse: #ffffff;
    /* =========================================================
       PRIMARY
       ========================================================= */
    --primary: rgb(var(--bs-primary-rgb));
    --bs-primary-active: rgba(var(--bs-primary-rgb), 0.85);
    --bs-primary-light: rgba(var(--bs-primary-rgb), 0.15);
    --bs-primary-clarity: rgba(var(--bs-primary-rgb), 0.08);
    --bs-primary-inverse: #ffffff;
    /* =========================================================
       SECONDARY
       ========================================================= */
    --secondary: rgb(var(--bs-secondary-rgb));
    --bs-secondary-active: rgba(var(--bs-secondary-rgb), 0.85);
    --bs-secondary-light: rgba(var(--bs-secondary-rgb), 0.15);
    --bs-secondary-clarity: rgba(var(--bs-secondary-rgb), 0.08);
    --bs-secondary-inverse: #ffffff;
    /* =========================================================
       SUCCESS
       ========================================================= */
    --success: rgb(var(--bs-success-rgb));
    --bs-success-active: rgba(var(--bs-success-rgb), 0.85);
    --bs-success-light: rgba(var(--bs-success-rgb), 0.15);
    --bs-success-clarity: rgba(var(--bs-success-rgb), 0.08);
    --bs-success-inverse: #ffffff;
    /* =========================================================
       INFO
       ========================================================= */
    --info: rgb(var(--bs-info-rgb));
    --bs-info-active: rgba(var(--bs-info-rgb), 0.85);
    --bs-info-light: rgba(var(--bs-info-rgb), 0.15);
    --bs-info-clarity: rgba(var(--bs-info-rgb), 0.08);
    --bs-info-inverse: #ffffff;
    /* =========================================================
       WARNING
       ========================================================= */
    --warning: rgb(var(--bs-warning-rgb));
    --bs-warning-active: rgba(var(--bs-warning-rgb), 0.85);
    --bs-warning-light: rgba(var(--bs-warning-rgb), 0.15);
    --bs-warning-clarity: rgba(var(--bs-warning-rgb), 0.08);
    --bs-warning-inverse: #000000;
    /* =========================================================
       DANGER
       ========================================================= */
    --danger: rgb(var(--bs-danger-rgb));
    --bs-danger-active: rgba(var(--bs-danger-rgb), 0.85);
    --bs-danger-light: rgba(var(--bs-danger-rgb), 0.15);
    --bs-danger-clarity: rgba(var(--bs-danger-rgb), 0.08);
    --bs-danger-inverse: #ffffff;
    /* =========================================================
       TEXT
       ========================================================= */
    --bs-text-primary: var(--primary);
    --bs-text-success: var(--success);
    --bs-text-info: var(--info);
    --bs-text-warning: var(--warning);
    --bs-text-danger: var(--danger);
    --crs-text-color: #211F1C;
    /* =========================================================
       OTHERS
       ========================================================= */
    --bs-component-active-bg: #4b7591;
    --bs-component-hover-color: var(--crs-text-color);
    --bs-menu-link-color-hover: var(--crs-text-color);
    --bs-menu-link-color-active: var(--crs-text-color);    
    /* =========================================================
       TEXT
       ========================================================= */
    --bs-form-valid-color: var(--bs-success);
    --bs-form-valid-border-color: var(--bs-success);
    --bs-form-invalid-color: #d73b18;
    --bs-form-invalid-border-color: #d73b18;
}

.text-form-invalid {
    color: var(--bs-form-invalid-color);
}

.form-check-input:checked{background-color: var(--bs-info);}
.dropzone {
    background-color: var(--bs-info-light);
    border: 1px dashed var(--bs-info);
}

.stepper.stepper-pills {
    --bs-stepper-icon-bg-color-current: var(--bs-info);
    --bs-stepper-icon-bg-color-completed: var(--bs-success);
    --bs-stepper-icon-check-color-completed: var(--bs-white);
    --bs-stepper-label-title-color-completed: var(--bs-text-success);
    --bs-stepper-label-title-color-current: var(--bs-text-info);
}
.nav {
    --bs-nav-link-color: var(--bs-info);
    --bs-nav-link-hover-color: var(--bs-info-active);
}


.load-row, .view-row, .edit-row, .delete-row { cursor:pointer; }
.toastr { opacity: 1 !important; }

.form-check-custom > .form-check-input:checked + .form-check-label { color:initial!important; }

#divTableHolder{min-height:25vh;position:relative;}
.crs-table-loader { position: absolute;z-index: 999; top:0;bottom:0;left:0;right:0; display:none !important; }
.crs-table-loader.loading { display: flex !important; }

.table:not(.table-bordered) td:first-child { padding-left: 1.25rem !important; }
.table:not(.table-bordered) td:last-child { padding-right: 1.25rem !important; }

.fv-plugins-message-container { font-weight:bold !important; }

.fv-plugins-bootstrap5-row-invalid input, .fv-plugins-bootstrap5-row-invalid select, .fv-plugins-bootstrap5-row-invalid textarea, .fv-plugins-bootstrap5-row-invalid .select2-selection, .fv-plugins-bootstrap5-row-invalid .input-group-text {
    --bs-border-opacity: 1;
    border-color: var(--bs-form-invalid-border-color) !important;
}
.fv-plugins-bootstrap5-row-invalid label { font-weight: bold !important; color: var(--bs-form-invalid-color) !important; }
.fv-plugins-bootstrap5-row-invalid .input-group .form-control, .fv-plugins-bootstrap5-row-invalid .input-group .form-select {
    border-right-color: rgb(248, 246, 242) !important;
}
.fv-plugins-bootstrap5-row-invalid .input-group .input-group-text, .fv-plugins-bootstrap5-row-invalid .input-group .input-group-text i {
    color: var(--bs-form-invalid-color) !important;
}


.input-group-text {
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}


.ignore-collapse-special .card-body .card:first-child {
    margin-top: 0 !important;
}
.collapse:not(.show) + .card-footer, .collapsing + .card-footer { display: none; }

.card-toolbar[data-bs-toggle="collapse"]:not(.collapsed) { transform: rotateZ(180deg); }

.draggable-visible { display: none !important; }
.draggable .draggable-visible { display: flex !important; }
.draggable-mirror { z-index: 9999 !important; }

.w-5 {width: 5% !important}
.w-10 {width: 10% !important}
.w-15 {width: 15% !important}
.w-20 {width: 20% !important}
.w-25 {width: 25% !important}
.w-30 {width: 30% !important}
.w-35 {width: 35% !important}
.w-40 {width: 40% !important}
.w-45 {width: 45% !important}

[data-crs-special-card="true"].card-edit-mode [data-crs-loadcontent="true"]{pointer-events:none !important;}
[data-crs-special-card="true"].card-edit-mode [data-crs-loadcontent="true"] .rotate-180 { display:none !important; }

[data-bs-theme="dark"] .crs-data-loader .bg-white {
    background: transparent !important;
}
[data-bs-theme="dark"] .crs-data-loader .text-dark {
    color: #fff !important;
}

.blockui .blockui-overlay {
    z-index: 999 !important;
}

.disabled-button-look {pointer-events: none;}
.disabled-button-look:hover, .disabled-button-look:focus, .disabled-button-look:active { background-color: inherit !important; color: inherit !important; box-shadow: none !important; }

.fw-boldest{font-weight: bold !important;}

.hanging-indent {padding-left: 1.25rem;text-indent: -1.25rem;}

.crs-radial-square {width: 50%;max-width: 180px;aspect-ratio: 1 / 1;}
@media (max-width: 767.98px) {.crs-radial-square {width: 96px;max-width: 96px;}}
.crs-review-radial {width: 100%;height: 100%;}


.form-check-label {
    color: var(--bs-gray-700) !important;
}
.form-check-custom > .form-check-input:checked + .form-check-label {
    color: var(--bs-gray-900) !important;
    font-weight:500;
}

.form-control, .form-select,
.form-select:active, .form-control:active,
.form-select:focus, .form-control:focus {
    color: var(--bs-gray-800);    
}

.form-select:active, .form-control:active,
.form-select:focus, .form-control:focus {
    border-color:var(--bs-gray-600);
}

.form-select.form-select-solid, .form-control.form-control-solid {
    background-color: var(--bs-gray-200);
    border-color: var(--bs-gray-200);
}
.form-select.form-select-solid:active, .form-control.form-control-solid:active,
.form-select.form-select-solid:focus, .form-control.form-control-solid:focus {
    background-color: var(--bs-gray-300);
    border-color: var(--bs-gray-300);
    color: var(--bs-gray-900);
    font-weight:600;
}

.select2-container--bootstrap5 .select2-selection--multiple .select2-selection__rendered .select2-selection__choice .select2-selection__choice__display {
    font-weight: initial;
    color: var(--bs-gray-900);
}
.select2-container--bootstrap5 .select2-dropdown .select2-results__option.select2-results__option--selected {
    color: var(--bs-gray-900);
    font-weight:600;
}
.select2-container--bootstrap5 .select2-dropdown .select2-results__option.select2-results__option--highlighted {
    color: var(--bs-gray-900);
    font-weight: 600;
}
.select2-container--bootstrap5 .form-select-solid .select2-search.select2-search--inline .select2-search__field {
    color:var(--bs-gray-900);
}

.select2-container--bootstrap5.select2-container--focus:not(.select2-container--disabled) .form-select-solid, .select2-container--bootstrap5.select2-container--open:not(.select2-container--disabled) .form-select-solid{
    background-color: var(--bs-gray-300);
    border-color: var(--bs-gray-600);
    color: var(--bs-gray-900);
    font-weight:600;
}

.crs-code-container {
    position: relative;
}

.crs-copy-btn {
    position: absolute;
    top: .5rem;
    right: .5rem;
    z-index: 10;
}

.crs-sql-output {
    max-height: 350px;
    overflow: auto;
    white-space: pre;
    max-width: 100%;
    padding: .75rem;
    background-color: var(--bs-gray-100);
    border: 1px solid var(--bs-gray-300);
    border-radius: .25rem;
    font-family: var(--bs-font-monospace);
}

.modal-error-button-container {display:none;}
.modal-body .modal-error-button-container {display:block;}

#kt_app_sidebar .collapse,
#kt_app_sidebar .collapsing {
    transition: none !important;
}


[data-kt-app-layout="light-sidebar"] .app-sidebar-menu .menu-link:hover {background-color: var(--bs-info) !important;}
[data-kt-app-layout="light-sidebar"] .app-sidebar-menu .menu-link:focus-visible {background-color: var(--bs-secondary) !important;}
[data-kt-app-layout="light-sidebar"] .app-sidebar-menu .menu-link:hover * {color: var(--bs-info-inverse) !important;}
[data-kt-app-layout="light-sidebar"] .app-sidebar-menu .menu-link:focus-visible * {color: var(--bs-secondary-inverse) !important;}

.menu-item.menu-accordion > button.menu-link .menu-arrow {transition: transform 0.15s ease;}
.menu-item.menu-accordion > button.menu-link[aria-expanded="true"] .menu-arrow {transform: rotate(180deg);}

.note-toolbar {
    background: #fff !important;
}
:root {
    --crs-env-ribbon-height: 44px;
    --crs-impersonation-banner-height: 44px;
    --crs-env-ribbon-offset: 0px;
    --crs-impersonation-offset: 0px;
}
body.has-env-ribbon {--crs-env-ribbon-offset: var(--crs-env-ribbon-height);}
body.has-impersonation-banner {--crs-impersonation-offset: var(--crs-impersonation-banner-height);}

.crs-env-ribbon {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 110;
    height: var(--crs-env-ribbon-height);
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
    color: #000;
    background-color: var(--bs-warning);
}
.crs-env-ribbon.crs-env-development {background-color: var(--bs-secondary); color: var(--bs-secondary-inverse);}
.crs-env-ribbon.crs-env-staging {background-color: var(--bs-warning); color: #000;}
.crs-env-ribbon.crs-env-preproduction {background-color: var(--bs-danger); color: #fff;}

.crs-impersonation-banner {
    position: fixed;
    top: var(--crs-env-ribbon-offset);
    left: 0;
    right: 0;
    z-index: 110;
    height: var(--crs-impersonation-banner-height);
    margin: 0;
    padding: 0 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    color: #fff;
    background-color: var(--bs-danger);
}

body.has-env-ribbon #kt_app_page,
body.has-impersonation-banner #kt_app_page {padding-top: calc(var(--crs-env-ribbon-offset) + var(--crs-impersonation-offset));}
body.has-env-ribbon.app-blank,
body.has-impersonation-banner.app-blank {padding-top: calc(var(--crs-env-ribbon-offset) + var(--crs-impersonation-offset));}
body.has-env-ribbon .app-header,
body.has-impersonation-banner .app-header {top: calc(var(--crs-env-ribbon-offset) + var(--crs-impersonation-offset));}
body.has-env-ribbon .app-sidebar,
body.has-impersonation-banner .app-sidebar {top: calc(var(--crs-env-ribbon-offset) + var(--crs-impersonation-offset)) !important;}
body.has-env-ribbon [data-kt-sticky="true"][style*="position: fixed"],
body.has-impersonation-banner [data-kt-sticky="true"][style*="position: fixed"] {top: calc(var(--crs-env-ribbon-offset) + var(--crs-impersonation-offset) + 10px) !important;}

@keyframes crs-bell-jangle {
    0%, 100% {transform: rotate(0);}
    10% {transform: rotate(18deg);}
    22% {transform: rotate(-15deg);}
    36% {transform: rotate(11deg);}
    52% {transform: rotate(-8deg);}
    68% {transform: rotate(5deg);}
    84% {transform: rotate(-2deg);}
}
#kt_notifications_toggle .ki-notification-bing {transform-origin: 50% 12%;}
#kt_notifications_toggle:hover .ki-notification-bing {animation: crs-bell-jangle 0.7s ease-in-out;}

@media (prefers-reduced-motion: reduce) {
    #kt_notifications_toggle:hover .ki-notification-bing {animation: none;}
}
