/* ===== БАЗА ===== */

body{
  margin:0;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
  background:#0f1115;
  color:#e6e6e6;
}

/* ===== LAYOUT ===== */

.layout{
  display:flex;
  min-height:100vh;
}

/* ===== SIDEBAR ===== */

.sidebar{
  width:220px;
  background:#14171d;
  border-right:1px solid #1f232b;
  display:flex;
  flex-direction:column;
  transition:.2s;
}

.sidebar.collapsed{
  width:81px;
}

/* логотип */

.logo{
  display:flex;
  align-items:center;
  gap:10px;              /* 👈 расстояние между иконкой и текстом */
  padding:16px;
}

.sidebar-toggle{
  margin-left:auto;
  cursor:pointer;

  color:#6f7682; /* 👈 мягкий серый */

  display:flex;
  align-items:center;
  justify-content:center;

  transition:.2s;
}

.sidebar-toggle i{
  font-size:18px;
}

/* hover */
.sidebar-toggle:hover{
  color:#7c8cff;

  filter:drop-shadow(0 0 6px rgba(124,140,255,0.4));
}



.logo .sidebar-toggle i{
  color:#6f7682; /* серый как нужно */
}

.logo .sidebar-toggle:hover i{
  color:#7c8cff;
}

.sidebar.collapsed .logo{
  justify-content:center;
  gap:6px;
}

.sidebar.collapsed .sidebar-toggle{
  margin-left:0;       /* ❗ убираем авто-сдвиг вправо */
  margin-top:4px;
}

.logo i{
  font-size:18px;
  color:#4fd26b;
}

/* меню */

.menu{
  padding:10px;
}

.menu-title{
  font-size:11px;
  color:#6f7682;
  margin:10px 8px 4px;
}

.menu-item{
  padding:8px 10px;
  border-radius:6px;
  cursor:pointer;
  font-size:13px;
  color:#cfd3da;

  transition:.15s;
}

.menu-item:hover{
  background:#1f232b;
}

.menu-item.active{
  background:#2a2f3a;
  color:#fff;
}

.menu-item.menu-item-blink{
  animation:menuItemBlinkDark .9s ease-in-out 0s 2;
}

@keyframes menuItemBlinkDark{
  50%{
    background:rgba(124,140,255,.26);
    color:#fff;
    box-shadow:0 0 0 1px rgba(124,140,255,.34), 0 0 18px rgba(124,140,255,.28);
  }
}

/* ===== MAIN ===== */

.main{
  flex:1;
  display:flex;
  flex-direction:column;
}

/* header */

.top-header{
  padding:16px 24px;
  border-bottom:1px solid #1f232b;
}

.page-title-main{
  font-size:28px;
  font-weight:500;
  color:#fff;
}

/* ===== CONTENT ===== */

.page-wrap{
  width:100%;
  max-width:none;      /* ❗ вот ключ */
  margin:0 auto;       /* ❗ вернуть */
  padding:0 20px;
  box-sizing:border-box;
}



/* ===== ЗАГОЛОВОК СЕКЦИИ ===== */

.section-header-title{
  text-align:center;
  font-size:28px;
  color:#cfd3da;
  margin-bottom:10px;
}

/* ===== БЛОКИ ===== */

.section-box{
  background:#14171d;
  border:none;
  border-radius:6px;
  padding:12px;
  margin-bottom:16px;
}

/* ===== INPUT ===== */

.chips-field{
  border:1px solid #2a2f3a;
  background:#0f1115;
  border-radius:4px;
  padding:6px;
  display:flex;
  align-items:center;
  font-size:11px;
  display:flex;
  flex-wrap:wrap;   /* важно */
  gap:3px;          /* 👈 ВОТ ЭТО РЕШЕНИЕ */
}

.seller-input-inline{
  border:none;
  outline:none;
  background:transparent;
  color:#fff;
  flex:1;
}

/* ===== TABLE ===== */

.requests-table{
  width:100%;
  border-collapse:collapse;
  font-size:12px;
}

.requests-table th{
  background:#1f232b;
  padding:8px;
  text-align:left;
}

.requests-table td{
  padding:8px;
  border-bottom:1px solid #1f232b;
}



.requests-table tr:not(.child-row):hover{
  background:#1a1e25;
}

/* ===== EMPTY ===== */

.empty{
  text-align:center;
  padding:60px;
  color:#6f7682;
}

/* ===== TOGGLE ===== */

.hint-with-toggle{
  display:flex;
  align-items:center;
  gap:6px;

  font-size:11px;
  color:#8f96a3;

  justify-content:flex-end;
}

.hint-toggle{
  position:relative;
  width:30px;
  height:16px;
}

.hint-toggle input{display:none;}

.toggle-slider{
  position:absolute;
  inset:0;
  background:#2a2f3a;
  border-radius:20px;
}

.toggle-slider::before{
  content:"";
  position:absolute;
  width:12px;
  height:12px;
  background:#fff;
  top:2px;
  left:2px;
  border-radius:50%;
  transition:.2s;
}

.hint-toggle input:checked + .toggle-slider{
  background:#4fd26b;
}

.hint-toggle input:checked + .toggle-slider::before{
  transform:translateX(14px);
}

/* ===== КОНСТРУКТОР СТИЛИ ===== */

.chips-field-placeholder{
  color:#8f96a3;
  margin-right:0px;
  white-space:nowrap;
}

.chip-option{
  padding:3px 9px; /* 👈 компенсируем border */
  border-radius:999px;

  border:none; /* ❗ УБРАЛИ */
  outline:1px solid #2a2f3a; /* 👈 вместо border */

  font-size:11px;
  cursor:pointer;
  background:#14171d;
  color:#cfd3da;
}

.chip-option:hover{
  outline:1px solid #5a6fe8;
}

/* календарные чипы — оранжевые */
/*.analysis-date-from-chip,
.analysis-date-to-chip{
  background: linear-gradient(
    180deg,
    #ff9b4d 0%,
    #f57c20 100%
  ) !important;

  color:#fff;

  box-shadow:
    0 1px 2px rgba(0,0,0,0.3),
    0 0 6px rgba(245,124,32,0.4);
}*/


.chip-option.active{
  background: linear-gradient(
    180deg,
    #7c8cff 0%,
    #5a6fe8 100%
  );

  outline:none; /* ❗ убираем обводку */
  border:none;
  box-shadow:none;

  color:#fff;
}

.display-row{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:10px;
}

.targeting-row-inline{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}

.chips-input{
  display:flex;
  flex-wrap:wrap;
  gap:4px;
}

.chips-input-field{
  border:none;
  outline:none;
  background:transparent;
  color:#fff;
  flex:1;
  min-width:80px;
}

.geo-field{
  display:flex;
  flex-direction:column;
  gap:6px;
}

.geo-hint{
  font-size:11px;
  color:#8f96a3;
}

.creatives-wrap{
  border:1px dashed #2a2f3a;
  padding:10px;
  border-radius:6px;
}

.chips-block{
  margin-bottom:10px;
}

.chips-caption{
  font-size:11px;
  color:#8f96a3;
  margin-bottom:4px;
}

/* hover */
.chips-field:hover{
  border-color:#3a4150;
}

/* фокус как в старом */
.chips-field:focus-within{
  border-color:#ff8a3a;

  box-shadow:
    none;
}

/* placeholder чуть живее */
.chips-field-placeholder{
  color:#6f7682;
  transition:.15s;
}

/* при фокусе приглушаем */
.chips-field:focus-within .chips-field-placeholder{
  color:#9aa1ad;
}

.chips-field{
  position:relative;
}

.chips-field-placeholder{
  position:static;   /* 👈 главное */
  transform:none;
  color:#6f7682;
  margin-right:6px;
}

.head-row-wide{
  display:grid;
  grid-template-columns:1fr;
  row-gap:8px; /* можно 6–10 */
}

.section-box .chips-field{
  margin-bottom:6px;
}

.analysis-period-field{
  display:flex;
  align-items:center;
  gap:3px; /* 👈 главный контроль расстояний */
  padding-left:8px;
}

/* label (длинный текст) */
.analysis-period-field .chips-field-placeholder{
  margin-right:3px; /* 👈 было больше → уменьшаем */
  position:static;        /* ❗ убираем absolute */
  transform:none;
  font-size:11px;
  color:#6f7682;
  white-space:nowrap;
}

/* "по" */
.date-separator{
  font-size:11px;
  color:#8f96a3;
  margin:0 1px;
}

/* чипы */
.analysis-date-field{
  position:relative;
  display:inline-flex;
  align-items:center;
}

.flatpickr-calendar{
  background:#14171d;
  border:1px solid #1f232b;
  box-shadow:0 8px 20px rgba(0,0,0,0.5);
}

/* шапка */
.flatpickr-months,
.flatpickr-weekdays{
  background:#1a1e25;
}

.flatpickr-month,
.flatpickr-weekday{
  color:#8f96a3 !important;
  font-size:11px;
}

