﻿.entity--form {
    display: grid;
    grid-gap: var(--form-grid-gap);
    position: relative;
    max-width: 100%;
    /* Tablet and Desktop */
}

.entity--form input [type='text'],
.entity--form input [type='number'],
.entity--form input [type='date'],
.entity--form select {
    width: var(--input-width);
}

.entity--form input [type='radio'] {
    margin-right: initial;
    width: initial;
}

.entity--form .break {
    flex-basis: 100%;
    width: 0px;
    height: 0px;
    overflow: hidden;
    display: inline-block;
}


@media (min-width: 768px) {
    .entity--form {
        grid-template-columns: 1fr 1fr;
    }
}


:root {
    /* Box */
    --box-container-heading-spacing: 0.25rem;
    --box-spacing: var(--spacing-medium);
    --box-border-width: 1px;
    --box-padding: 2rem;
    --box-max-width: 91vw;
    /* Form */
    --form-grid-gap: 3rem;
}

/*//////////////////////////*/

.spinner-box {
    display: grid;
    justify-content: center;
    justify-items: center;
    margin-top: var(--spacing-big);
}


div.spinner {
    display: inline-flex;
    stroke: var(--progress-color);
    z-index: 1;
}

@keyframes rotate {
    100% {
        transform: rotate(360deg);
    }
}

@keyframes dash {
    0% {
        stroke-dasharray: 1, 150;
        stroke-dashoffset: 0;
    }

    50% {
        stroke-dasharray: 90, 150;
        stroke-dashoffset: -35;
    }

    100% {
        stroke-dasharray: 90, 150;
        stroke-dashoffset: -124;
    }
}

    div.spinner svg {
        animation: 2s linear 0s infinite normal none running rotate;
        position: relative;
        z-index: 1;
    }

    div.spinner svg .path {
        animation: 1.5s ease-in-out 0s infinite normal none running dash;
        stroke-linecap: round;
    }

    svg.icon {
        backface-visibility: hidden;
        display: inline-block;
        fill: var(--icon-fill);
        height: var(--icon-size);
        pointer-events: none;
        stroke: var(--icon-stroke);
        stroke-width: var(--icon-stroke-width, 1px);
        width: var(--icon-size);
    } 