/* Гражданство — кастомный searchable combobox (замена нативного input+datalist).
   Скоуп строго .agent-tab3 .cz-* + флажок в чипе. Дизайн-токены — из agent-console-redesign.css. */

.agent-tab3 .cz-combo{position:relative;max-width:360px;margin-top:12px}

/* Триггер — выглядит как поле выбора */
.agent-tab3 .cz-trigger{
  width:100%;display:flex;align-items:center;gap:10px;
  border:1px solid var(--c-line);border-radius:12px;background:var(--c-surface-2);
  padding:11px 13px;font:inherit;color:var(--c-ink-soft);cursor:pointer;
  transition:border-color .16s var(--c-ease),box-shadow .16s var(--c-ease),background .16s var(--c-ease);
}
.agent-tab3 .cz-trigger:hover{border-color:var(--c-accent-line);background:#fff}
.agent-tab3 .cz-combo.is-open .cz-trigger{border-color:var(--c-accent-line);background:#fff;box-shadow:0 0 0 3px var(--c-accent-soft)}
.agent-tab3 .cz-trigger-ic{display:inline-flex;color:var(--c-accent);flex:none}
.agent-tab3 .cz-trigger-ic svg{width:18px;height:18px;display:block}
.agent-tab3 .cz-trigger-txt{flex:1;text-align:left;font-weight:600;font-size:13.5px}
.agent-tab3 .cz-count{
  min-width:20px;height:20px;padding:0 6px;border-radius:999px;
  background:var(--c-accent);color:#fff;font-size:11px;font-weight:800;line-height:20px;text-align:center;
}
.agent-tab3 .cz-count:empty{display:none}
.agent-tab3 .cz-chev{width:18px;height:18px;flex:none;fill:none;stroke:#90a0bd;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;transition:transform .2s var(--c-ease),stroke .2s var(--c-ease)}
.agent-tab3 .cz-combo.is-open .cz-chev{transform:rotate(180deg);stroke:var(--c-accent)}

/* Поповер */
.agent-tab3 .cz-pop{
  position:absolute;top:calc(100% + 8px);left:0;right:0;z-index:60;
  border:1px solid var(--c-line);border-radius:14px;background:#fff;
  box-shadow:0 18px 44px rgba(20,46,92,.16);overflow:hidden;
  opacity:0;transform:translateY(-6px) scale(.99);transform-origin:top center;pointer-events:none;
  transition:opacity .16s var(--c-ease),transform .16s var(--c-ease);
}
.agent-tab3 .cz-combo.is-open .cz-pop{opacity:1;transform:none;pointer-events:auto}
/* Раскрытие вверх, когда под триггером не хватает места */
.agent-tab3 .cz-combo.is-up .cz-pop{top:auto;bottom:calc(100% + 8px);transform-origin:bottom center;transform:translateY(6px) scale(.99)}
.agent-tab3 .cz-combo.is-up.is-open .cz-pop{transform:none}

/* Поиск */
.agent-tab3 .cz-search{display:flex;align-items:center;gap:9px;padding:11px 13px;border-bottom:1px solid var(--c-line-soft)}
.agent-tab3 .cz-search-ic{display:inline-flex;color:var(--c-ink-faint);flex:none}
.agent-tab3 .cz-search-ic svg{width:17px;height:17px;display:block}
.agent-tab3 .cz-search input{flex:1;border:0;outline:none;background:transparent;font:inherit;font-size:14px;color:var(--c-ink);min-width:0}
.agent-tab3 .cz-search input::placeholder{color:var(--c-ink-faint)}

/* Список опций */
.agent-tab3 .cz-list{list-style:none;margin:0;padding:6px;max-height:264px;overflow:auto;display:flex;flex-direction:column;gap:2px}
.agent-tab3 .cz-opt{
  display:flex;align-items:center;gap:11px;padding:9px 11px;border-radius:10px;cursor:pointer;
  font-size:14px;font-weight:600;color:var(--c-ink);position:relative;user-select:none;
  transition:background .12s var(--c-ease),color .12s var(--c-ease);
}
.agent-tab3 .cz-flag{font-size:18px;line-height:1;width:22px;text-align:center;flex:none}
.agent-tab3 .cz-opt-name{flex:1;min-width:0}
.agent-tab3 .cz-check{
  width:18px;height:18px;flex:none;fill:none;stroke:var(--c-accent);stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round;
  opacity:0;transform:scale(.55);transition:opacity .14s var(--c-ease),transform .14s var(--c-ease);
}
/* подсветка: hover ИЛИ клавиатурный курсор */
.agent-tab3 .cz-opt:hover,.agent-tab3 .cz-opt.is-active{background:var(--c-accent-soft)}
.agent-tab3 .cz-opt.is-active{box-shadow:inset 3px 0 0 var(--c-accent)}
/* выбранная страна */
.agent-tab3 .cz-opt.is-selected{color:var(--c-accent-deep)}
.agent-tab3 .cz-opt.is-selected .cz-check{opacity:1;transform:none}
.agent-tab3 .cz-empty{padding:16px 12px;text-align:center;color:var(--c-ink-faint);font-size:13.5px}

/* Флажок в чипе выбранной страны */
.agent-tab3 .ag-sc-tag .cz-chip-flag{font-size:15px;line-height:1;margin-right:-2px}

@media(max-width:1180px){ .agent-tab3 .cz-combo{max-width:none} }