/* The input sits inside this wrapper, so the WRAPPER is the flex item in .input-group,
   not the input. Without flex:1 here the wrapper shrinks to its content and the input
   never fills the row, which is why this box looked narrow next to the identical one on
   the documents page. The input's own width:100% then fills the wrapper. */
.autocomplete-wrapper {
    flex: 1;
    min-width: 240px; position: relative; }
#formSearch { width: 100%; padding: 10px 14px; font-size: 0.95rem; border: 1px solid var(--border); border-radius: 4px; background: var(--input-bg); color: var(--text); }
#formSearch:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 2px rgba(56,97,147,0.15); }

.suggestions-dropdown { display: none; position: absolute; top: 100%; left: 0; right: 0; background: var(--surface); border: 1px solid var(--border); border-top: none; border-radius: 0 0 6px 6px; max-height: 240px; overflow-y: auto; z-index: 100; box-shadow: 0 4px 12px rgba(0,0,0,0.1); }
.suggestions-dropdown.open { display: block; }
.suggestion-item { padding: 10px 14px; cursor: pointer; font-size: 0.9rem; color: var(--text); border-bottom: 1px solid var(--border); }
.suggestion-item:last-child { border-bottom: none; }
.suggestion-item:hover, .suggestion-item.active { background: rgba(56,97,147,0.08); }
.suggestion-item mark { background: rgba(56,97,147,0.2); color: inherit; padding: 0 1px; border-radius: 2px; }
.no-results { padding: 10px 14px; color: var(--text-muted); font-size: 0.9rem; font-style: italic; }

.results-header { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; flex-wrap: wrap; }
.results-header h2 { margin: 0; flex: 1; }
.results-count { font-size: 0.85rem; color: var(--text-muted); }

.results-filters { display: flex; align-items: flex-end; gap: 10px; margin-bottom: 16px; flex-wrap: wrap; }
.filter-group { display: flex; flex-direction: column; gap: 3px; }
.filter-group label { font-size: 0.75rem; color: var(--text-muted); font-weight: 500; }
.filter-group input[type="date"] { padding: 6px 10px; border: 1px solid var(--border); border-radius: 4px; font-size: 0.85rem; background: var(--input-bg); color: var(--text); }
.btn-sm { padding: 7px 14px; font-size: 0.82rem; }
.btn-download { margin-left: auto; }

.results-table-wrapper { overflow-x: auto; }
.results-table { width: 100%; border-collapse: collapse; font-size: 0.85rem; }
.results-table th { background: var(--accent); color: #fff; padding: 10px 12px; text-align: left; white-space: nowrap; position: sticky; top: 0; }
.results-table td { padding: 8px 12px; border-bottom: 1px solid var(--border); color: var(--text); max-width: 250px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.results-table tr:hover td { background: rgba(56,97,147,0.04); }
.results-table td.wrap { white-space: normal; word-break: break-word; }

.loading { text-align: center; padding: 20px; color: var(--text-muted); }


[data-theme="dark"] .suggestions-dropdown { background:#2d333b; border-color:#444c56; }
[data-theme="dark"] .suggestion-item { color:#f0f3f6; border-color:#444c56; }
[data-theme="dark"] .suggestion-item:hover, [data-theme="dark"] .suggestion-item.active { background:#22272e; }
[data-theme="dark"] .suggestion-item mark { background:rgba(162,210,255,0.2); }
[data-theme="dark"] #formSearch { background:#2a2f37; border-color:#444c56; color:#f0f3f6; }
[data-theme="dark"] .results-table th { background:#22272e; }
[data-theme="dark"] .results-table td { border-color:#444c56; }
[data-theme="dark"] .results-table tr:hover td { background:rgba(162,210,255,0.04); }
[data-theme="dark"] .filter-group input[type="date"] { background:#2a2f37; border-color:#444c56; color:#f0f3f6; }

/* Which tier's submissions are on screen. Always stated, because "live only" and
   "everything" are otherwise indistinguishable to someone about to act on a submission. */
.tier-notice {
    display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
    padding: 10px 14px; margin: 0 0 14px; border-radius: 5px; font-size: .88rem;
    background: var(--file-bg); border-left: 4px solid #386193;
}
.tier-ok   { color: var(--text-muted); }
.tier-warn { color: #6b4a00; }
.tier-notice:has(.tier-warn) { background: #fff8e1; border-left-color: #c79100; }
.tier-toggle {
    margin-left: auto; background: #386193; border: 1px solid #386193; color: #fff;
    padding: 5px 12px; border-radius: 20px; font-size: .8rem; cursor: pointer;
}
.tier-toggle:hover { background: #0e335b; border-color: #0e335b; }
.tier-toggle:focus-visible { outline: 3px solid #e2ca76; outline-offset: 2px; }
/* Signed out panel. Shown instead of bouncing the user straight back into sign-in, which is what
   used to happen because Entra ID keeps its own session after Cognito ends hers. */
.signed-out-panel {
    max-width: 34rem;
    margin: 4rem auto;
    padding: 2rem;
    text-align: center;
}

.signed-out-panel h1 {
    margin-top: 0;
}

.signed-out-note {
    font-size: 0.9rem;
    opacity: 0.8;
}