/* =============================================================================
   dashboard.css — Dark-theme base styles for admin pages.
   Uses admin CSS vars (--bg-base, --text-primary, etc.) — admin is always dark.
   ============================================================================= */

/* Body / HTML — Foundation sets background:#fefefe; color:#0a0a0a */
body, html {
    background-color: var(--bg-base) !important;
    color: var(--text-primary) !important;
}

/* Headings — Foundation resets them; restore dark palette */
h1, h2, h3, h4, h5, h6 {
    color: var(--text-primary);
}

/* Sidebar section headers — Foundation inflates h4 to ~1.5rem; lock it down */
#sidebar .sidebar-section-header h4,
#sidebar-content h4 {
    font-size: 0.85rem !important;
    font-weight: 600;
    margin: 0;
    line-height: 1.4;
}

/* Links */
a { color: var(--accent-info); }
a:hover { color: var(--accent-bright); }

/* Paragraphs / labels */
p { color: var(--text-primary); }
label { color: var(--accent-bright); }
small { color: var(--text-muted); }

/* Native form elements — Foundation styles them light */
input[type="text"],
input[type="password"],
input[type="email"],
input[type="number"],
input[type="search"],
input[type="url"],
input[type="tel"],
select,
textarea {
    background-color: var(--bg-input) !important;
    color: var(--text-primary) !important;
    border: 1px solid var(--border) !important;
    box-shadow: none !important;
}
input::placeholder,
textarea::placeholder { color: var(--text-muted) !important; }

/* Foundation table resets */
table { background: transparent !important; }
thead, tbody, tfoot, tr, td, th {
    background: transparent;
    color: var(--text-primary);
    border-color: var(--border);
}

/* Foundation sets <code> to a pinkish light bg */
code {
    background: var(--code-bg);
    color: var(--code-string);
    border: none;
}

/* Foundation details/summary */
details > summary { cursor: pointer; color: var(--text-muted); }

/* Foundation callout / alert boxes */
.callout { background: var(--bg-elevated); border-color: var(--border); color: var(--text-primary); }

/* Scope tabs (themes section) */
.scope-tabs { display: flex; gap: 6px; margin-bottom: 10px; }
.scope-tab {
    background: var(--bg-hover);
    border: 1px solid var(--border);
    color: var(--text-secondary);
    padding: 3px 14px;
    border-radius: 4px;
    cursor: pointer;
    font-size: 0.82rem;
}
.scope-tab.active {
    background: var(--accent-dark);
    border-color: var(--accent);
    color: #fff;
}

/* Global DB search results */
.db-global-results { display: flex; flex-direction: column; gap: 6px; padding: 8px 0; }
.db-global-result-item {
    background: var(--bg-elevated);
    border: 1px solid var(--border);
    border-radius: 5px;
    padding: 10px 14px;
    cursor: pointer;
    transition: border-color .15s;
}
.db-global-result-item:hover { border-color: var(--accent); }
.db-result-table { font-weight: 600; color: var(--accent); margin-right: 10px; }
.db-result-count { font-size: 0.8rem; color: var(--text-muted); }
.db-result-preview { margin-top: 5px; display: flex; flex-wrap: wrap; gap: 4px; }
.db-result-row {
    font-size: 0.78rem;
    color: var(--text-secondary);
    background: var(--bg-hover);
    border-radius: 3px;
    padding: 1px 6px;
    max-width: 300px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.services-container { padding: 15px; }
.services-columns { display: flex; gap: 20px; }
.services-column { flex: 1; min-width: 300px; }
.services-column-title { margin: 0 0 10px 0; font-size: 1.1rem; display: flex; align-items: center; gap: 8px; }
.services-count { font-size: 0.85rem; font-weight: normal; opacity: 0.7; }
.services-list { background: var(--bg-elevated); border-radius: 6px; min-height: 200px; max-height: 60vh; overflow-y: auto; }
.services-empty { padding: 20px; text-align: center; color: var(--text-muted); }
.services-item { display: flex; justify-content: space-between; align-items: center; padding: 10px 15px; border-bottom: 1px solid var(--border); }
.services-item:last-child { border-bottom: none; }
.services-item:hover { background: var(--bg-hover); }
.services-item-favorite { background: rgba(86, 156, 214, 0.1); }
.services-item-info { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1; }
.services-item-name { font-weight: 500; color: var(--text-primary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.services-item-status { font-size: 0.8rem; color: var(--text-muted); }
.services-status-running { color: var(--color-success); }
.services-status-stopped { color: var(--text-muted); }
.services-status-failed { color: var(--color-error); }
.services-item-actions { display: flex; gap: 5px; }
.services-btn { background: none; border: 1px solid var(--border); border-radius: 4px; padding: 4px 8px; cursor: pointer; color: var(--text-secondary); transition: all .15s; }
.services-btn:hover { background: var(--bg-hover); color: var(--text-primary); }
.services-btn-fav.active { color: #f0c040; border-color: #f0c040; }
.services-btn-cmd:hover { background: var(--accent-dark); color: #fff; }
.services-loading { padding: 40px; text-align: center; color: var(--text-muted); }
.services-error { padding: 20px; color: var(--color-error); text-align: center; }
.services-hdr-controls { display: flex; gap: 10px; }