/* Стройка в новом виде: kalkulyator-gipsokartona, kalkulyator-laminata, kalkulyator-oboev, kalkulyator-plitki, kalkulyator-rashoda-kraski */
/* Файл подключается после rd-geometriya.css и раньше calc.css, redesign.css и rd.css, поэтому селекторы начинаются с .rd #simple-calc */

/* Группы полей, которые JS показывает и прячет: внутри свой шаг между полями */
.rd #simple-calc :is([id^="grp-"], [id^="row-"], [id="adv-box"]):not(.custom-select, .form-group) > * + * { margin-top: 18px; }
.rd #simple-calc [id="row-dim"] { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; }
.rd #simple-calc [id="row-dim"] > * + * { margin-top: 0; }
.rd #simple-calc [id="fg-height"] { flex-direction: column; align-items: stretch; }
/* Подпись списка ниже подписи поля: ряд «список + поле» выравниваем по низу */
.rd #simple-calc .form-group__wrapper:has(> .custom-select) { align-items: end; }
.rd #simple-calc .krs-subhead { display: block; margin: 0 0 -8px; font: 400 11px/1.3 var(--f-mono); letter-spacing: 1px; text-transform: uppercase; color: var(--mute); }

/* Флажки */
.rd #simple-calc :is(.gk-check, .plt-check, .krs-check) { display: flex; align-items: center; gap: 10px; margin: 0; padding: 0; font: 400 14px/1.4 var(--f-ui); letter-spacing: 0; text-transform: none; color: var(--ink); cursor: pointer; }
.rd #simple-calc :is(.gk-check, .plt-check, .krs-check) input { -webkit-appearance: auto; appearance: auto; flex: none; width: 18px; height: 18px; min-height: 0; margin: 0; padding: 0; accent-color: var(--accent); cursor: pointer; }
.rd #simple-calc .gk-check-group { display: block; margin: 0; padding: 0; }
.rd #simple-calc .krs-toggles { display: flex; flex-direction: column; gap: 12px; margin: 0; padding: 0; }

/* Кнопки «Дополнительно» и «Цены и фасовка» */
.rd #simple-calc :is(.gk-adv-toggle, .lam-adv-toggle, .plt-adv-toggle, .krs-adv-toggle, .oboi-adv-toggle) { display: flex; align-items: center; justify-content: center; box-sizing: border-box; width: 100%; min-height: 46px; height: auto; margin: 0; padding: 10px 16px; border: 1px dashed var(--accent-mid); border-radius: 14px; background: transparent; box-shadow: none; font: 500 14px/1.3 var(--f-ui); letter-spacing: 0; text-transform: none; color: var(--accent); text-align: center; white-space: normal; cursor: pointer; transition: background-color .15s; }
.rd #simple-calc :is(.gk-adv-toggle, .lam-adv-toggle, .plt-adv-toggle, .krs-adv-toggle, .oboi-adv-toggle):hover { background: var(--accent-soft); }
.rd #simple-calc :is(.gk-adv-toggle, .lam-adv-toggle, .plt-adv-toggle, .krs-adv-toggle, .oboi-adv-toggle):focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

/* Ошибки: JS ставит display: block с текстом и none без него */
.rd #simple-calc :is(.gk-error, .lam-error, .plt-error, .krs-error, .oboi-error) { display: none; margin: 0; padding: 12px 16px; border: 0; border-radius: 14px; background: var(--bad-soft); font: 500 14px/1.45 var(--f-ui); color: var(--bad); text-align: left; }

/* Главная цифра и подпись под ней */
.rd #simple-calc :is(.gk-main-val, .lam-main-val, .plt-main-val, .krs-main-val, .oboi-main-val) { display: block; margin: 0; font: 600 28px/1.2 var(--f-ui); letter-spacing: -.3px; color: var(--ink); }
.rd #simple-calc .krs-main-kg { font: 400 16px/1.2 var(--f-ui); letter-spacing: 0; color: var(--mute); }
.rd #simple-calc :is(.gk-main-sub, .lam-main-sub, .plt-main-sub, .krs-main-sub, .oboi-main-sub) { display: block; margin: 6px 0 0; font: 400 14px/1.5 var(--f-ui); letter-spacing: 0; color: var(--mute); }
.rd #simple-calc :is(.gk-main-sub, .lam-main-sub, .plt-main-sub, .krs-main-sub, .oboi-main-sub):empty { display: none; }
.rd #simple-calc [id="oboi-main"] { margin: 0; font: 400 14px/1.45 var(--f-ui); letter-spacing: 0; color: var(--ink); }
.rd #simple-calc [id="oboi-main"] .oboi-main-sub + .oboi-row { margin-top: 12px; }

