﻿.LeasxForm {
    padding-top: 8px;
    padding-left: 8px;
    padding-right: 8px;
    padding-bottom: 8px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 12px;
}

.LeasxPageList {
    display: flex;
    flex-direction: row;
}

.LeasxPageListGrid {
    flex: 1;
    overflow-x: auto;
}

.LeasxFilter {
    padding-top: 0px;
    padding-left: 8px;
    padding-right: 8px;
    padding-bottom: 8px;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    gap: 12px;
    background: linear-gradient(to bottom, #a7a7a7, rgba(255,0,0,0)) no-repeat;
    background-size: auto 400px;
    background-position: top;
}

.LeasxGradient {
    background: linear-gradient(to bottom, #a7a7a7, rgba(255,0,0,0)) no-repeat;
    background-size: auto 50px;
    background-position: top;
}

.LeasxFormTitle {
    font-weight: var(--mud-typography-subtitle2-weight);
    font-size: var(--mud-typography-subtitle2-size);
    display: flex;
    gap: 8px;
}

.LeasxForm .LeasxFormGroup {
    padding: 8px;
    width: 32%;
    height: fit-content
}

.LeasxFilter .LeasxFormGroup {
    padding: 8px;
    width: 100%;
    height: fit-content
}

.LeasxFormItem {
    padding-top: 8px;
}

.LeasxFormItem.mud-input-root {
    padding-top: 0px;
}

.LeasxFormItem .mud-checkbox.flex-row-reverse {
    justify-content: flex-end;
}

.PanelClass {
    height: calc(100vh - 120px);
    overflow: auto;
    padding: 0px;
}

:root {
    --GridHeight: calc(100vh - 108px);
    --SubGridHeight: calc(100vh - 160px);
}

@media only screen and (max-width: 1100px) {
    .LeasxForm .LeasxFormGroup {
        width: 48%;
    }
}

@media only screen and (max-width: 600px) {
    .LeasxForm .LeasxFormGroup {
        width: 100%;
    }

    :root {
        --GridHeight: calc(100vh - 166px);
        --SubGridHeight: calc(100vh - 218px);
    }
}

.LeasxForm .LeasxFormGroup.ExtraLarge {
    width: 100%;
}

body {
}

@keyframes shake {
    0% {
        transform: rotate(0deg);
    }

    25% {
        transform: rotate(-10deg);
    }

    50% {
        transform: rotate(10deg);
    }

    75% {
        transform: rotate(-10deg);
    }

    100% {
        transform: rotate(0deg);
    }
}

