.irmf-form { max-width: 40rem; }
.irmf-field { margin-block: 0 1rem; }
.irmf-field label, .irmf-field small { display: block; }
.irmf-field input:not([type=checkbox]), .irmf-field textarea, .irmf-field select { box-sizing: border-box; width: 100%; }
.irmf-field textarea { min-height: 6rem; }
.irmf-trap { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.irmf-popup { box-sizing: border-box; width: min(92vw, 42rem); max-height: 90vh; overflow: auto; padding: 1.25rem; }
.irmf-popup::backdrop { background: rgb(0 0 0 / 45%); }
.irmf-popup [data-irmf-close] { margin-block-end: 1rem; }

/* The eight IRM forms retain the appearance of their FormCraft originals. */
.irmf-form.irmf-classic {
    --irmf-button: #4488ee;
    --irmf-hover: #3b77d1;
    --irmf-field-color: #777;
    --irmf-background: #fff;
    box-sizing: border-box;
    width: 420px;
    max-width: 100%;
    margin: 0 auto;
    color: #666;
    background: var(--irmf-background);
    border-radius: 2px;
    box-shadow: 0 1px 3px rgb(0 0 0 / 30%);
    font-size: 14px;
    line-height: 1.5;
    text-align: left;
}
.irmf-form:is(.irmf-classic-1, .irmf-classic-4) {
    --irmf-button: #ed1651;
    --irmf-hover: #d01347;
}
.irmf-form.irmf-classic-1 { --irmf-background: #f1f6fa; --irmf-field-color: #b6bcc2; }
.irmf-form:is(.irmf-classic-2, .irmf-classic-3, .irmf-classic-4) { box-shadow: none; }
.irmf-classic .irmf-fields { padding: 1.5em 1.5em 0; }
.irmf-form:is(.irmf-classic-2, .irmf-classic-3, .irmf-classic-4) .irmf-fields { padding: 0; }
.irmf-classic .irmf-field, .irmf-classic .irmf-submit, .irmf-classic .irmf-heading, .irmf-classic .irmf-content { margin: 0 0 1.5em; }
.irmf-classic .irmf-fields { display: flow-root; }
.irmf-classic .irmf-field :is(input:not([type=checkbox]), textarea, select) {
    width: 100%;
    margin: 0;
    padding: 9px 12px;
    min-height: 38px;
    border: 1px solid #ddd;
    border-radius: 2px;
    background: #fafafa;
    color: var(--irmf-field-color);
    box-shadow: 0 1px 2px rgb(0 0 0 / 5%) inset;
    font: inherit;
}
.irmf-classic .irmf-field :is(input, textarea)::placeholder { color: var(--irmf-field-color); opacity: 1; }
.irmf-classic .irmf-field :is(input, textarea, select):focus { border-color: #a0a0a0; outline: 2px solid var(--irmf-button); outline-offset: 1px; }
.irmf-classic .irmf-field textarea { height: 120px; resize: vertical; }
.irmf-classic .irmf-submit { text-align: center; }
.irmf-classic .irmf-submit button, .irmf-classic .irmf-field .irmf-file-button {
    display: inline-block;
    box-sizing: border-box;
    padding: 9px 18px;
    min-height: 0;
    border: 0;
    border-radius: 2px;
    color: #fff;
    background: var(--irmf-button);
    font: inherit;
    font-weight: 600;
    letter-spacing: normal;
    line-height: 1.5;
    text-transform: none;
    text-align: center;
    white-space: normal;
    cursor: pointer;
}
.irmf-classic .irmf-submit button:hover, .irmf-classic .irmf-field .irmf-file-button:hover { background: var(--irmf-hover); }
.irmf-classic .irmf-field .irmf-file-button { position: relative; overflow: hidden; padding: 0 16px 0 55px; min-height: 36px; line-height: 36px; font-weight: 700; }
.irmf-classic .irmf-file-button::before { content: "☁"; position: absolute; left: 2px; bottom: -12px; font-size: 46px; opacity: .2; }
.irmf-classic .irmf-upload:focus-within .irmf-file-button { outline: 2px solid #333; outline-offset: 2px; }
.irmf-classic .irmf-filename { display: block; overflow-wrap: anywhere; }
.irmf-classic .irmf-filename:not(:empty) { margin-top: .5em; }
.irmf-sr-only {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    min-height: 0 !important;
    padding: 0 !important;
    overflow: hidden;
    clip: rect(0,0,0,0);
    clip-path: inset(50%);
    white-space: nowrap;
}
.irmf-classic .irmf-heading { text-align: center; font: inherit; font-size: 1.5em; color: #5b57a6; }
.irmf-classic .irmf-status { margin: 0; }
.irmf-classic .irmf-status:not(:empty) { padding: 0 1.5em 1em; }
.irmf-form:is(.irmf-classic-5, .irmf-classic-6) {
    width: 330px;
    --irmf-button: #6199ed;
    --irmf-hover: #5586d0;
    color: #999;
    font-family: Merriweather, Georgia, serif;
    font-size: 16.8px;
}
.irmf-label-floating .irmf-field :is(input:not([type=checkbox]), textarea, select) { border-width: 0 0 1px; border-radius: 0; background: transparent; box-shadow: none; padding-inline: 2px; }
.irmf-label-floating .irmf-field textarea { height: 2.5em; min-height: 0; }
.irmf-label-floating .irmf-submit { text-align: right; }
.irmf-form.irmf-classic-7 { width: 100%; padding: 25px 15px; border-radius: 10px; --irmf-background: #6b68af; --irmf-button: #f70047; --irmf-hover: #d9003e; }
.irmf-classic-7 .irmf-heading { width: 100%; margin-bottom: 20px; font-size: 1.4em; color: #fff; }
.irmf-classic-7 .irmf-fields { display: flex; flex-wrap: wrap; justify-content: center; align-items: end; gap: 0 20px; padding: 0; }
.irmf-classic-7 .irmf-field, .irmf-classic-7 .irmf-submit { flex: 0 1 30%; margin-bottom: 0; text-align: center; }
.irmf-classic-7 .irmf-submit button { width: 100%; height: 40px; }
.irmf-classic-7 .irmf-field label { color: #fff; }
@media (max-width: 480px) {
    .irmf-classic-7 .irmf-field, .irmf-classic-7 .irmf-submit { flex-basis: 100%; margin-bottom: .75em; }
}

/* Пользовательское оформление версии строится из таблицы настроек в appearance.php
   и подключается после этого файла встроенным стилем (irmf_design_css). */