/* Строки результата, сметы и итогов */
.rd #simple-calc :is(.gk-row, .lam-row, .plt-row, .krs-row, .oboi-row) { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; margin: 0; padding: 8px 0; border-top: 1px solid var(--line); font: 400 14px/1.45 var(--f-ui); color: var(--ink); }
.rd #simple-calc :is(.gk-row, .lam-row, .plt-row, .krs-row, .oboi-row):first-child,
.rd #simple-calc :is(.gk-subhead, .plt-subhead, .krs-subhead) + :is(.gk-row, .plt-row, .krs-row) { border-top: 0; }
.rd #simple-calc :is(.gk-row, .lam-row, .plt-row, .krs-row, .oboi-row) > span { flex: 1 1 auto; min-width: 0; color: var(--mute); }
.rd #simple-calc :is(.gk-row, .lam-row, .plt-row, .krs-row, .oboi-row) > b { flex: 0 0 auto; min-width: 0; max-width: 60%; font-weight: 600; text-align: right; overflow-wrap: break-word; text-wrap: balance; }
.rd #simple-calc [id="res-extra"] :is(.gk-subhead, .plt-subhead, .krs-subhead),
.rd #simple-calc :is(.gk-est-total, .plt-est-total) :is(.gk-subhead, .plt-subhead) { display: block; margin: 16px 0 4px; font: 400 11px/1.3 var(--f-mono); letter-spacing: 1px; text-transform: uppercase; color: var(--mute); }
.rd #simple-calc [id="res-extra"] :is(.gk-subhead, .plt-subhead, .krs-subhead):first-child { margin-top: 0; }

/* Схема раскладки */
.rd #simple-calc :is([id="gk-visual"], [id="lam-visual"], [id="plt-visual"]) { margin: 16px 0 0; }
.rd #simple-calc :is(.gk-scheme-svg, .lam-scheme-svg, .plt-scheme-svg) { display: block; box-sizing: border-box; width: 100%; max-width: 360px; height: auto; border: 1px solid var(--line); border-radius: 14px; background: #fff; }
.rd #simple-calc .gk-scheme-svg .gk-face { fill: var(--tile); stroke: none; }
.rd #simple-calc .gk-scheme-svg .gk-joint { stroke: var(--mute); stroke-width: 1; stroke-dasharray: 3 3; opacity: .5; }
.rd #simple-calc .gk-scheme-svg .gk-stud { stroke: var(--accent); stroke-width: 1.6; }
.rd #simple-calc .gk-scheme-svg .gk-hanger { fill: var(--bad); }
.rd #simple-calc :is(.lam-scheme-svg .lam-pl, .plt-scheme-svg .plt-pl) { fill: #EEF0F2; stroke: #fff; }
.rd #simple-calc :is(.lam-scheme-svg .lam-pl, .plt-scheme-svg .plt-pl).is-cut { fill: var(--accent-soft); }
.rd #simple-calc :is(.gk-legend, .lam-legend, .plt-legend) { display: flex; flex-wrap: wrap; gap: 6px 16px; margin: 10px 0 0; font: 400 12px/1.4 var(--f-ui); color: var(--mute); }
.rd #simple-calc :is(.gk-legend, .lam-legend, .plt-legend) > span { display: inline-flex; align-items: center; gap: 6px; }
.rd #simple-calc :is(.gk-dot, .lam-dot, .plt-dot) { display: inline-block; flex: none; box-sizing: border-box; width: 12px; height: 12px; border: 1px solid var(--line); border-radius: 3px; background: #EEF0F2; }
.rd #simple-calc :is(.lam-dot, .plt-dot).is-cut { border-color: var(--accent-mid); background: var(--accent-soft); }
.rd #simple-calc .gk-dot-stud { border-color: var(--accent); background: var(--accent); }
.rd #simple-calc .gk-dot-joint { border: 1px dashed var(--mute); background: #fff; }
.rd #simple-calc .gk-dot-hang { border-color: var(--bad); border-radius: 50%; background: var(--bad); }
.rd #simple-calc :is(.gk-scheme-note, .lam-scheme-note, .plt-scheme-note) { margin: 8px 0 0; font: 400 13px/1.5 var(--f-ui); color: var(--mute); }

