/* Short-links analytics: dashboard, cards, funnel, daily chart, alerts */
.shortlinks-dashboard { margin-bottom: 1rem; }
.shortlinks-alerts { margin-bottom: 12px; min-height: 0; }
.shortlinks-alert {
  font-size: var(--fs-sm); color: var(--tg-hint);
  padding: 6px 0; border-left: 3px solid var(--tg-hint); padding-left: 10px;
}
.shortlinks-alert-red { border-left-color: var(--red-del); color: var(--red-del); }
.shortlinks-alert-yellow { border-left-color: var(--tg-hint); }
/* Свичер периода в шапке на одной линии с «Назад» */
.shortlinks-header { flex-wrap: wrap; }
.shortlinks-period-switcher {
  display: inline-flex;
  border-radius: var(--radius);
  overflow: hidden;
  border: 1px solid var(--glass-border);
  background: var(--tg-secondary);
  flex-shrink: 0;
}
.shortlinks-period-switcher .shortlinks-period-btn {
  height: 44px;
  min-height: 44px;
  box-sizing: border-box;
  padding: 0 18px;
  margin: 0;
  border: none;
  border-radius: 0;
  font-size: var(--fs-body);
  font-family: inherit;
  line-height: 1.25;
  background: transparent;
  color: var(--tg-hint);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background var(--dur-s) var(--ease), color var(--dur-s) var(--ease);
}
.shortlinks-period-switcher .shortlinks-period-btn + .shortlinks-period-btn {
  border-left: 1px solid var(--glass-border);
}
.shortlinks-period-switcher .shortlinks-period-btn-active {
  background: var(--tg-button);
  color: var(--tg-button-text);
}
.shortlinks-score-row {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 10px;
}
.shortlinks-score-row .shortlinks-card {
  flex: 1;
  min-width: 0;
  height: 44px;
  min-height: 44px;
  padding: 0 0.6rem;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 6px;
}
.shortlinks-score-row .shortlinks-card .shortlinks-card-label { font-size: var(--fs-sm); color: var(--tg-hint); }
.shortlinks-score-row .shortlinks-card .shortlinks-card-value { font-size: var(--fs-body); font-weight: 600; }
.shortlinks-score-row .shortlinks-recalc-btn {
  flex-shrink: 0;
  width: auto;
  height: 44px;
  min-height: 44px;
}
/* Цвет фона по уровню score (в стиле проекта: красный / жёлтый / зелёный) */
.shortlinks-card-score-dyn.shortlinks-card-score-low {
  background: var(--glass-del-bg);
  border-color: var(--glass-del-border);
}
.shortlinks-card-score-dyn.shortlinks-card-score-low .shortlinks-card-value { color: var(--red-del); }
.shortlinks-card-score-dyn.shortlinks-card-score-mid {
  background: color-mix(in srgb, var(--tg-secondary) 75%, rgba(200, 160, 0, 0.25));
  border-color: rgba(200, 160, 0, 0.4);
}
.shortlinks-card-score-dyn.shortlinks-card-score-mid .shortlinks-card-value { color: #d4b800; }
.shortlinks-card-score-dyn.shortlinks-card-score-high {
  background: var(--green-credit-bg);
  border-color: color-mix(in srgb, var(--green-credit) 50%, transparent);
}
.shortlinks-card-score-dyn.shortlinks-card-score-high .shortlinks-card-value { color: var(--green-credit); }
.shortlinks-recalc-btn { flex-shrink: 0; }
/* Высота кнопок и поля (44px) */
.shortlinks-recalc-btn,
.shortlinks-cpa-input-row .field-input,
.shortlinks-cpa-input-row .btn-confirm {
  height: 44px;
  min-height: 44px;
  box-sizing: border-box;
  padding: 0 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: var(--fs-body);
  font-family: inherit;
  border-radius: var(--radius);
  line-height: 1.25;
}
.shortlinks-dashboard-cards { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0.5rem; }
@media (min-width: 360px) { .shortlinks-dashboard-cards { grid-template-columns: repeat(3, 1fr); } }
/* Фильтр коротких ссылок — компактно, в стиле раздела «История» */
.shortlinks-filters-card .history-filters-inner { padding: 0; }
.shortlinks-filters-card .history-filters-row { margin-bottom: 8px; }
.shortlinks-filters-card .history-filters-row:last-of-type { margin-bottom: 0; }
.shortlinks-filters-card .history-filter.shortlinks-filter-input { width: 100%; box-sizing: border-box; }
#shortlinks-list-wrap { margin-top: 1rem; }
.shortlinks-card { background: var(--tg-secondary, #1f2936); border-radius: var(--radius-sm); padding: 0.6rem; text-align: center; border: 1px solid var(--glass-border, rgba(255,255,255,0.08)); }
.shortlinks-card-value { display: block; font-size: var(--fs-lg, 17px); font-weight: 600; }
.shortlinks-card-label { font-size: var(--fs-xs, 12px); color: var(--tg-hint); }
.shortlinks-card-cpa-high { border-color: var(--glass-del-border); background: var(--glass-del-bg); }
.shortlinks-card-threshold { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.25rem; }
.shortlinks-card-threshold .shortlinks-card-label { margin: 0; }
.shortlinks-card-threshold .shortlinks-card-threshold-input {
  display: block;
  width: 100%;
  max-width: 80px;
  margin: 0 auto;
  padding: 0.25rem 0.5rem;
  font-size: var(--fs-lg, 17px);
  font-weight: 600;
  text-align: center;
  color: var(--tg-text);
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid var(--glass-border, rgba(255, 255, 255, 0.12));
  border-radius: var(--radius-sm);
  box-sizing: border-box;
  -moz-appearance: textfield;
}
.shortlinks-card-threshold .shortlinks-card-threshold-input::-webkit-outer-spin-button,
.shortlinks-card-threshold .shortlinks-card-threshold-input::-webkit-inner-spin-button { appearance: none; margin: 0; }
.shortlinks-card-threshold .shortlinks-card-threshold-input:focus {
  outline: none;
  border-color: var(--tg-button);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--tg-button) 25%, transparent);
}
.shortlinks-loading-dots { color: var(--tg-hint); font-size: var(--fs-sm); }
.shortlink-card-score { margin-left: 0.35rem; padding: 0.15rem 0.4rem; border-radius: 6px; font-size: var(--fs-xs); font-weight: 600; }
.shortlink-score-high { background: var(--green-credit-bg); color: var(--green-credit); }
.shortlink-score-mid { background: rgba(200, 160, 0, 0.2); color: #d4b800; }
.shortlink-score-low { background: var(--glass-del-bg); color: var(--red-del); }
.shortlink-card-spend-cpa-row { display: flex; flex-wrap: wrap; gap: 0.25em; align-items: baseline; }
.shortlink-card-spend-cpa-sep { color: var(--tg-hint); font-size: var(--fs-sm); }
.shortlink-card .shortlink-card-spend,
.shortlink-card .shortlink-card-cpa,
.shortlink-card .shortlink-card-funnel { font-size: var(--fs-sm); color: var(--tg-hint); }
.shortlink-detail-funnel-wrap, .shortlink-detail-daily-wrap { margin-bottom: 1rem; }
.shortlink-funnel-label, .shortlink-daily-label { font-size: var(--fs-sm); color: var(--tg-hint); margin-bottom: 0.2rem; }
.shortlink-funnel-bars { display: flex; gap: 2px; align-items: stretch; height: 56px; }
.shortlink-funnel-labels { display: flex; gap: 12px; font-size: var(--fs-sm); color: var(--tg-hint); margin-top: 4px; flex-wrap: wrap; }
.shortlink-events-breakdown { margin-top: 0.5rem; }
.shortlink-events-breakdown-label { font-size: var(--fs-sm); color: var(--tg-hint); margin-bottom: 2px; }
.shortlink-events-breakdown-item { font-size: var(--fs-sm); color: var(--tg-text); padding: 1px 0; }
.shortlink-avg-session { font-size: var(--fs-sm); color: var(--tg-hint); margin-top: 0.4rem; }
.shortlink-funnel-bar { min-width: 32px; border-radius: 6px; background: var(--tg-button); color: var(--tg-button-text); font-size: var(--fs-sm); display: flex; align-items: center; justify-content: center; transition: width 0.2s ease; }
.shortlink-funnel-landings { background: color-mix(in srgb, var(--tg-button) 80%, white); }
.shortlink-funnel-leads { background: var(--green-credit); }
.shortlink-daily-chart { display: flex; align-items: stretch; gap: 4px; height: 80px; padding: 0.5rem 0; }
.shortlink-daily-bar-wrap { flex: 1; display: flex; flex-direction: column; align-items: center; min-width: 0; }
.shortlink-daily-bar-container { flex: 1; min-height: 0; width: 100%; display: flex; flex-direction: column; justify-content: flex-end; }
.shortlink-daily-bar { width: 100%; min-height: 2px; background: var(--tg-button); border-radius: 2px 2px 0 0; transition: height 0.2s ease; }
.shortlink-daily-day { font-size: 10px; color: var(--tg-hint); margin-top: 0.25rem; overflow: hidden; text-overflow: ellipsis; max-width: 100%; flex-shrink: 0; }