﻿@import url('open-iconic/font/css/open-iconic-bootstrap.min.css');

:root {
    --rz-primary: #00264d;
    --rz-oli-blue: #00537f;
    --rz-oli-red: #d1131b;
    --rz-base-300: #dfe7eb;
    --rz-selectbar-selected-background-color: #00264d;
    --rz-body-font-size: 14px;
    --rz-grid-header-cell-padding: 0;
    --rz-grid-header-font-weight: normal;
    --rz-grid-header-background-color: #e6ecef;
    --rz-grid-cell-font-size: 0.875rem;
    --rz-grid-cell-line-height: unset;
    --rz-grid-stripe-background-color: #f3f6f9;
    --rz-grid-foot-background-color: #e6ecef;
    --rz-grid-right-cell-border: #dfe7eb;
    --rz-menu-top-item-padding: 0.8125rem 0.625rem;
    --rz-button-vertical-align: middle;
    --rz-tabs-tab-font-weight: 600;
    --rz-tabs-tab-padding: 0.375rem 1.875rem;
    --rz-textarea-scrollbar-background-color: #f3f6f9;
    --rz-textarea-scrollbar-thumb-color: #e6ecef; 
    --rz-input-border: 1px solid var(--rz-primary);
}


html, body {
    /*font-family: 'Arial Narrow', Arial, Helvetica, sans-serif;*/
    font: 14px Calibri,arial,sans-serif;
/*    font-family: Calibri;
    font-size: 14px;
*/}

body {
    overflow-x: hidden;
}

*:focus {
    outline: 1px solid #def;
}

a, .btn-link {
    color: #0366d6;
}

a.btn-link, label.btn-link {
    background-color: #00264d; /*#003B5C;*/
    color: #ffffff;
    border: none;
    border-radius: 4px;
    padding: 1px 1.5rem 3px;
    font-weight: bold;
}

 label.btn-link {
     cursor: pointer;
 }

a.btn-link:hover, label.btn-link:hover {
    color: #fff;
}

a.legacy-link {
    font-weight: bold;
    text-decoration: underline;
}

body, h1, h2, h3, h4, h5, h6, a, input, label, textarea, span, div, table
/*.rz-datatable-data td .rz-cell-data, .rz-grid-table td .rz-cell-data */
{
    /*font-family: 'Arial Narrow', sans-serif;*/
    color: #00264d; /*#003a5d;*/
/*    font-size: 16px;
    color: #2b2c31;
*/
}

textarea {
    resize: none;
}

textarea::-webkit-scrollbar-thumb:vertical {
    background-color: var(--rz-textarea-scrollbar-thumb-color);
}
textarea::-webkit-scrollbar {
    width: 10px;
    background-color: var(--rz-textarea-scrollbar-background-color);
}

.rz-dropdown-item.rz-state-highlight, .rz-state-highlight.rz-menuitem, .rz-state-highlight.rz-autocomplete-list-item, .rz-state-highlight.rz-multiselect-item, .rz-dropdown-items li.rz-state-highlight, .rz-autocomplete-items li.rz-state-highlight, .rz-multiselect-items li.rz-state-highlight {
    background-color: #479cc8; /*#479cc8;*/
    color: #ffffff;
}

/* estes elementos estão highlighted com um background azul, precisam de ter a font a branco  */
.rz-dropdown-item.rz-state-highlight span, .rz-state-highlight.rz-menuitem span, .rz-state-highlight.rz-autocomplete-list-item span, .rz-state-highlight.rz-multiselect-item span, .rz-dropdown-items li.rz-state-highlight span, .rz-autocomplete-items li.rz-state-highlight span, .rz-multiselect-items li.rz-state-highlight span {
    color: #fff;
}

.site_logo {
    float: left;
    margin-right: 3rem;
}

.page {
    position: relative;
    display: flex;
    flex-direction: column;
}

.main {
    flex: 1;
}

.sidebar {
    background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
}

.logout {
    float: right;
}

.top-row {
    background-color: #fff;
    /*border-bottom: 1px solid #d6d5d5;*/
    border-bottom: 5px solid #fff;
    justify-content: space-between;
    /*height: 3.5rem;*/
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    font-size: 18px;
}

    .top-row ::deep a, .top-row .btn-link {
        white-space: nowrap;
        /*margin-left: 1.5rem;*/
    }

    .top-row a:first-child {
        overflow: hidden;
        text-overflow: ellipsis;
    }

