/* Shared styles for Radio Backend (Material-inspired on Bootstrap) */
:root {
  --muted: #475569;          /* text-secondary */
  --primary: #2563eb;        /* Blue 600 */
  --on-primary: #ffffff;
  --surface: #ffffff;
  --surface-variant: #f1f5f9;
  --border: rgba(2, 6, 23, 0.08);
}

/* Generic section wrapper (layout defines .glass/.card-glass) */
.section { padding: 18px; }

/* Stats blocks */
.stats-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 1em; }
.stat-item { text-align: center; padding: 1em; background: var(--surface-variant); border: 1px solid var(--border); border-radius: 10px; }
.stat-number { font-size: 1.6em; font-weight: 700; color: var(--primary); }
.stat-label { color: var(--muted); margin-top: 0.25em; }

/* Tables */
.table { width: 100%; border-collapse: collapse; color: inherit; }
.table th, .table td { padding: 0.85em; text-align: left; border-bottom: 1px solid var(--border); }
.table th { background: var(--surface-variant); color: inherit; font-weight: 600; }
.table tr:hover { background: rgba(37, 99, 235, .06); }

/* Search */
.search-box { margin-bottom: 1em; }
.search-input { width: 100%; padding: 0.8em; border: 1px solid var(--border); background: var(--surface); color: inherit; border-radius: 8px; font-size: 1em; }

/* Directory banner */
.directory-info { background: rgba(37, 99, 235, .10); padding: 1em; border-radius: 10px; margin-bottom: 1em; color: #1d4ed8; border: 1px solid rgba(37, 99, 235, .2); }
.directory-path { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; font-weight: 600; color: #1d4ed8; }

/* Buttons */
.info-btn { background: var(--primary); border: none; color: var(--on-primary); padding: 0.45em 0.7em; border-radius: 8px; cursor: pointer; transition: transform 0.15s ease, filter 0.15s ease; font-size: 0.95em; }
.info-btn:hover { filter: brightness(0.95); transform: translateY(-1px); }

/* Generic overlay */
.overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.45); z-index: 9998; opacity: 0; visibility: hidden; transition: all 0.3s ease; }
.overlay.show { opacity: 1; visibility: visible; }

/* Utilities */
.text-muted-soft { color: var(--muted) !important; }
.mono { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; }