/*
 * Black Raven Service Desk - Adaptive Theme
 * Auto-switches between light and dark based on OS/browser preference
 *
 * Light: White backgrounds, #00875a green accent
 * Dark:  Black backgrounds, #00ff41 terminal green accent
 */

/* === BASE (Light Mode Default) === */

body {
  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  color: #1a1a1a !important;
  background-color: #f5f5f5 !important;
}

h1, h2, h3, h4, h5, h6 { color: #1a1a1a !important; }
a { color: #00875a !important; }
a:hover { color: #006644 !important; text-decoration: none !important; }
.text-muted, .subtle { color: #888888 !important; }

.navigation { background-color: #ffffff !important; border-right: 1px solid #e0e0e0 !important; }
.navigation .logo { filter: none; }
.header { background-color: #ffffff !important; border-bottom: 1px solid #e0e0e0 !important; }

.navigation .menu-item { color: #4a4a4a !important; transition: color 0.2s ease, background-color 0.2s ease; }
.navigation .menu-item:hover { color: #00875a !important; background-color: rgba(0, 135, 90, 0.05) !important; }
.navigation .menu-item.is-active { color: #00875a !important; background-color: rgba(0, 135, 90, 0.08) !important; border-left: 3px solid #00875a !important; }

.main { background-color: #f5f5f5 !important; }
.content { background-color: #ffffff !important; }

.btn--primary, .btn--action { background-color: #00875a !important; color: #ffffff !important; border: none !important; font-weight: 600 !important; transition: background-color 0.2s ease; }
.btn--primary:hover, .btn--action:hover { background-color: #006644 !important; }
.btn--secondary { background-color: transparent !important; color: #00875a !important; border: 1px solid #00875a !important; }
.btn--secondary:hover { background-color: rgba(0, 135, 90, 0.08) !important; }
.btn--danger { background-color: #dc2626 !important; color: #ffffff !important; }

.ticket-list .ticket-list-item { border-bottom: 1px solid #e0e0e0 !important; transition: background-color 0.15s ease; }
.ticket-list .ticket-list-item:hover { background-color: rgba(0, 135, 90, 0.03) !important; }
.ticket-list .ticket-list-item.is-active { background-color: rgba(0, 135, 90, 0.06) !important; border-left: 3px solid #00875a !important; }
.ticket-article { border-bottom: 1px solid #e0e0e0 !important; }

.priority.icon-priority-1 { color: #3b82f6 !important; }
.priority.icon-priority-2 { color: #f59e0b !important; }
.priority.icon-priority-3 { color: #dc2626 !important; }

input, textarea, select, .form-control { background-color: #ffffff !important; color: #1a1a1a !important; border: 1px solid #d0d0d0 !important; transition: border-color 0.2s ease; }
input:focus, textarea:focus, select:focus, .form-control:focus { border-color: #00875a !important; box-shadow: 0 0 0 2px rgba(0, 135, 90, 0.15) !important; outline: none !important; }
input::placeholder, textarea::placeholder { color: #aaaaaa !important; }

table { border-collapse: collapse !important; }
table th { background-color: #fafafa !important; color: #4a4a4a !important; border-bottom: 2px solid #00875a !important; text-transform: uppercase; font-size: 0.75rem; letter-spacing: 0.05em; }
table td { border-bottom: 1px solid #e0e0e0 !important; color: #1a1a1a !important; }
table tr:hover td { background-color: rgba(0, 135, 90, 0.03) !important; }

.badge, .tag { background-color: rgba(0, 135, 90, 0.1) !important; color: #00875a !important; border: 1px solid rgba(0, 135, 90, 0.3) !important; border-radius: 4px !important; font-size: 0.75rem; }

.card, .panel, .sidebar-content { background-color: #ffffff !important; border: 1px solid #e0e0e0 !important; border-radius: 6px !important; }

.modal-dialog .modal-content { background-color: #ffffff !important; border: 1px solid #d0d0d0 !important; }
.modal-backdrop { background-color: rgba(0, 0, 0, 0.4) !important; }

.login { background-color: #f5f5f5 !important; }
.login .hero-unit { background-color: #ffffff !important; border: 1px solid #e0e0e0 !important; }
.login .btn--primary { background-color: #00875a !important; color: #ffffff !important; }
.auth-provider .auth-provider-item { background-color: #ffffff !important; border: 1px solid #d0d0d0 !important; color: #1a1a1a !important; }
.auth-provider .auth-provider-item:hover { border-color: #00875a !important; background-color: rgba(0, 135, 90, 0.05) !important; }

::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: #f5f5f5; }
::-webkit-scrollbar-thumb { background: #cccccc; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: #00875a; }

.noty_bar { border: 1px solid #e0e0e0 !important; background-color: #ffffff !important; }
.noty_type__success { border-left: 4px solid #00875a !important; }
.noty_type__error { border-left: 4px solid #dc2626 !important; }
.noty_type__warning { border-left: 4px solid #f59e0b !important; }

.stat-widget { background-color: #ffffff !important; border: 1px solid #e0e0e0 !important; }
.stat-widget .stat-value { color: #00875a !important; }

.search input { background-color: #ffffff !important; color: #1a1a1a !important; border: 1px solid #d0d0d0 !important; }
.search input:focus { border-color: #00875a !important; }

/* Desktop SPA - Light */
.bg-neutral-50 { background-color: #ffffff !important; }
.text-black { color: #1a1a1a !important; }
.bg-yellow-300 { background-color: #00875a !important; color: #ffffff !important; }
button[type="submit"] { color: #ffffff !important; }
.bg-neutral-50 input { background-color: #fafafa !important; color: #1a1a1a !important; border: 1px solid #d0d0d0 !important; border-radius: 6px !important; }
.bg-neutral-50 input:focus { border-color: #00875a !important; box-shadow: 0 0 0 2px rgba(0, 135, 90, 0.15) !important; }
.bg-neutral-50 label, .bg-neutral-50 .formkit-label { color: #4a4a4a !important; }
.bg-neutral-50 a { color: #00875a !important; }
.bg-neutral-50 a:hover { color: #006644 !important; }
.bg-neutral-950 { background-color: #f5f5f5 !important; }
.text-stone-200 { color: #4a4a4a !important; }
.rounded-3xl { border: 1px solid #e0e0e0 !important; }
.bg-neutral-50 h1 { color: #1a1a1a !important; }

/* === DARK MODE === */

@media (prefers-color-scheme: dark) {

  body {
    color: #ffffff !important;
    background-color: #0a0a0a !important;
  }

  h1, h2, h3, h4, h5, h6 { color: #ffffff !important; }
  a { color: #00ff41 !important; }
  a:hover { color: #00cc34 !important; }
  .text-muted, .subtle { color: #6a6a6a !important; }

  .navigation { background-color: #0a0a0a !important; border-right: 1px solid #2a2a2a !important; }
  .navigation .logo { filter: brightness(1.1); }
  .header { background-color: #1a1a1a !important; border-bottom: 1px solid #2a2a2a !important; }

  .navigation .menu-item { color: #aaaaaa !important; }
  .navigation .menu-item:hover { color: #00ff41 !important; background-color: rgba(0, 255, 65, 0.05) !important; }
  .navigation .menu-item.is-active { color: #00ff41 !important; background-color: rgba(0, 255, 65, 0.08) !important; border-left: 3px solid #00ff41 !important; }

  .main { background-color: #111111 !important; }
  .content { background-color: #1a1a1a !important; }

  .btn--primary, .btn--action { background-color: #00ff41 !important; color: #0a0a0a !important; }
  .btn--primary:hover, .btn--action:hover { background-color: #00cc34 !important; box-shadow: 0 0 12px rgba(0, 255, 65, 0.3) !important; }
  .btn--secondary { color: #00ff41 !important; border: 1px solid #00ff41 !important; }
  .btn--secondary:hover { background-color: rgba(0, 255, 65, 0.1) !important; }

  .ticket-list .ticket-list-item { border-bottom: 1px solid #2a2a2a !important; }
  .ticket-list .ticket-list-item:hover { background-color: rgba(0, 255, 65, 0.03) !important; }
  .ticket-list .ticket-list-item.is-active { background-color: rgba(0, 255, 65, 0.06) !important; border-left: 3px solid #00ff41 !important; }
  .ticket-article { border-bottom: 1px solid #2a2a2a !important; }

  input, textarea, select, .form-control { background-color: #1a1a1a !important; color: #ffffff !important; border: 1px solid #3a3a3a !important; }
  input:focus, textarea:focus, select:focus, .form-control:focus { border-color: #00ff41 !important; box-shadow: 0 0 0 2px rgba(0, 255, 65, 0.15) !important; }
  input::placeholder, textarea::placeholder { color: #6a6a6a !important; }

  table th { background-color: #1a1a1a !important; color: #aaaaaa !important; border-bottom: 2px solid #00ff41 !important; }
  table td { border-bottom: 1px solid #2a2a2a !important; color: #ffffff !important; }
  table tr:hover td { background-color: rgba(0, 255, 65, 0.03) !important; }

  .badge, .tag { background-color: rgba(0, 255, 65, 0.1) !important; color: #00ff41 !important; border: 1px solid rgba(0, 255, 65, 0.3) !important; font-family: "Space Mono", monospace; }

  .card, .panel, .sidebar-content { background-color: #1a1a1a !important; border: 1px solid #2a2a2a !important; }

  .modal-dialog .modal-content { background-color: #1a1a1a !important; border: 1px solid #3a3a3a !important; }
  .modal-backdrop { background-color: rgba(0, 0, 0, 0.8) !important; }

  .login { background-color: #0a0a0a !important; }
  .login .hero-unit { background-color: #1a1a1a !important; border: 1px solid #2a2a2a !important; }
  .login .btn--primary { background-color: #00ff41 !important; color: #0a0a0a !important; }
  .auth-provider .auth-provider-item { background-color: #1a1a1a !important; border: 1px solid #3a3a3a !important; color: #ffffff !important; }
  .auth-provider .auth-provider-item:hover { border-color: #00ff41 !important; background-color: rgba(0, 255, 65, 0.05) !important; }

  ::-webkit-scrollbar-track { background: #0a0a0a; }
  ::-webkit-scrollbar-thumb { background: #3a3a3a; }
  ::-webkit-scrollbar-thumb:hover { background: #00ff41; }

  .noty_bar { border: 1px solid #3a3a3a !important; background-color: #1a1a1a !important; }
  .noty_type__success { border-left: 4px solid #00ff41 !important; }

  .stat-widget { background-color: #1a1a1a !important; border: 1px solid #2a2a2a !important; }
  .stat-widget .stat-value { color: #00ff41 !important; font-family: "Space Mono", monospace; }

  .search input { background-color: #1a1a1a !important; color: #ffffff !important; border: 1px solid #3a3a3a !important; }
  .search input:focus { border-color: #00ff41 !important; }

  /* Desktop SPA - Dark */
  .bg-neutral-50 { background-color: #1a1a1a !important; }
  .text-black { color: #ffffff !important; }
  .dark .bg-gray-500 { background-color: #1a1a1a !important; }
  .bg-yellow-300 { background-color: #00ff41 !important; color: #0a0a0a !important; }
  button[type="submit"] { color: #0a0a0a !important; }
  .bg-neutral-50 input { background-color: #111111 !important; color: #ffffff !important; border: 1px solid #3a3a3a !important; }
  .bg-neutral-50 input:focus { border-color: #00ff41 !important; box-shadow: 0 0 0 2px rgba(0, 255, 65, 0.15) !important; }
  .bg-neutral-50 label, .bg-neutral-50 .formkit-label { color: #aaaaaa !important; }
  .bg-neutral-50 a { color: #00ff41 !important; }
  .bg-neutral-50 a:hover { color: #00cc34 !important; }
  .bg-neutral-950 { background-color: #0a0a0a !important; }
  .text-stone-200 { color: #aaaaaa !important; }
  .rounded-3xl { border: 1px solid #2a2a2a !important; }
  .bg-neutral-50 h1 { color: #ffffff !important; }
}

/* === Powered by Morpheus AI (both modes) === */

/* Desktop (Vue SPA) */
footer:has(a[href="https://zammad.org"]) > span { font-size: 0 !important; }
footer a[href="https://zammad.org"] { font-size: 0 !important; gap: 0 !important; }
footer a[href="https://zammad.org"] * { display: none !important; }
footer:has(a[href="https://zammad.org"]) { display: flex !important; align-items: center !important; justify-content: center !important; gap: 6px !important; }
footer:has(a[href="https://zammad.org"])::before { content: ""; display: inline-block; width: 20px; height: 20px; background-image: url("/assets/morpheus-logo.svg"); background-size: contain; background-repeat: no-repeat; }
footer:has(a[href="https://zammad.org"])::after { content: "Powered by Morpheus AI"; font-size: 0.75rem !important; color: #888888; white-space: nowrap; }

/* Legacy UI */
.poweredBy { font-size: 0 !important; display: flex !important; align-items: center !important; justify-content: center !important; gap: 6px !important; }
.poweredBy * { display: none !important; }
.poweredBy::before { content: ""; display: inline-block; width: 20px; height: 20px; background-image: url("/assets/morpheus-logo.svg"); background-size: contain; background-repeat: no-repeat; }
.poweredBy::after { content: "Powered by Morpheus AI"; font-size: 0.75rem !important; color: #888888 !important; white-space: nowrap; }