@media (max-width: 640.98px) {
/*    .top-row:not(.auth) {
        display: none;
    }
*/
/*    .top-row.auth {
        justify-content: space-between;
    }

    .top-row a, .top-row .btn-link {
        margin-left: 0;
    }
*/
    .page {
        flex-direction: row;
    }

    .main_menu .site_logo img {
        width: 80%;
    }

    .main_menu .rz-menu {
        margin-bottom: 5px;
    }

    .main_menu .rz-menu .rzi {
        color: #00264d;
    }

    .main_menu .rz-menu-open li.rz-menu-toggle-item {
        padding: 0;
    }

    .main_menu .rz-menu-open li.rz-menu-toggle-item button.rz-menu-toggle {
        vertical-align: bottom;
        outline: none;
        background-color: #00264d;
    }

    .main_menu .rz-menu-open li.rz-menu-toggle-item button.rz-menu-toggle i {
        color: red;
    }


    

    .main_menu .rz-menu-open li.rz-navigation-item {
        background-color: #00264d !important;
    }

    .main_menu .rz-menu-open li.rz-navigation-item span {
        color: #ffffff !important;
    }

    .top-row {
        position: sticky;
        top: 0;
        z-index: 1;
        min-height: 55px;
    }

    .main > div {
        padding-left: 1.5rem !important;
        padding-right: 1.5rem !important;
    }
}

@media (min-width: 641px) {
    .page {
        flex-direction: row;
    }

    .sidebar {
        width: 250px;
        height: 100vh;
        position: sticky;
        top: 0;
    }

    .top-row {
        position: sticky;
        top: 0;
        z-index: 1;
        min-height: 55px;
    }

    .main > div {
        padding-left: 1.5rem !important;
        padding-right: 1.5rem !important;
    }
}


/*  MENU  */
/*
.rz-menu span {
    font-family: "Arial";
}
*/
.rz-menu:not(.rz-profile-menu) .rz-navigation-item-wrapper:hover .rz-navigation-item-link {
    color: #fff;
    background-color: #d1131b; /*#CE112D;*/
}

.rz-menu:not(.rz-profile-menu) .rz-navigation-item-wrapper:hover .rz-navigation-item-link .rz-navigation-item-text {
    color: #fff;
}

.rz-menu:not(.rz-profile-menu) > .rz-navigation-item > .rz-navigation-item-wrapper-active:before {
    background-color: transparent;
}

.rz-menu:not(.rz-profile-menu) .rz-navigation-menu .rz-navigation-item-wrapper:hover {
  background-color: #fff;
}

/* sub menus */
.rz-menu:not(.rz-profile-menu) .rz-navigation-menu .rz-navigation-item-link {
    font-size: 16px;
}

.rz-menu .NoSubMenu a .rzi {
    /*visibility: hidden;*/
    display: none;
} 

.rz-navigation-item-text {
    line-height: 27px;
}

/*.rz-menu .rz-navigation-item-text {
    font-weight: bold;
} 
*/
.rz-menu .DevMenu a span {
    font-style: italic;
    font-weight: lighter;
    opacity: 0.5;
} 

#menu_account_button {
    padding: 0;
    border-radius: 25px;
    padding-top: 1px;
}

#menu_account_button .rzi {
    font-size: 32px;
}

/* HD: adicionei especificamente para side dialog right, para o account menu aparecer desde o topo */
.rz-dialog-side-position-right {
    top: 0;
}



h1 {
    display: block;
    position: relative;
    margin: 0;
    background-color: #00264d; /*#003B5C;*/
    color: #ffffff;
    text-align: left;
/*    font-family: 'Arial Narrow', sans-serif;*/
    font-size: 18px;
    font-weight: normal;
    line-height: 30px;
    text-decoration: none;
    padding-left: 10px;
    padding-right: 10px;
    border-radius: 4px;
    margin-bottom: 10px;
}

h1.PageHeader {
    display: flex; 
    justify-content: space-between;
    align-items: center;
}

h1.PageHeader div.PageHeaderTitle {
    color: #ffffff;
    min-width: 500px;
}

h1.PageHeader div.PageHeaderTitle span.locked, h1.PageHeader div.PageHeaderTitle span.locked span.material-icons {
    color: silver;
    font-weight: bold;
}
h1.PageHeader div.PageHeaderTitle span.locked span.material-icons {
    vertical-align: text-bottom;
    margin-left: 15px;
    font-weight: normal;
}

