:root {
    /*--pico-spacing: 1rem;*/
    /*--pico-line-height: 1.5;*/
    /*--pico-form-element-spacing-vertical: 0.3rem;*/
    /*--pico-form-element-spacing-horizontal: 0.7rem;*/
    /*--spacing-vertical: 0.3rem;*/
    /*--spacing-horizontal: 0.7rem;*/
}

/*input:not([type=checkbox],[type=radio],[type=range],[type=file]), select, textarea {*/
/*    padding: var(--spacing-vertical) var(--spacing-horizontal);*/
/*}*/

/*input:not([type=checkbox],[type=radio],[type=range]) {*/
/*    height: calc(0.2rem* var(--pico-line-height) + var(--spacing-vertical)* 2 + var(--spacing-horizontal)* 2);*/
/*}*/
/*details.dropdown summary:not([role]) {*/
/*    height: calc(0.2rem * var(--pico-line-height) + var(--spacing-vertical) * 2 + var(--spacing-horizontal) * 2);*/
/*    padding: var(--spacing-vertical) var(--spacing-horizontal);*/
/*}*/

@keyframes select {
    to {
        -webkit-user-select: text;
        user-select: text;
    }
}

.mb-0 { && { margin-bottom: 0; } }

.align-center { align-self: center; }

.text-left { text-align: left; }
.text-right { text-align: right; }

pre {
    tab-size: 2;
}

code {
    -webkit-user-select: all;
    user-select: all;
}
code:focus {
    animation: select 100ms step-end forwards;
}

summary {
    sup {
        opacity: 0.65;
    }
}

details {
    ul {
        max-height: 200px;
        overflow-x: scroll;
    }
}

.hidden {
    display: none;
}

.button {
    &.button--icon {

    }
}

.section-meta {
    .grid {
        display: grid;
        grid-template-columns: auto repeat(2, 1fr);
        grid-column-gap: 15px;
        grid-row-gap: 25px;
        justify-items: stretch;
        align-items: stretch;
    }
}

.section-fields {
    .grid {
        &.grid--input-add, &.grid--input-list {
            grid-template-columns: auto 1fr;
            grid-column-gap: 15px;
            grid-row-gap: 25px;
            justify-items: stretch;
            align-items: stretch;
        }
    }
}