/* ===== РОЗДІЛ «КОНВЕРТАЦІЯ» ===== */
/* Таблиця координат із завантажених файлів + вигрузка в KML/KMZ. */

.mode-tabs{grid-template-columns:repeat(4,1fr);}
.mode-tab[data-mode="convert"].active{
  background:rgba(88,166,255,.13);border-color:#58a6ff;color:#79c0ff;
}

#sidebarConvert{display:none!important;}
body.mode-convert #sidebarOps{display:none!important;}
body.mode-convert #sidebarConvert{display:block!important;}
body.mode-convert #mapEmptyState{display:none!important;}

/* Таблиця живе в тій самій клітинці сітки, що й карта, і накриває її. */
#convertPane{
  grid-area:map;position:relative;z-index:600;
  display:none;flex-direction:column;min-height:0;min-width:0;
  background:var(--bg);
}
body.mode-convert:not(.conv-map):not(.conv-hist) #convertPane{display:flex;}
/* Карту не прибираємо з потоку (Leaflet втратив би розмір), лише ховаємо —
   разом з її інструментами, статус-рядком і пошуком координат. */
body.mode-convert:not(.conv-map) #map{visibility:hidden;}

/* Історія завантажень — така сама «накривка» карти, як таблиця. */
#convHistPane{
  grid-area:map;position:relative;z-index:601;
  display:none;flex-direction:column;min-height:0;min-width:0;
  background:var(--bg);
}
body.mode-convert.conv-hist:not(.conv-map) #convHistPane{display:flex;}

.conv-hero{
  padding:10px 12px;margin-bottom:8px;border-radius:var(--radius);
  background:rgba(88,166,255,.08);border:1px solid rgba(88,166,255,.26);
}
.conv-hero h3{margin:0 0 4px;font-size:13px;color:#79c0ff;letter-spacing:.3px;}
.conv-hero p{margin:0;font-size:10px;color:var(--muted);line-height:1.45;}

#convFileInput{
  width:100%;font-size:10px;color:var(--muted);
  padding:8px;border:1px dashed var(--border-hi);border-radius:var(--radius);
  background:var(--panel2);cursor:pointer;
}
.conv-formats{display:flex;flex-wrap:wrap;gap:4px;margin-top:6px;}
.conv-formats span{
  padding:2px 7px;border-radius:12px;font-size:9.5px;font-weight:600;
  background:rgba(88,166,255,.1);color:#79c0ff;border:1px solid rgba(88,166,255,.22);
}

#convTextInput{
  width:100%;resize:vertical;min-height:70px;
  padding:8px;border:1px solid var(--border);border-radius:var(--radius);
  background:var(--panel2);color:var(--text);font-size:10.5px;line-height:1.5;
}
#convTextInput:focus{outline:none;border-color:#58a6ff;}
#convParseTextBtn{
  width:100%;margin-top:6px;padding:8px 10px;border-radius:var(--radius);cursor:pointer;
  font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center;gap:7px;
  background:var(--panel2);border:1px solid var(--border);color:var(--text);transition:all .12s;
}
#convParseTextBtn:hover{border-color:#58a6ff;color:#79c0ff;}
.conv-text-hint{margin-top:6px;font-size:9.5px;color:var(--muted);line-height:1.5;}

