html, body { background-color: #16161a; margin: 0; }
.navbar.is-dark { background-color: #000000; }
.navbar-elevated { box-shadow: 0 8px 24px rgba(0,0,0,.35); border-bottom: 1px solid #2a2734; }
.title, .label, .subtitle { color: #eaeaea; }
.button.is-primary { background-color: #6c3ccf; border-color: #6c3ccf; }
.notification.is-primary { background-color: #6c3ccf; color: #fff; }
.notification.is-link { background-color: #7a5cff; color: #fff; }
.notification.is-info { background-color: #8a75ff; color: #fff; }
.box.has-background-dark { background-color: #1f1d2b; color: #eaeaea; }
input.input[readonly] { background: #2a2734; color: #ddd; }
.brand-logo { height: 48px; }
.brand-logo--navbar { height: 48px; max-height: 48px !important; margin-bottom: 0; }
.brand-logo--large { height: 160px; }
.main-section { background: linear-gradient(180deg, rgba(108,60,207,.15), rgba(22,22,26,0));}
.login-page { background: radial-gradient(1000px 500px at 10% 10%, rgba(108,60,207,.25), transparent), radial-gradient(800px 400px at 90% 90%, rgba(122,92,255,.25), transparent), #16161a; }
.login-card { background: #1f1d2b; border: none; border-radius: 16px; box-shadow: 0 12px 36px rgba(0,0,0,.45); }
.login-card .input { background: #2a2734; color: #eaeaea; border: 1px solid #3a3750; }
.login-card .input::placeholder { color: #b9b9b9; }
.login-card .label { color: #cfcfcf; }
.dashboard-hero { padding: 32px 0;  border-bottom: 1px solid #2a2734; }
.metric-card { display:flex; align-items:center; background:#1f1d2b; border:1px solid #2a2734; border-radius:12px; padding:16px; }
.metric-icon { width:48px; height:48px; display:flex; align-items:center; justify-content:center; background:#2a2734; border-radius:8px; color:#bfbff5; margin-right:12px; font-size:20px; }
.metric-content span { display:block; color:#cfcfcf; font-size:14px; }
.metric-content strong { display:block; color:#fff; font-size:22px; }
.quick-actions { margin-top:12px; display:flex; gap:12px; }
.glass-card { background: rgba(31,29,43,.9); border: 1px solid #2a2734; border-radius:8px; overflow:hidden; }
.glass-card .card-header { padding:12px 16px; border-bottom:1px solid #2a2734; color:#eaeaea; font-weight:600; }
.glass-card .card-content { padding:8px 12px; }
.list-item { display:flex; align-items:center; gap:12px; padding:10px 6px; border-bottom:1px dashed #2a2734; }
.list-item:last-child { border-bottom:none; }
.list-thumb { width:48px; height:48px; border-radius:8px; overflow:hidden; background:#2a2734; display:flex; align-items:center; justify-content:center; }
.list-thumb img { width:100%; height:100%; object-fit:cover; }
.thumb-placeholder { color:#bfbff5; font-size:18px; }
.list-meta { flex:1; }
.list-title { color:#fff; font-weight:600; }
.list-sub { color:#cfcfcf; font-size:12px; }
.inline-logo { height:20px; margin-left:8px; border-radius:4px; }
.tag { background:#2a2734; color:#eaeaea; border-radius:18px; padding:6px 10px; display:inline-block; font-size:12px; }
.page-header { margin-bottom: 16px; padding: 20px 0;  }
.page-header h1 { font-size: 24px; font-weight: 600; }
.page-header p { font-size: 14px; color: #bfbff5; }
.form-card { background:#1f1d2b; border:1px solid #2a2734; border-radius:12px; padding:16px; margin-bottom: 20px; }
.field { margin-bottom:12px; }
.label { display:block; font-weight:600; margin-bottom:6px; }
.table { background: none !important;}
.table-dark thead { background:#2a2734; color:#eaeaea; text-align: left; }
.table-dark tbody tr { background:#1f1d2b; }
.table-dark td, .table-dark th { border-color:#2a2734 !important; color:#eaeaea !important; }
.table-dark.is-striped tbody tr:not(.is-selected):nth-child(2n) { background:#222033; }
.table-dark a { color:#cfc9ff; }
.table-dark a:hover { color:#ffffff; }
.table-dark tbody tr:nth-child(even) { background:#222033; }
.table-dark tbody tr:hover { background:#342f42 !important; }
.table-dark tbody tr.is-used { background:#2b2640 !important; }
.input, .select select { background:#2a2734; color:#eaeaea; border:1px solid #3a3750; border-radius:8px; width: 100%; padding:10px 12px; line-height:1.4; box-sizing:border-box; }
.input::placeholder { color:#b9b9b9; }
.input:focus, .select select:focus { outline:2px solid #6c3ccf; border-color:#6c3ccf; box-shadow:0 0 0 3px rgba(108,60,207,.25); }
.button-group { display:flex; gap:8px; flex-wrap:nowrap; }
.navbar .menu-center { display:flex; justify-content:center; align-items:center; gap:8px; flex:1; }
.navbar .navbar-item.is-active { background:#6c3ccf; color:#fff !important; border-radius:8px; }
.navbar .navbar-item { color:#eaeaea; }
.navbar .navbar-item:hover { background:#2a2734; color:#fff; }
/* Tables */
.table th, .table td { vertical-align: middle !important; }
.table th, .table td { padding: 10px 12px; }
.table .table-thumb { width:64px; height:64px; object-fit:contain; background-color: #FFFFFF; border-radius:8px; }
.table .table-thumb--small { width:32px; height:32px; object-fit:cover; border-radius:6px; }
/* Icons in buttons */
.button i { font-size:18px; line-height:1; vertical-align:middle; margin-right:6px; }
.button--icon-only { display:inline-flex; align-items:center; justify-content:center; padding:6px; gap:0; }
.button.is-small.button--icon-only { padding:4px; }
.button--icon-only i { margin:0; }
.button { display:inline-flex; align-items:center; gap:6px; padding:8px 12px; background:#2a2734; color:#eaeaea; border:1px solid #3a3750; border-radius:8px; }
.button:hover { background:#3a3750; color:#ffffff; border-color:#4a4765; }
.button.is-primary { background:#6c3ccf; border-color:#6c3ccf; color:#ffffff; }
.button.is-link { background:#7a5cff; border-color:#7a5cff; color:#ffffff; }
.button.is-danger { background:#d4383f; border-color:#d4383f; color:#ffffff; }
.button.is-light { background:#2a2734; color:#eaeaea; border-color:#3a3750; }
.notification { padding:10px 14px; border-radius:8px; }
.help { font-size:12px; color:#cfcfcf; }
.checkbox { display:inline-flex; align-items:center; gap:8px; }
/* Text helpers */
.cell-ellipsis { display:inline-block; max-width: 280px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; vertical-align: middle; }
.cell-date { white-space: nowrap; font-variant-numeric: tabular-nums; }
.config-fields { margin-top: 8px; gap: 16px; }
.config-fields .column { margin-bottom: 12px; }
.config-fields .field { margin-bottom: 12px; }
/* Fallbacks to replace Bulma grid/level when removing Bulma */
.level { display:flex; align-items:center; justify-content:space-between; }
.level-left, .level-right { display:flex; align-items:center; gap:8px; }
.columns { display:grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap:12px; }
.column { grid-column: span 12 / span 12; }
.column.is-2 { grid-column: span 2 / span 2; }
.column.is-3 { grid-column: span 3 / span 3; }
.column.is-4 { grid-column: span 4 / span 4; }
.column.is-6 { grid-column: span 6 / span 6; }
.column.is-12 { grid-column: span 12 / span 12; }
.columns.is-centered { justify-items:center; }
.columns.is-multiline { grid-auto-flow: row; }
.container { max-width: 1200px; margin: 0 auto; padding: 0 16px; }
.has-text-light { color:#eaeaea; }
.is-fullwidth, .select.is-fullwidth, .select.is-fullwidth select, .input.is-fullwidth { width:100%; }
.select { display:block; }
.field.has-addons { display:flex; align-items:stretch; gap:6px; }
.control.is-expanded { flex:1; }
.button.is-small { padding:4px 8px; font-size:12px; }
.notification.is-danger { background:#d4383f; color:#fff; }
/* Pagination fallbacks */
.pagination { display:flex; justify-content:center; align-items:center; gap:8px; }
.pagination-list { display:flex; gap:6px; list-style:none; padding:0; margin:0; }
.pagination-link, .pagination-previous, .pagination-next {
  background:#2a2734; color:#eaeaea; border:1px solid #3a3750; border-radius:6px; padding:6px 10px; display:inline-block;
}
.pagination-link.is-current { background:#6c3ccf; border-color:#6c3ccf; color:#fff; }
