.countries-browser { min-width:0; }
.countries-controls { display:grid; grid-template-columns:minmax(260px,1fr) auto auto; align-items:center; gap:9px; margin-bottom:14px; }
.countries-search { display:flex; min-width:0; height:44px; align-items:center; gap:8px; padding:8px 12px; border:1px solid #bcc9d8; border-radius:10px; background:#fff; color:#60758d; }
.countries-search:focus-within { border-color:#4b8bec; outline:3px solid rgba(75,139,236,.16); }
.countries-search input { width:100%; min-width:0; border:0; outline:0; background:transparent; }
.countries-search .material-icons { font-size:20px; }
.countries-clear { display:inline-flex; height:44px; align-items:center; justify-content:center; gap:5px; padding:8px 13px; border:1px solid #cbd6e3; border-radius:9px; background:#f8fafc; color:#29405c; font-weight:700; }
.countries-clear:hover { border-color:#8eabc9; background:#f2f6fa; }
.countries-clear .material-icons { font-size:18px; }
.countries-count { min-width:100px; margin:0; color:#64748b; font-size:13px; text-align:end; white-space:nowrap; }
.countries-table-wrap { position:relative; max-height:72vh; overflow:auto; border:1px solid #dce4ed; border-radius:12px; background:#fff; box-shadow:0 8px 24px rgba(23,44,76,.05); }
.countries-table-wrap:focus-visible { outline:3px solid #8ab0f8; outline-offset:2px; }
.countries-table { width:100%; border-collapse:separate; border-spacing:0; color:#263a55; font-size:13px; }
.countries-table th,.countries-table td { padding:10px 9px; border-bottom:1px solid #e7ecf2; background:#fff; overflow-wrap:break-word; text-align:start; vertical-align:middle; white-space:normal; }
.countries-table thead th { position:sticky; z-index:3; top:0; border-bottom:1px solid #cbd6e3; background:#f3f6fa; color:#43536a; font-size:11px; letter-spacing:.02em; text-transform:uppercase; }
.countries-table tbody tr:nth-child(even)>* { background:#f8fafc; }
.countries-table tbody tr:hover>* { background:#edf5ff; }
.countries-table tbody tr:last-child>* { border-bottom:0; }
.countries-flag { width:48px; text-align:center!important; font-size:20px; white-space:nowrap!important; }
.countries-name { width:16%; font-weight:750; }
.countries-table thead .countries-flag,.countries-table thead .countries-name { z-index:5; background:#f3f6fa; }
.countries-code { font-family:"SFMono-Regular",Consolas,"Liberation Mono",monospace; font-variant-numeric:tabular-nums; white-space:nowrap!important; }
.countries-empty { margin:0; padding:48px 20px; color:#64748b; text-align:center; }
@media (min-width:761px) {
  .countries-table-wrap { overflow-x:hidden; overflow-y:auto; }
  .countries-table { table-layout:fixed; }
  .countries-code-table th:nth-child(3) { width:13%; }
  .countries-code-table th:nth-child(4) { width:11%; }
  .countries-code-table th:nth-child(5) { width:17%; }
  .countries-code-table th:nth-child(6) { width:10%; }
  .countries-code-table th:nth-child(7),.countries-code-table th:nth-child(8) { width:8%; }
  .countries-code-table th:nth-child(9) { width:11%; }
  .countries-translation-table .countries-name { width:17%; }
}
@media (max-width:760px) {
  .countries-controls { grid-template-columns:minmax(0,1fr) auto; gap:7px; }
  .countries-count { grid-column:1/-1; grid-row:2; min-width:0; text-align:start; }
  .countries-table-wrap { max-height:68vh; border-radius:10px; }
  .countries-code-table { min-width:960px; }
  .countries-translation-table { min-width:1180px; }
  .countries-table th,.countries-table td { padding:9px 10px; overflow-wrap:normal; white-space:nowrap; }
  .countries-flag { position:sticky; z-index:1; left:0; width:42px; min-width:42px; padding-inline:7px!important; }
  .countries-name { position:sticky; z-index:1; left:42px; width:auto; min-width:145px; box-shadow:1px 0 0 #e1e7ee; }
}
@media (max-width:420px) {
  .countries-search { height:40px; padding:7px 9px; }
  .countries-clear { width:40px; height:40px; padding:6px; font-size:0; }
  .countries-clear .material-icons { font-size:18px; }
  .countries-name { min-width:132px; }
}
