/* «Потери дефицита» (static/deficit.js). Использует общий каркас окна .fd-* из findyn.css
   (шапка, mp-чипы, боковая панель, статус) — здесь только своя раскладка тела и таблицы. */
.df-modal .fd-side{width:280px}
.df-body{flex:1;display:flex;min-height:0}
.df-main{flex:1;min-width:0;display:flex;flex-direction:column;overflow:auto;padding:var(--sp-3)}

.df-native-msel{min-width:150px;max-height:30px}

.df-formula{background:var(--panel2);border:1px solid var(--line);border-radius:8px;padding:8px 10px}
.df-formula h4{margin:0 0 6px}
.df-formula p{margin:0 0 8px;font-size:var(--fs-cap);line-height:1.4;color:#394150}
.df-formula p:last-child{margin-bottom:0}

.df-sum-tbl{border-collapse:collapse;width:100%;font-size:var(--fs-base)}
.df-sum-tbl th,.df-sum-tbl td{border:1px solid var(--line);padding:4px 6px;text-align:center}
.df-sum-tbl th{background:#dcebf7;font-weight:700;font-size:var(--fs-cap)}

.df-table-wrap{overflow:auto;flex:none;max-height:52vh;border:1px solid var(--line);border-radius:6px}
.df-table{width:100%;border-collapse:separate;border-spacing:0;font-size:var(--fs-base)}
.df-table th,.df-table td{padding:3px 8px;border-bottom:1px solid #eef0f3;white-space:nowrap;text-align:right}
.df-table th{position:sticky;top:0;z-index:2;background:#dcebf7;font-weight:700;border-bottom:1px solid var(--line-strong)}
.df-table .fd-c1{text-align:left;position:sticky;left:0;background:#fff;z-index:1;min-width:220px;max-width:320px;white-space:normal}
.df-table th.fd-c1{background:#dcebf7;z-index:3}
.df-table tr.df-group td{font-weight:600;background:#f7f9fb}
.df-table tr.df-group td.fd-c1{background:#f7f9fb}
.df-table tr.fd-grand td{font-weight:700;background:#eef3fa}
.df-bar-cell{width:110px;min-width:110px;text-align:left}
.df-bar{height:10px;background:linear-gradient(90deg,#1d6bff,#5a9bff);border-radius:2px;min-width:2px}
.fd-sub{font-size:var(--fs-cap);color:var(--muted);white-space:normal}

.df-charts{display:flex;gap:var(--sp-4);margin-top:var(--sp-3);flex-wrap:wrap}
.df-chart-box{flex:1;min-width:280px;border:1px solid var(--line);border-radius:8px;padding:8px 10px;background:var(--panel)}
.df-chart-box h4{margin:0 0 8px}
.df-donut-wrap{display:flex;gap:14px;align-items:center;flex-wrap:wrap}
.df-legend{flex:1;min-width:160px;font-size:var(--fs-cap)}
.df-leg-row{display:flex;align-items:center;gap:6px;padding:2px 0}
.df-leg-dot{width:10px;height:10px;border-radius:50%;flex:none}

@media (max-width:900px){
  .df-body{flex-direction:column}
  .df-modal .fd-side{width:auto;max-height:38vh}
  .df-charts{flex-direction:column}
}


/* Skeleton Shimmer for Deficit */
@keyframes dfShimmer {
  0% { background-position: -200% 0; }
  100% { background-position: 200% 0; }
}
.df-sk-bar {
  display: block;
  height: 13px;
  border-radius: 3px;
  background: linear-gradient(90deg, #f0f4f8 25%, #dce4ee 50%, #f0f4f8 75%);
  background-size: 200% 100%;
  animation: dfShimmer 1.4s infinite;
}
.df-sk-chart {
  height: 160px;
  border-radius: 6px;
  background: linear-gradient(90deg, #f8fafc 25%, #eef2f6 50%, #f8fafc 75%);
  background-size: 200% 100%;
  animation: dfShimmer 1.4s infinite;
}