/* ═══════════════════════════════════════════════════════════════════════════
   Port Operations Guide — index page
   Compass Virtual Airlines · user/themes/compass-virtual/css/port-index.css

   ⚑ Lifted out of the page on 2026-09-16, along with the search logic and the
   305-entry PORTS array, which is now /ports.json. The page itself was 61 KB,
   of which 53 KB was that array and 4 KB was style and script — leaving about
   4 KB of actual content.

   ⚑ SEPARATE FROM port-operations.css, which styles the port pages themselves.
   These two sheets share nothing: this is a searchable table, those are
   tabbed reference pages. Keeping them apart means the 304 port pages do not
   carry the index's CSS and vice versa.
   ═══════════════════════════════════════════════════════════════════════════ */

#port-index { font-size: 13px; }
.pi-controls { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 8px; }
#pi-search { flex: 1; min-width: 200px; padding: 8px 12px; border: 1px solid #dde0e4; border-radius: 6px; font-size: 13px; outline: none; }
#pi-search:focus { border-color: #6d97a8; box-shadow: 0 0 0 2px rgba(109,151,168,0.15); }
.pi-filters, .pi-regions { display: flex; gap: 6px; flex-wrap: wrap; }
.pi-btn, .pi-rbtn { padding: 5px 10px; border: 1px solid #dde0e4; border-radius: 5px; background: white; font-size: 12px; cursor: pointer; color: #555; transition: all 0.15s; white-space: nowrap; }
.pi-btn:hover, .pi-rbtn:hover { border-color: #6d97a8; color: #4a7a8a; }
.pi-btn.active { background: #6d97a8; border-color: #6d97a8; color: white; }
.pi-rbtn.active { background: #4a7a8a; border-color: #4a7a8a; color: white; }
.pi-count { font-size: 11px; opacity: 0.8; }
.pi-summary { font-size: 12px; color: #8a9099; margin-bottom: 8px; }
.pi-table { width: 100%; border-collapse: collapse; }
.pi-table th { background: #e8f0f3; color: #4a7a8a; font-size: 11px; font-weight: 500; text-transform: uppercase; letter-spacing: 0.5px; padding: 8px 10px; text-align: left; border-bottom: 1px solid #c8d8e0; white-space: nowrap; }
.pi-table th.sortable { cursor: pointer; user-select: none; }
.pi-table th.sortable:hover { background: #d8eaf0; }
.sort-icon { color: #9ab8c4; font-size: 10px; }
.pi-table th.sort-asc .sort-icon::after { content: ' ↑'; }
.pi-table th.sort-desc .sort-icon::after { content: ' ↓'; }
.pi-table td { padding: 7px 10px; border-bottom: 0.5px solid #f0f2f3; vertical-align: middle; }
.pi-table tr:hover td { background: #f7fafc; }
.pi-port { font-weight: 500; color: #333; }
.pi-port a { color: #4a7a8a; text-decoration: none; font-weight: 500; }
.pi-port a:hover { color: #c8962e; text-decoration: underline; }
.pi-port-dot { display: inline-block; width: 6px; height: 6px; background: #c8962e; border-radius: 50%; margin-left: 5px; vertical-align: middle; }
.pi-code { font-family: monospace; font-size: 12px; color: #4a7a8a; font-weight: 600; }
.pi-badge { display: inline-block; padding: 2px 7px; border-radius: 10px; font-size: 11px; font-weight: 500; margin-right: 3px; white-space: nowrap; }
.pi-badge-Mainline { background: #e8f0f3; color: #4a7a8a; }
.pi-badge-Cargo { background: #fff3e0; color: #c8962e; }
.pi-badge-Express { background: #e8f5ec; color: #2a7a40; }