@charset "UTF-8";

:root {
    /* GENERAL PARAMETERS */

    --main-font-size: 14px;
    /* Global font size */

    --transition-time: 0.5s;
    /* Global transition time */

    --white: #ffffff;
    --white-dark: var(--white);
    /* Palette */
    --color-main-theme1: var(--main-light-color);
    --color-main-theme2: var(--primary-color);
    --color-main-theme3: var(--main-dark-color);
    --color-main-theme4: #8bc34a;
    --color-main-theme5: #aab8bf;

    --color-main-txt: #666666;
    --color-main-label: #888888;
    --color-main-txt-negative: #ffffff;
    --color-main-background: #ffffff;

    --folder-label-color: var(--primary-color);

    --radius-main: 6px;
    /* Default radius of GUI corners */

    --padding-val1: 0.2145em;
    /* Default padding values (not used yet) */
    --padding-val2: 0.429em;
    --padding-val3: 0.857em;
    --padding-val4: 0.571em;

    --cb-rb-size: 22px;
    /* Default size of checkboxes and radiobuttons */

    --fixed-rows-height: 85px !important;
    /* Default height of table fixed rows */

    --dirty-table-row-color: var(--color-main-theme4);
    --default-ico-color: var(--color-main-theme5);

    --table-link-color: var(--primary-color);
    --table-link-color-hover: var(--primary-hover-color);
    /* HEADER */
    --header-txt-color: var(--color-main-txt-negative);
    --header-background1: var(--color-main-theme1);
    --header-background2: #666;
    --header-logo-width: 185px;
    --header-logo-height: 75px;
    --header-hide-transition: var(--transition-time);

    /* FOOTER */
    --footer-txt-color: #aaa;

    /* MENUBAR */
    --menubar-background: var(--surface-a);
    --menubar-txt-color: #8181a5;
    --menubar-brd-color: #cdcdcd;

    /* BUTTONS */
    --btn-click-effect-color: #ccc;
    --btn-border: none;
    --btn-table-bkg: #ededed;

    /* PROGRESS */
    --progress-size: 100px;
    --progress-color1: var(--color-main-theme4);
    /* Color for the every 25% value */
    --progress-color2: var(--color-main-theme4);
    --progress-color3: var(--color-main-theme4);
    --progress-color4: var(--color-main-theme4);

    --first-diagram-color: #4ea316;
    --second-diagram-color: #d9ab3e;
    --third-diagram-color: #0095ff;
    --progress-size: 100px;
    --progress-color1: var(--primary-color);
    --progress-color2: var(--primary-color);
    --progress-color3: var(--primary-color);
    --progress-color4: var(--primary-color);
    /* TILE */
    --tile-color1: #E5F9FC;
    --tile-color2: #F4F8FD;
    --tile-color3: #F2F2FF;
    --tile-color4: #FFF5F6;
    --tile-icon-color1: #62C4D5;
    --tile-icon-color2: #C3CBDF;
    --tile-icon-color3: #ADADD2;
    --tile-icon-color4: #FABEAD;
    --title-rigth-menu: #E0E7FA;
    --content-info-color: rgb(253, 241, 230);
    --background-notify: rgba(242, 248, 255, 0.7);

    --additional-info-bkg: rgba(228, 238, 249, 0.7);

    /* LINKS */
    --show-more-color: #4D95FF;
    --show-more-hover-color: rgb(13, 110, 253);

    --main-form: #E0E7FA;
    --bg-setting: var(--main-form);
}

/*********************************/
/*   C U S T O M   S T Y L E S   */
/*********************************/

.my-btn {
    border: 1px solid var(--primary-color);
    background-color: var(--surface-a);
    color: var(--text-color);
}

.my-btn:hover {
    background-color: var(--primary-color);
    color: var(--text-color);
}

.my-action-btn {
    margin: 0 0.5rem 0 0;
    position: relative;
    /* top: 5px; */
}

.my-action-btn .p-button-icon {
    font-size: 24px;
    line-height: 24px;
    font-weight: 500;
}

.my-btn-small {
    border: 1px solid var(--primary-color);
    background-color: var(--surface-a);
    color: var(--text-color);
    padding: 0 10px 0 10px;
}

.my-btn-small:hover {
    background-color: var(--primary-color);
    color: var(--text-color);
}

.my-btn-login {
    padding: 15px;
    font-size: 18px;
}

