/* =========================================================
   BASE
   ========================================================= */
option {
    color: black;
    background-color: white;
}

button,
input,
select,
textarea {
    background: none;
    border: none;
    color: inherit;
}
:focus-visible {
    outline: none;
}
body {
    background-color: var(--bg-body);
}

.body {
    background-color: var(--bg-body-light);
}

/* =========================================================
   LOGIN
   ========================================================= */

.index_LOGIN {
    background-image: var(--gradient-main);
}

.index_LOGIN_FORM {
    background-color: var(--text-color-prim);
}

.index_LOGIN_div_label_header {
    color: var(--text-color-sub-muted);
}

.index_LOGIN_div_label {
    color: var(--text-color-sub);
}

.index_LOGIN_INPUT_input {
    background-color: var(--bg-input);
}

.index_LOGIN_INPUT_submit_login {
    color: var(--text-color-prim);
    background-color: var(--color-primary-action);
}

.index_LOGIN_INPUT_submit_back {
    color: var(--text-color-sub-disabled);
}

/* =========================================================
   HEADER / MENU
   ========================================================= */

.menu_header {
    background-color: var(--header-bg);
    color: var(--header-text);
}

.menu_header_form_logout {
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.menu_header_form_logout_submit {
    color: var(--text-color-prim);
}

.lmenu_open {
    background-image: linear-gradient(
        to bottom,
        var(--header-bg),
        var(--header-bg-dark)
    );
}
.lmenu_form {
    border-color: var(--bg-body);
}
.lmenu_form:hover {
    background-color: var(--header-bg-darker);
}

.lmenu_selected {
    background-color: var(--header-bg-selected);
    box-shadow: 0 0 10px var(--shadow-selected);
}

.lmenu_form_submit {
    color: var(--text-color-prim);
}

.lmenu_menu_open.lmenu_menu {
    border-bottom-color: var(--header-border);
}

.lmenu_menu_open.lmenu_menu_label {
    color: var(--header-text);
}

/* =========================================================
   SELECT / DROPDOWNS
   ========================================================= */

.select_pvz_form {
    background-color: var(--header-select-bg);
    color: var(--text-color-prim);
}

.select_pvz_custom_select,
.select_pvz_selected {
    color: var(--text-color-prim);
}

.select_pvz_form:hover {
    background-color: var(--header-select-bg-hover);
}

.select_pvz_options {
    background-color: var(--header-select-bg-open);
}

.select_pvz_option:hover,
.select_pvz_option.select_pvz_focused {
    background-color: var(--bg-selected-pvz-soft);
}

/* =========================================================
   CONTENT TABLE / ROWS
   ========================================================= */
.content_line_nums {
    background-color: var(--bg-zebra);
}
.content_row.header_id,
.content_row.header_name,
.home_page_submit {
    color: var(--text-color-prim);
}
.content_tile {
    border-color: var(--border-main);
}
.content_row,
.content_row_header,
.content_row_name,
.content_row_add,
.content_row_select_custom {
    border-left-color: var(--border-main);
    border-bottom-color: var(--border-main);
}

.content_row_header {
    border-bottom-color: var(--border-main);
}

.content_row_select_options {
    background-color: var(--bg-body-light);
    border-left-color: var(--border-main);
    border-right-color: var(--border-main);
    border-bottom-color: var(--border-main);
}

.content_row_select_open .content_row_select_options {
    box-shadow: 0 0 0.6vw var(--border-main);
}

.content_row_select_option {
    border-top-color: var(--border-main);
}

.content_row_select_option:hover {
    background-color: var(--state-hover);
}

.content_row_select_option_active {
    background-color: var(--state-active);
}

/* =========================================================
   MULTISELECT
   ========================================================= */

.content_row_multiselect_selected {
    border-bottom-color: var(--border-main);
}

.content_row_multiselect_options {
    background-color: var(--bg-body-light);
    border-left-color: var(--border-main);
    border-right-color: var(--border-main);
    border-bottom-color: var(--border-main);
}

.content_row_multiselect_option {
    border-top-color: var(--border-main);
}

.content_row_multiselect_option:hover {
    background-color: var(--state-hover);
}

.content_row_multiselect_option_active {
    background-color: var(--state-active-strong);
}

/* =========================================================
   TABLE / LINES
   ========================================================= */

.content_table {
    border-color: var(--border-main);
}

.content_table.content_table_selected {
    background-color: var(--bg-selected-strong);
}

.content_line.content_line_selected {
    background-color: var(--bg-selected-strong);
}

.content_line_active {
    box-shadow: 0 -0.06vw 0 0.06vw var(--border-main);
}

/* =========================================================
   BRICKS
   ========================================================= */

.content_bricks {
    border-bottom-color: var(--border-soft);
}

.content_bricks_custom_selected {
    border-bottom-color: var(--border-soft);
}

.content_bricks_custom_options {
    background-color: var(--bg-body-light);
    border-left-color: var(--border-main);
    border-right-color: var(--border-main);
    border-bottom-color: var(--border-main);
}

.content_bricks_custom_option {
    border-top-color: var(--border-main);
}

.content_bricks_custom_option:hover {
    background-color: var(--state-hover);
}

.content_bricks_custom_option_active {
    background-color: var(--state-active);
}

.content_bricks.content_bricks_holiday {
    color: var(--color-holiday);
}

.content_bricks.content_bricks_weekend {
    color: var(--color-weekend);
}

.content_bricks.content_bricks_light {
    background-color: var(--color-primary);
}

.content_bricks.content_bricks_edit,
.content_bricks.content_bricks_save {
    border-right-color: var(--border-soft);
}

/* =========================================================
   HEADERS / TEXT
   ========================================================= */

.content_row_header.content_row_header_date,
.content_row_header.content_row_header_now {
    border-bottom-color: var(--border-main);
}

.content_row_header.content_row_header_minus,
.content_row_header.content_row_header_plus {
    border-left-color: var(--border-main);
    border-right-color: var(--border-main);
    border-bottom-color: var(--border-main);
}

.hello {
    color: var(--color-primary);
}

/* =========================================================
   MODALS
   ========================================================= */

.reportModal {
    background-color: var(--overlay-dark);
}

.index_modal {
    background-image: var(--gradient-modal);
    border-left-color: var(--text-color-prim);
    border-right-color: var(--text-color-prim);
    border-bottom-color: var(--text-color-prim);
    color: var(--text-color-prim);
}