h1.PageHeader div.PageHeaderStatus {
    color: #ffffff;
    text-align: center;
}

h1.PageHeader div.PageHeaderStatus span.locked, h1.PageHeader div.PageHeaderStatus span.locked span.material-icons {
    color: silver;
    font-weight: bold;
}
h1.PageHeader div.PageHeaderStatus span.locked span.material-icons {
    vertical-align: text-bottom;
    font-weight: normal;
}

h1.PageHeader div.PageHeaderStatus .sync_error:after {
    display: inline-block;
    margin-left: 5px;
    padding: 0 5px;
    font-weight: bold;
    color: #fff;
    border-radius: 4px;
}

h1.PageHeader div.PageHeaderStatus .sync_error:after  {
    content:"⚠";
    font-weight: normal;
    font-size: 20px;
    background-color: transparent;
    color: red;
}



h1.PageHeader div.PageHeaderLinks {
    min-width: 500px;
    text-align: right;
}

h1.PageHeader div.PageHeaderLinks, h1.PageHeader div.PageHeaderLinks a, 
h1.PageHeader div.PageHeaderLinks span.material-icons {
    color: #ffffff;
    vertical-align: middle;
}

h1.PageHeader div.PageHeaderLinks span.material-icons {
    vertical-align: text-bottom;
}

h1.PageHeader span.separator {
    color: #ffffff;
    margin: 0 10px;
}

h1.PageHeader span.separator:last-of-type {
    color: transparent;
    margin: 0px 0px;
}


div.page_footer span.locked {
    display: block;
    text-align: center;
    border: 1px solid;
    border-radius: 4px;
    padding: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
}

div.page_footer span.locked.active {
    border: 2px solid;
    background-color: #dfe7eb;
}

div.page_footer span.locked, div.page_footer  span.locked span.material-icons {
    /*color: #dfe7eb;*/
    font-weight: bold;
}
div.page_footer span.locked span.material-icons {
    vertical-align: text-bottom;
    font-weight: normal;
}



h2 {
    display: block;
    position: relative;
    margin: 0;
    background-color: #4d6782; /*lightsteelblue;*/
    color: #ffffff; /*#00264d;*/ /*#003B5C;*/
    text-align: left;
    /* font-family: 'ArialNarrow', sans-serif; */
    font-size: 15px;
    line-height: 25px;
    text-decoration: none;
    border-radius: 5px 5px 0 0;
    margin-top: 5px;
    text-indent: 10px;
}

/* adiciona espacamento vertical entre textboxes/rows */
.rz-fieldset-content .row {
    margin-bottom: 5px;
}

.btn-primary, .rz-primary {
    color: #fff;
    background-color: #1b6ec2;
    border-color: #1861ac;
}

.content {
    padding-top: 0.5rem;
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid #d1131b; /*red;*/
}

.validation-message {
    color: #d1131b; /*red;*/
}

#blazor-error-ui {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }

.rz-dialog-title .error-header {
    color: red;
    font-size: 20px;
}

.rz-dialog-title .error-header::before {
    content: '✗ ';
    color: #fff;
    background-color: red;
    border-radius: 25px;
    padding: 2px 2px 2px 6px;
    margin-right: 10px;
    font-size: 20px;
}

.rz-dialog-title .success-header {
    color: green;
    font-size: 20px;
}

.rz-dialog-title .success-header::before {
    content: '✔ ';
    color: #fff;
    background-color: green;
    border-radius: 25px;
    padding: 3px 3px 2px 6px;
    margin-right: 10px;
    font-size: 20px;
}

.rz-message-popup {
    top: 32px;
    border: 1px solid black;
    background-color: #fff;
    /* height: 32px; */
    z-index: 10;
    color: #000;
    font-size: 15px;
    font-weight: normal;
    padding: 15px;
    box-shadow: 5px 5px 0px 0 rgba(0, 0, 0, .1);
}

.rz-message-popup::before {

}

div.dialog_message {
    font-size: medium;
}

.overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5); /* Cor de fundo semitransparente */
    z-index: 9999; /* Z-index alto para garantir que fique sobre todos os outros elementos */
    display: flex;
    justify-content: center;
    align-items: center;
}

/* ************ GRIDS RADZEN ************** */