.conv-src{margin-top:8px;display:flex;flex-direction:column;gap:4px;}
.conv-src-hint{margin-top:6px;font-size:9.5px;color:var(--muted);line-height:1.45;}
.conv-src-item{
  display:flex;align-items:center;justify-content:space-between;gap:6px;
  padding:5px 7px;border-radius:var(--radius);background:var(--panel2);
  border:1px solid var(--border);font-size:10px;
}
.conv-src-item b{font-weight:600;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.conv-src-item i{color:var(--muted);font-style:normal;flex-shrink:0;}

/* Назви областей і типів довгі, тому чипи — рядками на всю ширину панелі. */
.conv-chips{display:flex;flex-direction:column;gap:4px;}
.conv-chip{
  display:flex;align-items:center;gap:6px;width:100%;margin:0;
  padding:5px 9px;border-radius:8px;cursor:pointer;text-align:left;
  background:var(--panel2);border:1px solid var(--border);
  color:var(--muted);font-size:10px;font-weight:600;transition:all .12s;
}
.conv-chip .cnt{margin-left:auto;}
.conv-chip:hover{border-color:var(--border-hi);color:var(--text);}
.conv-chip.on{background:rgba(88,166,255,.14);border-color:#58a6ff;color:#79c0ff;}
.conv-chip .cnt{
  padding:0 5px;border-radius:9px;font-size:9px;font-weight:700;
  background:rgba(255,255,255,.07);color:inherit;
}
.conv-chip .dot{width:8px;height:8px;border-radius:50%;flex-shrink:0;}
.conv-chips-empty{font-size:10px;color:var(--muted);padding:2px;}
.conv-chips-reset{
  margin:5px 0 0;width:auto;align-self:flex-start;
  font-size:9.5px;color:var(--muted);background:none;border:0;
  cursor:pointer;padding:0;text-decoration:underline dotted;
}
.conv-chips-reset:hover{color:var(--text);}

.conv-actions{display:flex;flex-direction:column;gap:6px;margin-top:10px;}
.conv-actions button{
  width:100%;padding:9px 10px;border-radius:var(--radius);cursor:pointer;
  font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center;gap:7px;
  background:var(--panel2);border:1px solid var(--border);color:var(--text);transition:all .12s;
}
.conv-actions button:hover{border-color:var(--border-hi);}
#convExportBtn{background:rgba(88,166,255,.14);border-color:#58a6ff;color:#79c0ff;}
#convExportBtn:hover{background:rgba(88,166,255,.22);}
#convClearBtn{color:#f85149;border-color:rgba(248,81,73,.3);}
#convClearBtn:hover{background:rgba(248,81,73,.1);}

/* --- панель таблиці --- */
.conv-toolbar{
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  padding:9px 12px;border-bottom:1px solid var(--border);background:var(--panel);
}
#convSearch{
  flex:1 1 220px;min-width:160px;padding:7px 10px;border-radius:var(--radius);
  background:var(--panel2);border:1px solid var(--border);color:var(--text);font-size:11px;
}
#convSearch:focus{outline:none;border-color:#58a6ff;}
.conv-stats{font-size:10.5px;color:var(--muted);display:flex;gap:10px;flex-wrap:wrap;}
.conv-stats b{color:var(--text);font-weight:700;}
.conv-stats .sel{color:#79c0ff;}
.conv-stats .dup{color:#e3b341;}
.conv-selacts{display:flex;gap:5px;margin-left:auto;}
.conv-selacts button{
  width:auto;margin:0;flex:0 0 auto;
  padding:6px 10px;border-radius:var(--radius);cursor:pointer;font-size:10px;font-weight:600;
  background:var(--panel2);border:1px solid var(--border);color:var(--muted);
}
.conv-selacts button:hover{color:var(--text);border-color:var(--border-hi);}

.conv-tablewrap{flex:1 1 auto;overflow:auto;min-height:0;}
/* Список без сторінок: ширини колонок фіксовані по шапці, рядки однакової
   висоти — від неї залежить точність віртуальної прокрутки. */
#convTable{width:100%;border-collapse:collapse;font-size:11px;table-layout:fixed;}
#convTable th.chk{width:34px;}
#convTable th.num{width:56px;}
#convTable th.oblast{width:150px;}
#convTable th.group{width:185px;}
#convTable th.lat{width:150px;}
#convTable th.mgrs{width:155px;}
#convTable th.source{width:160px;}
#convTable th.act{width:36px;}
#convTable tbody tr{height:30px;}
#convTable tbody td{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
#convTable tr.conv-spacer{height:auto;}
#convTable tr.conv-spacer td{padding:0;border:0;}
#convTable tr.conv-spacer:hover{background:none;}
#convTable th{
  position:sticky;top:0;z-index:2;
  background:var(--panel);border-bottom:1px solid var(--border-hi);
  padding:8px 9px;text-align:left;font-size:9.5px;font-weight:700;
  color:var(--muted);text-transform:uppercase;letter-spacing:.4px;
  cursor:pointer;white-space:nowrap;user-select:none;
}
#convTable th:hover{color:var(--text);}
#convTable th .arr{opacity:.5;font-size:8px;margin-left:3px;}
#convTable th.nosort{cursor:default;}
#convTable td{padding:0 9px;border-bottom:1px solid var(--border);vertical-align:middle;}
#convTable tbody tr:hover{background:rgba(255,255,255,.03);}
#convTable tbody tr.off{opacity:.42;}
#convTable td.num{color:var(--muted);font-size:10px;text-align:right;white-space:nowrap;}
#convTable td.coord{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:10.5px;white-space:nowrap;}
#convTable td.mgrs{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:10.5px;color:var(--muted);white-space:nowrap;}
#convTable td.src{color:var(--muted);font-size:10px;max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
#convTable td.name{min-width:0;}
#convTable td.oblast{white-space:nowrap;}
#convTable td.oblast .guess{color:var(--muted);font-size:9px;margin-left:4px;}
.conv-type{display:inline-flex;align-items:center;gap:5px;white-space:nowrap;}
.conv-type .dot{width:8px;height:8px;border-radius:50%;flex-shrink:0;}
.conv-row-btn{
  background:none;border:0;color:var(--muted);cursor:pointer;padding:2px 4px;font-size:11px;
}
.conv-row-btn:hover{color:#79c0ff;}
#convTable input[type=checkbox]{cursor:pointer;accent-color:#58a6ff;}

/* Пагінатор лишився в розмітці, але не використовується: список суцільний. */
.conv-pager{
  display:none!important;align-items:center;justify-content:center;gap:8px;
  padding:8px;border-top:1px solid var(--border);background:var(--panel);font-size:10.5px;color:var(--muted);
}
.conv-pager button{
  width:auto;margin:0;flex:0 0 auto;
  padding:5px 12px;border-radius:var(--radius);cursor:pointer;font-size:10px;
  background:var(--panel2);border:1px solid var(--border);color:var(--text);
}
.conv-pager span{white-space:nowrap;}
.conv-pager button:disabled{opacity:.4;cursor:default;}

.conv-empty{
  flex:1 1 auto;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:10px;color:var(--muted);text-align:center;padding:30px;
}
.conv-empty i{font-size:34px;opacity:.35;}
.conv-empty h4{margin:0;font-size:14px;color:var(--text);font-weight:600;}
.conv-empty p{margin:0;font-size:11px;line-height:1.6;max-width:430px;}

/* --- історія завантажень --- */
.conv-hist-title{font-size:12px;font-weight:700;color:#79c0ff;display:flex;align-items:center;gap:7px;}
.conv-hist-wrap{flex:1 1 auto;overflow:auto;min-height:0;padding:10px 12px 20px;}
.conv-hist-day{margin-bottom:14px;}
.conv-hist-date{
  position:sticky;top:0;z-index:2;display:flex;align-items:center;gap:8px;
  padding:6px 2px;background:var(--bg);
  font-size:11px;font-weight:700;color:var(--text);
}
.conv-hist-date i{color:var(--muted);font-size:10px;}
.conv-hist-date span{font-size:10px;color:var(--muted);font-weight:600;}
.conv-hist-item{
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  padding:8px 10px;margin-top:5px;border-radius:var(--radius);
  background:var(--panel2);border:1px solid var(--border);
}
.conv-hist-item:hover{border-color:var(--border-hi);}
.conv-hist-item.mine{border-color:rgba(88,166,255,.38);background:rgba(88,166,255,.06);}
.conv-hist-time{font-size:11px;font-weight:700;color:var(--text);white-space:nowrap;}
.conv-hist-who{
  font-size:9.5px;font-weight:700;padding:2px 7px;border-radius:10px;white-space:nowrap;
  background:rgba(255,255,255,.07);color:var(--muted);
}
.conv-hist-item.mine .conv-hist-who{background:rgba(88,166,255,.16);color:#79c0ff;}
.conv-hist-name{
  flex:1 1 220px;min-width:0;font-size:11px;color:var(--text);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.conv-hist-meta{font-size:10px;color:var(--muted);display:flex;gap:9px;flex-wrap:wrap;}
.conv-hist-meta b{color:var(--text);font-weight:700;}
.conv-hist-obl{font-size:9.5px;color:var(--muted);flex:1 1 100%;line-height:1.5;}
.conv-hist-acts{display:flex;gap:5px;margin-left:auto;}
.conv-hist-acts button{
  width:auto;margin:0;flex:0 0 auto;
  padding:5px 9px;border-radius:var(--radius);cursor:pointer;font-size:10px;font-weight:600;
  background:var(--panel);border:1px solid var(--border);color:var(--muted);
}
.conv-hist-acts button:hover{color:var(--text);border-color:var(--border-hi);}
.conv-hist-acts button[data-hist-del]{color:#f85149;border-color:rgba(248,81,73,.3);}
.conv-hist-empty{font-size:10px;color:var(--muted);padding:4px 2px;}

/* Кнопка повернення з карти до таблиці */
#convBackBar{
  display:none;position:absolute;left:50%;transform:translateX(-50%);top:12px;z-index:900;
  align-items:center;gap:10px;padding:7px 12px;border-radius:20px;
  background:rgba(13,17,23,.92);border:1px solid #58a6ff;color:#79c0ff;
  font-size:11px;font-weight:700;box-shadow:0 4px 18px rgba(0,0,0,.45);
}
body.mode-convert.conv-map #convBackBar{display:flex;}
#convBackBar button{
  width:auto;margin:0;
  background:rgba(88,166,255,.15);border:1px solid rgba(88,166,255,.4);color:#79c0ff;
  padding:4px 10px;border-radius:12px;cursor:pointer;font-size:10px;font-weight:700;
}
#convBackBar span{color:var(--muted);font-weight:600;}

/* --- вікно експорту --- */
#convExportModal{
  display:none;position:fixed;inset:0;z-index:100000;
  background:rgba(1,4,9,.72);backdrop-filter:blur(3px);
  align-items:center;justify-content:center;padding:16px;
}
#convExportModal.show{display:flex;}
.conv-modal-box{
  width:100%;max-width:440px;max-height:90vh;overflow:auto;
  background:var(--panel);border:1px solid var(--border-hi);border-radius:12px;padding:18px;
}
.conv-modal-box h3{margin:0 0 4px;font-size:15px;color:#79c0ff;}
.conv-modal-box .hint{margin:0 0 14px;font-size:10.5px;color:var(--muted);line-height:1.5;}
.conv-field{margin-bottom:13px;}
.conv-field>label{display:block;font-size:9.5px;font-weight:700;text-transform:uppercase;letter-spacing:.4px;color:var(--muted);margin-bottom:6px;}
.conv-opts{display:flex;flex-direction:column;gap:5px;}
.conv-opts label{
  display:flex;align-items:flex-start;gap:8px;padding:7px 9px;border-radius:var(--radius);
  background:var(--panel2);border:1px solid var(--border);cursor:pointer;font-size:11px;color:var(--text);
}
.conv-opts label:hover{border-color:var(--border-hi);}
.conv-opts input{margin-top:2px;accent-color:#58a6ff;}
.conv-opts small{display:block;color:var(--muted);font-size:9.5px;line-height:1.4;margin-top:2px;}
#convExportName,#convExportTop,#convExportDate{
  width:100%;padding:8px 10px;border-radius:var(--radius);
  background:var(--panel2);border:1px solid var(--border);color:var(--text);font-size:11px;
}
#convExportName:focus,#convExportTop:focus,#convExportDate:focus{outline:none;border-color:#58a6ff;}
.conv-field-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.conv-field-row>div>label{display:block;font-size:9.5px;font-weight:700;text-transform:uppercase;letter-spacing:.4px;color:var(--muted);margin-bottom:6px;}
.conv-modal-acts{display:flex;gap:8px;margin-top:6px;}
.conv-modal-acts button{
  flex:1;margin:0;padding:10px;border-radius:var(--radius);cursor:pointer;font-size:11px;font-weight:700;
  border:1px solid var(--border);background:var(--panel2);color:var(--text);
}
#convExportGo{background:rgba(88,166,255,.16);border-color:#58a6ff;color:#79c0ff;}
#convExportGo:hover{background:rgba(88,166,255,.26);}

@media (max-width:820px){
  .conv-toolbar{padding:8px;}
  .conv-selacts{margin-left:0;}
  /* На вузькому екрані MGRS і файл прибираємо разом із їхніми клітинками шапки
     (клас шапки — source, клас клітинки — src). */
  #convTable td.mgrs,#convTable th.mgrs,
  #convTable td.src,#convTable th.source{display:none;}
}