@import './header.css';
@import './colors.css';

* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;

    font-family: Arial, Helvetica, sans-serif;
}

body {
    background-color: var(--surface-a0);
}

main {
    min-height: 90vh;

    display: flex;
    flex-direction: column;
    align-items: center;
}

.avatar-small {
    background-color: var(--surface-a20);
    /*border: 3px solid var(--surface-a40);*/

    height: 45px;
    width: 45px;

    border-radius: 50%;
    object-fit: cover;
}

.avatar-normal {
    /*background-color: var(--primary-a40);*/
    background-color: var(--surface-a20);
    border-color: var(--surface-a0);
    height: 100px;
    width: 100px;

    border-radius: 50%;
    object-fit: cover;
}

h1, h2, h3, h4, h5, h6, i {
    color: var(--light-a0);

    margin: 0;
    padding: 0;
}

.username-text {
    color: var(--light-a10);
}

textarea {
    background-color: var(--surface-a10);
    color: var(--light-a0);
    border: 2px solid var(--surface-a40);
}

textarea:focus {
    background-color: var(--surface-a10);
    color: var(--light-a0);
    outline: 1px solid var(--primary-a20);
    border-color: var(--primary-a20);
}

.alert-danger {
    font-size: 2rem;
}

.form-error-text {
    font-size: 1rem;
}

/*.btn-primary {*/
/*    background-color: var(--primary-a10);*/
/*    border-color: var(--primary-a10);*/
/*}*/

/*.btn-primary:hover {*/
/*    background-color: var(--primary-a30);*/
/*    border-color: var(--primary-a30);*/
/*}*/

/*.btn-primary:active {*/
/*    background-color: var(--primary-a20) !important;*/
/*    border-color: var(--primary-a20) !important;*/
/*}*/