.grid-filter-bar {
    width: 100%;
    background-color: #e6ecef;
    border: solid 1px #dfe7eb;
    padding: 0.2rem 1rem;
    display: flex;
    justify-content: space-between;
}

.grid-filter-bar div {
    display: flex;
    align-items: center;
}

.grid-filter-bar div.grid-filter-area div {
    display: inline-block;
    vertical-align: middle;
}

.grid-filter-bar div.grid-filter-area div + div {
    display: inline-block;
}

.grid-filter-bar .rz-button {
    padding: 0 0.5rem;
    line-height: unset;
    min-height: unset;
    height: 2.1875rem;
}

.grid-filter-bar .rz-button.btn-info, .grid-filter-bar .rz-button.rz-info, .btn-info.rz-paginator-element , .rz-info.rz-paginator-element {
/*    background-color: #fff;
    color: #6d787d;
*/}

.grid-filter-bar .rz-button.btn-info, .grid-filter-bar .rz-button.rz-info {
    margin-right: 5px;
    width: 36px;
}

.grid-filter-bar .rz-button.btn-export, .grid-filter-bar .rz-button.rz, .grid-filter-bar .rz-button.btn-export .rzi, .grid-filter-bar .rz-button.rz-export .rzi {
    background-color: darkgreen;
    color: #fff;
}

.grid-filter-bar .rz-button.btn-toggle-filters, .grid-filter-bar .rz-button.rz-toggle-filters {
    background-color: cadetblue;
    color: #fff;
}

.grid-filter-bar .rz-button.btn-toggle-filters .rzi, .grid-filter-bar .rz-button.rz-toggle-filters .rzi {
    color: #fff;
    font-size: 22px;
    width: 100%;
}

.grid-filter-bar .rz-button.btn-list, .grid-filter-bar .rz-button.rz-list {
    min-width: 5rem;
    margin: 0 auto;
    height: 100%;
    padding: 0 0.5rem;
}

.grid-filter-bar .rz-button.btn-list .rzi, .grid-filter-bar .rz-button.rz-list .rzi {
    color: #fff;
    font-size: 22px;
    width: 100%;
}

.grid-filter-bar .grid-filter-area {
    margin: 0 2rem;
}

.grid-filter-bar .grid-filter-area label:not(.rz-dropdown-label)
{
    display: block;
    width: 100%;
    text-align: center;
    background-color: #00264d; /*#003a5d;*/
    color: #fff;
    border: 1px solid #ddd;
    margin-bottom: 0;
}
.grid-filter-bar .grid-filter-area div.rz-helper-hidden-accessible {
    display: block;
}

.grid-filter-bar .grid-filter-area div input {
    border: 1px solid #dadfe2;
    min-width: 150px;
    height: var(--rz-input-height);
    line-height: var(--rz-input-line-height);
    padding: var(--rz-input-padding);
    border-radius: var(--rz-input-border-radius);
    outline: none;
}

.rz-data-grid {
    z-index: 0;
}

.rz-data-grid-data {
    overflow: auto;
    position: relative;
    max-height: 75vh;
}

.rz-grid-table th {
    padding: 0.5rem 0.1rem 0.5rem 0.2rem;
}

/* esconde icones de sorting */
.rz-sortable-column .rzi-grid-sort {
    display: none;
}

/* mostra icon de sort apenas quando ordenado */
.rz-sortable-column .rzi-grid-sort.rzi-sort-asc, .rz-sortable-column .rzi-grid-sort.rzi-sort-desc {
    display: inline-block;
}

/* ajusta altura dos filtros */
.rz-grid-table thead th .rz-cell-filter {
    padding: 0rem 0.6rem 0rem;
}

/* ajusta altura dos filtros */
.rz-grid-table thead th .rz-cell-filter .rz-cell-filter-label {
    margin-bottom: 0;
}

/* esconder spinners dos inputs dos filtros */
.rz-grid-table thead th .rz-cell-filter .rz-spinner .rz-spinner-button {
    display: none;
}

.rz-datatable-data td .rz-cell-data, .rz-grid-table td .rz-cell-data {
    max-height: 30px;
}
/* no caso de grids dentro de combos, permito expandir a altura das row pq o popup tem largura limitada e posso querer apresentar texto em altura, como alternativa */
.rz-lookup-panel .rz-grid-table td .rz-cell-data {
    max-height: fit-content;
}

.rz-grid-table tbody tr {
    height: 34px;
}

