/* ======================================== LT Scanner - Section-Specific Styles ======================================== */ /* Results grid */ .results-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: var(--space-md); } @media (max-width: 1400px) { .results-grid { grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); } } @media (max-width: 1100px) { .results-grid { grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); } } .filter-row { display: flex; gap: var(--space-md); flex-wrap: wrap; align-items: flex-end; } .action-row { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: var(--space-md); margin-top: var(--space-md); } .status { font-family: system-ui, sans-serif; font-size: var(--font-sm); color: var(--text-muted); padding: var(--space-lg); text-align: center; } .empty-state { text-align: center; padding: var(--space-xl) var(--space-md); color: var(--text-muted); background: var(--bg-elevated); border-radius: 4px; border: 1px solid var(--border); } @media (max-width: 900px) { .action-row { flex-direction: column; align-items: stretch; } } /* Filter Controls */ .filter-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: var(--space-sm); } .filter-controls { display: flex; gap: var(--space-sm); align-items: center; } #filter-select { background: var(--bg); color: var(--text); border: 1px solid var(--border); border-radius: 4px; padding: var(--space-xs) var(--space-sm); font-size: var(--font-sm); outline: none; } #filter-select:focus { border-color: var(--accent); } .btn-small { padding: var(--space-xs) var(--space-sm); font-size: var(--font-xs); } /* Page header */ .page-header { margin-bottom: var(--space-lg); } .page-title { font-size: var(--font-xxl); margin-bottom: var(--space-xs); } .page-subtitle { font-size: var(--font-xs); color: var(--text-muted); margin: 0; } /* Control panel */ .control-panel { background: var(--bg-elevated); border: 1px solid var(--border); border-radius: 4px; padding: var(--space-md); margin-bottom: var(--space-lg); } .input-label { font-size: var(--font-xs); font-weight: 600; color: var(--text-dim); text-transform: uppercase; letter-spacing: 0.5px; } .filter-textarea { width: 100%; min-height: 50px; max-height: 120px; background: var(--bg); color: var(--text); border: 1px solid var(--border); border-radius: 4px; padding: var(--space-sm); font-family: "Monaco", "Menlo", monospace; font-size: var(--font-sm); resize: vertical; outline: none; } .filter-textarea:focus { border-color: var(--accent); } .tf-selector { display: flex; gap: var(--space-xs); align-items: center; } .tf-btn { background: var(--bg); color: var(--text-muted); border: 1px solid var(--border); padding: var(--space-xs) var(--space-sm); font-size: var(--font-xs); font-weight: 600; border-radius: 4px; cursor: pointer; transition: all 0.2s; } .tf-btn:hover { border-color: var(--accent); } .tf-btn.active { background: var(--accent); color: #000; border-color: var(--accent); }