/* Чипы: главный тёмный, опасный красный */
.rd #simple-calc :is(.gk-chip-primary, .plt-chip-primary, .krs-chip-primary) { background: var(--ink); color: #fff; }
.rd #simple-calc :is(.gk-chip-primary, .plt-chip-primary, .krs-chip-primary):hover { background: var(--ink); opacity: .85; }
.rd #simple-calc :is(.gk-chip-danger, .plt-chip-danger, .krs-chip-danger) { background: var(--bad-soft); color: var(--bad); }
.rd #simple-calc :is(.gk-chip-danger, .plt-chip-danger, .krs-chip-danger):hover { background: var(--bad-soft); box-shadow: inset 0 0 0 1px var(--bad); }
.rd #simple-calc :is(.gk-result-actions, .plt-result-actions, .krs-result-actions, .gk-est-actions, .plt-est-actions, .krs-est-actions, .krs-surf-btns) { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0; padding: 0; }
.rd #simple-calc :is(.gk-result-actions, .plt-result-actions, .krs-result-actions, .gk-est-actions, .plt-est-actions, .krs-est-actions) { margin-top: 16px; }
.rd #simple-calc :is(.gk-result-actions, .plt-result-actions, .krs-result-actions) #copy-btn { margin-top: 0; }

/* Обои: подробный расчёт */
.rd #simple-calc [id="oboi-toggle"] { margin-top: 16px; }
.rd #simple-calc .oboi-details { margin: 16px 0 0; padding: 20px; border: 1px solid var(--line); border-radius: 16px; background: transparent; }
.rd #simple-calc .oboi-sub { margin: 0 0 8px; font: 400 11px/1.3 var(--f-mono); letter-spacing: 1px; text-transform: uppercase; color: var(--mute); }
.rd #simple-calc .oboi-step { display: block; margin: 0 0 8px; font: 400 14px/1.6 var(--f-ui); color: var(--ink); }
.rd #simple-calc .oboi-note-txt { margin: 12px 0 0; font: 400 13px/1.5 var(--f-ui); color: var(--mute); }

/* Краска: примеры и список площадей */
.rd #simple-calc .krs-presets { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0; padding: 0; }
.rd #simple-calc .krs-presets-label { flex: 0 0 100%; font: 400 11px/1.3 var(--f-mono); letter-spacing: 1px; text-transform: uppercase; color: var(--mute); }
.rd #simple-calc .krs-surf-item { display: flex; align-items: center; gap: 10px; padding: 8px 0; border-top: 1px solid var(--line); font: 400 14px/1.45 var(--f-ui); color: var(--ink); }
.rd #simple-calc .krs-surf-item:first-child { border-top: 0; }
.rd #simple-calc .krs-surf-name { flex: 1 1 auto; min-width: 0; color: var(--mute); }
.rd #simple-calc .krs-surf-item > b { font-weight: 600; white-space: nowrap; }
.rd #simple-calc .krs-surf-total { display: flex; justify-content: space-between; gap: 16px; padding: 10px 0 0; border-top: 1px solid var(--ink); font: 600 14px/1.45 var(--f-ui); color: var(--ink); }
.rd #simple-calc .krs-empty { font: 400 13px/1.5 var(--f-ui); color: var(--mute); }

