/*
 * ============================================
 * ROGUE.AgentRMM — TacticalRMM Custom Theme
 * Brand Guide v1.0 | 2026
 * ============================================
 *
 * Palette:
 *   Primary:   #00FF8C (Rogue Green)
 *   Secondary: #8B5CF6 (Electric Violet)
 *   Accent:    #FF006E (Hot Magenta)
 *   Void:      #050508
 *   Dark 1:    #0A0A10
 *   Dark 2:    #111118
 *   Dark 3:    #1A1A24
 *   Dark 4:    #252532
 *
 * Typography:
 *   Display:   Orbitron (Google Fonts)
 *   Body:      Rajdhani (Google Fonts)
 *   Code:      JetBrains Mono (Google Fonts)
 */

/* === FONT IMPORTS === */
@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@400;500;600;700;800;900&family=Rajdhani:wght@300;400;500;600;700&family=JetBrains+Mono:wght@300;400;500;600;700&display=swap');

/* === CSS VARIABLES === */
:root {
  --rogue-green: #00FF8C;
  --rogue-green-dim: #00CC70;
  --rogue-green-glow: rgba(0, 255, 140, 0.3);
  --rogue-green-subtle: rgba(0, 255, 140, 0.08);
  --rogue-violet: #8B5CF6;
  --rogue-violet-glow: rgba(139, 92, 246, 0.3);
  --rogue-magenta: #FF006E;
  --rogue-void: #050508;
  --rogue-dark-1: #0A0A10;
  --rogue-dark-2: #111118;
  --rogue-dark-3: #1A1A24;
  --rogue-dark-4: #252532;
}

/* === QUASAR DARK THEME OVERRIDES === */
body.body--dark {
  background-color: var(--rogue-void) !important;
  font-family: 'Rajdhani', -apple-system, BlinkMacSystemFont, sans-serif !important;
}

/* === PRIMARY COLOR OVERRIDE === */
/* Quasar uses --q-primary for theming */
body.body--dark {
  --q-primary: #00FF8C !important;
  --q-secondary: #8B5CF6 !important;
  --q-accent: #FF006E !important;
  --q-dark: #0A0A10 !important;
  --q-dark-page: #050508 !important;
  --q-positive: #00FF8C !important;
  --q-negative: #FF006E !important;
  --q-info: #8B5CF6 !important;
  --q-warning: #FFD600 !important;
}

/* === TYPOGRAPHY === */
.q-toolbar__title,
.q-drawer .q-item__label--header,
.text-h1, .text-h2, .text-h3, .text-h4, .text-h5, .text-h6 {
  font-family: 'Orbitron', 'Rajdhani', monospace !important;
  letter-spacing: 0.5px;
}

code, pre, .q-field__native[type="text"],
.q-editor__content code {
  font-family: 'JetBrains Mono', 'Fira Code', monospace !important;
}

/* === TOP HEADER BAR === */
.q-header {
  background-color: var(--rogue-dark-1) !important;
  border-bottom: 1px solid var(--rogue-dark-3) !important;
}

.q-header .q-toolbar {
  background-color: var(--rogue-dark-1) !important;
}

/* === SIDEBAR / DRAWER === */
.q-drawer {
  background-color: var(--rogue-dark-1) !important;
  border-right: 1px solid var(--rogue-dark-3) !important;
}

.q-drawer .q-item:hover {
  background-color: var(--rogue-dark-3) !important;
}

.q-drawer .q-item.q-router-link--active,
.q-drawer .q-item--active {
  background-color: var(--rogue-green-subtle) !important;
  border-left: 3px solid var(--rogue-green) !important;
}

.q-drawer .q-item.q-router-link--active .q-item__label,
.q-drawer .q-item--active .q-item__label {
  color: var(--rogue-green) !important;
}

.q-drawer .q-item.q-router-link--active .q-icon,
.q-drawer .q-item--active .q-icon {
  color: var(--rogue-green) !important;
}

/* Sidebar icons */
.q-drawer .q-icon {
  color: rgba(240, 240, 245, 0.6) !important;
}

.q-drawer .q-item:hover .q-icon {
  color: var(--rogue-green) !important;
}

/* === MAIN PAGE AREA === */
.q-page-container {
  background-color: var(--rogue-void) !important;
}

