/* =========================================================
   LIGHT THEME
   Drop-in override for app.css
   ========================================================= */

:root {
  --bg: #f6f7f9;
  --panel: #ffffff;
  --panel-alt: #f1f3f6;
  --panel-alt-users: #e5f7ed;
  --panel-alt-tasks: #fcf7d2;
  --panel-alt-notes: #d2eafb;

  --border: rgba(0,0,0,.12);

  --text: #1c1e21;
  --muted: #6b7280;

  --accent: #2563eb;       /* iOS-like blue */
  --accent-soft: rgba(37,99,235,.12);

  --danger: #dc2626;
  --success: #16a34a;
}

/* Global background */
body {
  background: var(--bg);
  color: var(--text);
}

/* Cards / panels */
.card,
.panel,
.incident-dialog,
.note,
.user-chip {
  background: var(--panel);
  border-color: var(--border);
}

/* Sub-panels / headers */
.card__header,
.panel__title,
.incident-dialog__header {
  background: var(--panel-alt);
  border-bottom: 1px solid var(--border);
}


.assignedusers.panel__title { background: var(--panel-alt-users); }
.assignedtasks.panel__title, .assignedtasks.card__header { background: var(--panel-alt-tasks); }
.incidentnotes.panel__title { background: var(--panel-alt-notes); }

/* Inputs */
.input,
select,
textarea {
  background: #ffffff;
  color: var(--text);
  border: 1px solid var(--border);
}

.input::placeholder {
  color: var(--muted);
}

.input:focus {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px var(--accent-soft);
}

/* Buttons */
.btn {
  background: #ffffff;
  color: var(--text);
  border: 1px solid var(--border);
}

.btn:hover {
  background: #f3f4f6;
}

.btn--primary {
  background: var(--accent);
  color: #ffffff;
  border-color: var(--accent);
}

.btn--primary:hover {
  background: #1d4ed8;
}

/* Status pills */
.status {
  background: var(--panel-alt);
  border: 1px solid var(--border);
  color: var(--text);
}

.status-open        { color: #2563eb; }
.status-in_progress { color: #ca8a04; }
.status-waiting     { color: #9333ea; }
.status-resolved    { color: #16a34a; }

/* Tables */
.table {
  background: var(--panel);
  border-color: var(--border);
}

.table th {
  background: var(--panel-alt);
  color: var(--muted);
}

.table td {
  border-top: 1px solid var(--border);
}

/* Sidebar */
.sidebar {
  background: #ffffff;
  border-right: 1px solid var(--border);
}

.sidebar .nav-link {
  color: var(--text);
}

.sidebar .nav-link:hover {
  background: #f3f4f6;
}

/* Top bar */
.topbar {
  background: #ffffff;
  border-bottom: 1px solid var(--border);
}

/* Notes */
.note {
  background: #ffffff;
}

/* Muted text */
.muted {
  color: var(--muted);
}

/* Toast */
.toast {
  background: #111827;
  color: #ffffff;
}

/* jQuery UI dialog tweaks */
.ui-dialog {
  background: var(--panel) !important;
  border: 1px solid var(--border);
}

.ui-dialog-titlebar {
  background: var(--panel-alt);
  border-bottom: 1px solid var(--border);
  color: var(--text);
}

/* Scrollbars (WebKit) */
@media (hover:hover) {
  ::-webkit-scrollbar {
    width: 10px;
  }
  ::-webkit-scrollbar-track {
    background: #e5e7eb;
  }
  ::-webkit-scrollbar-thumb {
    background: #cbd5e1;
    border-radius: 6px;
  }
}

/* jQuery UI modal overlay — LIGHT THEME */
.ui-widget-overlay {
  background: rgba(243, 244, 246, 0.85); /* light grey */
}

@supports (backdrop-filter: blur(4px)) {
  .ui-widget-overlay {
    backdrop-filter: blur(4px);
    background: rgba(243, 244, 246, 0.65);
  }
}


.table thead th { color:#000; }

.incident-dialog__header { padding:18px; }

.panel__title { padding: 10px; }

.kv__k{ color: rgba(0,0,0,.68); font-weight: 650; }
.kv__v{ color: rgba(0,0,0,.92); }


select.input {
  background-color: #ffffff;
}

select.input:hover {
  background-color: #f9fafb;
}

.card__filters select.input {
  background-color: #f3f4f6;
  border-color: #d1d5db;
}