@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

* {
    box-sizing: border-box;
    font-size: 16px;
    padding: 0;
    margin: 0;
    font-family: "Poppins", sans-serif;
}

:root {
    --cor-cancelar: #a83c32;
    --cor-cancelar-hover: #97362d;
    --cor-cancelar-click: #762a23;
    --cor-confirmar: #27884E;
    --cor-confirmar-hover: #1B5F36;
    --cor-confirmar-click: #103720;
    --background-color: #F1F5F9;
    --main-background-color: #ffffff;
    --text-color: #2B2D33;
    --input-border-color: #D3D3D3;
    --shadow-color: rgba(0, 0, 0, 0.15);
    --th-background-color: #475569;
    --th-background-color-hover: #404d5f;
    --th-background-color-click: #394454;
    --tr-highcontrast-color: #F1F5F9;
    --tr-lowcontrast-color: #E2E8F0;
    --input-color: #ffffff;
    --nav-background-color: #D9D9D9;
    --nav-links-color: #450A0A;
    --table-refrigerator: #5961d4;
}

:root[data-theme='light'] {
    --cor-confirmar: #27884E;
    --cor-confirmar-hover: #1B5F36;
    --cor-confirmar-click: #103720;
    --background-color: #F1F5F9;
    --main-background-color: #ffffff;
    --text-color: #2B2D33;
    --input-border-color: #D3D3D3;
    --shadow-color: rgba(0, 0, 0, 0.15);
    --th-background-color: #475569;
    --tr-highcontrast-color: #F1F5F9;
    --tr-lowcontrast-color: #E2E8F0;
    --input-color: #ffffff;
    --nav-background-color: #D9D9D9;
    --nav-links-color: #450A0A;
    --table-dedicada: #d97059;
    --table-perecivel: #d9bf59;
    --table-perto: #9c7e09;
    --table-passou: #690505;
    --table-refrigerator: #5961d4;
}

:root[data-theme='dark']{
    --cor-confirmar: #275388;
    --cor-confirmar-hover: #5275a0;
    --cor-confirmar-click: #6887ac;
    --background-color: #101724;
    --main-background-color: #0a0f17;
    --text-color: white;
    --input-border-color: #D3D3D3;
    --shadow-color: rgba(255, 255, 255, 0.1);
    --th-background-color: #475569;
    --tr-highcontrast-color: #151517;
    --tr-lowcontrast-color: #26282e;    
    --input-color: #22242e;
    --link-color: #6692e3;
    --link-visited: #759de6;
    --link-clicked: #85a8e9;
    --nav-background-color: #212c40;
    /* --nav-links-color: #d43333; */
    --nav-links-color: #c4c4cc;
    --table-dedicada: #692010;
    --table-perecivel: #695110;
    --table-perto: #f0ad1d;
    --table-passou: #cf1d0c;
    --table-refrigerator: #1b2069;
}

nav#divNavegacaoHeader .dropdown-content a {
    color: #505054;
}

a {
    color: var(--link-color);
}

a:visited {
    color: var(--link-visited);
}

a:active {
    color: var(--link-clicked);
}

body{
    margin: 0;
    padding: 0;
    width: 100vw;
    min-height: 100vh;
    overflow-x: hidden;
    background-color: var(--background-color);
    color: var(--text-color);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
}

h1 {
    font-size: 24px;
}

main {
    background-color: var(--main-background-color);
    min-height: calc(100vh - 64px);
    padding: 8px 16px;
    width: 90%;
    max-width: 1300px;
    /* overflow-y: auto; */
}


.inputHolder {
    display: flex;
    flex-direction: column;
    margin-top: 8px;
}

input:not([type="checkbox"]):not([type="radio"]),
select, .selecao-multipla, textarea {
    padding: 4px 8px;
    height: 32px;
    border: 1px solid var(--input-border-color);
    border-radius: 4px;
    width: 100%;
    color: var(--text-color);
    background-color: var(--input-color);
}

textarea {
    min-height: 96px;
    resize: none;
}

select, textarea {
    background-color: var(--input-color);
}


table{
    width: 100%;
    /* height: 100%; PELO AMOR DE DEUS O QUE É ISSOOOOOOOOOOO */
    border-collapse: collapse;
    /* margin: 25px 0; */
    font-size: 0.9rem;
    font-family: sans-serif;
    min-width: 400px;
    box-shadow: 0 0 8px var(--shadow-color);
    table-layout: fixed; /* Garante que as colunas respeitem as larguras definidas */
    text-align: center;

    
}

th{
    background-color: var(--th-background-color);
    color: #FFF;
}

th,
td{
    padding: 12px 15px;
}

tbody tr {
    /* border-bottom: 1px solid #dddddd; */
    background-color: var(--tr-highcontrast-color);


}

tbody tr:nth-of-type(even) {
    background-color: var(--tr-lowcontrast-color);
}


@media screen and (max-width: 640px) {
    main {
        width: 90%;
    }
}

.botao-imprimir {
    position: fixed;
    background-color: var(--th-background-color);
    right: 16px;
    bottom: 16px;
    width: 50px;
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    clip-path: circle();
    cursor: pointer;
}

#botao-imprimir:hover {
    background-color: var(--th-background-color-hover);
}

#botao-imprimir:active {
    background-color: var(--th-background-color-click);
}

#headerNavBar {
    background-color: var(--nav-background-color);
}

#filtroContainer {
    background-color: var(--nav-background-color) !important;
}

tbody tr.refrigerador {
    background-color: var(--table-refrigerator);
}