/* Смета: отдельная плашка под калькулятором */
.rd #simple-calc :is(.gk-estimate, .plt-estimate, .krs-estimate) { box-sizing: border-box; margin: 20px 0 0; padding: 28px; border: 0; border-radius: 20px; background: var(--tile); font: 400 14px/1.45 var(--f-ui); color: var(--ink); }
.rd #simple-calc :is(.gk-smeta-tabs, .plt-smeta-tabs) { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 16px; }
.rd #simple-calc :is(.gk-smeta-tab, .plt-smeta-tab, .gk-smeta-new, .plt-smeta-new) { display: inline-flex; align-items: center; gap: 6px; box-sizing: border-box; height: 34px; padding: 0 14px; border: 0; border-radius: 999px; background: var(--pill); font: 500 13px/1.2 var(--f-ui); color: var(--ink); white-space: nowrap; cursor: pointer; transition: background-color .15s; }
/* Длинное название сметы переносится внутри вкладки */
.rd #simple-calc :is(.gk-smeta-tab, .plt-smeta-tab) { height: auto; min-height: 34px; max-width: 100%; padding-top: 7px; padding-bottom: 7px; white-space: normal; text-align: left; overflow-wrap: break-word; }
.rd #simple-calc :is(.gk-smeta-tab, .plt-smeta-tab):hover { background: var(--accent-soft); }
.rd #simple-calc :is(.gk-smeta-tab, .plt-smeta-tab).is-active { background: var(--ink); color: #fff; }
/* число позиций — отдельный бейдж, иначе «Смета 1 1» читается как «Смета 11» */
.rd #simple-calc :is(.gk-smeta-tab, .plt-smeta-tab) em { display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box; min-width: 20px; height: 20px; padding: 0 6px; border-radius: 999px; background: rgba(0, 0, 0, .08); font: normal 600 11px/1 var(--f-mono); color: inherit; }
.rd #simple-calc :is(.gk-smeta-tab, .plt-smeta-tab).is-active em { background: rgba(255, 255, 255, .22); }
.rd #simple-calc :is(.gk-smeta-del, .plt-smeta-del) { margin-left: 2px; font-size: 11px; opacity: .6; }
.rd #simple-calc :is(.gk-smeta-del, .plt-smeta-del):hover { opacity: 1; }
.rd #simple-calc :is(.gk-smeta-new, .plt-smeta-new) { border: 1px dashed var(--accent-mid); background: transparent; color: var(--accent); }
.rd #simple-calc :is(.gk-smeta-new, .plt-smeta-new):hover { background: var(--accent-soft); }
.rd #simple-calc :is(.gk-est-namerow, .plt-est-namerow) { margin: 0 0 16px; }
.rd #simple-calc :is(.gk-est-namelabel, .plt-est-namelabel) { display: block; margin: 0 0 8px; padding: 0; font: 500 13px/1.35 var(--f-ui); letter-spacing: 0; text-transform: none; color: var(--ink); opacity: 1; }
.rd #simple-calc :is(.gk-est-name-input, .plt-est-name-input) { display: block; box-sizing: border-box; width: 100%; height: 48px; min-height: 48px; margin: 0; padding: 0 16px; border: 1px solid var(--line); border-radius: 14px; background: #fff; box-shadow: none; outline: none; font: 500 16px/1.2 var(--f-ui); color: var(--ink); }
.rd #simple-calc :is(.gk-est-name-input, .plt-est-name-input)::placeholder { color: var(--mute); opacity: .7; }
.rd #simple-calc :is(.gk-est-name-input, .plt-est-name-input):focus { border-color: var(--accent); }
.rd #simple-calc :is(.gk-est-head, .plt-est-head) { margin: 0; }
.rd #simple-calc :is(.gk-est-list, .plt-est-list, .krs-est-list) { margin: 4px 0 16px; }
.rd #simple-calc :is(.gk-est-item, .plt-est-item, .krs-est-item) { display: flex; align-items: center; gap: 12px; padding: 10px 0; border-top: 1px solid var(--line); font: 400 14px/1.45 var(--f-ui); color: var(--ink); }
.rd #simple-calc :is(.gk-est-item, .plt-est-item, .krs-est-item):first-child { border-top: 0; }
.rd #simple-calc :is(.gk-est-name, .plt-est-name, .krs-est-name) { flex: 1 1 auto; min-width: 0; overflow-wrap: break-word; }
.rd #simple-calc :is(.gk-est-name, .plt-est-name, .krs-est-name) em { font-style: normal; color: var(--mute); }
.rd #simple-calc .krs-est-item > b { font-weight: 600; white-space: nowrap; }
.rd #simple-calc :is(.gk-est-btns, .plt-est-btns) { display: inline-flex; gap: 6px; flex: none; }
.rd #simple-calc :is(.gk-est-edit, .plt-est-edit, .gk-est-del, .plt-est-del, .krs-del) { display: inline-flex; align-items: center; justify-content: center; flex: none; box-sizing: border-box; width: 32px; height: 32px; min-width: 0; margin: 0; padding: 0; border: 0; border-radius: 999px; background: var(--pill); box-shadow: none; font: 500 14px/1 var(--f-ui); cursor: pointer; transition: background-color .15s; }
.rd #simple-calc :is(.gk-est-edit, .plt-est-edit) { color: var(--accent); }
.rd #simple-calc :is(.gk-est-edit, .plt-est-edit):hover { background: var(--accent-soft); }
.rd #simple-calc :is(.gk-est-del, .plt-est-del, .krs-del) { color: var(--bad); }
.rd #simple-calc :is(.gk-est-del, .plt-est-del, .krs-del):hover { background: var(--bad-soft); }
.rd #simple-calc :is(.gk-est-item, .plt-est-item).is-editing { margin: 2px 0; padding: 10px 12px; border-top-color: transparent; border-radius: 12px; background: var(--accent-soft); }
.rd #simple-calc :is(.gk-est-item, .plt-est-item).is-editing + :is(.gk-est-item, .plt-est-item) { border-top-color: transparent; }
.rd #simple-calc :is(.gk-edit-note, .plt-edit-note) { margin: 0 0 12px; padding: 10px 14px; border-radius: 12px; background: var(--accent-soft); font: 400 13px/1.5 var(--f-ui); color: var(--accent); }
.rd #simple-calc :is(.gk-est-link, .plt-est-link) { color: var(--accent); text-decoration: underline; cursor: pointer; }
.rd #simple-calc :is(.gk-est-empty, .plt-est-empty) { font: 400 14px/1.5 var(--f-ui); color: var(--mute); }
.rd #simple-calc :is(.gk-est-total, .plt-est-total, .krs-est-total) { margin: 16px 0 0; padding: 16px 0 0; border-top: 1px solid var(--ink); }
.rd #simple-calc .krs-est-total { padding-top: 8px; }
.rd #simple-calc :is(.gk-est-total, .plt-est-total) > .label-text { margin-bottom: 4px; }
.rd #simple-calc :is(.gk-sum, .plt-sum) { display: block; font: 600 13px/1.4 var(--f-ui); color: var(--mute); white-space: nowrap; }
.rd #simple-calc :is(.gk-buy, .plt-buy) { display: block; font: 500 12px/1.4 var(--f-ui); color: var(--accent); white-space: nowrap; }
.rd #simple-calc :is(.gk-budget, .plt-budget) > b { flex: none; white-space: nowrap; }
.rd #simple-calc :is(.gk-budget, .plt-budget) { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; margin: 12px 0 0; padding: 12px 0 0; border-top: 1px solid var(--ink); font: 600 15px/1.4 var(--f-ui); color: var(--ink); }