.my-btn-login:disabled {
    color: #666;
}

.my-input-login {
    padding: 15px 7px 15px 7px;
}

.my-input-addon {
    background-color: var(--shadow-grey-5);
}

/* .my-input-addon > input {
  border-top-right-radius: var(--main-border-radius);
  border-bottom-right-radius: var(--main-border-radius);
} */

/* CODE LISTING */

.my-code {
    background: #f4f4f4;
    border: 1px solid #ddd;
    border-left: 5px solid #f36d33;
    color: #666;
    page-break-inside: avoid;
    font-family: monospace;
    font-size: 12px;
    line-height: 1.6;
    margin-bottom: 1.6em;
    max-width: 100%;
    overflow: auto;
    padding: 1em 1.5em;
    display: block;
    word-wrap: break-word;
}

/*  */

.my-left-rounded-border {
    border-top-left-radius: var(--main-border-radius) !important;
    border-bottom-left-radius: var(--main-border-radius) !important;
}

.my-right-rounded-border {
    border-top-right-radius: var(--main-border-radius) !important;
    border-bottom-right-radius: var(--main-border-radius) !important;
}

.my-float-label label {
    position: absolute;
    pointer-events: none;
    top: 50%;
    left: 3.5rem;
    margin-top: -.5rem;
    transition-property: all;
    transition-timing-function: ease;
    line-height: 1;
}

.my-float-label input:focus ~ label,
.my-float-label input.p-filled ~ label,
.my-float-label textarea:focus ~ label,
.my-float-label textarea.p-filled ~ label,
.my-float-label .p-inputwrapper-focus ~ label,
.my-float-label .p-inputwrapper-filled ~ label {
    top: -.75rem;
    font-size: 12px;
}

.my-float-label .input:-webkit-autofill ~ label {
    top: -20px;
    font-size: 12px;
}

/* BOX SHADOWS */
.my-color-shadow {
    box-shadow: 0 10px 60px 0 var(--box-shadow-color) !important;
}

.my-grey-shadow {
    box-shadow: var(--box-shadow-color) 0px 7px 29px 0px !important;
}

.p-menubar .p-menubar-root-list > .p-menuitem > .p-menuitem-link .p-menuitem-text {
    color: var(--menubar-txt-color);
}

.p-inputswitch .p-inputswitch-slider:before {
    width: 1rem;
    height: 1rem;
    margin-top: -0.5rem;
    left: 2px
}

.p-inputswitch {

    width: 3rem;
    height: 1.35rem;
}

.p-inputswitch.p-inputswitch-checked .p-inputswitch-slider:before {

    transform: translateX(1.6rem);
}

.p-inputswitch .p-inputswitch-slider {

    border-radius: 0.8rem
}

.p-inputswitch .p-inputswitch-slider:before {
    box-shadow: none;
    background: #d1d7da
}

.p-inputswitch .p-inputswitch-slider {
    border: 1px solid var(--shadow-grey-6)
}

.p-button.p-button-text-outline {
    background: var(--primary-outlined-hover-color)
}

.menu-breadcrumb > .p-breadcrumb {
    border: unset;
}

.p-checkbox .p-checkbox-box {
    border: 2px solid #d1d7da;
}

.setting-page {
    .title-menu {
        font-size: 1.35rem;
        color: #000000;
        font-weight: 700;
    }

    .p-menu {
        background: unset;
        font-size: 1.25rem;
        color: #434343;

        .p-menuitem {
            border-bottom: 1px solid var(--shadow-grey-6);
        }

        .p-menuitem-link:not(.p-disabled):hover {
            background: unset;
        }

        .p-menuitem-link:not(.p-disabled):hover .p-menuitem-text {
            font-weight: 700;
            color: unset;
        }

        .active {
            font-weight: 700;
            background-color: #3AB0BB;

            .p-menuitem, .p-menuitem-link, .p-menuitem-text {
                color: var(--white);
            }
        }
    }
}

.notification-list {
    .btn-add-notification {
        width: unset;
        padding: .75rem 1.25rem !important;
        font-size: 1.15rem;
        font-weight: normal;

        .pi {
            margin-right: 5px;
        }
    }

    .p-tag.p-tag-success, .p-tag.p-tag-danger {
        text-transform: uppercase;
    }

    .active {
        background-color: #fff5f2;
    }

    .p-datatable > .p-datatable-wrapper {
        overflow: unset;
    }
}