/* стрелки */
.flatpickr-prev-month,
.flatpickr-next-month{
  fill:#8f96a3;
}

.flatpickr-prev-month:hover,
.flatpickr-next-month:hover{
  fill:#7c8cff;
}


/* дни */
.flatpickr-day{
  color:#cfd3da;
  border-radius:4px;
}

/* hover */
.flatpickr-day:hover{
  background:#1f232b;
}

/* выбранная дата — мягкий фиолетовый */
.flatpickr-day.selected{
  background:#5a6fe8 !important;
  color:#fff;
}

/* сегодня */
.flatpickr-day.today{
  border:1px solid #7c8cff;
}

/* диапазон */
.flatpickr-day.startRange,
.flatpickr-day.endRange{
  background:#7c8cff;
  color:#fff;
}

.flatpickr-day.inRange{
  background:rgba(124,140,255,0.15);
}

/* disabled */
.flatpickr-day.disabled{
  color:#555;
}

.chip-dropdown{
  position:absolute;

  border:1px solid #2a2f3a;
  border-radius:6px;

  background:#14171d;

  box-shadow:0 6px 16px rgba(0,0,0,0.4);

  font-size:11px;

  z-index:1000;

  min-width:60px;
  max-height:200px;

  overflow-y:auto;

  display:none;
}

.chip-dropdown-item{
  padding:6px 10px;
  cursor:pointer;
  white-space:nowrap;
  border-bottom:1px solid #1f232b;
}

.chip-dropdown-item:last-child{
  border-bottom:none;
}

.chip-dropdown-item:hover{
  background:#1f232b;
}

/* ===== GEO SELECT ===== */

.geo-select{
  min-height:50px; /* 👈 было маленькое — делаем выше */
  position:relative;

  display:flex;
  flex-wrap:wrap;
  gap:6px;

  align-items:flex-start;   /* 👈 важно */
  width:100%;

  padding:22px 0px 6px 0px; /* 👈 как у chips-field */
}

/* label как в конструкторе */

.geo-label{
  position:absolute;
  top:6px;
  left:0px;

  font-size:11px;
  color:#6f7682;

  pointer-events:none;
}

/* контейнер выбранных */

.geo-selected{
  display:flex;
  flex-wrap:wrap;
  gap:6px;

  align-items:center;
}

/* input */

.geo-input-field{
  border:none;
  outline:none;
  background:transparent;

  color:#fff;
  font-size:11px;

  flex:1;
  min-width:120px;
    margin:0;
  padding:0;

}

/* ===== CHIP ===== */

.geo-chip{
  display:inline-flex;
  align-items:center;
  gap:6px;

  padding:4px 10px;
  border-radius:999px;

  border:none;

  background: linear-gradient(
    180deg,
    #7c8cff 0%,
    #5a6fe8 100%
  );

  color:#fff;

  box-shadow:0 1px 2px rgba(0,0,0,0.3); /* 👈 только лёгкая тень */
}

.geo-chip .remove{
  cursor:pointer;
  color:rgba(255,255,255,0.8);
  transition:.15s;
}

.geo-chip .remove:hover{
  color:#fff;
}

/* ===== DROPDOWN ===== */

.geo-dropdown{
  position:absolute;

  top:100%;
  left:0;

  width:100%;

  background:#14171d;
  border:1px solid #2a2f3a;
  border-radius:6px;

  box-shadow:0 6px 16px rgba(0,0,0,0.4);

  display:none;
  z-index:1000;
}

/* пункт */

.geo-option{
  padding:6px 10px;
  cursor:pointer;
  font-size:11px;
}

.geo-option:hover{
  background:#1f232b;
}

.geo-dropdown{
  max-height:160px;
  overflow-y:auto;
}

.geo-clear-text{
  position:absolute;
  bottom:6px;
  right:8px;

  font-size:11px;

  color:#ff8a3a;
  text-decoration:underline;

  cursor:pointer;

  background:none;
  border:none;
  padding:0;

  display:none; /* 👈 изначально скрыта */

  transition:.15s;
}

.geo-clear-text:hover{
  color:#ffb070;
}

/* флайт — оранжевые чипсы */
.flight-field .chip-option.active{
  background: linear-gradient(
    180deg,
    #ff9b4d 0%,
    #f57c20 100%
  );

  border:none;
  color:#fff;

box-shadow:0 1px 2px rgba(0,0,0,0.3); /* 👈 только это оставить */
}

.geo-dropdown::-webkit-scrollbar{
  width:6px;
}

.geo-dropdown::-webkit-scrollbar-thumb{
  background:#2a2f3a;
  border-radius:4px;
}

.geo-dropdown::-webkit-scrollbar-thumb:hover{
  background:#3a4150;
}
#limit-field .chips-field-placeholder{
  margin-right:1px; /* 👈 уменьшили */
}

.sidebar.collapsed .menu-item{
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  gap:4px;
  padding:10px 4px;
}


.sidebar.collapsed .menu-text{
  display:none;
}

.sidebar.collapsed .menu-title{
  display:block;
  margin:10px 0 4px;
  text-align:center;
  font-size:10px;
}



.sidebar.collapsed .logo{
  justify-content:center;
}

.sidebar.collapsed .menu-item.active{
  border-radius:10px;
  padding:10px 4px;
}
.sidebar.collapsed .menu-item{
  position:relative;
}

.sidebar.collapsed .menu-item:hover::after{
    z-index:9999;              /* 👈 главное */
  content:attr(data-title);
  position:absolute;
  left:70px;
  top:50%;
  transform:translateY(-50%);

  background:#1f232b;
  color:#fff;

  font-size:11px;
  padding:4px 8px;
  border-radius:4px;
  white-space:nowrap;
}

.sidebar.collapsed .logo{
  flex-direction:column;
  align-items:center;
  gap:4px;
}

.sidebar.collapsed .logo-text{
  display:block;
  font-size:10px;
  text-align:center;
  line-height:1.1;
}

.menu-item{
  position:relative;
}




.sidebar.collapsed .menu-badge{
  right:6px;
  top:6px;
  transform:none;
  font-size:9px;
  padding:2px 5px;
}

.top-header{
  display:flex;
  justify-content:space-between;
  align-items:center;

  padding:14px 20px;

  /* 🔥 новый фон */
  background:rgba(20,23,29,0.85);
  backdrop-filter:blur(10px);

  border-bottom:1px solid #1f232b;
}

/* правая часть */
.header-right{
  display:flex;
  align-items:center;
  gap:12px;
}

/* ПИЛЮЛИ */
.header-actions{
  display:flex;
  gap:8px;
}

.header-pill{
  display:flex;
  align-items:center;
  gap:6px;

  padding:6px 10px;

  border-radius:999px;
  font-size:12px;

  background:#1a1e25;
  color:#cfd3da;

  cursor:pointer;
  transition:.2s;
}

.header-pill:hover{
  background:#2a2f3a;
  color:#fff;
}

/* ЧАСЫ + ПРОФИЛЬ */
.header-combo{
  display:flex;
  align-items:center;

  background:#1a1e25;
  border-radius:999px;

  padding:4px;
}

/* дата + время */
.header-clock{
  display:flex;
  flex-direction:column;
  padding:6px 12px;
  color:#fff;
}

.clock-top{
  font-size:11px;
  color:#8f96a3;
}

.clock-bottom{
  display:flex;
  align-items:center;
  gap:6px;
  font-size:14px;
}

/* профиль */
.header-profile{
  width:28px;
  height:28px;

  display:flex;
  align-items:center;
  justify-content:center;

  border-radius:50%;
  background:#2a2f3a;

  cursor:pointer;
  transition:.2s;
}

.header-profile:hover{
  background:#7c8cff;
  color:#fff;
}

.header-profile.developer-impersonation{
  background:#2a2f3a;
  color:#cfd3da;
  animation:developer-impersonation-pulse 1.15s ease-in-out infinite;
}

.header-profile.developer-impersonation:hover,
.header-profile.developer-impersonation.active{
  animation-duration:.9s;
}

@keyframes developer-impersonation-pulse{
  0%{
    background:#2a2f3a;
    color:#cfd3da;
    box-shadow:0 0 0 0 rgba(220,38,38,0);
    transform:scale(1);
  }

  45%,
  55%{
    background:#dc2626;
    color:#fff;
    box-shadow:0 0 0 6px rgba(220,38,38,.28);
    transform:scale(1.08);
  }

  100%{
    background:#2a2f3a;
    color:#cfd3da;
    box-shadow:0 0 0 0 rgba(220,38,38,0);
    transform:scale(1);
  }
}

/* выход */
.header-logout{
  width:34px;
  height:34px;

  display:flex;
  align-items:center;
  justify-content:center;

  border-radius:8px;

  background:#1a1e25;
  cursor:pointer;

  transition:.2s;
}

.header-logout:hover{
  background:#ff4d4f;
  color:#fff;
}

