/* ============================================
   12. PAGE: ADMIN
   ============================================ */

/* ShopAdmin---------- */
.newItemForm fieldset textarea{
    font-size: 18px;
    width: 95%;
    margin: .5rem auto 2rem auto;
    padding: .5rem;
    border-radius: .5rem;
    border: 1px solid gray;
}

/* ------------------- */


/* Announcements -----*/

    .editTextArea{
        display:none;
        margin:auto;
        width: 75vw;
        max-width: 100ch;
        padding:3rem 0;
        
    }
    .expand{
        height:fit-content;
    }
    .showLogo, .deleteLogo, .editLogo, .hideLogo{
        font-size: 20px;
        margin:.2rem;
    }
    .hideLogo{
        color:black;
    }
    .editLogo{
        color: var(--logoBlue);
    }
    .deleteLogo{
        color:red;
    }
    .showLogo{
        color:gray;
    }
    .loading{
        margin:auto;
        width:fit-content;
        font-size: 30px;
    }
    .newEntry{
        padding:.5rem 1rem;
        background-color: var(--logoBlue);
        color:white;
        border:2px solid var(--logoBlue);
        border-radius:.5rem;
        margin: 2rem 1rem;
        transition:.2s;
        display:block;
        width:fit-content;
        text-decoration:none;
        font-size:18px;
        transition:.2s;
    }
    .newEntry:hover{
        background-color: white;
        color:var(--logoBlue);
    }
    .newEntry:active{
        background-color:var(--logoBlue) ;
        color:white;
    }
    
    .newAnnouncement:hover{
        background-color:white;
        color:var(--logoBlue);
    }
    .editTextArea h1{
        margin: 3rem 0;
    }
    .editTextArea input{
        margin:2rem 0;
        padding: .5rem 1rem;
        background-color: var(--logoBlue);
        color:white;
        border: 2px solid var(--logoBlue);
        border-radius: .5rem;
        transition:.2s;
    }
    .editTextArea input:hover{
        cursor: pointer;
        background-color: white;
        color: var(--logoBlue);
    }
    .editTextArea input:active{
    
        background-color: var(--logoBlue);
        color:white;
    }


/* ------------------ */


/* ============================================
   12. PAGE: ADMIN (continued)
   ============================================ */

/* All Users ---------*/

.users{
    margin-top: 5rem;
    
}
.users .display{
    width:90vw;
    max-width:100ch;

}
.users .display .center{
    text-align: center;
}

/*  ------------------*/


.backButton{
    cursor: pointer;
    padding:.2rem .5rem;
    width:fit-content;
    margin:1rem;
    background-color: lightgray;
    border:1px solid black;
    color:black;
    text-decoration: none;
    border-radius: .5rem;
}

.newUserForm{
    height:80vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin:1rem 0;
}
.newUserForm fieldset legend{
    text-align: center;
    padding:.5rem 1rem;
    background-color: var(--logoBlue);
    color:white;
    border-radius:2rem;
}
.newUserForm fieldset{
    display: flex;
    flex-direction: column;
    border:none;
    box-shadow: var(--boxShadow);
    border-radius: .5rem;
}
.newUserForm label{
    margin:.5rem 1rem;
}

.newUserForm fieldset input{
    width: 90vw;
    max-width: 30ch;
    margin:0 1rem 1rem 1rem;
    border:none;
    border-bottom: 1px solid gray;
    padding:.5rem;
    font-size: 18px;
}

.newUserForm .adminRadio{
    display:flex;
}

#yes,#no,#yes1,#no1{
    width:1.5rem;
    height:1.5rem;
    background-color: red;
    margin:auto;
}

/*  ------------------*/


/* Admin Login -------*/
    .adminLogin{
        height:80vh;
        display: flex;
        flex-direction: column;
        justify-content: center;
    }
    .adminLogin fieldset{
        display: flex;
        flex-direction: column;
        border:none;
        box-shadow: var(--boxShadow);
        border-radius: .5rem;
        width:90vw;
        max-width:45ch;
    }
    .adminLogin legend{
        background-color: var(--logoBlue);
        border-radius: 2rem;
        padding: .5rem;
        color:white;
        margin:auto;
        width:50%;
        text-align: center;
    }

    .adminLogin .inputForm{
        box-sizing: border-box;
        display: flex;
        justify-content: center;
        margin:2rem;
        height: fit-content;
        border:1px solid var(--logoBlue);
        
    }
    .adminLogin .inputForm i{
        background-color: var(--logoBlue);
        padding: .75rem;
        width:2rem;
        color:white;
        font-size: 20px;
        text-align: center;
        margin:auto;
        
        
        
    }
    .adminLogin input{
        width: 90%;
        max-width: 30ch;
        padding:.5rem;
        font-size: 18px;
        border:none;
    
    }
    .adminLogin #submit{
        width: 5rem;
        margin: 1rem auto;
    }
/* ------------------ */