.file-input {
    display: block;
    width: 100%;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    box-shadow: none;
    outline: none;
    font-size: .8125rem;
    line-height: 1;
    background-color: var(--tw-light-active);
    border-radius: .375rem;
    height: 2.5rem;
    padding: 0;
    padding-inline-end: 1rem;
    border: 1px solid var(--tw-gray-300);
    color: var(--tw-gray-700);
}

.file-input::-moz-placeholder {
    color: var(--tw-gray-500);
}

.file-input::placeholder {
    color: var(--tw-gray-500);
}

.file-input::file-selector-button {
    color: var(--tw-gray-600);
    height: 100%;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    padding-inline-start: 1rem;
    padding-inline-end: 1rem;
    margin-inline-end: 1rem;
    outline: none;
    background-color: transparent;
    border-start-start-radius: .375rem;
    border-end-start-radius: .375rem;
    border: 0;
    border-inline-end: 1px solid var(--tw-gray-300);
    box-shadow: none
}

.file-input:hover {
    border-color: var(--tw-gray-400);
}

.file-input:focus {
    border-color: var(--tw-primary);
/ box-shadow: var(--tw-input-focus-box-shadow);
/ color: var(--tw-gray-700);
}

.file-input:focus::-moz-placeholder {
    color: var(--tw-gray-600)
}

.file-input:focus::placeholder {
    color: var(--tw-gray-600);
}

.file-input:active {
    color: var(--tw-gray-700);
}

.file-input:active::-moz-placeholder {
    color: var(--tw-gray-600);
}

.file-input:active::placeholder {
    color: var(--tw-gray-600);
}

.file-input:active {
    box-shadow: none;
}

.file-input:disabled {
    background-color: var(--tw-gray-100);
    color: var(--tw-gray-400);
}

.file-input:disabled::-moz-placeholder {
    color: var(--tw-gray-300);
}

.file-input:disabled::placeholder {
    color: var(--tw-gray-300);
}
.justify-space-evenly{
    justify-content: space-evenly;
}
.h-screen{
    height: 100vh;
}

@media only screen and (max-width: 600px) {
    .sm-hidden{
        display: none;
    }
}

@media only screen and (min-width: 1024px) {
    .col-span-3{
        grid-column: span 3 / span 3;
    }
}