/* Новый вид экранов: стили группы «money». Подключён в index.html после app.css. */
/* Сверка с банком · Расходы · Налог 3 % · Юани у партнёра. Все классы — с приставкой pm-. */

/* формы внутри карточек */
.pm-form{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px 14px;align-items:end}
.pm-form label{display:flex;flex-direction:column;gap:6px;font-size:13px;color:#595968;min-width:0}
.kv .pm-form :where(input,select){width:100%;box-sizing:border-box;min-height:44px;font-size:15px;color:#1C1C1E;background:#fff}
.pm-acts{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px}
.pm-acts .k-sub{flex:1 1 220px;line-height:1.45}
.pm-form .pm-acts .k-btn{min-width:120px}
.pm-form-rc{grid-template-columns:150px minmax(215px,1.3fr) minmax(0,1fr) auto}
.pm-form-dep{grid-template-columns:180px minmax(0,1fr) auto;max-width:560px}
.pm-form-xp{grid-template-columns:160px minmax(0,1fr) minmax(0,1.4fr) 150px auto}
.pm-form-tax{grid-template-columns:repeat(2,minmax(0,1fr))}
.pm-form-tax .pm-acts,.pm-form-ly~.pm-acts{grid-column:1 / -1}
.pm-form-ly{grid-template-columns:repeat(3,minmax(0,1fr));margin:14px 0 4px}
.pm-acts-row{margin-top:16px}
.kv .k-note.pm-lead{margin:0}
@media (max-width:1100px){
  .pm-form-rc{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pm-form-xp{grid-template-columns:160px minmax(0,1fr) 150px}
  .pm-form-xp .pm-wide{grid-column:1 / -2}
}
@media (max-width:900px){
  .pm-form-ly{grid-template-columns:1fr}
}

/* «Сколько должно быть сегодня» */
.pm-calc{display:flex;flex-direction:column}
.pm-calc>div{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:10px 0;border-bottom:1px solid #F0F0F3;font-size:14.5px}
.pm-calc>div span{min-width:0}
.pm-calc>div span small{display:block;font-size:12.5px;color:#595968;margin-top:2px}
.pm-calc>div b{font-family:var(--num);font-weight:500;white-space:nowrap}
.pm-calc>div.tot{border-bottom:0;border-top:2px solid #E5E5EB;font-weight:600}
.pm-calc>div.tot b{font-weight:700;font-size:16px}

/* загрузка файла, «внести вручную», сводка выписки */
.kv .pm-file{display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box}
.pm-dep-up{margin-bottom:4px}
.pm-det{margin:14px 0 6px;border-top:1px solid #F0F0F3;padding-top:4px}
.pm-det>summary{cursor:pointer;list-style:none;min-height:42px;display:flex;align-items:center;gap:8px;font-size:14.5px;font-weight:500;color:#292771}
.pm-det>summary::-webkit-details-marker{display:none}
.pm-det>summary::before{content:'›';display:inline-block;font-size:19px;line-height:1;transition:transform .15s}
.pm-det[open]>summary::before{transform:rotate(90deg)}
.pm-det .pm-form{margin-top:6px}
.pm-dep-sum{margin:12px 0;padding:10px 14px;border-radius:12px;background:#EDF6F0;border:1px solid #C6E3D0;font-size:14px;line-height:1.5}
.pm-dep-sum.bad{background:#FBECEB;border-color:#EFC4C1}
#depResult .pm-acts{margin:12px 0 4px}
.pm-dep{margin-top:6px}

/* маленькие кнопки в строках таблиц */
.kv .pm-tb{min-height:36px;padding:0 12px;border-radius:10px;border:1px solid #DBDBE0;background:#fff;color:#1D1C4C;font:inherit;
  font-size:13px;font-weight:500;cursor:pointer;box-shadow:none;white-space:nowrap}
.kv .pm-tb:hover{background:#F0F0F3}
.kv .pm-tb.pm-del{color:#C2413A;border-color:#EFC4C1}
.kv .pm-tb.pm-del:hover{background:#FBECEB}
.kv .pm-tb.pm-ok{background:#1D1C4C;border-color:#1D1C4C;color:#fff}
.kv .pm-tb.pm-ok:hover{background:#50505D}
.pm-btns{display:inline-flex;gap:6px;justify-content:flex-end}
.pm-amt-del{display:inline-flex;align-items:center;gap:14px}

/* таблицы нового вида без старой «стеклянной» тени */
.pm .k-table{box-shadow:none;border-radius:0;overflow:visible}
/* широкие таблицы листаются внутри карточки */
.pm-wide-t{min-width:620px}
.kv .pm-wide-t td small{display:inline;margin:0 0 0 4px}
.kv .pm-tax td small{display:block;margin:2px 0 0}
.pm-tax td:first-child{min-width:190px}
.pm-tax td .k-chip,.pm-xt td .k-chip{margin-left:6px;vertical-align:1px}
.pm-foot{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px}
.pm-foot:empty{display:none}

/* Расходы: доля плана в карточке цифры */
.pm-plan{display:block;height:8px;border-radius:4px;background:#F0F0F3;overflow:hidden;margin:2px 0 8px}
.pm-plan i{display:block;height:100%;border-radius:4px;background:#2E7D52}
.pm-plan i.hot{background:#C98A2E}
/* Расходы: полоски-кнопки фильтра */
.k-bars-r.pm-click{cursor:pointer;border-radius:10px;margin:0 -10px;padding-left:10px;padding-right:10px}
.k-bars-r.pm-click:hover{background:#F9F9FA}
.k-bars-r.pm-on{background:#F0F0F4}
.k-bars-r.pm-on .k-bars-l{font-weight:600}
.k-bars-r.pm-click:focus-visible{outline:2px solid #393692;outline-offset:-2px}
@media (min-width:701px){.pm-xcur .k-bars-x{min-width:150px}}
/* Расходы: список записей */
.pm-xt td.xd{white-space:nowrap;color:#595968}
.pm-xt td.xb{text-align:right;white-space:nowrap}
.pm-xt td.xn{white-space:nowrap}
.pm-edit input,.pm-edit select{width:100%;min-width:0;box-sizing:border-box}
.pm-edit td.xd input{min-width:140px}
.pm-edit td.xn input{max-width:140px;text-align:right}

/* Юани: записи ops, скрытые строки */
.pm-ev td.ed{white-space:nowrap;color:#595968}
.pm-ev td.ey,.pm-ev td.ek{font-family:var(--num)}
.pm-ev td.er{color:#595968;font-size:13.5px}
.pm-ev tr.pm-hide{display:none!important}
.kv td.sku{font-family:var(--num);font-size:13px;color:#292771}

@media (max-width:700px){
  .pm-form,.pm-form-rc,.pm-form-dep,.pm-form-tax,.pm-form-ly{grid-template-columns:minmax(0,1fr)}
  .pm-form-xp{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pm-form-xp .pm-wide,.pm-form-xp label:nth-child(2),.pm-form-xp .pm-acts{grid-column:1 / -1}
  .pm-form-xp label:nth-child(4){grid-row:1;grid-column:2}
  .pm-form .pm-acts,.pm-form .pm-acts .k-btn{width:100%}
  .pm-acts-row .k-btn,.pm-acts-row .k-btn2{flex:1 1 140px}
  .kv .pm-tb{min-height:40px}
  .pm-calc>div{font-size:14px}
  .pm>.k-top>.k-top-r{width:100%}
  .pm>.k-top>.k-top-r>button{flex:1 1 150px}

  /* Расходы: строка списка — дата и сумма сверху, описание, затем категория и кнопки */
  .pm-xt thead{display:none}
  .pm-xt tr{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"d n" "t t" "c b";gap:4px 12px;padding:12px 0;border-bottom:1px solid #F0F0F3}
  .pm-xt tr:last-child{border-bottom:0}
  .pm-xt td{padding:0;border:0}
  .pm-xt td.xd{grid-area:d;font-size:12.5px}
  .pm-xt td.xn{grid-area:n}
  .pm-xt td.xt{grid-area:t}
  .pm-xt td.xc{grid-area:c;font-size:12.5px;color:#595968;align-self:center}
  .pm-xt td.xb{grid-area:b}
  .pm-xt td[colspan]{grid-column:1 / -1}
  .pm-xt tr.pm-edit{grid-template-columns:minmax(0,1fr);grid-template-areas:"d" "c" "t" "n" "b";gap:8px}
  .pm-xt tr.pm-edit td.xn input{max-width:none;text-align:left}
  .pm-xt tr.pm-edit td.xb{text-align:left}
  .pm-xt tr.pm-edit .pm-btns{display:flex}
  .pm-xt tr.pm-edit .pm-tb{flex:1}

  /* Юани: запись ops — дата и юани сверху, что и тенге, куда отнесено */
  .pm-ev thead{display:none}
  .pm-ev tr{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"d y" "w k" "r r";gap:3px 12px;padding:10px 0;border-bottom:1px solid #F0F0F3}
  .pm-ev tr:last-child{border-bottom:0}
  .pm-ev td{padding:0;border:0}
  .pm-ev td.ed{grid-area:d;font-size:12.5px}
  .pm-ev td.ey{grid-area:y;font-weight:600}
  .pm-ev td.ew{grid-area:w}
  .pm-ev td.ek{grid-area:k;font-size:13px;color:#595968}
  .pm-ev td.er{grid-area:r;font-size:12.5px}
  .pm-ev td[colspan]{grid-column:1 / -1}
}
@media (max-width:700px){
  .pm-dep td.r:not(:last-child){text-align:left}
}
/* оплаты налога: «Удалить» в своей колонке, «Сумма» стоит над суммами */
.pm-pays td.pm-act,.pm-pays th.pm-act-h{width:1%;white-space:nowrap;padding-left:6px}
/* расходы месяца: строка «Итого» */
.pm-xt tr.xp-tot td,.m2 .k-table.pm-xt tr.xp-tot td{border-top:1.5px solid rgba(60,60,67,.2)!important;font-weight:700;background:rgba(118,118,128,.04)}
.pm-xt tr.xp-tot td.xc{font-weight:400;color:#6B6B76}
@media (max-width:760px){
  .m2 .k-table.pm-xt tr.xp-tot,.pm-xt tr.xp-tot{grid-template-areas:"d n" "c c";border-top:1.5px solid rgba(60,60,67,.2)!important;background:rgba(118,118,128,.04)}
  .m2 .k-table.pm-xt tr.xp-tot td,.pm-xt tr.xp-tot td{border-top:0!important;background:none}
  .pm-xt tr.xp-tot td.xt,.pm-xt tr.xp-tot td.xb{display:none}
}
.pm-xt tr.xp-tot small.xp-tot-n{display:block;margin-top:2px;font-size:12px;color:#6B6B76;font-weight:400}
.m2 .k-table.pm-xt tr.xp-tot td.xc,.pm-xt tr.xp-tot td.xc{font-weight:400;color:#6B6B76}
.m2 .k-table.pm-xt tr.xp-tot td.xd b,.pm-xt tr.xp-tot td.xd b{color:#1C1C1E}