/* мягкий badge */
.badge-soft{
  position:absolute;
  top:-4px;
  right:-4px;

  background:#ff6b6b;
  color:#fff;

  font-size:10px;
  padding:2px 6px;

  border-radius:999px;

  box-shadow:
    0 0 6px rgba(255,107,107,0.4);
}

.header-pill.with-badge{
  position:relative;
}

.analysis-quick-actions{
  display:flex;
  gap:10px;
  margin-top:4px;
  padding-left:8px;
}

.quick-date{
  font-size:11px;
  color:#8f96a3;            /* 👈 бледно-серый */

  cursor:pointer;
  text-decoration:none;

  transition:.15s;
}

/* hover */
.quick-date:hover{
  color:#7c8cff;            /* 👈 фирменный фиолетовый */
  text-decoration:underline;
}

.page-progress-wrap{
  padding:0 20px; /* было 10px сверху */
}

.form-slot{
  margin:16px 20px 0;
}

.page-progress-wrap{
  margin-top:16px;
}

.page-wrap{
  margin-top:16px;
}

.page-progress-info{
  font-size:11px;
  color:#8f96a3;
  margin-bottom:4px;
}

/* фон */
.page-progress-bar{
  height:4px;
  background:#1f232b;
  border-radius:999px;
  overflow:hidden;
}

/* заполнение */
.page-progress-fill{
  height:100%;
  border-radius:999px;

  background:#4fd26b; /* один базовый зелёный */

  opacity:0.3; /* старт тусклый */

  transition:
    width .3s ease,
    opacity .3s ease,
    box-shadow .3s ease;
}

.submit-wrap{
  margin-top:16px;
  text-align:center;

  opacity:0;
  transform:translateY(10px);

  pointer-events:none;

  transition:
    opacity .6s ease,
    transform .6s ease;
}

/* состояние показа */
.submit-wrap.show{
  opacity:1;
  transform:translateY(0);

  pointer-events:auto;
}

.submit-btn{
  padding:10px 22px;
  border-radius:8px;
  border:none;

  background:linear-gradient(
    180deg,
    #4fd26b 0%,
    #2ea44f 100%
  );

  color:#fff;
  font-size:14px;
  font-weight:600;

  cursor:pointer;

  box-shadow:
    0 4px 10px rgba(79,210,107,0.3);

  transition:.2s;
}

.submit-btn:hover{
  transform:translateY(-1px);
  box-shadow:
    0 6px 16px rgba(79,210,107,0.4);
}

/* базовый бейдж */
.menu-badge{
  position:absolute;
  right:10px;
  top:50%;
  transform:translateY(-50%);

  font-size:10px;
  font-weight:600;

  padding:2px 7px;
  border-radius:999px;

  background:#2a2f3a;
  color:#cfd3da;

  box-shadow:none; /* ❌ убираем glow */
}

/* АКТИВНЫЕ — единственный акцент */
.menu-badge.active{
  background:#4fd26b;
  color:#0f1115;

  box-shadow:
    0 0 6px rgba(79,210,107,0.4);
}

/* СОГЛАСОВАНИЕ */
.menu-badge.approval{
  background:#3a3428;
  color:#d8c9a6;
}


/* БРОНЬ */
.menu-badge.booking{
  background:#2a2f3a;
  color:#9aa1ad;
}

.form-slot{
  margin:10px 20px 0;
  min-height:44px; /* 👈 фикс высоты */
  position:relative;
}

.form-slot.form-slot-collapsed{
  min-height:0;
  margin-top:0;
  overflow:hidden;
}

.form-slot.form-slot-collapsed .form-hint,
.form-slot.form-slot-collapsed .submit-wrap{
  display:none !important;
}

/* оба слоя занимают одно место */
.form-hint,
.submit-wrap{
  position:absolute;
  inset:0;

  display:flex;
  align-items:center;
  justify-content:center;

  transition:.3s ease;
}

/* hint */
.form-hint{
  justify-content:flex-start;

  gap:8px;
  padding:8px 10px;

  font-size:12px;

  border-radius:6px;

  background:rgba(255,180,80,0.08);
  color:#d8c9a6;

  border:1px solid rgba(255,180,80,0.15);
}

/* скрытие */
.form-hint.hidden{
  opacity:0;
  transform:translateY(-5px);
  pointer-events:none;
}

/* кнопка */
.submit-wrap{
  opacity:0;
  transform:translateY(5px);
  pointer-events:none;
}

.submit-wrap.show{
  opacity:1;
  transform:translateY(0);
  pointer-events:auto;
}

.reset-wrap{
  display:flex;
  justify-content:flex-end;

  margin-top:10px;
}

.reset-btn{
  background:none;
  border:none;

  font-size:12px;
  color:#8f96a3;

  cursor:pointer;

  text-decoration:underline;

  transition:.2s;
}

.reset-btn:hover{
  color:#ff6b6b;
}

.reset-wrap{
  display:none;
  justify-content:flex-end;
  margin-top:10px;
}

.reset-wrap.show{
  display:flex;
}

#generate-demo{
  margin-left:6px;
  color:#7c8cff;
  text-decoration:underline;
  cursor:pointer;
}

#generate-demo:hover{
  color:#9aa8ff;
}

.chips-field-placeholder{
  pointer-events: none;
}

.creatives-wrap{
  border:1px dashed #2a2f3a;
  padding:16px;
  border-radius:6px;
  text-align:center;
  transition:.2s;
}

.creatives-wrap.drag{
  border-color:#7c8cff;
  background:rgba(124,140,255,0.05);
}

.creatives-placeholder{
  font-size:11px;              /* как в chips */
  color:#6f7682;               /* как placeholder */
  text-align:left;             /* 👈 ВАЖНО */
}

.upload-link{
  color:#7c8cff;
  text-decoration:underline;
  cursor:pointer;
}

.upload-link:hover{
  color:#9aa8ff;
}

.creatives-list{
  margin-top:10px;
  display:flex;
  flex-direction:column;
  gap:6px;
}

.creative-item{
  display:flex;
  justify-content:space-between;
  align-items:center;

  background:#1a1e25;
  padding:6px 10px;
  border-radius:6px;

  font-size:11px;
}

.creative-remove{
  cursor:pointer;
  color:#ff6b6b;
}

.upload-url-btn{
  display:none;

  font-size:11px;
  color:#7c8cff;
  text-decoration:underline;
  cursor:pointer;

  margin-left:6px;
}

.upload-url-btn:hover{
  color:#9aa8ff;
}

.stats-wrap{
  padding:10px 20px 0;
  margin-top:6px;   /* 👈 ВОТ ЭТО */
}

#page-all .section-box{
  border:1px solid #1f232b;
  border-radius:8px;
}

.stats-card{
  background:#14171d;
  border:1px solid #1f232b;
  border-radius:8px;
  padding:14px;
}

.stats-title{
  display:flex;
  align-items:center;
  gap:6px;
  font-size:13px;
  color:#8f96a3;
  margin-bottom:10px;
  cursor:pointer;
  user-select:none;
}

.stats-title:hover{
  color:#cfd3da;
}

.stats-toggle-icon{
  transition:transform .16s ease;
}

.stats-card.stats-collapsed .stats-grid{
  display:none;
}

.stats-card.stats-collapsed .stats-title{
  margin-bottom:0;
}

.stats-card.stats-collapsed .stats-toggle-icon{
  transform:rotate(-90deg);
}

.stats-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:12px;
}

.stat-item{
  background:#1a1e25;
  border-radius:6px;
  padding:10px;
}

.stat-label{
  font-size:11px;
  color:#8f96a3;
  margin-bottom:4px;
}

.stat-value{
  font-size:16px;
  color:#fff;
}

.stat-chart{
  grid-column: span 3; /* растянуть на всю ширину */
}

.mini-chart{
  width:100%;
  height:40px;
  margin-top:6px;
}

.mini-chart polyline{
  filter: drop-shadow(0 0 4px rgba(124,140,255,0.5));
}


.stat-chart{
  grid-column: span 4;
}

.bar-chart{
  display:flex;
  align-items:flex-end;
  gap:8px;
  height:90px;
}

.stats-message{
  width:100%;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#8f96a3;
  font-size:12px;
}

/* контейнер бара */
.bar{
  flex:1;
  height:100%;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  align-items:center;
}

