/* ============================================================
   udm-podpiska.css — страницы «Подписка» в ЛК (3 состояния),
   строка «Отмена в любой момент» на тарифах и плашка
   «Не нашли что искали?» для страниц шаблонов.
   Пакет вёрстки заказчика dogovorpodpiskaverstka.zip (07.09.2026),
   перенесён один в один; классы, совпавшие с уже занятыми в
   custom-templates.css / udm-svoy-shablon.css, переименованы
   с постоянным префиксом (таблица — claude/24_SVOY_SHABLON.md):
     udm-page → udm-pd;  udm-{btns,cancel,h1,h2,hero,hl,lead,muted,
     price,q,r,side,status,sub,tot,v} → udm-pd-<то же>.
   .udm-fit и .udm-tag — сайтовые (пакет 06.09), здесь не дублируются;
   крошки (.udm-crumbs) — родные Breadcrumbs, правила пакета не нужны.
   ============================================================ */

.udm-pd{padding-top:24px;padding-bottom:60px}   /* не 24px 0 60px: боковые поля .container родные */
.udm-pd-h1{font-family:Unbounded,sans-serif;font-weight:700;font-size:44px;margin:0 0 28px;line-height:1.1}
.udm-pd-h2{font-family:Unbounded,sans-serif;font-weight:700;font-size:30px;margin:0 0 24px}
.udm-pd-muted{color:#9B8D85;font-size:14px}

/* CTA сайта в наших блоках: ширина по содержимому */
.udm-pd .my-btn.udm-fit{min-width:420px;padding:0 40px}
.udm-pd-cancel{color:#9B8D85;font-size:14px;margin-top:12px}
.udm-center{text-align:center}

/* ---------- герой страницы «Подписка» (нет подписки) ---------- */
.udm-pd-hero{display:flex;justify-content:space-between;align-items:center;gap:40px;margin-bottom:44px}
.udm-pd-hero .udm-hi{max-width:620px;min-width:0;width:100%}
.udm-pd-hero .udm-pd-sub{font-size:20px;margin:0 0 8px}
.udm-pd-hero .udm-pd-lead{margin:0 0 26px;color:#6C605A}
.udm-pd-hero>img{width:260px;height:260px;flex:none}

/* ---------- преимущества ---------- */
.udm-benefits{display:grid;grid-template-columns:1fr 1fr 1fr;gap:26px}
.udm-bc{background:#F7F8E6;border-radius:40px;padding:44px 40px 40px;text-align:center;font-size:18px;font-weight:700}
.udm-bc img{width:110px;height:110px;margin:0 auto 26px;display:block}

/* ---------- таблица подписки ---------- */
.udm-sub-tbl{border:1px solid #C6B4AC;border-radius:20px;padding:34px 40px 30px;background:#fff}
.udm-sub-tbl .udm-tt{font-family:Unbounded,sans-serif;font-weight:700;font-size:24px;margin:0 0 18px}
.udm-sub-tbl .udm-pd-r{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 0;border-top:1px solid #EFE7E3;font-size:18px;font-weight:700}
.udm-sub-tbl .udm-pd-r .udm-pd-v{color:#7CAB3D;font-weight:700}
.udm-sub-tbl .udm-pd-r.udm-pd-hl{background:#F7F8E6;border-radius:14px;padding:18px 20px;margin:6px -20px;border-top:0}
.udm-sub-tbl .udm-pd-r.udm-pd-hl+.udm-pd-r{border-top:0}
.udm-sub-tbl .udm-pd-tot{display:flex;align-items:center;justify-content:space-between;padding-top:22px;font-family:Unbounded,sans-serif;font-weight:700;font-size:26px;border-top:1px solid #EFE7E3}
.udm-sub-tbl .udm-pd-tot b{color:#628A2C;font-weight:500;font-size:30px;white-space:nowrap}
.udm-sub-tbl .udm-pd-tot small{display:block;font-family:Mulish,sans-serif;font-size:14px;font-weight:400;color:#9B8D85;margin-top:4px}
/* степпер: сайтовый .change-rate-count-block в мягком виде таблицы */
.udm-sub-tbl .change-rate-count-block{border:0;background:#F1F0EA;width:150px}
.udm-sub-tbl .change-rate-minus,.udm-sub-tbl .change-rate-plus{background:transparent}
/* значение «Сотрудники» — input.quantity (его читает родной subscription.js при отправке формы), вид как у текста */
.udm-sub-tbl input.change-rate-text{border:0;background:transparent;text-align:center;width:44px;padding:0;font:inherit;font-weight:700;color:inherit;outline:0}
/* полоса подтверждения отписки — родная форма .stop-subscribe-form (её показывает subscription.js через slideDown) */
.udm-pd form.udm-confirm{display:none}
.udm-pd .udm-confirm-in{display:flex;align-items:center;justify-content:space-between;gap:24px}
/* «Изменить» подсвечивает таблицу, когда менять нечего */
.udm-sub-tbl.udm-pd-focus{box-shadow:0 0 0 3px #C9DDA8;transition:box-shadow .3s}
/* подсказки «?» в строках */
.udm-sub-tbl .helper-wrapper{margin-left:6px}
.udm-sub-tbl .helper-wrapper>img{width:18px;height:18px;cursor:help}
/* метка «Новинка» */

/* ---------- активная подписка ---------- */
.udm-pd-status{display:inline-flex;align-items:center;gap:8px;background:#E9F1DA;color:#628A2C;border-radius:10px;padding:6px 12px;font-size:14px;font-weight:700}
.udm-pd-status img{width:16px;height:16px}
.udm-active-head{display:flex;align-items:center;gap:16px;margin-bottom:28px;flex-wrap:wrap}
.udm-active-head .udm-pd-h1{margin:0}
.udm-active-grid{display:grid;grid-template-columns:1fr 340px;gap:26px;align-items:start}
.udm-pd-side{border:1px solid #C6B4AC;border-radius:20px;padding:28px}
.udm-pd-side .udm-pd-price{font-family:Unbounded,sans-serif;font-weight:700;font-size:26px;margin:2px 0 16px}
.udm-pd-side .udm-pd-price small{font-size:14px;font-weight:500;color:#9B8D85;font-family:Unbounded,sans-serif}
.udm-pd-side .udm-until{font-weight:800;font-size:20px;margin:2px 0 22px}
.udm-pd-side .my-btn-small{width:100%}
.udm-pd-side .my-btn-small+.my-btn-small{margin-top:10px}
.udm-btn-grey{background:#C6B4AC;color:#fff}
.udm-btn-grey:hover{background:#B5A196;color:#fff}
.udm-savebar{display:none;align-items:center;gap:14px;margin-top:16px}
.udm-savebar.on{display:flex}
.udm-confirm{display:none;background:#F7F8E6;border-radius:20px;padding:28px 40px;align-items:center;justify-content:space-between;gap:24px;margin-top:20px}
.udm-confirm.on{display:flex}
.udm-confirm .udm-pd-q{font-family:Unbounded,sans-serif;font-weight:500;font-size:22px}
.udm-confirm .udm-pd-btns{display:flex;gap:12px}
.udm-confirm .udm-pd-btns .my-btn-small{width:auto;min-width:96px;padding:0 32px}

/* ---------- тарифы: строка отмены под суммой ---------- */
.udm-rate-cancel{text-align:center;font-size:14px;color:#9B8D85;margin-top:4px}

/* ---------- плашка «Не нашли что искали?» ---------- */
.udm-notfound{background:#fff;border:1px solid #C6B4AC;border-radius:20px;padding:22px 28px;display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}
.udm-notfound b{font-family:Unbounded,sans-serif;font-weight:500;font-size:17px;display:block;margin-bottom:5px}
.udm-notfound span{font-size:14.5px;color:#6C605A}

/* ---------- доступность ---------- */
.udm-pd :focus-visible{outline:2px solid #628A2C;outline-offset:2px}

/* ---------- адаптив ---------- */
@media (max-width:900px){
  .udm-benefits,.udm-active-grid{grid-template-columns:1fr}
  .udm-pd-hero{flex-direction:column-reverse;align-items:flex-start;gap:20px}
  .udm-pd-hero>img{width:180px;height:180px}
}
@media (max-width:760px){
  .udm-pd-h1{font-size:30px}.udm-pd-h2{font-size:22px}
  .udm-sub-tbl{padding:22px 18px}
  .udm-sub-tbl .udm-pd-r{font-size:15px;flex-wrap:wrap}
  .udm-sub-tbl .udm-pd-r.udm-pd-hl{margin:6px -8px;padding:14px 12px}
  .udm-sub-tbl .udm-pd-tot{font-size:20px;flex-wrap:wrap}
  .udm-sub-tbl .udm-pd-tot b{font-size:24px}
  .udm-sub-tbl .change-rate-count-block{width:130px}
  .udm-pd .my-btn.udm-fit{width:100%;min-width:0;padding:0 20px}
  .udm-bc{padding:28px 20px;border-radius:24px}
  .udm-bc img{width:80px;height:80px}
  .udm-confirm{padding:22px 20px}
  .udm-pd .udm-confirm-in{flex-direction:column;align-items:flex-start}
  .udm-confirm .udm-pd-q{font-size:18px}
  .udm-sub-tbl .helper-show-body{left:-200px}
  .udm-notfound .my-btn-small{width:100%}
}
/* правки после ТЗ 07.09 (п. 2): у «Сотрудников» значение — input, у «Моих шаблонов» — span; вид один */
.udm-sub-tbl .change-rate-count-block .change-rate-text{font-weight:700;font-size:17px;color:#382D28;line-height:1}