/** * Amnezia Admin — Cyberpunk theme overrides */ ::-webkit-scrollbar { width: 6px; height: 6px; } ::-webkit-scrollbar-track { background: #0b0d1a; } ::-webkit-scrollbar-thumb { background: #252b55; border-radius: 3px; } ::-webkit-scrollbar-thumb:hover { background: var(--admin-accent); } /* Panels & cards */ .admin-content .card, .dash-panel, .sl-panel { border-radius: var(--admin-radius); border-color: rgba(0, 240, 255, 0.12); background: linear-gradient(160deg, rgba(13, 16, 37, 0.95) 0%, rgba(17, 22, 51, 0.88) 100%); box-shadow: var(--admin-shadow); transition: border-color 0.2s, box-shadow 0.2s; } .admin-content .card:hover, .dash-panel:hover, .sl-panel:hover { border-color: rgba(0, 240, 255, 0.22); } .admin-content .card-header h2, .dash-panel-head h2, .sl-panel__head h2 { font-family: var(--admin-font-display); font-size: 0.88rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: #e0e6ff; } .dash-panel-head i, .sl-panel__head i, .admin-content .card-header > i { color: var(--admin-accent); filter: drop-shadow(0 0 6px var(--admin-accent-glow)); } /* Stats tiles */ .dash-stat { border-radius: var(--admin-radius); border-color: rgba(0, 240, 255, 0.12); background: linear-gradient(160deg, rgba(13, 16, 37, 0.95) 0%, rgba(17, 22, 51, 0.85) 100%); } .dash-stat:hover { border-color: rgba(0, 240, 255, 0.35); box-shadow: 0 12px 28px rgba(0, 0, 0, 0.35), 0 0 20px rgba(0, 240, 255, 0.08); } .dash-stat-icon { border-radius: var(--admin-radius); } .dash-stat-label { font-family: var(--admin-font-mono); letter-spacing: 0.1em; color: #555d80; } /* Quick actions */ .dash-action { border-radius: var(--admin-radius); border-color: rgba(0, 240, 255, 0.1); background: rgba(17, 22, 51, 0.6); } .dash-action:hover { border-color: rgba(0, 240, 255, 0.35); background: rgba(0, 240, 255, 0.06); box-shadow: 0 0 20px rgba(0, 240, 255, 0.08); } .dash-action--primary { border-color: rgba(0, 240, 255, 0.4); background: linear-gradient(135deg, rgba(0, 240, 255, 0.12) 0%, rgba(255, 45, 123, 0.06) 100%); } .dash-action--primary:hover { border-color: rgba(0, 240, 255, 0.6); box-shadow: 0 0 28px rgba(0, 240, 255, 0.15); } .dash-action-icon { border-radius: var(--admin-radius); background: rgba(0, 240, 255, 0.1); color: var(--admin-accent); border: 1px solid rgba(0, 240, 255, 0.2); } .dash-action-text strong { font-family: var(--admin-font-display); font-size: 0.82rem; letter-spacing: 0.04em; text-transform: uppercase; color: #e0e6ff; } /* Alerts */ .dash-alert { border-radius: var(--admin-radius); border-color: rgba(255, 226, 61, 0.35); background: rgba(255, 226, 61, 0.06); color: #ffe23d; } /* Code & mono */ .admin-content code, .code-inline, .dash-info-user code, .sl-url-result__text, .sl-id, .sl-creation__cid, .mono { font-family: var(--admin-font-mono) !important; } .code-inline, .admin-page-links .code-inline, .admin-page-settings .code-inline, .dash-info-user code { background: rgba(0, 240, 255, 0.08); color: var(--admin-accent); border: 1px solid rgba(0, 240, 255, 0.15); border-radius: 2px; } /* Tables */ .sl-table-wrap { border-radius: var(--admin-radius); border-color: rgba(0, 240, 255, 0.15); box-shadow: inset 0 0 0 1px rgba(0, 240, 255, 0.04); } .sl-table thead th { background: rgba(13, 16, 37, 0.98); color: var(--admin-accent) !important; font-family: var(--admin-font-mono); letter-spacing: 0.1em; border-bottom-color: rgba(0, 240, 255, 0.2); } .sl-table tbody td { color: #c8d0f0 !important; border-bottom-color: rgba(26, 31, 61, 0.8); } .sl-table tbody tr:hover td { background: rgba(0, 240, 255, 0.04); } .sl-id { color: var(--admin-accent-2); font-weight: 600; } .sl-url-link { color: #8892b8; } .sl-url-link:hover { color: var(--admin-accent); text-shadow: 0 0 8px var(--admin-accent-glow); } /* Inputs */ .sl-input, .admin-content .form-control, .admin-content .form-select, .admin-content input[type="text"], .admin-content input[type="number"], .admin-content input[type="date"], .admin-content input[type="datetime-local"], .admin-content input[type="search"], .admin-content textarea, .admin-content select { border-radius: var(--admin-radius); border-color: rgba(0, 240, 255, 0.18); background: rgba(5, 6, 15, 0.8); color: #e0e6ff; font-family: var(--admin-font-body); transition: border-color 0.15s, box-shadow 0.15s; } .sl-input:focus, .admin-content .form-control:focus, .admin-content .form-select:focus, .admin-content input:focus, .admin-content textarea:focus, .admin-content select:focus { border-color: var(--admin-accent); box-shadow: 0 0 0 2px rgba(0, 240, 255, 0.15), 0 0 16px rgba(0, 240, 255, 0.1); background: rgba(5, 6, 15, 0.95); color: #e0e6ff; } .sl-search__bar { border-radius: var(--admin-radius); border-color: rgba(0, 240, 255, 0.18); background: rgba(5, 6, 15, 0.7); } .sl-search__bar:focus-within { border-color: rgba(0, 240, 255, 0.45); box-shadow: 0 0 20px rgba(0, 240, 255, 0.1); } .sl-search__btn { background: rgba(0, 240, 255, 0.15); color: var(--admin-accent); border-radius: var(--admin-radius); font-family: var(--admin-font-mono); font-size: 0.78rem; letter-spacing: 0.06em; text-transform: uppercase; } .sl-search__btn:hover { background: rgba(0, 240, 255, 0.25); box-shadow: 0 0 16px var(--admin-accent-glow); } /* Buttons */ .sl-btn-generate, .sl-btn-save-timing, .sl-btn-cleanup, .sl-btn-migrate, .admin-content .btn-primary { border-radius: var(--admin-radius); font-family: var(--admin-font-display); font-size: 0.78rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; border: 1px solid rgba(0, 240, 255, 0.45); background: linear-gradient(135deg, rgba(0, 240, 255, 0.18) 0%, rgba(0, 240, 255, 0.06) 100%); color: var(--admin-accent); box-shadow: 0 0 16px rgba(0, 240, 255, 0.1); transition: box-shadow 0.15s, border-color 0.15s, transform 0.12s; } .sl-btn-generate:hover, .sl-btn-save-timing:hover, .sl-btn-cleanup:hover:not(:disabled), .sl-btn-migrate:hover, .admin-content .btn-primary:hover { border-color: var(--admin-accent); background: linear-gradient(135deg, rgba(0, 240, 255, 0.28) 0%, rgba(255, 45, 123, 0.1) 100%); color: #fff; box-shadow: 0 0 24px var(--admin-accent-glow); transform: translateY(-1px); } .sl-btn-copy, .admin-content .btn-outline-secondary { border-radius: var(--admin-radius); border-color: rgba(0, 240, 255, 0.25); color: #8892b8; font-family: var(--admin-font-mono); font-size: 0.78rem; } .sl-btn-copy:hover, .admin-content .btn-outline-secondary:hover { border-color: var(--admin-accent); color: var(--admin-accent); background: rgba(0, 240, 255, 0.06); } .sl-chip { border-radius: var(--admin-radius); border-color: rgba(0, 240, 255, 0.2); font-family: var(--admin-font-mono); font-size: 0.75rem; } .sl-chip.active, .sl-chip:hover { border-color: var(--admin-accent); background: rgba(0, 240, 255, 0.12); color: var(--admin-accent); box-shadow: 0 0 12px rgba(0, 240, 255, 0.15); } /* Config cards */ .sl-creation { border-radius: var(--admin-radius); border-color: rgba(0, 240, 255, 0.12); background: rgba(5, 6, 15, 0.5); } .sl-creation:hover { border-color: rgba(0, 240, 255, 0.25); } .sl-creation--deleted { border-color: rgba(255, 56, 96, 0.2); opacity: 0.75; } .sl-configs-details summary { font-family: var(--admin-font-mono); color: #8892b8; } .sl-configs-details[open] summary { color: var(--admin-accent); } /* Server sidebar (configs page) */ .sl-sidebar { border-radius: var(--admin-radius); border-color: rgba(0, 240, 255, 0.15); background: rgba(13, 16, 37, 0.9); } .sl-sidebar__item.is-active, .sl-sidebar__item:hover { border-color: rgba(0, 240, 255, 0.35); background: rgba(0, 240, 255, 0.08); box-shadow: inset 3px 0 0 var(--admin-accent); } .sl-sidebar__item.is-active .sl-sidebar__name { color: var(--admin-accent); text-shadow: 0 0 8px var(--admin-accent-glow); } /* Pagination */ .sl-pager__btn { border-radius: var(--admin-radius); border-color: rgba(0, 240, 255, 0.18); background: rgba(5, 6, 15, 0.7); font-family: var(--admin-font-mono); } .sl-pager__btn:hover:not(.is-disabled):not(.is-active) { border-color: var(--admin-accent); color: var(--admin-accent); box-shadow: 0 0 12px rgba(0, 240, 255, 0.12); } .sl-pager__page.is-active { background: var(--admin-accent); color: #05060f; border-color: var(--admin-accent); box-shadow: 0 0 16px var(--admin-accent-glow); font-weight: 700; } /* Timing form modal */ .sl-timing-form { border-radius: var(--admin-radius); border-color: rgba(0, 240, 255, 0.25); background: linear-gradient(160deg, #0d1025 0%, #111633 100%); box-shadow: 0 24px 64px rgba(0, 0, 0, 0.6), 0 0 1px rgba(0, 240, 255, 0.3); } .sl-timing-form__head strong { font-family: var(--admin-font-display); letter-spacing: 0.06em; text-transform: uppercase; color: var(--admin-accent); } .sl-timing-form__section { font-family: var(--admin-font-mono); color: var(--admin-accent-2); letter-spacing: 0.1em; } .sl-form-module { border-color: rgba(0, 240, 255, 0.12); background: rgba(8, 12, 28, 0.5); } .sl-form-module__head { font-family: var(--admin-font-mono); color: var(--admin-accent-2); letter-spacing: 0.1em; background: rgba(0, 240, 255, 0.04); border-bottom-color: rgba(0, 240, 255, 0.1); } .sl-switch input:checked + .sl-switch__track { background: rgba(0, 240, 255, 0.85); border-color: var(--admin-accent); box-shadow: 0 0 14px var(--admin-accent-glow); } .sl-switch-row--master { background: rgba(0, 240, 255, 0.05); border-color: rgba(0, 240, 255, 0.18); } .sl-server-toolbar__btn { font-family: var(--admin-font-mono); letter-spacing: 0.04em; } .sl-server-toolbar__count { font-family: var(--admin-font-mono); color: var(--admin-accent); border-color: rgba(0, 240, 255, 0.2); background: rgba(0, 240, 255, 0.06); } .sl-server-pick:has(.js-server-pick:checked) { background: rgba(0, 240, 255, 0.07); } .sl-btn-save-timing { font-family: var(--admin-font-display); letter-spacing: 0.08em; text-transform: uppercase; background: transparent; color: var(--admin-accent); border: 1px solid var(--admin-accent); box-shadow: 0 0 16px rgba(0, 240, 255, 0.15); } .sl-btn-save-timing:hover { background: rgba(0, 240, 255, 0.12); color: #fff; } /* URL result */ .sl-url-result { border-radius: var(--admin-radius); border-color: rgba(0, 255, 157, 0.3); background: rgba(0, 255, 157, 0.05); } .sl-url-result__label { color: #00ff9d; font-family: var(--admin-font-mono); letter-spacing: 0.08em; text-transform: uppercase; } /* Status filter pills */ .sl-status-filters { display: flex; flex-wrap: wrap; align-items: center; gap: 0.4rem; margin-bottom: 0.65rem; width: 100%; } .sl-status-pill { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.38rem 0.72rem; border-radius: var(--admin-radius); border: 1px solid rgba(0, 240, 255, 0.18); background: rgba(5, 6, 15, 0.7); color: #8892b8; font-family: var(--admin-font-mono); font-size: 0.75rem; font-weight: 600; letter-spacing: 0.04em; text-decoration: none; text-transform: uppercase; transition: border-color 0.15s, color 0.15s, box-shadow 0.15s, background 0.15s; } .sl-status-pill__count { display: inline-flex; align-items: center; justify-content: center; min-width: 1.35rem; padding: 0.1rem 0.35rem; border-radius: 2px; background: rgba(255, 255, 255, 0.06); font-size: 0.68rem; color: inherit; } .sl-status-pill:hover { border-color: rgba(0, 240, 255, 0.4); color: var(--admin-accent); box-shadow: 0 0 12px rgba(0, 240, 255, 0.1); } .sl-status-pill.is-active { color: #05060f; border-color: transparent; box-shadow: 0 0 16px rgba(0, 240, 255, 0.2); } .sl-status-pill.is-active .sl-status-pill__count { background: rgba(0, 0, 0, 0.2); color: inherit; } .sl-status-pill--active.is-active { background: #00ff9d; box-shadow: 0 0 16px rgba(0, 255, 157, 0.35); } .sl-status-pill--expired.is-active { background: #ffe23d; color: #1a1400; box-shadow: 0 0 16px rgba(255, 226, 61, 0.35); } .sl-status-pill--expired.is-active .sl-status-pill__count { color: #1a1400; } .sl-status-pill--cleaned.is-active { background: #ff3860; box-shadow: 0 0 16px rgba(255, 56, 96, 0.35); } .sl-status-pill:not(.sl-status-pill--active):not(.sl-status-pill--expired):not(.sl-status-pill--cleaned).is-active { background: var(--admin-accent); box-shadow: 0 0 16px var(--admin-accent-glow); } .sl-controls-bar .sl-toolbar { margin-left: auto; } @media (min-width: 768px) { .sl-controls-bar { align-items: flex-start; } .sl-status-filters { margin-bottom: 0; width: auto; flex: 1; } } /* Controls bar */ .sl-controls-bar { border-radius: var(--admin-radius); border-color: rgba(0, 240, 255, 0.12); background: rgba(13, 16, 37, 0.6); } .sl-toggle span { font-family: var(--admin-font-mono); font-size: 0.78rem; color: #8892b8; } /* Renewal codes page */ .admin-page-renewal .rc-code-display, .admin-page-renewal .rc-code-pill { color: var(--admin-accent); font-family: var(--admin-font-mono); text-shadow: 0 0 8px var(--admin-accent-glow); } .admin-page-renewal .rc-days-badge { color: #00ff9d; background: rgba(0, 255, 157, 0.1); border: 1px solid rgba(0, 255, 157, 0.25); border-radius: var(--admin-radius); font-family: var(--admin-font-mono); } .admin-page-renewal .rc-usage-fill { background: linear-gradient(90deg, var(--admin-accent), var(--admin-accent-3)); box-shadow: 0 0 8px var(--admin-accent-glow); } /* Settings form */ .admin-page-settings .form-label, .sl-field__label { font-family: var(--admin-font-mono); font-size: 0.72rem; letter-spacing: 0.08em; text-transform: uppercase; color: #8892b8; } /* Server labels page */ .sl-server-row { border-radius: var(--admin-radius); border-color: rgba(0, 240, 255, 0.1); } .sl-server-row:hover { border-color: rgba(0, 240, 255, 0.25); background: rgba(0, 240, 255, 0.03); } .sl-hint a { color: var(--admin-accent); } .sl-hint--warn { color: #ffe23d; border-color: rgba(255, 226, 61, 0.25); background: rgba(255, 226, 61, 0.06); } /* Icons glow on hover */ .admin-content .fa-solid, .admin-content .fa-regular { transition: filter 0.15s; } .sl-panel__head:hover i, .dash-panel-head:hover i { filter: drop-shadow(0 0 8px var(--admin-accent-glow)); }