/* =============================================================
   COMPONENT / FIELDSETS
   
   Fieldset'ы, которые используются в разных местах проекта:
   - .check-list — простой чек-лист
   - .bulletin — форма с вертикальными полями
   - .has-legend — fieldset с заголовком-легендой
   - .dashed — с пунктирной рамкой
   ============================================================= */

/* ---------------------------------------------------------
   CHECK-LIST — простой грид без рамки
   --------------------------------------------------------- */

fieldset.check-list {
    position: relative;
    display: grid;
    border: none;
    padding: var(--space-5);
    margin: 0;
}

/* ---------------------------------------------------------
   BULLETIN — вертикальная форма
   Подпись сверху, поле снизу, всё на всю ширину.
   --------------------------------------------------------- */

fieldset.bulletin {
    position: relative;
    display: grid;
    align-content: start;
    gap: var(--space-5);
    border: none;
    padding: 0;
}

label.bulletin {
    display: block;
}

label.bulletin>span {
    display: block;
    font-size: smaller;
    line-height: 16px;
    margin-bottom: var(--space-2);
}

label.bulletin :is(select,
    input:not([type="file"], [type="checkbox"], [type="radio"]),
    textarea) {
    width: 100%;
    height: 36px;
    border: none;
    border-radius: 0;
}

/* ---------------------------------------------------------
   HAS-LEGEND — fieldset с заголовком-легендой сверху
   --------------------------------------------------------- */

fieldset.has-legend {
    padding: 40px var(--space-5) var(--space-5);
}

fieldset.has-legend legend {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    color: var(--text-primary);
    font-size: var(--fs-sm);
    font-weight: var(--fw-medium);
    padding: 10px var(--space-5) 3px;
}

/* ---------------------------------------------------------
   DASHED — пунктирная рамка
   --------------------------------------------------------- */

fieldset.dashed {
    border: 1px dashed var(--border-default);
}