﻿@import url('open-iconic/font/css/open-iconic-bootstrap.min.css');
@import url('variables.css');
@import url('sidebar.css');
@import url('site.css');
@import url('form.css');
@import url('search.css');
@import url('order.css');
@import url('filter.css');
@import url('header.css');
@import url('main-list.css');
@import url('user-bar.css');
@import url('login.css');
@import url('not-found.css');
@import url('btn.css');
@import url('flexbox.css');
@import url('Index.css');
@import url('favoritos.css');
@import url('Paginacao.css');
@import url('no_content.css');

html, body {
    font-family: OpenSans;
    font-size: .925rem;
}

body {
    background-attachment: fixed;
}

.word-break {
    word-wrap: break-word !important;
}

/*INPUTS, TEXTAREAS, SELECTS*/
input[type=text], input[type=email], input[type=password], input[type=date], input[type=number], textarea, select {
    display: block;
    width: 100%;
    margin-bottom: .8rem;
    font-weight: 400;
    color: #2d2f31;
    background-color: #fff;
    border: 1px solid #ced4da;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    height: calc(1.5em + 0.5rem + 2px);
    padding: 0.25rem 0.5rem;
    font-size: 0.875rem;
    line-height: 1.5;
    border-radius: 0.2rem;
    -moz-appearance: textfield;
}
    input[type=text]:focus, input[type=email]:focus, input[type=password]:focus, input[type=number]:focus, input[type=date] textarea:focus, select:focus {
        color: #495057;
        border-color: var(--color-darkred);
        outline: 0;
        box-shadow: 0 0 0 0.1rem rgba(139, 0, 0, .15);
    }

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;    
    margin: 0;
}

input[type=date] {
    cursor: pointer;
}

.form section > div::before, .form > div::before, .search > div::before, .data-label::before {
    content: attr(data-label);
    color: black;
    font-size: .975rem;
    display: block;
    margin-top: .5rem;
    margin-bottom: .0rem !important;
}

.input-chk {
    cursor: pointer;
}
    .input-chk:first-child {
        margin-right: .25rem;
    }


a, .btn-link{
    color: var(--color-gray);
    transition: all .18s linear;
}

a:hover, btn-link:hover{
    color: black;
    text-decoration: none;
}

select, input[type=radio], input[type=checkbox]{
    cursor: pointer;
}

.custom-control-input, .custom-control-label {
    cursor: pointer !important;
}

.pesquisa {
    display: flex;
    flex-wrap: wrap;
}

.pesquisa label {
    font-size: .875rem;
    color: darkgray;
}

.pesquisa button[type=submit] {
    margin-top: auto;
    margin-bottom: .8rem;
}

.pointer {
    cursor: pointer;
}

.table td, th {
    vertical-align: middle !important;
}

.font-bold {
    font-weight: 500 !important;
}

.font-italic {
    font-style: italic !important;
}

.select-cadastro {
    display: flex;
    flex-wrap: nowrap;
}

    .select-cadastro input {
        width: 100%;
    }

    .select-cadastro button {
        height: 1.8rem;
        padding: 1px 6px;
    }

body::-webkit-scrollbar {
    width: 6px; /* width of the entire scrollbar */
    height: 6px;
}
    
    body::-webkit-scrollbar-track {
        background: transparent; /* color of the tracking area */
    }
    
    body::-webkit-scrollbar-thumb {
        background-color: var(--color-darkred);    /* color of the scroll thumb */
        border-radius: 20px;       /* roundness of the scroll thumb */
        
    }

.textarea-lg {
    height: 9rem;
}

.title-cancelado {
    color: var(--color-darkred);
}

/*MEDIA QUERIES*/
@media (max-width: 767.98px) {
    .main .top-row:not(.auth) {
        display: none;
    }

    .main .top-row.auth {
        justify-content: space-between;
    }

    .main .top-row a, .main .top-row .btn-link {
        margin-left: 0;
    }
}

.setor-pendente {
        color: darkred;
    }

    .setor-producao {
        color: darkblue;
    }
    
    .setor-parcial {
        color: darkcyan;
    }

    .setor-concluido {
        color: darkgreen;
    }

@media (min-width: 768px) {
    app {
        flex-direction: row;
    }

    .sidebar {
        width: 250px;
        height: 100vh;
        position: sticky;
        top: 0;
    }

    .main .top-row {
        top: 0;
    }

    .main > div {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }

    .navbar-toggler {
        display: none;
    }

    .sidebar .collapse {
        /* Never collapse the sidebar for wide screens */
        display: block;
    }
}