/* =========================================================================
   AoFilters — переиспользуемый стек «поиск / фильтры / колонки / группировка».
   Пиксельный перенос из web_app_front: FilterMaster, FilterItem,
   FilterCheckbox(es), FilterHeaderSelectedAction, TableSidebarPanel,
   ToolbarMaster, GlobalFiltersMaster, SortControlMaster, GroupingMaster.
   Один и тот же CSS используется таблицами и панелью слоя карты.
   ========================================================================= */

/* ---------- Боковая панель (TableSidebarPanel: 304px, ease-in .5s) ---------- */
.af-sidebar{
  position:absolute;z-index:1010;top:0;right:0;bottom:0;width:304px;
  padding:16px 24px;background:#fff;box-shadow:var(--shadow-elevation-2);
  overflow:auto;transform:translateX(110%);transition:transform ease-in .5s;
}
.af-sidebar.is-active{transform:translateX(0)}
.af-sidebar__head{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.af-sidebar__title{font-size:10px;line-height:14px;text-transform:uppercase;color:#646465}
.af-sidebar__close{width:24px;height:24px;display:flex;align-items:center;justify-content:center;color:var(--text-600);border-radius:var(--r)}
.af-sidebar__close:hover{background:var(--panel-grey)}
.af-sidebar__close .ao-icon{font-size:9px}

/* ---------- Тулбар (ToolbarMaster: 24px, рамка #EDF1F2, active primary) ---------- */
.af-toolbar{display:flex;align-items:center;font-size:12px}
.af-tool-btn{
  position:relative;width:24px;height:24px;margin-right:4px;
  display:inline-flex;align-items:center;justify-content:center;
  background:#fff;border:1px solid #EDF1F2;border-radius:var(--r);color:#576674;
}
.af-tool-btn .ao-icon{font-size:14px}
.af-tool-btn.is-active{background:var(--primary);border-color:var(--primary);color:#fff}
.af-tool-btn .af-badge{
  position:absolute;top:-3px;right:-9px;z-index:1;
  padding:2.5px 3px;border-radius:var(--r-pill);background:#EA5D31;
  color:#fff;font-size:9px;font-weight:600;line-height:1;white-space:nowrap;
}

/* ---------- Секция фильтра (FilterItem) ---------- */
.af-item{width:100%;margin-top:16px;border-bottom:1px solid var(--border-soft)}
.af-item__head{
  display:flex;align-items:center;gap:4px;min-height:18px;margin-bottom:16px;
  cursor:pointer;width:100%;text-align:left;
}
.af-item__head .chev{
  display:inline-flex;height:10px;color:#576674;font-size:10px;
  transition:transform .3s ease-out;
}
.af-item.is-open .af-item__head .chev{transform:rotate(90deg)}
.af-item__title{font-size:10px;font-weight:600;line-height:140%;text-transform:uppercase;color:#576674}
.af-item__spacer{flex:1}
.af-item__body{overflow:hidden;max-height:0;transition:max-height linear .3s;margin-top:-12px}
.af-item.is-open .af-item__body{max-height:none;margin-bottom:12px}

/* бейдж «выбрано N» (FilterHeaderSelectedAction: 18px, рамка error 2px) */
.af-selected-badge{
  display:inline-flex;align-items:center;height:18px;overflow:hidden;
  border:2px solid var(--error);border-radius:var(--r);
  font-size:10px;font-weight:400;line-height:140%;cursor:auto;
}
.af-selected-badge .count{display:flex;align-items:center;height:100%;padding:0 4px}
.af-selected-badge .count .ao-icon{font-size:10px}
.af-selected-badge .reset{
  display:flex;align-items:center;justify-content:center;width:18px;height:18px;
  background:rgba(var(--error-rgb),.12);color:var(--text-800);cursor:pointer;
}
.af-selected-badge .reset .ao-icon{font-size:8px}

/* ---------- Чипы выбранного («Выбранный:» + Сбросить все) ---------- */
.af-chips{display:flex;flex-wrap:wrap;margin:-4px}
.af-chip{
  display:inline-flex;align-items:center;gap:4px;max-width:100%;margin:4px;
  height:24px;padding:0 8px;border-radius:var(--r);
  background:rgba(var(--primary-rgb),.12);color:var(--primary);
  font-size:10px;font-weight:500;
}
.af-chip span{white-space:nowrap;overflow:hidden;text-overflow:clip}
.af-chip .x{
  width:12px;height:12px;flex:0 0 auto;border-radius:50%;background:#fff;
  display:inline-flex;align-items:center;justify-content:center;cursor:pointer;color:var(--text-700);
}
.af-chip .x .ao-icon{font-size:6px}
.af-reset-all{
  display:inline-flex;align-items:center;gap:4px;height:18px;
  font-size:10px;font-weight:500;color:var(--text-700);opacity:.8;
}
.af-reset-all:hover{opacity:1}
.af-reset-all .ao-icon{font-size:11px}

/* ---------- Поиск (в панели и по фильтрам) ---------- */
.af-search{margin-bottom:12px}
.af-search .ao-field__control{height:28px}
.af-search input{font-size:12px}
.af-search--x-small input{font-size:10px}

/* ---------- Чекбокс фильтра (FilterCheckbox: строка 24px + mb 4px) ---------- */
.af-checkbox{position:relative;margin-bottom:4px}
.af-checkbox .mark{
  position:absolute;top:50%;left:0;transform:translateY(-50%);
  display:flex;align-items:center;justify-content:center;
  width:13.33px;height:13.33px;border:1px solid #86919d;border-radius:2.667px;
  background:transparent;font-size:10px;pointer-events:none;
}
.af-checkbox .mark svg{width:9px;height:9px;display:none;fill:none;stroke:#fff;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.af-checkbox.is-checked .mark{background:var(--primary);border:none;color:#fff}
.af-checkbox.is-checked .mark svg{display:block}
.af-checkbox .lbl{
  position:relative;display:flex;align-items:center;height:24px;
  padding-left:22px;padding-right:16px;
  font-size:12px;font-weight:400;line-height:150%;color:var(--text-body);
  white-space:nowrap;text-overflow:ellipsis;overflow:hidden;
  user-select:none;cursor:pointer;
}
.af-checkbox .btn-all,.af-checkbox .btn-only{
  position:absolute;top:50%;right:0;padding:2px 8px;background:#fff;
  transform:translate(110%,-50%);transition:transform .3s ease-in-out;
  font-size:12px;color:var(--primary);cursor:pointer;
}
.af-checkbox .btn-all:hover,.af-checkbox .btn-only:hover{text-decoration:underline}
.af-checkbox:hover .lbl.can-all .btn-all{transform:translate(0,-50%)}
.af-checkbox:hover .lbl.can-only .btn-only{transform:translate(0,-50%)}
.af-checkbox.is-disabled{opacity:.4;pointer-events:none}

/* прокрутка списка вариантов (max-height 164) */
.af-scroll{max-height:164px;overflow-y:auto}

/* ---------- Радио (boolean) ---------- */
.af-radio{display:flex;align-items:center;gap:8px;height:24px;margin-bottom:4px;cursor:pointer;font-size:12px}
.af-radio .rmark{width:13.33px;height:13.33px;border:1px solid #86919d;border-radius:50%;display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.af-radio .rmark::after{content:'';width:7px;height:7px;border-radius:50%;background:var(--primary);transform:scale(0);transition:transform .12s ease}
.af-radio.is-checked .rmark{border-color:var(--primary)}
.af-radio.is-checked .rmark::after{transform:scale(1)}

/* ---------- Диапазон (range) ---------- */
.af-range{display:flex;flex-direction:column;gap:8px;padding:2px 0 4px}
.af-range .inputs{display:flex;align-items:center;gap:8px}
.af-range .inputs .ao-field{flex:1}
.af-range .inputs .ao-field__control{height:26px}
.af-range .inputs input{font-size:12px}
.af-range input[type=range]{width:100%;accent-color:var(--primary);height:18px}
.af-range .suffix{font-size:10px;color:var(--text-600)}

/* ---------- Диапазон дат ---------- */
.af-daterange{display:flex;gap:8px}
.af-daterange .ao-field{flex:1}
.af-daterange input{font-size:12px}

/* ---------- DnD-строки (колонки / группировка) ---------- */
.af-dnd-row{display:flex;align-items:center;gap:4px;min-height:28px}
.af-dnd-row .drag{display:inline-flex;color:var(--text-secondary);font-size:12px;cursor:grab;flex:0 0 auto}
.af-dnd-row .af-checkbox{flex:1;margin:0}
.af-dnd-row+.af-dnd-row{border-top:none}
.af-dnd-group{margin-top:8px;border-bottom:1px solid var(--border-soft);padding-bottom:8px}
.af-dnd-group__head{display:flex;align-items:center;gap:4px;color:#576674;cursor:pointer;min-height:28px}
.af-dnd-group__head .chev{display:inline-flex;font-size:10px;transition:transform .3s}
.af-dnd-group.is-open .af-dnd-group__head .chev{transform:rotate(90deg)}
.af-dnd-group__body{overflow:hidden;max-height:0;transition:max-height .3s ease-out;padding-left:12px}
.af-dnd-group.is-open .af-dnd-group__body{max-height:none}

/* ---------- Глобальный фильтр (GlobalFiltersMaster) ---------- */
.af-gf{position:relative;display:inline-block}
.af-gf__btn{
  display:flex;align-items:center;max-width:240px;height:24px;padding:0 8px;
  border:1px solid #edf1f2;border-radius:var(--r);background:#fff;
  font-size:12px;font-weight:400;line-height:150%;color:#576674;
  white-space:nowrap;overflow:hidden;
}
.af-gf__btn:hover{background:#ecf1f7}
.af-gf__btn.is-open{background:#ecf1f7;color:var(--primary)}
.af-gf__btn .counter{
  display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;
  height:16px;min-width:16px;padding:0 1px;margin-left:4px;
  background:#ea5d31;border-radius:20px;color:#fff;
  font-weight:700;font-size:8px;line-height:10px;
}
.af-gf__btn .arrow{display:inline-flex;font-size:8px;margin-left:4px;transition:transform .2s}
.af-gf__btn.is-open .arrow{transform:rotate(180deg)}
.af-gf__menu{
  position:absolute;top:calc(100% + 8px);left:0;z-index:1012;width:255px;
  background:#fff;border-radius:var(--r);box-shadow:var(--shadow-popover);
}
.af-gf__menu .content{padding:16px 16px 0;max-height:40vh;overflow:auto}
.af-gf__menu .actions{display:flex;align-items:center;gap:12px;padding:12px 16px 16px}
.af-gf__menu .actions .ao-btn{flex:1;height:32px}
.af-gf__menu .ao-field{margin-bottom:16px}
.af-gf__menu .ao-field__label{font-size:10px;color:#86919d}
.af-gf__menu input,.af-gf__menu select{font-size:14px;color:#1d2126}

/* пресеты периодов (колонка 30px строк, border-right #ddd) */
.af-ranges{display:flex}
.af-ranges .list{border-right:1px solid #ddd;overflow-y:auto;max-height:230px;min-width:132px}
.af-ranges .list button{
  display:block;width:100%;height:30px;padding:0 10px;
  font-size:11px;text-align:left;color:var(--text-body);border-radius:0;
}
.af-ranges .list button:hover{background:var(--panel-grey)}
.af-ranges .list button.is-active{background:var(--primary-50);color:var(--primary);font-weight:600}
.af-ranges .cal{flex:1;padding:8px 0 8px 10px;display:flex;flex-direction:column;gap:8px}

/* ---------- Сортировка (SortControlMaster) ---------- */
.af-sort{position:relative;display:flex;align-items:center}
.af-sort__btn{height:20px;padding:2px 4px;border-radius:var(--r);font-size:10px;font-weight:500;color:#576674}
.af-sort__btn:hover{background:var(--panel-grey)}
.af-sort__dir{width:20px;height:20px;margin-left:4px;display:inline-flex;align-items:center;justify-content:center;color:#576674;border-radius:var(--r)}
.af-sort__dir:hover{background:var(--panel-grey)}
.af-sort__dir .ao-icon{font-size:12px}
.af-sort__menu{
  position:absolute;top:calc(100% + 4px);left:0;z-index:1012;min-width:180px;padding:8px;
  background:#fff;border-radius:var(--r);box-shadow:var(--shadow-popover);
}
.af-sort__menu button{
  display:flex;width:100%;height:28px;align-items:center;padding:0 8px;border-radius:var(--r);
  font-size:12px;font-weight:500;color:#576674;text-align:left;
}
.af-sort__menu button:hover{background:#ecf1f7}
.af-sort__menu button.is-active{background:var(--primary);color:#fff}

/* сортировка в шапке таблицы */
.ao-table th.sortable{cursor:pointer;user-select:none}
.ao-table th.sortable:hover{background:#f2f2f2}
.ao-table th .sort-ico{display:inline-flex;vertical-align:middle;margin-left:4px;color:var(--text-600);font-size:12px}
.ao-table th.sorted .sort-ico{color:var(--primary)}