/* ===== main_v3 calculator v2 (mockup 5a/5b/5c) ===== */
.calc2-mode-toggle { display:flex; gap:8px; width:100%; margin:0 0 28px; background:var(--color-bg-primary); border-radius:16px; padding:6px; box-sizing:border-box; }
.calc2-mode-toggle__btn { flex:1 1 50%; min-width:0; border:none; background:transparent; border-radius:12px; height:52px; cursor:pointer; color:var(--color-text-muted); display:flex; align-items:center; justify-content:center; transition:background .18s ease, color .18s ease, box-shadow .18s ease; }
.calc2-mode-toggle__btn.is-active { background:#fff; color:var(--color-accent-primary); box-shadow:0 4px 14px -4px rgba(20,34,66,.25); }
.calc2 { background:#fff; border-radius:24px; padding:44px; box-shadow:0 26px 60px -28px rgba(20,34,66,.28); box-sizing:border-box; }
.calc2__wrapper { display:grid; grid-template-columns:1fr 1fr; gap:56px; }
/* min-width:0 overrides the grid item's default min-width:auto — without it,
   a 1fr track can't shrink below its content's intrinsic width (e.g. a long
   service name in the select header), and the whole calculator overflows the
   page horizontally on narrow/mobile viewports. */
.calc2__col { display:flex; flex-direction:column; gap:26px; min-width:0; }
.calc2__col--right { gap:26px; }
.calc2-group > * { min-width:0; }
/* align the first row across columns (Социальная сеть ↔ Тип услуги): equalize
   the first group height so social tiles (56px) and type pills (48px) don't desync */
.calc2__col > .calc2-group:first-child { min-height:86px; }
/* left/right columns keep a consistent 26/22px vertical rhythm between groups,
   including the JS-filled containers that hold multiple groups (mockup parity) */
#calc2-inputs { display:flex; flex-direction:column; gap:26px; }
#calc2-inputs:empty { display:none; }
/* list mode's service select (left column, under Социальная сеть); empty in
   "Умный подбор" mode, so it must not eat a flex-gap slot there */
#calc2-service-list:empty { display:none; }
.calc2__label { color:#9aa4b3; letter-spacing:.06em; margin-bottom:14px; }
.calc2 .calc2__label { font-size:12px; font-weight:600; line-height:1.3; }

/* ── <=1024px: Социальная сеть / Тип услуги collapse into a pair of icon
   selects (calc2-mobile-picks), single-column layout; desktop tile/pill
   grids inside calc2-left/right are hidden instead of removed, so the JS
   render functions for both stay unconditional (no resize listeners needed) ── */
.calc2-mobile-picks { display:none; }
@media (max-width: 1024px) {
  .calc2 { padding:28px; }
  .calc2__wrapper { grid-template-columns:1fr; gap:34px; }
  .calc2-mobile-picks { display:flex; flex-direction:column; gap:26px; margin-bottom:34px; }
  #calc2-left > .calc2-group:first-child,
  #calc2-right > .calc2-group:first-child { display:none; }
}

.calc2-social__list { display:flex; gap:14px; flex-wrap:wrap; }
.calc2-social__list--grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(52px,1fr)); gap:12px; }
.calc2-social-tile { position:relative; width:56px; height:56px; border-radius:16px; border:1px solid #E1E5EC; background:#fff; display:flex; align-items:center; justify-content:center; cursor:pointer; flex-shrink:0; }
.calc2-social__list--grid .calc2-social-tile { width:52px; height:52px; border-radius:14px; }
.calc2-social-tile.is-active { border:2px solid var(--color-accent-primary); background:var(--color-bg-secondary); }
.calc2-social-tile img { width:30px; height:30px; border-radius:6px; }
.calc2-social__list--grid .calc2-social-tile img { width:28px; height:28px; }
.calc2-social-tile__check { position:absolute; top:-7px; right:-7px; width:20px; height:20px; border-radius:50%; background:var(--color-accent-primary); color:#fff; display:flex; align-items:center; justify-content:center; border:2px solid #fff; }
/* fill:none — same fix as .calc2-feed__check-ico/.calc2-terms__icon: without it
   the checkmark's stroke path gets filled solid by the global `svg { fill:
   currentColor }` rule and renders as a malformed sliver instead of a check. */
.calc2-social-tile__check-ico { fill:none; }
.calc2-social__fallback { font-weight:700; color:var(--color-accent-primary); }
.calc2-type__list { display:flex; gap:10px; flex-wrap:wrap; }
.calc2-type__list--wrap { flex-wrap:wrap; }
.calc2-type-pill { flex:1 1 120px; min-height:48px; padding:0 16px; border-radius:12px; border:1px solid #E1E5EC; background:#fff; color:var(--color-text-secondary); display:flex; align-items:center; justify-content:center; gap:8px; cursor:pointer; }
.calc2-type__list--wrap .calc2-type-pill { flex:0 0 auto; min-height:44px; border-radius:11px; }
.calc2-type-pill.is-active { border:1.5px solid var(--color-accent-primary); background:var(--color-bg-secondary); color:var(--color-accent-primary); }
.calc2 .calc2-type-pill { font-size:14px; font-weight:500; line-height:1.2; }
.calc2 .calc2-type-pill span { font-size:14px; }
.calc2 .calc2-type-pill.is-active { font-weight:600; }
.calc2 .calc2-type__list--wrap .calc2-type-pill span { font-size:13px; }

/* ── Task 4: list-mode left inputs (link/quantity/drip), service list, 5a summary ── */
.calc2-field { position:relative; }
.calc2-input { width:100%; min-height:56px; padding:0 18px; border:1px solid #E1E5EC; border-radius:14px; background:var(--color-bg-input,#fff); font-family:inherit; font-size:14px; color:inherit; outline:none; box-sizing:border-box; transition:border-color .15s ease; }
.calc2-input:focus { border-color:var(--color-accent-primary); }
textarea.calc2-input { padding:14px 18px; line-height:1.4; resize:vertical; }
.calc2-link-add { margin-top:10px; color:var(--color-accent-primary); cursor:pointer; display:inline-block; }
.calc2 .calc2-input { font-size:15px; }
.calc2 .calc2-link-add { font-size:14px; font-weight:600; margin-top:12px; }

.calc2-qty { display:flex; align-items:center; justify-content:space-between; height:64px; padding:0 14px; border:1px solid #E1E5EC; border-radius:14px; background:#fff; box-sizing:border-box; }
.calc2-qty__val { color:var(--color-text-primary); }
.calc2-qty__ctrls { display:flex; align-items:center; gap:8px; flex-shrink:0; }
.calc2-qty__btn { width:38px; height:38px; flex-shrink:0; display:flex; align-items:center; justify-content:center; border-radius:10px; border:1px solid var(--color-accent-primary); background:var(--color-accent-primary); color:var(--color-text-inverse); cursor:pointer; font-size:18px; line-height:1; transition:filter .1s; }
.calc2-qty__btn--minus { background:var(--color-bg-primary); border-color:var(--color-bg-primary); color:var(--color-accent-primary); }
.calc2-qty__btn:hover { filter:brightness(1.06); }
.calc2 .calc2-qty__val { font-size:22px; font-weight:700; }

.calc2-feed { display:flex; align-items:flex-start; gap:14px; cursor:pointer; }
.calc2-feed__check { position:relative; width:26px; height:26px; flex-shrink:0; border-radius:50%; border:2px solid #C6D2E2; background:transparent; display:flex; align-items:center; justify-content:center; color:#fff; transition:background .2s ease, border-color .2s ease; }
/* fill:none — see .calc2-terms__icon above; without it the checkmark's stroke
   path gets filled solid by the global `svg { fill: currentColor }` rule and
   renders as an off-center blob instead of a check mark. */
.calc2-feed__check-ico { opacity:0; transform:scale(.4); transition:opacity .2s ease, transform .2s ease; fill:none; }
/* solid fill, not the gradient — at 26px the gradient's light end (#6CB0FF)
   reads as an unfilled/half-painted circle instead of a solid checked state */
.calc2-feed__check.is-on { background:var(--color-accent-primary); border-color:transparent; }
.calc2-feed__check.is-on .calc2-feed__check-ico { opacity:1; transform:scale(1); }
.calc2-feed__desc { display:block; color:Hsla(var(--color-text-primary-hsl),.4); margin-top:4px; }
.calc2 .calc2-feed__txt > .ui-text:first-child { font-size:16px; font-weight:700; }
.calc2 .calc2-feed__desc { font-size:13px; }

/* service select-with-search (right column, list mode) */
.calc2-select-svc { position:relative; }
.calc2-select-svc__header { width:100%; display:flex; align-items:center; justify-content:space-between; gap:12px; height:64px; padding:0 18px; background:#fff; border:1px solid var(--color-accent-primary); border-radius:14px; cursor:pointer; text-align:left; box-sizing:border-box; }
.calc2-select-svc__info { display:flex; flex-direction:column; gap:2px; min-width:0; }
.calc2-select-svc__name { color:var(--color-text-primary); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.calc2-select-svc__rate { color:var(--color-text-muted); }
.calc2-select-svc__chevron { width:18px; height:18px; color:var(--color-accent-primary); flex-shrink:0; transition:transform .15s; }
.calc2-select-svc__header[aria-expanded="true"] .calc2-select-svc__chevron { transform:rotate(180deg); }
.calc2-select-svc__panel { position:absolute; z-index:20; left:0; right:0; top:calc(100% + 8px); background:#fff; border:1px solid #E1E5EC; border-radius:14px; box-shadow:0 18px 40px -16px rgba(20,34,66,.28); padding:10px; box-sizing:border-box; }
.calc2-select-svc__search { padding:4px 4px 10px; }
.calc2-select-svc__search-input { width:100%; height:44px; padding:0 14px; border:1px solid #E1E5EC; border-radius:10px; outline:none; box-sizing:border-box; font-family:inherit; color:var(--color-text-secondary); }
.calc2-select-svc__search-input:focus { border-color:var(--color-accent-primary); }
.calc2-select-svc__list { list-style:none; margin:0; padding:0; max-height:260px; overflow-y:auto; }
.calc2-select-svc__option { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 14px; border-radius:10px; cursor:pointer; }
.calc2-select-svc__option:hover { background:var(--color-bg-primary); }
.calc2-select-svc__option.is-active { background:var(--color-bg-secondary); }
.calc2-select-svc__opt-name { color:var(--color-text-primary); min-width:0; }
.calc2-select-svc__opt-rate { color:var(--color-text-muted); flex-shrink:0; }
.calc2-select-svc__empty { padding:12px 14px; color:var(--color-text-muted); }
.calc2-select-svc__other { max-height:220px; overflow-y:auto; }
.calc2-select-svc__other:not(:empty) { border-top:1px solid var(--color-bg-secondary); margin-top:4px; padding-top:4px; }
.calc2-select-svc__group-label { padding:10px 12px 4px; color:var(--color-text-muted); text-transform:uppercase; letter-spacing:.02em; }
.calc2-select-svc__option--cross { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 14px; border-radius:10px; cursor:pointer; }
.calc2-select-svc__option--cross:hover { background:var(--color-bg-primary); }
.calc2 .calc2-select-svc__name { font-size:15px; font-weight:600; }
.calc2 .calc2-select-svc__rate { font-size:13px; }
.calc2 .calc2-select-svc__search-input { font-size:15px; }
.calc2 .calc2-select-svc__opt-name { font-size:15px; }
.calc2 .calc2-select-svc__opt-rate { font-size:13px; }
.calc2 .calc2-select-svc__empty { font-size:15px; }
.calc2 .calc2-select-svc__group-label { font-size:11px; }

/* <=1024px mobile network/type selects — same header/panel/option pattern as
   .calc2-select-svc above, minus the search box (icons instead of a rate) */
.calc2-msel { position:relative; }
.calc2-msel__header { width:100%; display:flex; align-items:center; justify-content:space-between; gap:12px; height:64px; padding:0 18px; background:#fff; border:1px solid var(--color-accent-primary); border-radius:14px; cursor:pointer; text-align:left; box-sizing:border-box; }
.calc2-msel__info { display:flex; align-items:center; gap:12px; min-width:0; }
.calc2-msel__info .ui-text { color:var(--color-text-primary); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.calc2-msel__icon-wrap { display:flex; align-items:center; justify-content:center; width:28px; height:28px; flex-shrink:0; }
.calc2-msel__icon-wrap img { width:26px; height:26px; border-radius:6px; }
.calc2-msel__icon { width:20px; height:20px; flex-shrink:0; object-fit:contain; border-radius:4px; }
.calc2-msel__chevron { width:18px; height:18px; color:var(--color-accent-primary); flex-shrink:0; transition:transform .15s; }
.calc2-msel__header[aria-expanded="true"] .calc2-msel__chevron { transform:rotate(180deg); }
.calc2-msel__panel { position:absolute; z-index:20; left:0; right:0; top:calc(100% + 8px); background:#fff; border:1px solid #E1E5EC; border-radius:14px; box-shadow:0 18px 40px -16px rgba(20,34,66,.28); padding:10px; box-sizing:border-box; max-height:320px; overflow-y:auto; }
.calc2-msel__list { list-style:none; margin:0; padding:0; }
.calc2-msel__option { display:flex; align-items:center; gap:12px; padding:12px 14px; border-radius:10px; cursor:pointer; }
.calc2-msel__option:hover { background:var(--color-bg-primary); }
.calc2-msel__option.is-active { background:var(--color-bg-secondary); }
.calc2-msel__option .ui-text { color:var(--color-text-primary); min-width:0; }
.calc2 .calc2-msel__info .ui-text { font-size:15px; font-weight:600; }
.calc2 .calc2-msel__option .ui-text { font-size:15px; font-weight:500; }

.calc2-summary { background:var(--color-bg-secondary); padding:28px; border-radius:20px; }
.calc2-summary__title { color:#9aa4b3; letter-spacing:.06em; margin-bottom:18px; }
.calc2-summary__row { display:flex; align-items:center; justify-content:space-between; color:var(--color-text-secondary); }
.calc2-summary__row:not(:first-child) { margin-top:16px; }
.calc2-summary__total { display:flex; align-items:center; justify-content:space-between; gap:12px; background:var(--gradient-primary-deep); border-radius:16px; margin-top:22px; padding:22px 24px; color:var(--color-text-inverse); box-shadow:0 16px 34px -12px rgba(3,54,206,.5); }
.calc2-summary__total-sub { opacity:.8; margin-top:4px; }
.calc2-summary__total-val { flex-shrink:0; }
.calc2-cta { display:flex; align-items:center; justify-content:center; width:100%; min-height:60px; margin-top:18px; padding:0 24px; border:none; border-radius:var(--border-radius--size-l,16px); background:var(--gradient-primary); color:var(--color-text-inverse); cursor:pointer; text-transform:uppercase; transition:filter .1s, opacity .1s; box-sizing:border-box; }
.calc2-cta:hover:not(:disabled) { filter:brightness(1.05); }
.calc2-cta:disabled { opacity:.3; cursor:default; }
#calc2-order-result { margin-top:14px; display:flex; flex-direction:column; gap:10px; }
.calc2 .calc2-summary__title { font-size:12px; font-weight:700; margin-bottom:20px; }
.calc2 .calc2-summary__row { font-size:15px; }
.calc2 .calc2-summary__row > span:last-child { font-weight:600; }
.calc2 .calc2-summary__row > span.ui-text--weight-700 { font-weight:700; }
.calc2 .calc2-summary__total > div > div:first-child { font-size:15px; font-weight:700; }
.calc2 .calc2-summary__total-sub { font-size:12px; opacity:.75; margin-top:5px; }
.calc2 .calc2-summary__total-val { font-size:34px; font-weight:700; line-height:1; }
.calc2 .calc2-summary__total--pay .calc2-summary__total-val { font-size:30px; }
.calc2 .calc2-cta { height:56px; min-height:0; border-radius:40px; margin-top:16px; box-shadow:0 12px 26px -10px rgba(3,120,255,.7); font-size:15px; font-weight:700; letter-spacing:.04em; }

/* ── Task 5: drip-feed runs/interval fields (left) + timeline (summary, 5b) ── */
.calc2-drip-fields { background:var(--color-bg-primary); border-radius:18px; padding:22px; display:grid; grid-template-columns:1fr 1fr 1fr; gap:16px; margin-top:18px; }
/* same min-width:auto grid-item overflow as .calc2__col — on narrow columns
   (mobile 3-up grid) the label+hint-icon row is wider than its 1fr track and
   pushes the whole calculator wider than the viewport without this. */
.calc2-drip-fields > div { min-width:0; }
.calc2-drip-fields__label { text-transform:uppercase; letter-spacing:.04em; color:#9aa4b3; margin-bottom:10px; }
.calc2-drip-fields__field { background:#fff; border:1px solid #E1E5EC; border-radius:12px; height:52px; display:flex; align-items:center; justify-content:space-between; padding:0 8px; }
.calc2-drip-fields__btn { width:32px; height:32px; flex-shrink:0; border:none; border-radius:8px; background:var(--color-accent-primary); color:#fff; display:flex; align-items:center; justify-content:center; cursor:pointer; }
.calc2-drip { background:#fff; border-radius:16px; padding:20px; margin-bottom:18px; }
.calc2-drip__head { display:flex; align-items:center; gap:8px; margin-bottom:16px; color:var(--color-accent-primary); }
.calc2-drip__track { position:relative; padding-top:4px; }
.calc2-drip__line { position:absolute; top:11px; left:10px; right:10px; height:2px; background:#D3DEEC; }
.calc2-drip__nodes { display:flex; justify-content:space-between; position:relative; }
.calc2-drip__node { display:flex; flex-direction:column; align-items:center; gap:7px; }
.calc2-drip__dot { width:14px; height:14px; border-radius:50%; background:var(--gradient-primary); border:3px solid #fff; box-shadow:0 0 0 1px var(--color-accent-primary); flex-shrink:0; }
.calc2-drip__time { color:var(--color-text-muted); }
.calc2 .calc2-drip-fields__label { font-size:11px; font-weight:600; }
.calc2 .calc2-drip { border-radius:16px; padding:20px; }
.calc2 .calc2-drip__head { font-size:13px; font-weight:700; }
.calc2 .calc2-drip__node > span.ui-text:not(.calc2-drip__time) { font-size:12px; font-weight:700; }
.calc2 .calc2-drip__time { font-size:11px; }

/* ── Task 6: filters mode ("Умный подбор") — pills, steppers, select ── */
.calc2-step { width:20px; height:20px; border-radius:50%; background:var(--color-accent-primary); color:#fff; display:inline-flex; align-items:center; justify-content:center; font-weight:700; margin-right:8px; }
.calc2-pills { display:flex; flex-wrap:wrap; gap:10px; }
.calc2-pill { min-height:48px; padding:0 22px; border-radius:12px; border:1px solid #E1E5EC; background:#fff; color:var(--color-text-secondary); display:flex; align-items:center; cursor:pointer; }
.calc2-pill.is-active { border:1.5px solid var(--color-accent-primary); background:var(--color-bg-secondary); color:var(--color-accent-primary); }
.calc2-pill__badge { margin-left:8px; padding:2px 8px; border-radius:8px; background:var(--color-bg-tertiary); color:var(--color-text-muted); }

/* Task 2: checkbox-cards filter step ("Умный подбор" sequencer) */
.calc2-fcards { display:flex; flex-direction:column; gap:10px; }
.calc2-fcard { display:block; cursor:pointer; }
.calc2-fcard__row { display:flex; align-items:center; justify-content:space-between; gap:10px; border-radius:14px; padding:12px 16px; width:100%; border:1px solid #E1E5EC; background:#fff; box-sizing:border-box; transition:background-color .1s, border-color .1s; }
.calc2-fcard__left { display:flex; align-items:center; gap:10px; min-width:0; }
.calc2-fcard__left img { width:50px; height:50px; border-radius:14px; flex-shrink:0; }
.calc2-fcard__info { display:flex; flex-direction:column; min-width:0; }
.calc2-fcard__title { margin-bottom:4px; }
.calc2-fcard__text { color:var(--color-text-muted); }
.calc2-fcard__right { display:flex; align-items:center; gap:8px; flex-shrink:0; }
.calc2-fcard__badge { background:var(--color-bg-tertiary); display:flex; align-items:center; justify-content:center; padding:4px 8px; min-width:45px; height:30px; border-radius:8px; box-sizing:border-box; }
.calc2-fcard__check { display:inline-flex; width:24px; height:24px; border-radius:50%; border:1px solid Hsla(var(--color-text-primary-hsl),.4); flex-shrink:0; }
.calc2-fcard.is-active .calc2-fcard__row { background:var(--color-bg-secondary); border-color:var(--color-accent-primary); }
.calc2-fcard.is-active .calc2-fcard__check { background:var(--gradient-primary); border:0; }
.calc2 .calc2-pill__badge { font-size:11px; font-weight:600; }
.calc2 .calc2-fcard__title { font-size:14px; font-weight:500; }
.calc2 .calc2-fcard__text { font-size:12px; font-weight:500; }
.calc2 .calc2-fcard__badge { font-size:11px; font-weight:500; }

.calc2-range { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.calc2-range > div { min-width:0; }
.calc2-num { background:#fff; border:1px solid #E1E5EC; border-radius:14px; height:56px; display:flex; align-items:center; justify-content:space-between; padding:0 12px; }
.calc2-num__btn { width:34px; height:34px; flex-shrink:0; border:none; border-radius:9px; background:var(--color-accent-primary); color:#fff; display:flex; align-items:center; justify-content:center; cursor:pointer; }
.calc2-select { background:#fff; border:1px solid #E1E5EC; border-radius:14px; height:56px; width:100%; padding:0 18px; }
.calc2-hint { color:var(--color-text-muted); margin-top:10px; }
.calc2 .calc2-step { font-size:11px; font-weight:700; }
.calc2 .calc2-pill { font-size:14px; }
.calc2 .calc2-pill span { font-size:14px; }
.calc2 .calc2-range .calc2-num > span.ui-text { font-size:17px; font-weight:700; }
.calc2 .calc2-range .calc2__label { font-size:11px; font-weight:400; text-transform:none; letter-spacing:normal; color:#9aa4b3; }
.calc2 .calc2-group > div > .calc2-num > span.ui-text { font-size:18px; font-weight:700; }
.calc2 .calc2-select { font-size:15px; }
.calc2 .calc2-hint { font-size:13px; }

/* ── Task 7: 5c subscription payment timeline (summary) ── */
.calc2-sub__head { display:flex; align-items:center; gap:8px; margin-bottom:8px; color:var(--color-accent-primary); text-transform:uppercase; letter-spacing:.04em; }
.calc2-sub__lead { color:var(--color-text-muted); margin-bottom:20px; line-height:1.45; }
.calc2-sub-tl { position:relative; padding-left:34px; margin-bottom:20px; }
.calc2-sub-tl__line { position:absolute; left:11px; top:10px; bottom:24px; width:2px; background:linear-gradient(var(--color-accent-primary) 55%,#C6D2E2 55%); }
.calc2-sub-tl__node { position:relative; margin-bottom:20px; }
.calc2-sub-tl__marker { position:absolute; left:-34px; top:0; width:24px; height:24px; border-radius:50%; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.calc2-sub-tl__marker--now { background:var(--gradient-primary); color:#fff; }
.calc2-sub-tl__marker--new { border:2px dashed var(--color-accent-primary); background:#fff; color:var(--color-accent-primary); font-weight:700; }
.calc2-sub-tl__row { display:flex; align-items:baseline; justify-content:space-between; gap:12px; }
.calc2-sub-tl__val { flex-shrink:0; font-weight:700; }
.calc2-sub-tl__val--now { color:var(--color-accent-primary); }
.calc2-sub-tl__ellipsis { color:var(--color-text-muted); }
.calc2-sub__note { display:flex; align-items:flex-start; gap:8px; color:var(--color-text-muted); margin-top:16px; margin-bottom:18px; line-height:1.4; }
/* same icon as .calc2-terms__icon (Описание услуги) — fill:none is required,
   see the comment there: the global svg{fill:currentColor} rule otherwise
   fills this stroke-only path solid. */
.calc2-sub__note-icon { width:16px; height:16px; flex-shrink:0; margin-top:1px; fill:none; }
.calc2-sub__note-icon circle { fill:currentColor; }
.calc2 .calc2-sub__head { font-size:13px; font-weight:700; }
.calc2 .calc2-sub__lead { font-size:13px; }
.calc2 .calc2-sub-tl__row > div > div:first-child { font-size:15px; font-weight:700; }
.calc2 .calc2-sub-tl__desc { font-size:12px; }
.calc2 .calc2-sub-tl__val--now { font-size:22px; font-weight:700; }
.calc2 .calc2-sub-tl__val:not(.calc2-sub-tl__val--now) { font-size:16px; font-weight:700; }
.calc2 .calc2-sub-tl__ellipsis { font-size:12px; }
.calc2 .calc2-sub__note { font-size:12px; }

/* ── Task 8: description accordion ── */
.calc2-terms { background:#fff; border:1px solid #E6EAF0; border-radius:14px; margin-top:8px; }
.calc2-terms__head { width:100%; background:transparent; border:none; cursor:pointer; display:flex; align-items:center; justify-content:space-between; padding:0 20px; height:56px; }
.calc2-terms__title { display:flex; align-items:center; gap:10px; color:var(--color-text-secondary); }
.calc2-terms__chevron { width:18px; height:18px; color:var(--color-text-muted); transition:transform .15s; }
.calc2-terms__head[aria-expanded="true"] .calc2-terms__chevron { transform:rotate(180deg); }
.calc2-terms__body { padding:0 20px 18px; color:var(--color-text-muted); }
.calc2 .calc2-terms { border-radius:14px; }
.calc2 .calc2-terms__head { height:56px; }
.calc2 .calc2-terms__title { font-size:14px; }

/* ── Task 4: multi-link modal ("+ Добавить несколько") + count label/tooltip ── */
.calc2-links__count { color:var(--color-text-muted); margin-left:10px; text-transform:none; letter-spacing:normal; }
.calc2-link-add[disabled] { color:var(--color-text-muted); cursor:not-allowed; opacity:.7; }
.calc2-link-add { position:relative; }
.calc2-links__tooltip { display:none; position:absolute; left:0; top:100%; margin-top:6px; z-index:2; padding:8px 12px; border-radius:10px; background:#1f2430; color:#fff; white-space:nowrap; box-shadow:0 10px 24px -10px rgba(20,34,66,.4); }
.calc2-link-add:hover + .calc2-links__tooltip,
.calc2-link-add[disabled]:hover + .calc2-links__tooltip { display:block; }

.calc2-links-modal { display:none; position:fixed; inset:0; z-index:100001; align-items:center; justify-content:center; padding:20px; }
.calc2-links-modal.is-open { display:flex; }
.calc2-links-modal__overlay { position:absolute; inset:0; background:rgba(22,22,22,.45); }
.calc2-links-modal__dialog { position:relative; z-index:1; width:100%; max-width:520px; background:#fff; border-radius:20px; padding:28px; box-sizing:border-box; box-shadow:0 26px 60px -28px rgba(20,34,66,.4); }
.calc2-links-modal__head { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:12px; }
.calc2-links-modal__title { margin:0; color:var(--color-text-primary); }
.calc2-links-modal__close { display:flex; align-items:center; justify-content:center; width:32px; height:32px; border:none; background:none; color:var(--color-text-muted); cursor:pointer; padding:0; }
.calc2-links-modal__desc { margin:0 0 14px; color:var(--color-text-muted); }
.calc2-links-modal__textarea { width:100%; min-height:140px; margin-bottom:16px; }
.calc2-links-modal__actions { display:flex; justify-content:flex-end; gap:10px; }
.calc2-links-modal__btn { min-height:44px; padding:0 20px; border-radius:12px; border:none; cursor:pointer; box-sizing:border-box; }
.calc2-links-modal__btn--clear { border:1px solid #E1E5EC; background:#fff; color:var(--color-text-secondary); }
.calc2-links-modal__btn--clear:hover { background:var(--color-bg-primary); }
.calc2-links-modal__btn--save { background:var(--gradient-primary); color:var(--color-text-inverse); }
.calc2-links-modal__btn--save:disabled { opacity:.55; cursor:not-allowed; }
@media (max-width: 560px) {
  .calc2-links-modal__dialog { padding:22px; border-radius:16px; }
}

/* ── UI polish batch: filter spacing, type icons, drip check/desc icons, qty input, tooltip ── */
#calc2-filters { display:flex; flex-direction:column; gap:26px; }
#calc2-filters:empty { display:none; }
#calc2-dynfields { display:flex; flex-direction:column; gap:26px; }
#calc2-dynfields:empty { display:none; }
.calc2-type-pill__icon { width:18px; height:18px; flex-shrink:0; object-fit:contain; }
/* fill:none is required here — the global `svg { fill: currentColor }` rule
   (index.css) otherwise fills this stroke-only path solid, turning the
   info-circle outline into a solid blob (same fix as .calc-terms__icon). */
.calc2-terms__icon { width:20px; height:20px; flex-shrink:0; color:var(--color-accent-primary); fill:none; }
.calc2-terms__icon circle { fill:currentColor; }
.calc2-drip-fields__label { display:flex; align-items:center; gap:5px; overflow:visible; }
/* Field hint tooltip (drip-feed labels) — ported from .calc-hint (index.css) so
   the drip-feed tooltips match the old calculator's style instead of a native
   title-attribute tooltip. Named calc2-info-hint (not calc2-hint) because
   calc2-hint was already taken by calc2LimitsHint()'s "Лимиты: от X до Y"
   text, whose margin-top:10px was leaking onto this icon. */
.calc2-info-hint { position:relative; display:inline-flex; align-items:center; margin-left:2px; line-height:0; cursor:help; outline:none; }
.calc2-info-hint__icon { width:15px; height:15px; display:block; }
.calc2-info-hint__badge { fill:#9aa4b3; transition:fill .15s; }
.calc2-info-hint:hover .calc2-info-hint__badge, .calc2-info-hint:focus .calc2-info-hint__badge { fill:var(--color-accent-primary); }
.calc2-info-hint__i { fill:#fff; }
.calc2-info-hint__tip {
  position:absolute; left:50%; bottom:calc(100% + 10px); transform:translateX(-50%);
  width:max-content; max-width:230px; padding:10px 12px;
  background:var(--color-text-primary); color:var(--color-text-inverse);
  border-radius:var(--border-radius--size-m,10px); box-shadow:0 8px 22px rgba(0,0,0,.18);
  text-transform:none; text-align:left; line-height:1.45; letter-spacing:0; white-space:normal;
  opacity:0; visibility:hidden; transition:opacity .15s ease; z-index:50; pointer-events:none;
}
.calc2-info-hint__tip::after { content:""; position:absolute; top:100%; left:50%; transform:translateX(-50%); border:6px solid transparent; border-top-color:var(--color-text-primary); }
.calc2-info-hint:hover .calc2-info-hint__tip, .calc2-info-hint:focus .calc2-info-hint__tip, .calc2-info-hint:focus-within .calc2-info-hint__tip { opacity:1; visibility:visible; }
.calc2-drip-fields { animation:calc2fade .22s ease-out; }
@keyframes calc2fade { from { opacity:0; transform:translateY(-4px); } to { opacity:1; transform:translateY(0); } }
.calc2-qty__input { border:none; background:transparent; outline:none; width:100%; min-width:0; padding:0; margin:0; font-family:inherit; color:var(--color-text-primary); -moz-appearance:textfield; appearance:textfield; }
.calc2-qty__input::-webkit-outer-spin-button, .calc2-qty__input::-webkit-inner-spin-button { -webkit-appearance:none; margin:0; }
.calc2-link-add { position:relative; }
.calc2-link-add[data-tip]:hover::after { content:attr(data-tip); position:absolute; left:0; top:calc(100% + 7px); z-index:40; width:max-content; max-width:280px; background:#2F2F30; color:#fff; font-size:12px; font-weight:500; line-height:1.4; padding:8px 11px; border-radius:8px; box-shadow:0 8px 22px -8px rgba(0,0,0,.45); white-space:normal; pointer-events:none; }
.calc2-link-add[data-tip]:hover::before { content:""; position:absolute; left:16px; top:calc(100% + 2px); border:5px solid transparent; border-bottom-color:#2F2F30; z-index:41; pointer-events:none; }

/* ── Onboarding tour ── */
.calculator__head { position:relative; }
.calc2-tour-help { position:absolute; top:0; right:0; width:38px; height:38px; border-radius:50%; border:1.5px solid #E1E5EC; background:#fff; color:var(--color-accent-primary); display:flex; align-items:center; justify-content:center; cursor:pointer; flex-shrink:0; font-weight:700; font-size:18px; line-height:1; transition:border-color .15s, background .15s; }
.calc2-tour-help:hover { border-color:var(--color-accent-primary); background:var(--color-bg-secondary); }

.calc2-tour { position:fixed; inset:0; z-index:100010; }
/* transparent full-screen layer that swallows clicks so the page can't be
   interacted with while the tour runs (the dim comes from the spot's shadow) */
.calc2-tour__overlay { position:absolute; inset:0; }
.calc2-tour__spot { position:fixed; border-radius:16px; box-shadow:0 0 0 9999px rgba(15,23,42,.6); pointer-events:none; transition:top .2s ease, left .2s ease, width .2s ease, height .2s ease; }
.calc2-tour__popup { position:fixed; z-index:1; width:340px; max-width:calc(100vw - 24px); background:#fff; border-radius:16px; padding:20px 22px; box-shadow:0 24px 60px -20px rgba(20,34,66,.5); box-sizing:border-box; }
.calc2-tour__progress { color:var(--color-text-muted); text-transform:uppercase; letter-spacing:.06em; font-size:11px; font-weight:700; margin-bottom:8px; }
.calc2-tour__title { color:var(--color-text-primary); font-size:18px; font-weight:700; line-height:1.25; margin-bottom:8px; }
.calc2-tour__body { color:var(--color-text-secondary); font-size:14px; font-weight:500; line-height:1.5; }
.calc2-tour__actions { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:20px; }
.calc2-tour__nav { display:flex; align-items:center; gap:8px; margin-left:auto; }
.calc2-tour__skip { border:none; background:none; color:var(--color-text-muted); cursor:pointer; padding:8px 4px; font-size:13px; font-weight:500; }
.calc2-tour__skip:hover { color:var(--color-text-secondary); }
.calc2-tour__btn { min-height:40px; padding:0 18px; border-radius:10px; cursor:pointer; border:none; font-size:13px; font-weight:700; }
.calc2-tour__btn--ghost { background:var(--color-bg-primary); color:var(--color-text-secondary); font-weight:600; }
.calc2-tour__btn--primary { background:var(--gradient-primary); color:var(--color-text-inverse); }
.calc2-tour__btn--primary:hover { filter:brightness(1.05); }
@media (max-width: 560px) {
  .calc2-tour__popup { width:calc(100vw - 24px); padding:18px; }
  .calc2-tour__title { font-size:16px; }
}
