@import url('background.css');
@import url('login.css');
@import url('home.css');
@import url('footer.css');
@import url('painel.css');
@import url('edit.css');
@import url('effects.css');

@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&family=Playwrite+AU+SA:wght@100..400&display=swap');

:root{
  --text:   #EDF1F7;
  --red:    #C51212;
  --blue:   #0041C2;
  --cyan:   #05f7ff;
  --green:  #14B02D;
  --yellow: #FFc12b;
  --purple: #A020F0;
  --orange: #FFA500;
  --pink:   #FF00FF;
  --gold:   #FFD700;

  --raibow: linear-gradient(
      45deg,
      cyan,
      #333,
      cyan,
      #333,
      cyan,
      #333
  );
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: "Montserrat", serif;
    font-weight: 500;
    user-select: none;
}

body {
    background-color: #ffffff;
    overflow-x: hidden;
    min-height: 100%;
    height: auto;
}

html::-webkit-scrollbar {
    width: 0.5rem;
}

html::-webkit-scrollbar-track {
    background: #333;
}

html::-webkit-scrollbar-thumb {
    background: cyan;
}

:root {
    --main: snow;
}

@keyframes Animarborda {
    0% {
        background-position: 0;
    }
    100% {
        background-position: 300%;
    }
}

/* responsividade */
@media screen and (max-width:1450px){
   
}

@media screen and (max-width:1350px)
{

}

@media screen and (max-width:1000px)
{
    
}

@media screen and (max-width: 900px){
    html, body{
        overflow-x: hidden;
    }

    .loginmain{
        overflow: hidden;
    }

    .cardlogin {
        width: 95vw;
        height: 30.5rem;
    }
    
    nav {
        left: 10%;
    }

    .header2 .container{
        display: flex;
    }

    .info{
        & h1{
            display: none;
        }
        & .info2 .interactive{
            position: absolute;
            top: 60px;
            right: 120px;
        }
        & .info2 input{
            position: absolute;
            top: 20px;
            right: 120px;
        }
        & .info2 .data{
            width: 125px;
        }
    }

    .box{
        top: 70px;
        right: 860px;
        width: 95vw;
        height: 90.6vh;
        background-color: #0043fa73;
        background-repeat: no-repeat;
        background-size: 70%;
        background-position: center;
        background-image: url("../img/Logotipo/Sem\ fundo/Logotipo sem fundo (1500x500)-byfront.png");
    
        & .conteudo h2{
            text-align: center;
            font-size: 1.3rem;
        }
        
        & .conteudo li {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
        }
    }
    
    .tabela, th, td{
        margin: 0;
        padding: 4px;
        font-size: 1rem;
    }

    .btn-edit{
        padding: 0.4rem 0.6rem;
        border-radius: 5px;
        font-size: 0.5rem;
    }
    .btn-delete{
        padding: 0.4rem 0.6rem;
        border-radius: 5px;
        font-size: 0.5rem;
    }
    .buttonspainel{
        gap: 5px;
        top: 10px;
    
        & a{
            font-size: 1rem;
        }
    }

    .editbox{
        width: 350px;
    }

    #background{
        overflow: hidden;
    }
    #background::before {
        background: linear-gradient(100deg, rgba(0, 0, 0, 0.623) 0%, rgb(3, 3, 3) 0%, rgba(0, 0, 0, 0.26) 50%);
    }
}