/* сам бар */
.bar-fill{
  position:relative;
  width:100%;
  background:linear-gradient(180deg,#7c8cff,#5a6fe8);
  border-radius:4px 4px 2px 2px;

  box-shadow:0 0 6px rgba(124,140,255,0.4);

  min-height:4px;

  display:flex;
  align-items:flex-end;
  justify-content:center;
  padding-bottom:6px;

  transition:
    transform .2s ease,
    box-shadow .2s ease,
    filter .2s ease;
}

.bar-fill-empty{
  min-height:3px;
  padding-bottom:0;
  background:linear-gradient(180deg,#7c8cff,#5a6fe8);
  box-shadow:0 0 6px rgba(124,140,255,0.35);
  overflow:visible;
}

.bar-fill-empty .bar-value{
  position:absolute;
  bottom:12px;
  color:#fff;
  text-shadow:none;
}

/* подпись месяца */
.bar > span{
  font-size:9px;
  color:#6f7682;
  margin-top:2px;
}

/* значение внутри бара */
.bar-value{
  font-size:12px;
  font-weight:600;
  color:#fff;

  text-shadow:0 1px 2px rgba(0,0,0,0.6);

  pointer-events:none;

  transition:
    transform .2s ease,
    font-size .2s ease,
    text-shadow .2s ease;
}

/* ===== HOVER ===== */

/* бар */
.bar-fill:hover{
  transform:translateY(-2px);
  filter:brightness(1.15);

  box-shadow:
    0 0 10px rgba(124,140,255,0.7),
    0 0 20px rgba(124,140,255,0.3);
}

.bar-fill-empty:hover{
  transform:translateY(-2px);
  filter:brightness(1.15);
  box-shadow:0 0 10px rgba(124,140,255,0.6);
}

/* число */
.bar-fill:hover .bar-value{
  font-size:14px;
  transform:translateY(-2px);

  text-shadow:
    0 0 6px rgba(255,255,255,0.6),
    0 0 12px rgba(124,140,255,0.6);
}

.bar-fill-empty:hover .bar-value{
  font-size:12px;
  transform:none;
  text-shadow:none;
}

/* ===== СТАТЫ (оставил как у тебя) ===== */

.stat-value-wrap{
  display:flex;
  align-items:center;
  gap:8px;
}

.stat-delta{
  display:flex;
  align-items:center;
  gap:4px;

  font-size:11px;
  font-weight:500;
}

.stat-delta.up{
  color:#4fd26b;
}

.stat-delta.down{
  color:#ff6b6b;
}

/* мини чип */
.chip-mini{
  background:#1f232b;
  padding:4px 8px;
  border-radius:999px;
  font-size:11px;
}

/* прогресс в таблице */
.table-progress-bar{
  height:6px;
  background:#1f232b;
  border-radius:999px;
  overflow:hidden;
  margin-bottom:4px;
}

.table-progress-fill{
  height:100%;
  background:#4fd26b;
}

.table-progress-text{
  font-size:10px;
  color:#8f96a3;
}

/* кнопка действий */
.row-actions{
  cursor:pointer;
  color:#8f96a3;
}

.row-actions:hover{
  color:#fff;
}

/* вложенная таблица */
.inner-table{
  width:100%;
  font-size:11px;
  margin-top:6px;
}

.inner-table td{
  padding:6px;
  border-bottom:1px solid #1f232b;
}

.child-row{
  display:none;

  background:rgba(124,140,255,0.08); /* 👈 как open */
  border-top:1px solid rgba(124,140,255,0.15);
  border-bottom:1px solid rgba(124,140,255,0.15);
}

.parent-row{
  cursor:pointer;
}

.full-width-page{
  width:100%;
  padding:0 20px;
  box-sizing:border-box;
}

.full-width-page .section-box{
  max-width:none;
}

/* Ж */
.chip-female{
  background:rgba(255,120,160,0.15);
  color:#ff8fb1;
  outline:1px solid rgba(255,120,160,0.35);
}

/* М */
.chip-male{
  background:rgba(120,160,255,0.15);
  color:#7c8cff;
  outline:1px solid rgba(120,160,255,0.35);
}

/* Все */
.chip-all{
  background:#1f232b;
  color:#cfd3da;
  outline:1px solid #2a2f3a;
}

/* ===== ЧИПСЫ В ТАБЛИЦЕ (ЦА) ===== */

.requests-table .chip-option{
  width:80px;              /* 👈 фикс ширина */
  height:18px;             /* 👈 фикс высота */

  padding:0;               /* убираем внутренние отступы */


  font-size:10px;
  line-height:1;

  border-radius:999px;

  display:inline-flex;
  align-items:center;
  justify-content:center;

  white-space:nowrap;

  outline:none;        /* ❌ убрали обводку */
  border:none;         /* на всякий */

}

/* Ж */
.requests-table .chip-option.female{
  background:rgba(255,120,150,0.12);
  color:#ff7a9a;
}

/* М */
.requests-table .chip-option.male{
  background:rgba(124,140,255,0.12);
  color:#7c8cff;
}

/* Все */
.requests-table .chip-option.all{
  background:#1a1e25;
  color:#9aa1ad;
}

.requests-table .chip-option.geo-chip-table{
  width:auto;              /* ❗ убираем фикс ширину */
  padding:0 10px;          /* нормальные отступы */

  height:18px;

  background:#14171d;
  color:#cfd3da;

  border:1px solid #2a2f3a; /* можно оставить тонкий */
}

.day-row{
  display:grid;
  grid-template-columns:60px 1fr 1fr 50px;
  align-items:center;
  gap:10px;

  margin-bottom:6px;
}

/* дата */
.day-label{
  font-size:10px;
  color:#8f96a3;
}

/* блок метрики */
.day-metric{
  display:flex;
  align-items:center;
  gap:6px;
}

/* бар */
.day-bar{
  flex:1;
  height:6px;
  background:#1f232b;
  border-radius:999px;
  overflow:hidden;
}

/* заполнение */
.day-fill{
  height:100%;
  border-radius:999px;
}

/* показы */
.fill.imp{
  background:#6c7ce0; /* мягкий синий */
}

/* охват */
.fill.reach{
  background:#3fa764; /* мягкий зелёный */
}

/* текст */
.day-metric span{
  font-size:10px;
  color:#8f96a3;
  width:45px;
}

/* freq */
.day-freq{
  font-size:10px;
  color:#cfd3da;
  text-align:right;
}

.period-cell.open .period-arrow{
  transform:rotate(180deg);
}

.period-details div:hover{
  background:#1a1e25;
  border-radius:4px;

}

.requests-table td:last-child{
  padding-right:12px;
}

.actions-btn{
  width:32px;
  height:32px;

  display:flex;
  align-items:center;
  justify-content:center;

  border-radius:8px;

  background:#1a1e25;
  color:#8f96a3;

  cursor:pointer;

  transition:.2s;
}

/* hover общий */
.actions-btn:hover{
  background:#7c8cff;
  color:#fff;
  transform:translateY(-1px);

  box-shadow:0 4px 10px rgba(124,140,255,0.4);
}

/* актив */
.actions-btn:active{
  transform:scale(0.95);
}

/* иконки */
.actions-btn i{
  font-size:15px;
}

/* 🔥 PDF — лёгкий акцент */
.actions-btn i.bi-file-earmark-pdf{
  color:#ff6b6b;
}

.actions-btn:hover i.bi-file-earmark-pdf{
  color:#ff8f8f;
}

.geo-cell.open .geo-arrow{
  transform:rotate(180deg);
}

.status-badge{
  font-size:10px;
  padding:3px 8px;
  border-radius:999px;
  white-space:nowrap;
}

/* Активно */
.status-active, .status-saved{
  background:rgba(79,210,107,0.15);
  color:#4fd26b;
}

/* Бронь */
.status-booking{
  background:rgba(120,140,255,0.15);
  color:#7c8cff;
}

/* Согласование */
.status-approval{
  background:rgba(255,180,80,0.15);
  color:#ffb070;
}

/* Завершено */
.status-archive{
  background:#1a1e25;
  color:#8f96a3;
}

/* ===== FOOTER ===== */

.footer{
  margin-top:auto; /* 👈 прижимает вниз */
  border-top:1px solid #1f232b;

  background:#14171d;

  padding:10px 20px;
}

.footer-content{
  display:flex;
  justify-content:space-between;
  align-items:center;

  font-size:11px;
  color:#6f7682;
}

.footer-right{
  display:flex;
  gap:6px;
  align-items:center;
}

.footer-sep{
  opacity:0.5;
}

/* ===== HOVER ПОДКАТОВ ===== */

.period-cell,
.geo-cell,
.name-cell{
  position:relative;
  cursor:pointer;
  transition:.15s;
}

/* мягкая зона при наведении */
.period-cell:hover,
.geo-cell:hover,
.name-cell:hover{
  background:transparent; /* 👈 вместо заливки */
}

/* 👇 подсветка рамкой (очень помогает понять границу) */
.period-cell:hover::after,
.geo-cell:hover::after,
.name-cell:hover::after{
  content:"";
  position:absolute;
  inset:2px;

  border-radius:6px;
  border:1px solid rgba(124,140,255,0.25);

  pointer-events:none;
}

/* стрелка тоже усиливается */
.period-cell:hover .period-arrow,
.geo-cell:hover .geo-arrow,
.name-cell:hover .name-arrow{
  color:#7c8cff;
  transform:translateY(-1px);
}

.period-cell.open,
.geo-cell.open,
.name-cell.open{
  background:rgba(124,140,255,0.08);
}

/* ===== СТАТУСЫ ТЕЛЕКАНАЛОВ ===== */

.channel-approval{
  background:rgba(255,180,80,0.15);
  color:#ffb070;
}

.channel-approved{
  background:rgba(79,210,107,0.15);
  color:#4fd26b;
}

.channel-rejected{
  background:rgba(255,100,100,0.15);
  color:#ff6b6b;
}

.channel-status{
  display:inline-flex;
  align-items:center;
  justify-content:center;

  width:22px;
  height:22px;

  border-radius:50%;
  font-size:12px;
}

/* утверждено — зелёная галка */
.channel-approved{
  background:rgba(79,210,107,0.15);
  color:#4fd26b;
}

/* отклонено — красный крест */
.channel-rejected{
  background:rgba(255,100,100,0.15);
  color:#ff6b6b;
}

/* на согласовании — жёлтые часы */
.channel-approval{
  background:rgba(255,180,80,0.15);
  color:#ffb070;
}

.approve-btn{
  padding:6px 12px;
  border-radius:6px;
  border:none;

  font-size:11px;
  cursor:pointer;

  background:linear-gradient(
    180deg,
    #7c8cff,
    #5a6fe8
  );

  color:#fff;

  transition:.2s;
}

.approve-btn:hover{
  transform:translateY(-1px);
  box-shadow:0 4px 10px rgba(124,140,255,0.4);
}

/* ===== CALC RESULT ===== */

/* ===== CALC RESULT ===== */

.calc-result{
  margin-top:20px;

  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  align-items:center;
  gap:20px 48px;

  padding:0;
  background:none;
  border:none;

  /* появление контейнера */
  opacity:0;
  transform:translateY(12px) scale(0.98);

  transition:
    opacity .5s ease,
    transform .5s cubic-bezier(.2,.8,.2,1);
}

.calc-result.show{
  opacity:1;
  transform:translateY(0) scale(1);
}


/* ===== ITEM ===== */

.calc-item{
  text-align:center;
}


/* ===== VALUE ===== */

.calc-value{
  font-size:32px;
  font-weight:700;
  line-height:1;

  background:linear-gradient(
    180deg,
    #7c8cff 0%,
    #5a6fe8 100%
  );

  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;

  letter-spacing:0.5px;

  font-variant-numeric: tabular-nums;

  /* начальное состояние */
  opacity:0;
  transform:translateY(14px) scale(0.9);

  transition:
    opacity .6s ease,
    transform .6s cubic-bezier(.2,.8,.2,1);
}


/* появление цифр */
.calc-result.show .calc-item:nth-child(1) .calc-value{
  opacity:1;
  transform:translateY(0) scale(1);
  transition-delay:.15s;
}

.calc-result.show .calc-item:nth-child(2) .calc-value{
  opacity:1;
  transform:translateY(0) scale(1);
  transition-delay:.25s;
}

.calc-result.show .calc-item:nth-child(3) .calc-value{
  opacity:1;
  transform:translateY(0) scale(1);
  transition-delay:.35s;
}

.calc-result .calc-warning{
  /* Отступы .page-wrap (20px) и fieldset (2px). */
  flex-basis:calc(100% - 44px);
  box-sizing:border-box;
  min-width:0;
  margin:0 22px;
  overflow-wrap:anywhere;
}

@media (max-width:600px){
  .calc-result{ column-gap:24px; }
  .calc-result .calc-value{ font-size:24px; }
}


/* финальный "буст" */
.calc-value.calc-final{
  transform:scale(1.08);

  filter:brightness(1.15);

  text-shadow:
    0 0 8px rgba(124,140,255,0.5),
    0 0 16px rgba(124,140,255,0.25);

  transition:
    transform .3s ease,
    filter .3s ease,
    text-shadow .3s ease;
}


/* ===== LABEL ===== */

.calc-label{
  margin-top:6px;

  font-size:11px;
  color:#8f96a3;
}


/* ===== BUTTON STATES ===== */

.submit-btn{
  min-width:220px;

  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
}

.submit-btn.loading{
  background:#2a2f3a;
  color:#9aa1ad;
  box-shadow:none;
  cursor:default;
}

.submit-btn:disabled{
  opacity:.5;
  cursor:not-allowed;
  transform:none;
  box-shadow:none;
}


/* ===== TIMER ===== */

.calc-timer{
  font-size:11px;
  color:#6f7682;
  min-width:28px;
  text-align:left;
}

.calc-bounce{
  animation: calcBounce 0.4s ease;
}



@keyframes calcBounce{
  0%{ transform:scale(1); }
  40%{ transform:scale(1.15); }
  70%{ transform:scale(0.97); }
  100%{ transform:scale(1); }
}

/* 🔒 заблокированные поля */
.locked{
  opacity:0.5;
  pointer-events:none;
  filter:grayscale(0.3);
}

/* кнопка изменить */
.edit-calc{
  margin-left:12px;   /* 👈 сдвиг вправо */
  margin-top:0;       /* 👈 убираем вертикальный отступ */

  display:inline-block; /* 👈 ВАЖНО */

  font-size:11px;
  color:#7c8cff;

  cursor:pointer;
  text-decoration:underline;

  vertical-align:middle; /* 👈 выравнивание с кнопкой */
}
.edit-calc:hover{
  color:#9aa8ff;
}


/* ===== SUCCESS SCREEN ===== */

.campaign-success{
  display:none;

  width:100%;
  height:100%;

  padding:60px 20px;

  box-sizing:border-box;

  display:flex;
  align-items:flex-start;   /* 👈 вместо center */
  justify-content:center;

  padding-top:100px;        /* 👈 регулируешь высоту */

  background:transparent;

  opacity:0;
  transform:translateY(10px);

  transition:
    opacity .4s ease,
    transform .4s ease;
}

.campaign-success.show{
  display:flex;
  opacity:1;
  transform:translateY(0);
}


/* ===== CONTENT ===== */

.success-content{
  text-align:center;
  max-width:700px;

  margin:0 auto;   /* 👈 только по горизонтали */
}


/* ===== TITLE ===== */

.success-title{
  font-size:32px;
  color:#fff;

  margin-bottom:12px;

  animation:fadeUp .5s ease;
}


/* ===== SUB ===== */

.success-sub{
  font-size:18px;
  color:#cfd3da;

  margin-bottom:30px;

  animation:fadeUp .7s ease;
}


/* ===== ARROW ===== */

.success-arrow{
  display:flex;
  align-items:center;
  justify-content:center;

  margin:28px auto;

  font-size:32px;
  color:#7c8cff;

  animation:arrowPulse 1.6s ease-in-out infinite;
}




/* ===== HINT ===== */

.success-hint{
  font-size:15px;
  color:#9aa1ad;

  margin-bottom:24px;

  animation:fadeUp .9s ease;
}


/* ===== FOOTER ===== */

.success-footer{
  font-size:13px;
  color:#6f7682;

  line-height:1.6;

  animation:fadeUp 1.1s ease;
}


/* ===== ANIMATIONS ===== */

@keyframes fadeUp{
  from{
    opacity:0;
    transform:translateY(12px);
  }
  to{
    opacity:1;
    transform:translateY(0);
  }
}


\

.to-booking-btn{
  padding:6px 12px;
  border-radius:6px;
  border:none;

  font-size:11px;
  cursor:pointer;

  background:#2a2f3a;
  color:#cfd3da;

  transition:.25s;
}

/* hover */
.to-booking-btn:hover{
  background:#7c8cff;
  color:#fff;
  transform:translateY(-1px);
}

/* клик (анимация) */
.to-booking-btn.loading{
  pointer-events:none;
  background:#1f232b;
  color:#8f96a3;
}

/* успех */
.to-booking-btn.success{
  background:#4fd26b;
  color:#0f1115;

  box-shadow:
    0 0 8px rgba(79,210,107,0.6);
}

/* микро bounce */
@keyframes btnBounce{
  0%{ transform:scale(1); }
  40%{ transform:scale(1.15); }
  70%{ transform:scale(0.95); }
  100%{ transform:scale(1); }
}

.header-combo-extended{
  display:flex;
  align-items:center;
}

/* 👇 выравниваем ВСЮ капсулу по высоте */
.header-combo,
.header-logout.attached{
  height:44px; /* 🔥 один размер */
}

/* левая часть */
.header-combo{
  display:flex;
  align-items:center;

  background:#1a1e25;

  border-radius:999px 0 0 999px;

  padding:0 6px 0 10px; /* 👈 аккуратный внутренний отступ */
}

/* профиль — чуть вписать */
.header-profile{
  width:28px;
  height:28px;
}

/* правая часть */
.header-logout.attached{
  width:44px;

  display:flex;
  align-items:center;
  justify-content:center;

  background:#1a1e25;

  border-radius:0 999px 999px 0;

  margin-left:-2px; /* 🔥 меньше зазор → лучше склейка */

  cursor:pointer;
  transition:.2s;
}

/* hover */
.header-logout.attached:hover{
  background:#ff4d4f;
  color:#fff;

  box-shadow:0 0 10px rgba(255,77,79,0.4);
}

#creatives-section{
  display:none;
}

@keyframes arrowPulse{
  0%{
    transform:scale(1);
    opacity:0.6;
  }
  50%{
    transform:scale(1.2);
    opacity:1;
  }
  100%{
    transform:scale(1);
    opacity:0.6;
  }
}

.success-arrow{
  font-size:34px;
  color:#7c8cff;

  text-shadow:
    0 0 6px rgba(124,140,255,0.6),
    0 0 12px rgba(124,140,255,0.3);

  animation:arrowPulse 1.6s ease-in-out infinite;
}

.video-upload-block{
  margin-top:16px;
}

.video-upload-title{
  font-size:11px;
  color:#8f96a3;
  margin-bottom:6px;
}

.video-drop-zone{
  border:1px dashed #2a2f3a;
  border-radius:6px;
  padding:12px;
  transition:.2s;
}

.video-drop-zone.drag{
  border-color:#7c8cff;
  background:rgba(124,140,255,0.05);
}

.video-placeholder{
  font-size:11px;
  color:#6f7682;
}

.video-link{
  color:#7c8cff;
  text-decoration:underline;
  cursor:pointer;
}

.video-url-row{
  margin-top:8px;
  display:flex;
  gap:6px;
}

.video-url-input{
  flex:1;
  background:#0f1115;
  border:1px solid #2a2f3a;
  border-radius:4px;
  color:#fff;
  font-size:11px;
  padding:4px 6px;
}

.video-url-btn{
  font-size:11px;
  color:#7c8cff;
  cursor:pointer;
  text-decoration:underline;
}

.video-preview{
  margin-top:10px;
}

.video-preview video{
  width:260px;
  border-radius:6px;
}

.video-remove{
  margin-top:4px;
  font-size:11px;
  color:#ff6b6b;
  cursor:pointer;
}

.video-placeholder{
  white-space:nowrap;  /* 👈 ключ */
}

.video-url-btn{
  display:none;   /* 👈 скрыта по умолчанию */
}


.video-url-row{
  align-items:center;
}

.actions-menu-wrap{
  position:relative;
}

.actions-menu{
  position:absolute;
  top:110%;
  right:0;

  background:#14171d;
  border:1px solid #1f232b;
  border-radius:8px;

  box-shadow:0 8px 20px rgba(0,0,0,0.5);

  display:none;
  flex-direction:column;

  min-width:160px;
  z-index:1000;
}

.actions-menu-item{
  display:flex;
  align-items:center;
  gap:8px;

  padding:8px 10px;
  font-size:12px;
  color:#cfd3da;

  cursor:pointer;
  transition:.2s;
}

.actions-menu-item:hover{
  background:#1f232b;
  color:#fff;
}

.actions-menu-item i{
  font-size:13px;
}

.actions-btn{
  position:relative;
}

/* тултип */
.actions-btn:hover::after{
  content:attr(data-title);

  position:absolute;
  bottom:110%;
  right:0;

  background:#1f232b;
  color:#fff;

  font-size:11px;
  padding:4px 8px;
  border-radius:4px;

  white-space:nowrap;

  opacity:0;
  transform:translateY(4px);

  animation:tooltipFade .15s ease forwards;

  z-index:9999;
}

/* маленькая стрелочка */
.actions-btn:hover::before{
  content:"";

  position:absolute;
  bottom:100%;
  right:10px;

  border:5px solid transparent;
  border-top-color:#1f232b;

  opacity:0;
  animation:tooltipFade .15s ease forwards;
}

@keyframes tooltipFade{
  to{
    opacity:1;
    transform:translateY(0);
  }
}


.login-page{
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#0f1115;
}

/* контейнер */
.login-shell{
  width:100%;
  max-width:420px;
}

/* бренд */
.login-brand{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:16px;
}

.login-brand-icon{
  width:50px;
  height:50px;
  display:flex;
  align-items:center;
  justify-content:center;

  border-radius:12px;

  background:linear-gradient(180deg,#7c8cff,#5a6fe8);
  color:#fff;
  font-size:20px;
}

.login-brand-title{
  font-size:18px;
  color:#fff;
}

.login-brand-sub{
  font-size:12px;
  color:#8f96a3;
}

/* карточка */
.login-card{
  background:#14171d;
  border:1px solid #1f232b;
  border-radius:12px;
  padding:20px;
}

/* заголовок */
.login-title{
  font-size:22px;
  color:#fff;
  margin-bottom:16px;
}

/* поля */
.login-field{
  margin-bottom:14px;
}

.login-field label{
  font-size:12px;
  color:#8f96a3;
  margin-bottom:4px;
  display:block;
}

.login-input{
  position:relative;
}

.login-input > i{
  position:absolute;
  left:12px;
  top:50%;
  transform:translateY(-50%);
  color:#6f7682;
  z-index:2;
}

.login-input input{
  width:100%;
  height:40px;
  padding:0 44px 0 36px;
  background:#0f1115;
  border:1px solid #2a2f3a;
  border-radius:6px;
  color:#fff;
  box-sizing:border-box;
}

.login-eye{
  position:absolute;
  right:12px;
  top:50%;
  transform:translateY(-50%);
  display:flex;
  align-items:center;
  justify-content:center;
  width:20px;
  height:20px;
  cursor:pointer;
  color:#8f96a3;
  z-index:2;
}

/* строка */
.login-row{
  display:flex;
  justify-content:space-between;
  font-size:12px;
  margin-bottom:12px;
}

/* кнопка */
.login-btn{
  width:100%;
  height:40px;
  border:none;
  border-radius:8px;

  background:linear-gradient(180deg,#7c8cff,#5a6fe8);
  color:#fff;

  cursor:pointer;
}

/* footer */
.login-footer{
  margin-top:14px;
  font-size:11px;
  text-align:center;
  color:#6f7682;
}

.login-alert{
  display:flex;
  align-items:flex-start;
  gap:10px;

  margin-bottom:16px;
  padding:12px 14px;

  border-radius:10px;
  border:1px solid transparent;

  font-size:13px;
  line-height:1.45;
}

.login-alert-error{
  background:rgba(255,107,107,0.08);
  border-color:rgba(255,107,107,0.18);
  color:#ffd2d2;
}

.login-alert-icon{
  flex:0 0 auto;
  font-size:14px;
  line-height:1;
  margin-top:2px;
  color:#ff8e8e;
}

.login-alert-text{
  color:#f3caca;
}

.access-denied{
  display:flex;
  align-items:center;
  justify-content:center;
  padding:60px 20px;
}

.access-denied-card{
  text-align:center;
  padding:30px;
  border-radius:12px;
  background:#14171d;
  border:1px solid #1f232b;
  max-width:420px;
}

.access-denied-icon{
  font-size:28px;
  color:#ff6b6b;
  margin-bottom:12px;
}

.access-denied-title{
  font-size:20px;
  color:#fff;
  margin-bottom:6px;
}

.access-denied-text{
  font-size:13px;
  color:#8f96a3;
}

.app-modal-dialog-role{
  max-width:760px;
}

.role-form-textarea{
  width:100%;
  min-height:110px;
  padding:12px;
  border:1px solid #2a2f3a;
  border-radius:10px;
  background:#0f1115;
  color:#fff;
  outline:none;
  box-sizing:border-box;
  resize:vertical;
  transition:.2s;
}

.role-form-textarea:focus{
  border-color:#7c8cff;
  box-shadow:0 0 0 3px rgba(124,140,255,.12);
}

/* ===== LIGHT THEME SHARED UI ===== */

html.app-theme-light{
  --lt-bg:#f3f6fb;
  --lt-surface:#ffffff;
  --lt-surface-soft:#f8fafc;
  --lt-surface-hover:#eef3ff;
  --lt-border:#d9e2ef;
  --lt-border-soft:#e6edf6;
  --lt-text:#17202e;
  --lt-text-soft:#334155;
  --lt-muted:#667085;
  --lt-faint:#98a2b3;
  --lt-accent:#4f65d8;
  --lt-accent-hover:#3442a0;
  --lt-accent-soft:#eef2ff;
  --lt-success:#148f45;
  --lt-success-soft:#eaf7ef;
  --lt-danger:#d12d2d;
  --lt-danger-soft:#fff1f1;
  --lt-warning:#b7791f;
  --lt-warning-soft:#fff7e6;
}

html.app-theme-light body,
html.app-theme-light .main{
  background:var(--lt-bg);
  color:var(--lt-text);
}

html.app-theme-light .sidebar{
  background:var(--lt-surface);
  border-right-color:var(--lt-border);
  box-shadow:6px 0 20px rgba(15,23,42,.04);
}

html.app-theme-light .logo-text,
html.app-theme-light .page-title-main,
html.app-theme-light .section-header-title,
html.app-theme-light .section-title,
html.app-theme-light .success-title,
html.app-theme-light .access-denied-title,
html.app-theme-light .stat-value{
  color:var(--lt-text);
}

html.app-theme-light .sidebar-toggle,
html.app-theme-light .logo .sidebar-toggle i,
html.app-theme-light .menu-title,
html.app-theme-light .clock-top,
html.app-theme-light .hint-with-toggle,
html.app-theme-light .page-progress-info,
html.app-theme-light .chips-caption,
html.app-theme-light .geo-hint,
html.app-theme-light .chips-field-placeholder,
html.app-theme-light .analysis-period-field .chips-field-placeholder,
html.app-theme-light .date-separator,
html.app-theme-light .quick-date,
html.app-theme-light .cell-subtext,
html.app-theme-light .metric-label,
html.app-theme-light .metric-text,
html.app-theme-light .detail-title,
html.app-theme-light .detail-muted,
html.app-theme-light .detail-grid-head,
html.app-theme-light .empty,
html.app-theme-light .success-hint,
html.app-theme-light .success-footer,
html.app-theme-light .calc-label,
html.app-theme-light .calc-timer,
html.app-theme-light .footer,
html.app-theme-light .footer-content,
html.app-theme-light .access-denied-text,
html.app-theme-light .login-footer{
  color:var(--lt-muted);
}

html.app-theme-light .sidebar-toggle:hover,
html.app-theme-light .logo .sidebar-toggle:hover i,
html.app-theme-light .quick-date:hover,
html.app-theme-light .edit-calc,
html.app-theme-light .upload-url-btn,
html.app-theme-light .video-link,
html.app-theme-light .video-url-btn{
  color:var(--lt-accent);
}

html.app-theme-light .menu-item{
  color:#475467;
}

html.app-theme-light .menu-item:hover{
  background:#f1f5f9;
  color:var(--lt-text);
}

html.app-theme-light .menu-item.active{
  background:var(--lt-accent-soft);
  color:var(--lt-accent-hover);
}

html.app-theme-light .menu-item.menu-item-blink{
  animation-name:menuItemBlinkLight;
}

@keyframes menuItemBlinkLight{
  50%{
    background:#dfe7ff;
    color:var(--lt-accent-hover);
    box-shadow:0 0 0 1px rgba(79,101,216,.28), 0 0 18px rgba(79,101,216,.22);
  }
}

html.app-theme-light .top-header{
  background:rgba(255,255,255,.88);
  border-bottom-color:var(--lt-border);
  box-shadow:0 8px 26px rgba(15,23,42,.05);
}

html.app-theme-light .header-pill,
html.app-theme-light .header-combo,
html.app-theme-light .header-profile,
html.app-theme-light .header-logout,
html.app-theme-light .header-logout.attached{
  background:var(--lt-surface-soft);
  color:#475467;
  border-color:var(--lt-border);
}

html.app-theme-light .header-pill:hover,
html.app-theme-light .header-profile:hover,
html.app-theme-light .header-combo:hover,
html.app-theme-light .header-logout.attached:hover{
  background:var(--lt-accent-soft);
  color:var(--lt-accent-hover);
}

html.app-theme-light .header-clock{
  color:var(--lt-text);
}

html.app-theme-light .header-logout:hover,
html.app-theme-light .header-logout.attached:hover{
  color:var(--lt-accent-hover);
}

html.app-theme-light .header-profile.developer-impersonation{
  background:#fee2e2;
  color:#b42318;
  animation-name:developer-impersonation-pulse-light;
}

@keyframes developer-impersonation-pulse-light{
  0%{
    background:#fee2e2;
    color:#b42318;
    box-shadow:0 0 0 0 rgba(209,45,45,0);
    transform:scale(1);
  }

  45%,
  55%{
    background:#dc2626;
    color:#fff;
    box-shadow:0 0 0 6px rgba(209,45,45,.22);
    transform:scale(1.08);
  }

  100%{
    background:#fee2e2;
    color:#b42318;
    box-shadow:0 0 0 0 rgba(209,45,45,0);
    transform:scale(1);
  }
}

html.app-theme-light .section-box,
html.app-theme-light #page-all .section-box,
html.app-theme-light .stats-card,
html.app-theme-light .access-denied-card{
  background:var(--lt-surface);
  border:1px solid var(--lt-border);
  box-shadow:0 12px 28px rgba(15,23,42,.04);
}

html.app-theme-light .stat-item,
html.app-theme-light .chip-mini{
  background:var(--lt-surface-soft);
  color:var(--lt-text-soft);
}

html.app-theme-light .stat-label,
html.app-theme-light .stats-title,
html.app-theme-light .bar > span,
html.app-theme-light .stats-message,
html.app-theme-light .bar-fill-empty .bar-value,
html.app-theme-light .table-progress-text{
  color:var(--lt-muted);
}

html.app-theme-light .stats-title:hover{
  color:var(--lt-text);
}

html.app-theme-light .chips-field,
html.app-theme-light .role-form-textarea,
html.app-theme-light .video-url-input{
  background:var(--lt-surface);
  border-color:#cfd8e6;
  color:var(--lt-text);
}

html.app-theme-light .chips-field:hover,
html.app-theme-light .video-drop-zone.drag{
  border-color:#b8c4d6;
}

html.app-theme-light .chips-field:focus-within,
html.app-theme-light .role-form-textarea:focus,
html.app-theme-light .video-url-input:focus{
  border-color:var(--lt-accent);
  box-shadow:0 0 0 3px rgba(79,101,216,.12);
}

html.app-theme-light .seller-input-inline,
html.app-theme-light .chips-input-field,
html.app-theme-light .geo-input-field,
html.app-theme-light .analysis-date-from,
html.app-theme-light .analysis-date-to{
  color:var(--lt-text);
}

html.app-theme-light .seller-input-inline::placeholder,
html.app-theme-light .chips-input-field::placeholder,
html.app-theme-light .geo-input-field::placeholder,
html.app-theme-light .video-url-input::placeholder{
  color:var(--lt-faint);
}

html.app-theme-light .chip-option,
html.app-theme-light .requests-table .chip-option.geo-chip-table{
  background:#edf2f7;
  color:#475467;
  outline-color:#d9e2ef;
}

html.app-theme-light .chip-option:hover,
html.app-theme-light .requests-table .chip-option.geo-chip-table:hover{
  background:var(--lt-accent-soft);
  color:var(--lt-accent-hover);
}

html.app-theme-light .chip-option.active{
  background:linear-gradient(180deg,#4f65d8 0%,#3442a0 100%);
  color:#fff;
}

html.app-theme-light .flight-field .chip-option.active{
  background:linear-gradient(180deg,#ffad66 0%,#e66f16 100%);
  color:#fff;
}

html.app-theme-light .toggle-slider,
html.app-theme-light .metric-bar,
html.app-theme-light .table-progress-bar,
html.app-theme-light .page-progress-bar{
  background:#e4e9f2;
}

html.app-theme-light .form-hint{
  background:#fff8eb;
  border-color:#f2cf8f;
  color:#7a5514;
}

html.app-theme-light .form-hint i,
html.app-theme-light .form-hint b,
html.app-theme-light #form-hint-text b{
  color:#9a650f;
}

html.app-theme-light .chip-dropdown,
html.app-theme-light .geo-dropdown,
html.app-theme-light .actions-menu{
  background:var(--lt-surface);
  border-color:var(--lt-border);
  box-shadow:0 16px 34px rgba(15,23,42,.14);
  color:var(--lt-text);
}

html.app-theme-light .chip-dropdown-item,
html.app-theme-light .actions-menu-item{
  border-color:var(--lt-border-soft);
  color:var(--lt-text-soft);
}

html.app-theme-light .chip-dropdown-item:hover,
html.app-theme-light .geo-option:hover,
html.app-theme-light .actions-menu-item:hover{
  background:var(--lt-accent-soft);
  color:var(--lt-accent-hover);
}

html.app-theme-light .geo-label{
  color:var(--lt-muted);
}

html.app-theme-light .geo-clear-text,
html.app-theme-light .creative-remove,
html.app-theme-light .video-remove{
  color:#c2410c;
}

html.app-theme-light .geo-dropdown::-webkit-scrollbar-thumb{
  background:#cbd5e1;
}

html.app-theme-light .geo-dropdown::-webkit-scrollbar-thumb:hover{
  background:#94a3b8;
}

html.app-theme-light .requests-table{
  color:var(--lt-text-soft);
}

html.app-theme-light .requests-table th{
  background:var(--lt-surface-soft);
  color:#475467;
}

html.app-theme-light .requests-table td,
html.app-theme-light .inner-table td{
  border-bottom-color:var(--lt-border-soft);
}

html.app-theme-light .requests-table tr:not(.child-row):hover{
  background:#f8fafc;
}

html.app-theme-light .detail-grid{
  color:var(--lt-text-soft);
}

html.app-theme-light .child-row{
  background:rgba(79,101,216,.07);
  border-top-color:rgba(79,101,216,.16);
  border-bottom-color:rgba(79,101,216,.16);
}

html.app-theme-light .row-actions,
html.app-theme-light .actions-btn{
  color:var(--lt-muted);
}

html.app-theme-light .row-actions:hover,
html.app-theme-light .actions-btn:hover{
  color:var(--lt-accent-hover);
}

html.app-theme-light .actions-btn,
html.app-theme-light .to-booking-btn,
html.app-theme-light .submit-btn.loading{
  background:#edf2f7;
  color:#475467;
}

html.app-theme-light .to-booking-btn:hover,
html.app-theme-light .actions-btn:hover{
  background:var(--lt-accent-soft);
  color:var(--lt-accent-hover);
}

html.app-theme-light .to-booking-btn.loading{
  background:#e4e9f2;
  color:var(--lt-muted);
}

html.app-theme-light .to-booking-btn.success{
  background:var(--lt-success-soft);
  color:var(--lt-success);
}

html.app-theme-light .actions-btn:hover::after{
  background:var(--lt-surface);
  border:1px solid var(--lt-border);
  color:var(--lt-text);
  box-shadow:0 12px 28px rgba(15,23,42,.14);
}

html.app-theme-light .actions-btn:hover::before{
  border-top-color:var(--lt-border);
}

html.app-theme-light .status-active,
html.app-theme-light .status-saved{
  background:rgba(20,143,69,.10);
  color:#0f6d35;
}

html.app-theme-light .status-booking{
  background:rgba(79,101,216,.12);
  color:#3442a0;
}

html.app-theme-light .status-approval{
  background:rgba(183,121,31,.12);
  color:#8a5600;
}

html.app-theme-light .status-archive{
  background:#edf2f7;
  color:var(--lt-muted);
}

html.app-theme-light .geo-cell:hover,
html.app-theme-light .geo-cell.open{
  background:var(--lt-accent-soft);
}

html.app-theme-light .geo-cell:hover::after{
  border-color:rgba(79,101,216,.26);
}

html.app-theme-light .video-upload-block,
html.app-theme-light .video-drop-zone{
  border-color:var(--lt-border);
}

html.app-theme-light .video-upload-title,
html.app-theme-light .video-placeholder{
  color:var(--lt-muted);
}

html.app-theme-light .video-preview{
  background:#edf2f7;
}

html.app-theme-light .campaign-success{
  background:transparent;
}

html.app-theme-light .success-sub{
  color:var(--lt-text-soft);
}

html.app-theme-light .success-arrow{
  color:var(--lt-accent);
}

html.app-theme-light .calc-value{
  background:linear-gradient(180deg,#4f65d8 0%,#3442a0 100%);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
}

html.app-theme-light .flatpickr-calendar{
  background:var(--lt-surface);
  border-color:var(--lt-border);
  box-shadow:0 18px 42px rgba(15,23,42,.16);
}

html.app-theme-light .flatpickr-months,
html.app-theme-light .flatpickr-weekdays{
  background:var(--lt-surface-soft);
}

html.app-theme-light .flatpickr-month,
html.app-theme-light .flatpickr-weekday{
  color:var(--lt-muted) !important;
}

html.app-theme-light .flatpickr-prev-month,
html.app-theme-light .flatpickr-next-month{
  fill:var(--lt-muted);
}

html.app-theme-light .flatpickr-prev-month:hover,
html.app-theme-light .flatpickr-next-month:hover{
  fill:var(--lt-accent);
}

html.app-theme-light .flatpickr-day{
  color:var(--lt-text-soft);
}

html.app-theme-light .flatpickr-day:hover{
  background:var(--lt-accent-soft);
  border-color:var(--lt-accent-soft);
}

html.app-theme-light .flatpickr-day.selected,
html.app-theme-light .flatpickr-day.startRange,
html.app-theme-light .flatpickr-day.endRange{
  background:var(--lt-accent) !important;
  border-color:var(--lt-accent) !important;
  color:#fff !important;
}

html.app-theme-light .flatpickr-day.today{
  border-color:var(--lt-accent);
}

html.app-theme-light .flatpickr-day.inRange{
  background:rgba(79,101,216,.12);
  border-color:rgba(79,101,216,.10);
  box-shadow:-5px 0 0 rgba(79,101,216,.12), 5px 0 0 rgba(79,101,216,.12);
}

html.app-theme-light .flatpickr-day.disabled{
  color:#cbd5e1;
}

html.app-theme-light .login-alert-error{
  background:var(--lt-danger-soft);
  border-color:rgba(209,45,45,.18);
  color:#b42318;
}

html.app-theme-light .login-alert-icon,
html.app-theme-light .login-alert-text{
  color:#b42318;
}

html.app-theme-light .access-denied-icon{
  color:var(--lt-danger);
}

html.app-theme-light .footer{
  background:var(--lt-surface);
  border-top-color:var(--lt-border);
}

/* Ролики в раскрытой карточке РК */
.video-upload-block{padding:16px;border:1px solid #2a2f3a;border-radius:8px;background:#171a21}
.video-upload-title{font-size:14px;font-weight:600;color:#edf0f7;margin-bottom:12px}
.video-drop-zone{display:block;cursor:pointer;padding:16px;text-align:center;border:1px dashed #63718d;border-radius:8px;background:#11151d}
.video-drop-zone:hover,.video-drop-zone:focus,.video-drop-zone.drag{border-color:#8d9aff;background:#1d2440;outline:none}
.video-placeholder{white-space:normal;color:#b8c2d6;font-size:12px}
.video-url-row{margin:10px 0 0}
.video-url-input{min-width:0;min-height:21px;font-size:12px}
.video-url-btn{display:inline-flex;align-items:center;white-space:nowrap;padding:6px 10px;border:1px solid #6574a2;border-radius:5px;background:#263052;color:#e6eaff;text-decoration:none;cursor:pointer}
.video-url-btn:hover{background:#34416b}
.video-upload-progress{position:relative;overflow:hidden;margin-top:10px;padding:6px 10px;border-radius:5px;background:#252d3d;color:#eaf0ff;font-size:12px}
.video-upload-progress[hidden]{display:none}
.video-upload-progress-fill{position:absolute;inset:0 auto 0 0;width:0;background:rgba(124,140,255,.25)}
.video-upload-progress span{position:relative}
.video-list{display:grid;gap:10px;margin-top:12px}
.video-item{padding:10px;border:1px solid #333b4b;border-radius:7px;background:#11151d}
.video-item-top{display:flex;align-items:center;flex-wrap:wrap;gap:8px}
.video-item-name{font-size:12px;font-weight:600;color:#edf0f7;overflow-wrap:anywhere}
.video-item-status{font-size:11px;color:#adb9cd}
.video-status-ready{color:#77d6a7}
.video-status-error,.video-state-error{color:#ff9e9e}
.video-remove{margin-left:auto;padding:2px 6px;border:0;background:transparent;color:#ff9999;text-decoration:underline;cursor:pointer}
.video-remove:disabled{opacity:.5;cursor:wait}
.video-item video{display:block;width:min(100%,420px);max-height:250px;margin-top:10px;border-radius:5px;background:#000}
.video-state{font-size:12px;color:#aab6ca}
html.app-theme-light .video-upload-block{border-color:#d6dfeb;background:#fff}
html.app-theme-light .video-upload-title,html.app-theme-light .video-item-name{color:#243047}
html.app-theme-light .video-drop-zone,html.app-theme-light .video-item{border-color:#c9d5e5;background:#f8faff}
html.app-theme-light .video-drop-zone:hover,html.app-theme-light .video-drop-zone:focus,html.app-theme-light .video-drop-zone.drag{border-color:#4f65d8;background:#edf1ff}
html.app-theme-light .video-placeholder,html.app-theme-light .video-state,html.app-theme-light .video-item-status{color:#59677e}
html.app-theme-light .video-url-btn{border-color:#b8c5eb;background:#e9eeff;color:#3442a0}
html.app-theme-light .video-url-btn:hover{background:#dce5ff}
html.app-theme-light .video-upload-progress{background:#e7ecf7;color:#263552}
html.app-theme-light .video-item{border-color:#d8e1ee}
html.app-theme-light .video-status-ready{color:#167449}
html.app-theme-light .video-status-error,html.app-theme-light .video-state-error,html.app-theme-light .video-remove{color:#b32631}
@media(max-width:600px){.video-url-row{flex-wrap:wrap}.video-url-input{flex-basis:100%}.video-url-btn{min-height:34px}}

.video-drop-zone.is-disabled,.video-drop-zone.is-disabled:hover{cursor:not-allowed;border-color:#3a4150;background:#171b24;outline:none}
.video-drop-zone.is-disabled .video-placeholder{color:#8390a5}
.video-url-input:disabled,.video-url-btn:disabled{opacity:.58;cursor:not-allowed}
.video-upload-hint{margin-top:8px;font-size:11px;line-height:1.45;color:#d0a66c}
html.app-theme-light .video-drop-zone.is-disabled,html.app-theme-light .video-drop-zone.is-disabled:hover{border-color:#d6dfeb;background:#f4f6fa}
html.app-theme-light .video-drop-zone.is-disabled .video-placeholder{color:#8a95a7}
html.app-theme-light .video-upload-hint{color:#8a5b19}