/* Смета: цены и фасовка */
.rd #simple-calc :is(.gk-settings, .plt-settings) { margin: 12px 0 0; padding: 16px; border: 1px solid var(--line); border-radius: 16px; background: #fff; container-type: inline-size; }
.rd #simple-calc :is(.gk-set-toggles, .plt-set-toggles) { display: flex; flex-wrap: wrap; gap: 8px 20px; margin: 0 0 12px; }
.rd #simple-calc :is(.gk-set-h, .plt-set-h, .gk-set-row, .plt-set-row) { display: grid; grid-template-columns: minmax(0, 1fr) 72px 88px; gap: 8px; align-items: center; }
.rd #simple-calc :is(.gk-set-h, .plt-set-h) { padding: 0 0 6px; font: 400 10px/1.3 var(--f-mono); letter-spacing: 1px; text-transform: uppercase; color: var(--mute); }
.rd #simple-calc :is(.gk-set-h, .plt-set-h) > span + span { text-align: right; }
.rd #simple-calc :is(.gk-set-row, .plt-set-row) { padding: 6px 0; border-top: 1px solid var(--line); }
.rd #simple-calc :is(.gk-set-name, .plt-set-name) { font: 400 13px/1.35 var(--f-ui); color: var(--ink); overflow-wrap: break-word; }
.rd #simple-calc :is(.gk-set-inp, .plt-set-inp) { display: block; box-sizing: border-box; width: 100%; height: 38px; min-height: 0; margin: 0; padding: 0 10px; border: 1px solid var(--line); border-radius: 10px; background: var(--tile); box-shadow: none; outline: none; font: 500 14px/1.2 var(--f-ui); color: var(--ink); text-align: right; }
.rd #simple-calc :is(.gk-set-inp, .plt-set-inp):focus { border-color: var(--accent); }
.rd #simple-calc .plt-set-nopack { font: 400 12px/1.3 var(--f-ui); color: var(--mute); text-align: right; }
/* На узкой плашке название встаёт над полями, поля делят строку пополам */
@container (max-width: 340px) {
    .rd #simple-calc :is(.gk-set-h, .plt-set-h, .gk-set-row, .plt-set-row) { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); row-gap: 6px; }
    .rd #simple-calc :is(.gk-set-h, .plt-set-h, .gk-set-row, .plt-set-row) > :first-child { grid-column: 1 / -1; }
    .rd #simple-calc :is(.gk-set-h, .plt-set-h) > span + span { text-align: left; }
    .rd #simple-calc :is(.gk-set-inp, .plt-set-inp) { text-align: left; }
    .rd #simple-calc .plt-set-nopack { text-align: left; }
}