.rz-grid-table thead tr:nth-of-type(2) th {
    top: 0;
}

.rz-grid-table thead tr, .rz-grid-table tfoot tr {
    height: 25px;
}

/*.rz-datatable-thead th .rz-column-title, .rz-grid-table thead th .rz-column-title {
    padding: 0.2rem 0.5rem 0.2rem 0;
}

.rz-datatable-tfoot td .rz-column-footer, .rz-grid-table tfoot td .rz-column-footer {
    padding: 0.2rem 0.5rem 0.5rem 0;
}*/
/* bottom: 0 estava a permitir ver 1px das linhas por baixo do footer */
.rz-grid-table tfoot,.rz-grid-table tfoot td {
    bottom: -1px;
}

.rz-grid-table thead th {
    padding: 0.1rem 0px;
}

.rz-datatable {
    border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px;
}

.rz-datatable-thead th .rz-column-title, .rz-grid-table thead th .rz-column-title {
    padding-left: 5px;
    padding: 0.1rem 5px;
}

.rz-datatable-thead th.rz-text-align-center.rz-sortable-column .rz-column-title, .rz-grid-table thead th.rz-text-align-center.5px .rz-column-title {
    padding-left: unset;
}

.rz-grid-table td, .rz-grid-table thead td, .rz-grid-table tfoot td
{
    padding: 0.1rem 5px;
}

.rz-grid-table td, .rz-grid-table th, .rz-grid-table col {
    min-width: 50px;
}

/*.rz-grid-table tfoot td {
    font-weight: 600;
}
*/

.rz-grid-table .sync_error:after, .rz-grid-table .sync_insert:after, .rz-grid-table .sync_edit:after, .rz-grid-table .sync_cancel:after, .sync_open:after, .sync_closed:after {
    display: inline-block;
    margin-left: 5px;
    padding: 0 5px;
    font-weight: bold;
    color: #fff;
    border-radius: 4px;
}

.rz-grid-table .sync_error:after  {
    content:"⚠";
    font-weight: normal;
    font-size: 20px;
    background-color: transparent;
    color: red;
}

.rz-grid-table .sync_insert:after {
    content:"INS";
    background-color: orange;
  }

.rz-grid-table .sync_edit:after {
    content:"EDIT";
    background-color: orange;
  }

.rz-grid-table .sync_cancel:after {
    content:"DEL";
    background-color: red;
  }
.rz-grid-table .sync_closed:after {
    content: "CLOSED";
    background-color: red;
}
.rz-grid-table .sync_open:after {
    content: "OPEN";
    background-color: orange;
}


/* permite que texto das celulas herde color definida no respectivo TD  */
.rz-datatable-data td .rz-cell-data, .rz-grid-table td .rz-cell-data {
    color: inherit;
    line-height: 1rem;
}

.rz-datatable-data td .rz-cell-data a, .rz-grid-table td .rz-cell-data a {
    font-weight: bold;
    text-decoration: underline;
}

.rz-datatable-data td .rz-cell-data a.icon, .rz-grid-table td .rz-cell-data a.icon {
    text-decoration: none !important;
    border:0px !important;
    outline:none;
    border-width: 0px;
    outline-width:0px;
    border-bottom: none;
    font-size: 18px;
    display: block;
    text-align: center;
/*    
    color: white;
    background-color: #003a5d;
    border-radius: 5px;
*/    
    margin: 0 5px 0 5px;
    font-weight: bold;
    text-shadow: 0px 0px 0px; /* funciona como extra-bold */
}

/* selected row */
.rz-selectable .rz-datatable-even.rz-state-highlight > td, .rz-selectable .rz-datatable-odd.rz-state-highlight > td {
    background-color: rgba(204, 230, 255, 0.5);
}
.rz-selectable .rz-datatable-even.rz-state-highlight .rz-cell-data, .rz-selectable .rz-datatable-odd.rz-state-highlight .rz-cell-data {
    color: #00537f;
}

/* hover row */
.rz-selectable .rz-datatable-even:hover:not(.rz-state-highlight) > td:not(.rz-frozen-cell), .rz-selectable .rz-datatable-odd:hover:not(.rz-state-highlight) > td:not(.rz-frozen-cell) {
    background-color: rgba(204, 230, 255, 0.5);
}
.rz-selectable .rz-datatable-even:hover:not(.rz-state-highlight) .rz-cell-data, .rz-selectable .rz-datatable-odd:hover:not(.rz-state-highlight) .rz-cell-data {
    /*color: #00537f;*/ /* comentei, se célula tivesse background color poderia dar asneira */
    color: inherit;
    opacity: .7;
    font-weight: bold;
}