.q-page {
  background-color: var(--rogue-void) !important;
}

/* === BUTTONS === */
.q-btn.bg-primary,
.bg-primary {
  background-color: var(--rogue-green) !important;
  color: var(--rogue-void) !important;
}

.q-btn.bg-primary:hover {
  box-shadow: 0 0 20px var(--rogue-green-glow) !important;
}

.q-btn.bg-secondary,
.bg-secondary {
  background-color: var(--rogue-violet) !important;
}

.q-btn.bg-negative,
.bg-negative {
  background-color: var(--rogue-magenta) !important;
}

/* Outlined buttons */
.q-btn--outline.text-primary {
  color: var(--rogue-green) !important;
  border-color: var(--rogue-green) !important;
}

.q-btn--outline.text-primary:hover {
  background-color: var(--rogue-green-subtle) !important;
}

/* Flat buttons */
.q-btn--flat.text-primary {
  color: var(--rogue-green) !important;
}

/* === CARDS === */
.q-card {
  background-color: var(--rogue-dark-2) !important;
  border: 1px solid var(--rogue-dark-3) !important;
}

.q-card .q-card__section {
  border-color: var(--rogue-dark-3) !important;
}

/* === TABLES === */
.q-table {
  background-color: var(--rogue-dark-2) !important;
}

.q-table thead tr {
  background-color: var(--rogue-dark-1) !important;
}

.q-table thead th {
  color: var(--rogue-green) !important;
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 11px !important;
  letter-spacing: 1px;
  text-transform: uppercase;
  border-color: var(--rogue-dark-3) !important;
}

.q-table tbody tr:hover {
  background-color: var(--rogue-dark-3) !important;
}

.q-table tbody td {
  border-color: var(--rogue-dark-3) !important;
  color: #E0E0E8 !important;
}

/* Selected rows */
.q-table tbody tr.selected {
  background-color: var(--rogue-green-subtle) !important;
}

/* === INPUTS / FIELDS === */
.q-field--dark .q-field__control,
.q-field .q-field__control {
  background-color: var(--rogue-dark-2) !important;
}

.q-field--focused .q-field__control {
  border-color: var(--rogue-green) !important;
  box-shadow: 0 0 0 2px var(--rogue-green-glow) !important;
}

.q-field--dark .q-field__label,
.q-field .q-field__label {
  color: rgba(240, 240, 245, 0.5) !important;
}

.q-field--focused .q-field__label {
  color: var(--rogue-green) !important;
}

/* === TABS === */
.q-tab--active {
  color: var(--rogue-green) !important;
}

.q-tab__indicator {
  background-color: var(--rogue-green) !important;
}

.q-tabs {
  border-bottom: 1px solid var(--rogue-dark-3) !important;
}

/* === DIALOGS / MODALS === */
.q-dialog__inner > .q-card {
  background-color: var(--rogue-dark-2) !important;
  border: 1px solid var(--rogue-dark-4) !important;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.7) !important;
}

.q-dialog__backdrop {
  background-color: rgba(5, 5, 8, 0.85) !important;
  backdrop-filter: blur(4px) !important;
}

/* === TOOLTIPS === */
.q-tooltip {
  background-color: var(--rogue-dark-2) !important;
  color: #F0F0F5 !important;
  border: 1px solid var(--rogue-dark-4) !important;
  font-family: 'Rajdhani', sans-serif !important;
}

/* === MENUS / DROPDOWNS === */
.q-menu {
  background-color: var(--rogue-dark-2) !important;
  border: 1px solid var(--rogue-dark-4) !important;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5) !important;
}

.q-menu .q-item:hover {
  background-color: var(--rogue-dark-3) !important;
}

/* === BADGES / CHIPS === */
.q-badge {
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 11px !important;
  letter-spacing: 0.5px;
}

.q-chip {
  background-color: var(--rogue-green-subtle) !important;
  color: var(--rogue-green) !important;
  border: 1px solid rgba(0, 255, 140, 0.2) !important;
  font-family: 'JetBrains Mono', monospace !important;
}

/* === TOGGLE / CHECKBOX === */
.q-toggle__inner--truthy {
  color: var(--rogue-green) !important;
}

.q-checkbox__inner--truthy {
  color: var(--rogue-green) !important;
}

