/* ═══════════════════════════════════════════
   ISC Defence Intelligence — Shared Components
   Nav dropdown, search overlay, article lists,
   filter tabs, archive controls. Include on ALL
   v2 pages. v5 — Phase 3 (19 Apr 2026).
   ═══════════════════════════════════════════ */

/* ─── NAV DROPDOWN (Insights) ─── */
.nav-dropdown{position:relative}
.nav-dropdown>a{display:flex;align-items:center;gap:5px}
.nav-dropdown>a::after{display:none}
.nav-dropdown .dropdown-arrow{font-size:.55rem;transition:transform .25s;margin-left:2px}
.nav-dropdown-menu{position:absolute;top:100%;left:-16px;min-width:260px;background:rgba(6,20,40,.98);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(201,152,42,.15);padding:8px 0;opacity:0;visibility:hidden;transform:translateY(8px);transition:all .25s ease;z-index:1001;box-shadow:0 12px 40px rgba(0,0,0,.4)}
.nav-dropdown:hover .nav-dropdown-menu,.nav-dropdown:focus-within .nav-dropdown-menu{opacity:1;visibility:visible;transform:translateY(0)}
.nav-dropdown:hover .dropdown-arrow{transform:rotate(180deg)}
.nav-dropdown-menu a{display:flex;align-items:center;gap:10px;padding:10px 20px;color:rgba(255,255,255,.75);text-decoration:none;font-size:.82rem;font-weight:500;transition:all .15s;white-space:nowrap}
.nav-dropdown-menu a:hover{background:rgba(201,152,42,.1);color:var(--white)}
.nav-dropdown-menu a:hover::after{display:none}
.nav-dropdown-menu a .dd-icon{width:20px;text-align:center;font-size:.75rem;color:var(--gold);flex-shrink:0}
.nav-dropdown-menu .dd-divider{height:1px;background:rgba(201,152,42,.12);margin:6px 0}
.nav-dropdown-menu .dd-label{padding:8px 20px 4px;font-size:.6rem;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--gold);opacity:.6}

/* ─── SEARCH ICON IN NAV ─── */
.nav-search-btn{background:none;border:none;color:rgba(255,255,255,.7);cursor:pointer;padding:8px;font-size:.95rem;transition:color .2s;display:flex;align-items:center}
.nav-search-btn:hover{color:var(--white)}
.nav-search-hint{font-size:.6rem;color:rgba(255,255,255,.35);margin-left:6px;border:1px solid rgba(255,255,255,.15);padding:1px 6px;border-radius:3px;font-family:system-ui}