/* Статья: примечания и текстовые формулы */
html body.rd :is(.gk-note, .plt-note) { font: 400 14px/1.55 var(--f-ui); color: var(--mute); }
html body.rd :is(.plt-formula, .krs-formula) { box-sizing: border-box; margin: 24px 0; padding: 16px 20px; border-radius: 16px; background: var(--tile); font: 500 16px/1.6 var(--f-mono); color: var(--ink); text-align: left; overflow-x: auto; }
html body.rd .krs-formula sub { font-size: .7em; }

/* Смета краски на самом узком экране: длинная марка краски помещается без разрыва слова */
@media (max-width: 359px) {
    .rd #simple-calc .krs-est-item { gap: 8px; }
    .rd #simple-calc .krs-est-name { font-size: 13px; }
}

@media (max-width: 639px) {
    .rd #simple-calc [id="row-dim"] { grid-template-columns: minmax(0, 1fr); gap: 12px; }
    .rd #simple-calc :is(.gk-main-val, .lam-main-val, .plt-main-val, .krs-main-val, .oboi-main-val) { font-size: 22px; }
    .rd #simple-calc .oboi-details { padding: 16px; }
    .rd #simple-calc :is(.gk-estimate, .plt-estimate, .krs-estimate) { padding: 18px 16px; }
    html body.rd :is(.plt-formula, .krs-formula) { padding: 14px 16px; font-size: 14px; }
}

@media print {
    .rd #simple-calc :is(.gk-result-actions, .plt-result-actions, .krs-result-actions, .gk-est-actions, .plt-est-actions, .krs-est-actions, .krs-presets, .krs-surf-btns, .gk-adv-toggle, .lam-adv-toggle, .plt-adv-toggle, .krs-adv-toggle, .oboi-adv-toggle, .gk-est-btns, .plt-est-btns, .krs-del, .gk-smeta-new, .plt-smeta-new) { display: none; }
}

@media (prefers-reduced-motion: reduce) {
    .rd #simple-calc :is(.gk-adv-toggle, .lam-adv-toggle, .plt-adv-toggle, .krs-adv-toggle, .oboi-adv-toggle, .gk-smeta-tab, .plt-smeta-tab, .gk-smeta-new, .plt-smeta-new, .gk-est-edit, .plt-est-edit, .gk-est-del, .plt-est-del, .krs-del) { transition: none; }
}