/* === PROGRESS / LOADING === */
.q-spinner,
.q-linear-progress__track {
  color: var(--rogue-green) !important;
}

.q-linear-progress__model {
  background-color: var(--rogue-green) !important;
}

.q-circular-progress__svg circle:last-child {
  stroke: var(--rogue-green) !important;
}

/* === SCROLLBAR === */
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

::-webkit-scrollbar-track {
  background: var(--rogue-dark-1);
}

::-webkit-scrollbar-thumb {
  background: var(--rogue-dark-4);
  border-radius: 3px;
}

::-webkit-scrollbar-thumb:hover {
  background: var(--rogue-green-dim);
}

/* === TEXT SELECTION === */
::selection {
  background-color: var(--rogue-green) !important;
  color: var(--rogue-void) !important;
}

/* === NOTIFICATION BANNERS === */
.q-notification {
  background-color: var(--rogue-dark-2) !important;
  border: 1px solid var(--rogue-dark-4) !important;
}

.q-notification--positive {
  border-left: 3px solid var(--rogue-green) !important;
}

.q-notification--negative {
  border-left: 3px solid var(--rogue-magenta) !important;
}

.q-notification--info {
  border-left: 3px solid var(--rogue-violet) !important;
}

/* === EXPANSION ITEMS === */
.q-expansion-item {
  border-color: var(--rogue-dark-3) !important;
}

.q-expansion-item__container > .q-item:hover {
  background-color: var(--rogue-dark-3) !important;
}

/* === TIMELINE (Agent events) === */
.q-timeline__dot {
  color: var(--rogue-green) !important;
}

/* === SEPARATOR === */
.q-separator {
  background-color: var(--rogue-dark-3) !important;
}

/* === TRMM-SPECIFIC: Agent status colors === */
.text-positive, .text-green {
  color: var(--rogue-green) !important;
}

.text-primary {
  color: var(--rogue-green) !important;
}

.text-secondary {
  color: var(--rogue-violet) !important;
}

.text-negative, .text-red {
  color: var(--rogue-magenta) !important;
}

/* === TRMM-SPECIFIC: Dashboard summary cards === */
.q-card .text-h4,
.q-card .text-h5,
.q-card .text-h6 {
  font-family: 'Orbitron', monospace !important;
  letter-spacing: 1px;
}

/* === TRMM-SPECIFIC: Tree view (client/site/agent hierarchy) === */
.q-tree__node--selected {
  background-color: var(--rogue-green-subtle) !important;
}

.q-tree__node--selected > .q-tree__node-header {
  color: var(--rogue-green) !important;
}

/* === TRMM-SPECIFIC: Login page === */
.q-page.flex.flex-center {
  background-color: var(--rogue-void) !important;
}

/* === ROGUE SIGNATURE: Subtle scanline overlay === */
body::after {
  content: '';
  position: fixed;
  top: 0; left: 0; right: 0; bottom: 0;
  background: repeating-linear-gradient(
    transparent,
    transparent 2px,
    rgba(0, 255, 140, 0.005) 2px,
    rgba(0, 255, 140, 0.005) 4px
  );
  pointer-events: none;
  z-index: 99999;
}

/* === ROGUE SIGNATURE: Subtle grid background === */
body::before {
  content: '';
  position: fixed;
  top: 0; left: 0; right: 0; bottom: 0;
  background-image:
    linear-gradient(rgba(0, 255, 140, 0.015) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0, 255, 140, 0.015) 1px, transparent 1px);
  background-size: 60px 60px;
  pointer-events: none;
  z-index: -1;
}

/* === TRMM-SPECIFIC: Logo text replacement via CSS === */
/* Hide default TRMM text and replace with Rogue branding */
.q-toolbar__title {
  font-size: 0 !important;
  line-height: 0 !important;
}

.q-toolbar__title::after {
  content: 'Rogue.AgentRMM';
  font-family: 'Orbitron', monospace !important;
  font-size: 16px !important;
  font-weight: 700;
  letter-spacing: 2px;
  color: var(--rogue-green) !important;
  line-height: normal !important;
}

/*
 * ============================================
 * End of ROGUE.AgentRMM Theme
 * Rogue AI and MSP Services LLC
 * roguemsp.ai | rogueaimsp.com
 * ============================================
 */