/* ─── SEARCH OVERLAY ─── */
#isc-search-overlay{position:fixed;inset:0;z-index:10000;display:none}
#isc-search-overlay.open{display:block}
.search-backdrop{position:absolute;inset:0;background:rgba(6,20,40,.75);backdrop-filter:blur(4px)}
.search-panel{position:relative;max-width:680px;margin:80px auto 0;background:var(--white,#fff);box-shadow:0 20px 60px rgba(0,0,0,.4);z-index:1;max-height:calc(100vh - 120px);display:flex;flex-direction:column}
.search-header{display:flex;align-items:center;border-bottom:2px solid var(--gold,#C9982A);padding:0 20px}
.search-input-wrap{flex:1;display:flex;align-items:center;gap:12px}
.search-icon{color:var(--gold,#C9982A);font-size:1.1rem}
#isc-search-input{flex:1;border:none;outline:none;font-size:1.05rem;padding:18px 0;font-family:inherit;background:transparent;color:var(--text,#2C2C2C)}
#isc-search-input::placeholder{color:var(--steel,#4A6078)}
.search-close{background:none;border:none;font-size:1.2rem;color:var(--steel,#4A6078);cursor:pointer;padding:8px;transition:color .2s}
.search-close:hover{color:var(--text,#2C2C2C)}
.search-results{flex:1;overflow-y:auto;padding:0}
.search-hint{padding:32px 24px;color:var(--text-light,#5A5A5A);font-size:.9rem;text-align:center}
.search-count{padding:12px 24px 8px;font-size:.72rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--gold,#C9982A)}
.search-result-item{display:flex;flex-direction:column;gap:4px;padding:14px 24px;text-decoration:none;border-bottom:1px solid var(--border,#D4D4D0);transition:background .15s}
.search-result-item:hover{background:rgba(201,152,42,.06)}
.sr-cat{font-size:.65rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--gold,#C9982A)}
.sr-title{font-size:.92rem;font-weight:600;color:var(--navy,#0B1F3A);line-height:1.35}
.sr-meta{font-size:.75rem;color:var(--steel,#4A6078)}
.search-footer{padding:10px 24px;font-size:.72rem;color:var(--text-light,#5A5A5A);text-align:center;border-top:1px solid var(--border,#D4D4D0)}
.search-footer kbd{background:#EEE;padding:1px 6px;border-radius:3px;font-family:system-ui;font-size:.68rem;border:1px solid #DDD}

/* ─── ARTICLE LIST (category pages, insights latest) ─── */
.article-list{display:flex;flex-direction:column}
.article-row{display:flex;justify-content:space-between;align-items:center;padding:16px 0;border-bottom:1px solid var(--border,#D4D4D0);text-decoration:none;gap:20px;transition:background .15s}
.article-row:hover{background:rgba(201,152,42,.04);padding-left:8px;padding-right:8px;margin-left:-8px;margin-right:-8px}
.article-row-left{display:flex;flex-direction:column;gap:4px;flex:1;min-width:0}
.article-row-cat{font-size:.62rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--gold,#C9982A)}
.article-row-title{font-size:.92rem;font-weight:600;color:var(--navy,#0B1F3A);line-height:1.35;overflow:hidden;text-overflow:ellipsis}
.article-row-right{display:flex;align-items:center;gap:16px;flex-shrink:0}
.article-row-score{font-size:.8rem}
.article-row-date{font-size:.78rem;color:var(--steel,#4A6078);white-space:nowrap}
.article-row-time{font-size:.75rem;color:var(--text-light,#5A5A5A);white-space:nowrap}
.no-articles{padding:32px 0;color:var(--text-light,#5A5A5A);font-style:italic}
.article-list-more{padding:20px 0;text-align:center}
.btn-show-more{background:none;border:1px solid var(--gold,#C9982A);color:var(--gold,#C9982A);padding:10px 24px;font-size:.82rem;font-weight:600;cursor:pointer;transition:all .2s;letter-spacing:.03em}
.btn-show-more:hover{background:var(--gold,#C9982A);color:var(--navy,#0B1F3A)}

/* ─── FILTER TABS ─── */
.filter-tabs{display:flex;flex-wrap:wrap;gap:6px;padding:16px 0 24px}
.filter-tab{background:none;border:1px solid var(--border,#D4D4D0);padding:6px 14px;font-size:.75rem;font-weight:600;color:var(--text-light,#5A5A5A);cursor:pointer;transition:all .2s;letter-spacing:.02em;white-space:nowrap}
.filter-tab:hover{border-color:var(--gold,#C9982A);color:var(--gold,#C9982A)}
.filter-tab.active{background:var(--navy,#0B1F3A);color:var(--white,#fff);border-color:var(--navy,#0B1F3A)}

/* ─── LATEST ARTICLES SECTION (insights page) ─── */
.latest-articles-section{margin-bottom:48px;padding-bottom:40px;border-bottom:1px solid var(--border,#D4D4D0)}
.latest-articles-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}
.latest-articles-header h3{font-family:'Playfair Display',serif;font-size:1.4rem;font-weight:700;color:var(--navy,#0B1F3A)}
.latest-articles-header a{font-size:.8rem;font-weight:600;color:var(--gold,#C9982A);text-decoration:none;letter-spacing:.03em}

/* ═══════════════════════════════════════════
   Phase 3 — Power-User Layer (19 Apr 2026)
   Search result grouping, keyboard-active state,
   mobile search trigger, archive controls.
   ═══════════════════════════════════════════ */

/* ─── Phase 3: Grouped search results ─── */
.sr-group{border-top:1px solid var(--border,#D4D4D0)}
.sr-group:first-child{border-top:none}
.sr-group-label{display:flex;justify-content:space-between;align-items:center;padding:10px 24px 6px;background:var(--offwht,#F5F5F0);font-size:.62rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--gold,#C9982A);position:sticky;top:0;z-index:1}
.sr-group-count{background:rgba(201,152,42,.14);color:var(--gold,#C9982A);padding:1px 10px;font-weight:700;font-size:.62rem;letter-spacing:.06em;border-radius:2px}
.search-result-item.is-active{background:rgba(201,152,42,.12);border-left:3px solid var(--gold,#C9982A);padding-left:21px}
.search-result-item[aria-selected="true"]{background:rgba(201,152,42,.12)}

/* ─── Phase 3: Mobile search trigger (shared fallback — insights/archive override inline) ─── */
.mobile-search-trigger{display:flex;align-items:center;gap:10px;color:var(--white,#fff);background:none;border:none;font-size:1.05rem;padding:14px 0;cursor:pointer;text-align:left;width:100%;font-family:inherit}
.mobile-search-trigger i{color:var(--gold,#C9982A);font-size:.95rem}
.mobile-search-trigger:hover{color:var(--gold,#C9982A)}

/* ─── Phase 3: Archive control bar (shared selectors for archive.html) ─── */
.archive-bar{background:var(--white,#fff);border-bottom:1px solid var(--border,#D4D4D0);position:sticky;top:72px;z-index:900;padding:16px 32px;box-shadow:0 2px 10px rgba(0,0,0,.04)}
.archive-bar-inner{max-width:1400px;margin:0 auto;display:flex;gap:12px;flex-wrap:wrap;align-items:center}
.archive-search{flex:1;min-width:240px;display:flex;align-items:center;gap:10px;background:var(--offwht,#F5F5F0);border:1px solid var(--border,#D4D4D0);padding:10px 14px;transition:border-color .2s}
.archive-search:focus-within{border-color:var(--gold,#C9982A)}
.archive-search i{color:var(--steel,#4A6078);font-size:.85rem}
.archive-search input{flex:1;border:none;outline:none;background:transparent;font-size:.85rem;color:var(--navy,#0B1F3A);font-family:inherit}
.archive-select{background:var(--white,#fff);border:1px solid var(--border,#D4D4D0);padding:10px 14px;font-size:.8rem;color:var(--navy,#0B1F3A);font-family:inherit;cursor:pointer;transition:border-color .2s;min-width:180px}
.archive-select:hover,.archive-select:focus{border-color:var(--gold,#C9982A);outline:none}
.archive-toggle{background:var(--white,#fff);border:1px solid var(--border,#D4D4D0);padding:10px 16px;font-size:.8rem;color:var(--text-light,#5A5A5A);font-family:inherit;cursor:pointer;display:flex;align-items:center;gap:8px;transition:all .2s;letter-spacing:.02em;font-weight:500}
.archive-toggle:hover{border-color:var(--gold,#C9982A);color:var(--navy,#0B1F3A)}
.archive-toggle.active{background:var(--navy,#0B1F3A);color:var(--white,#fff);border-color:var(--navy,#0B1F3A)}
.archive-toggle.active i{color:#ff6b35}

/* ─── Phase 3: Hot row highlighting (optional hook for renderTableLayout) ─── */
.article-row.is-hot .article-row-title{color:var(--navy,#0B1F3A)}
.article-row.is-hot{border-left:2px solid var(--gold,#C9982A);padding-left:10px}

/* ─── RESPONSIVE ─── */
@media(max-width:768px){
  .nav-dropdown-menu{position:fixed;top:72px;left:0;right:0;min-width:100%;max-height:60vh;overflow-y:auto}
  .search-panel{margin:20px 12px 0;max-height:calc(100vh - 40px)}
  .article-row{flex-direction:column;align-items:flex-start;gap:8px}
  .article-row-right{gap:12px}
  .filter-tabs{gap:4px}
  .filter-tab{padding:5px 10px;font-size:.7rem}
  .archive-bar{padding:14px 20px;top:72px}
  .archive-bar-inner{gap:8px}
  .archive-search{min-width:100%;order:-1}
  .archive-select{min-width:calc(50% - 4px);flex:1}
  .archive-toggle{flex:1;justify-content:center}
  .sr-group-label{padding:10px 16px 6px}
  .search-result-item.is-active{padding-left:21px}
}