/* ERROR GRID */

div#errorGrid .rz-data-grid-data {
    max-height: none !important;
}

div#errorGrid .rz-datatable-data td .rz-cell-data, div#errorGrid .rz-grid-table td .rz-cell-data {
    max-height: fit-content !important;
    display: flex;
    align-items: center;
}



.rz-button.rz-primary {
    padding: 0 2rem;
}

.rz-button.btn-primary, .rz-button.rz-primary, .btn-primary.rz-paginator-element, .rz-primary.rz-paginator-element {
    background-color: #00264d; /*#003B5C;*/
    color: #ffffff;
}

.rz-button.btn-primary span, .rz-button.rz-primary span, .btn-primary.rz-paginator-element span , .rz-primary.rz-paginator-element span {
    color: #ffffff;
}

.rz-button.btn-secondary, .rz-button.rz-secondary, .btn-secondary.rz-paginator-element, .rz-secondary.rz-paginator-element {
    background-color: #ddd;
    color: #ffffff;
}

.rz-button.btn-danger {
    background-color: #d1131b; /*#f00;*/
}

.rz-paginator-page.rz-state-active {
    color: #00264d;
}

.rz-paginator-first, .rz-paginator-prev, .rz-paginator-last, .rz-paginator-next {
    background-color: #e6ecef;
}

.rz-date-filter-buttons .rz-apply-filter {
    background-color: #00264d; /*#003B5C;*/
    color: #ffffff;
}

.rz-date-filter-buttons .rz-clear-filter {
    color: #00264d; /*#003B5C;*/
    background-color: #e6ecef;
}

.rz-selectbutton .rz-button.rz-state-active, .rz-selectbutton .rz-state-active.rz-paginator-element {
    background-color: #00264d; /*#003B5C;*/
    color: #ffffff;
}

.rz-selectbutton .rz-button.rz-state-active  .rz-button-text, .rz-selectbutton .rz-state-active.rz-paginator-element .rz-button-text {
    color: #ffffff;
}

.rz-selectbutton.lang .rz-button {
    padding: 0 1rem; 
    font-weight: normal;
    display: flex;
    align-items: center;
    height: 2.1875rem;
    min-height: unset;
}

.rz-datepicker-title .rz-dropdown {
    line-height: 1rem;
}

.rz-datepicker-title .rz-dropdown .rz-dropdown-label {
    margin-top: 0.2rem;
    margin-bottom: 0.2rem;
}

.rz-datepicker-calendar th {
    font-weight: normal;
    font-size: 0.7rem;
    text-transform: none;
    color: #212529;
    /* padding: 0.5rem 0.875rem; */
    text-align: center;
}

.rz-card {
    margin: 4px 5px 11px 0px;
}

/* GRIDS - controls editaveis */

.rz-datatable-data td .rz-cell-data input[type=text], .rz-grid-table td .rz-cell-data input[type=text] {
    width: 100%;
    box-sizing: inherit;
    border: none;
    background: transparent;
}

/*  FORM / EDITOR  */

.form_data label {
    margin-bottom: 0;
    color: #666666;
}

.form_data label.required {
    font-weight: bold;
}

.form_data label.required:after {
    content:" *";
    /*color: red;*/
  }

.form_data input.required, .form_data textarea.required, .form_data select.required, .form_data div.rz-dropdown.required {
    background-color: #FFA50011; /*#ddeeff66;*/
}


.form_data label + div {
    font-weight: bold;
    min-height: 1rem;
    margin-bottom: 0.5rem;
}

.form_data label + div div {
    margin-bottom: unset;
}

.rz-form .row .rz-label {
    line-height: unset;
}

.form_data div.edit:not(div.rz-dropdown) {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
}

.form_data div.edit label.unit {
    margin-left: 5px;
    font-weight: 100;
    font-style: italic;
    width: 16px;
    text-align: center;
}

.form_data .form_field {
    min-height: 1rem;
    text-align: left;
}

.form_data .form_field.view {
    border: unset;
    outline: unset;
    font-weight: bold;
}

.form_data input.form_field.edit, .form_data textarea.form_field.edit, .form_data div.rz-dropdown.edit {
    font-weight: bold;
    padding: 0 2px;
    border-width: 1px;
    border-radius: 3px;
    box-shadow: unset;
    height: auto;
    border: var(--rz-input-border) !important;
}

.form_data div.rz-dropdown {
    padding: 0 0 0 5px;
}

.form_data div.rz-dropdown:hover {
    border: var(--rz-input-border) !important;
}

.form_data div.rz-dropdown.valid {
    outline: unset;
}

.form_data input.form_field.edit:focus, .form_data textarea.form_field.edit:focus, .form_data div.rz-dropdown:focus, div.rz-dropdown-panel.rz-popup {
    outline: 1px solid var(--rz-primary);
}
    
/* avoid clipping long dropdown lists in form selects */
.rz-lookup-panel.rz-popup {
    max-height: 70vh !important;
    overflow-y: auto !important;
}


.form_data .form_field a {
    font-weight: bold;
    text-decoration: underline;
}

.form_data .form_field a.icon {
    text-decoration: none !important;
    border:0px !important;
    outline:none;
    border-width: 0px;
    outline-width:0px;
    border-bottom: none;
    font-size: 18px;
    display: block;
    text-align: center;
    margin: 0 5px 0 5px;
    font-weight: bold;
    text-shadow: 0px 0px 0px; /* funciona como extra-bold */
}


.form_button_area .rz-button:not(.rz-state-disabled):focus:not(:active) {
    outline: 2px solid white;
}

.form_button_area .return-button {
    height: 100%;
    margin-left: 10px;
    font-size: var(--rz-body-font-size);
    font-weight: 600;
    padding: 0.5rem 1rem;
    background-color: #abbbcf;
    border-radius: 4px;
    opacity: .7;
/*    display: flex;
    align-items: center;
*/
}

.form_button_area .return-button:hover {
    opacity: 1;
}

.form_button_area .return-button:before { 
    content: "⮜";
    background-color: #fff;
    padding: 0px 3px;
    border-radius: 25px;
    margin-right: 5px;
    color: #000;
    font-weight: 200;
}

/* file drop area */

.file-drop-area {
    border: 2px dashed #ccc;
    border-radius: 10px;
    width: 90%;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    cursor: pointer;
    transition: border-color 0.3s ease, background-color 0.3s ease;
}

.file-drop-area[disabled="disabled"] {
    border: 1px dashed #ccc;
    cursor: no-drop;
    opacity: .5;
}

.file-drop-area:not([disabled="disabled"]):hover {
    border-color: #0066cc;
    background-color: #f0f8ff;
}

.file-drop-area:not([disabled="disabled"]).dragging {
    border-color: #0044cc;
    background-color: #e6f0ff;
}

.file-drop-area input[type="file"] {
    opacity: 0;
    position: absolute;
    width: 100%;
    height: 100%;
    cursor: pointer;
}

.file-drop-area[disabled="disabled"] input[type="file"] {
    cursor: no-drop;
}

.file-drop-area[disabled="disabled"] div.placeholder-text {
    opacity: .2;
}

.rz2-event-content {
    background: var(--rz-scheduler-event-background-color);
    border-radius: var(--rz-scheduler-border-radius);
    color: black;
    height: 100%;
    padding: var(--rz-scheduler-event-content-padding);
    font-size: 15px;
    line-height: var(--rz-scheduler-event-line-height);
    overflow: hidden;
    justify-content: center;
    display: flex;
    align-items: center;
}

.legend {
    display: flex;
    justify-content: space-around;
    padding: 5px;
    border: 1px solid #ccc;
    margin-top: 5px;
}

.legend-item {
    display: flex;
    align-items: center;
    margin-right: 20px;
}

.color-box {
    width: 20px;
    height: 20px;
    border-radius: 5px;
    margin-right: 10px;
}

.scheduler-green {
    background-color: #96ff7a;
}

.scheduler-grey {
    background-color: #aaaaaa;
}

.scheduler-red {
    background-color: #ff6363;
}

.scheduler-blue {
    background-color: #00a4ff;
}

div[draggable="true"] {
    cursor: grab;
}

div[draggable="true"]:active {
    cursor: grabbing;
}

.remaining-space {
    flex-grow: 1; /* Takes the remaining space */
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
}

.filetemplate-grey {
    background-color: dimgray;
}

.filetemplate-red {
    background-color: #c82626;
}

.filetemplate-blue {
    background-color: #00264d;
}