/* ============================================================
   Maestro HVACR — Premium Global Design Override
   Pure white backgrounds, black text, Fieldpiece-level legibility
   Applies to ALL screens via .screen class
   ============================================================ */

/* ====== GLOBAL SCREEN OVERRIDE ====== */
.screen {
  background: #FFFFFF !important;
  color: #111827 !important;
}
.screen > div {
  color: #111827 !important;
}

/* ====== DARK BACKGROUND NUKE — catches inline dark styles ====== */
.screen [style*="background:#0f172a"],
.screen [style*="background:#0a1628"],
.screen [style*="background:#050a12"],
.screen [style*="background:#0d1f3c"],
.screen [style*="background:#1e293b"],
.screen [style*="background:#070e1a"],
.screen [style*="background:#0c1929"],
.screen [style*="background: #0f172a"],
.screen [style*="background: #0a1628"],
.screen [style*="background: #1e293b"] {
  background: #FFFFFF !important;
  color: #111827 !important;
}

/* Dark rgba backgrounds → white */
.screen [style*="background:rgba(15,23,42"],
.screen [style*="background:rgba(30,41,59"],
.screen [style*="background: rgba(15,23,42"],
.screen [style*="background: rgba(30,41,59"] {
  background: #FFFFFF !important;
  color: #111827 !important;
}

/* Dark linear gradients → clean white */
.screen [style*="linear-gradient"][style*="#0f172a"]:not([style*="position:fixed"]),
.screen [style*="linear-gradient"][style*="#0a1628"]:not([style*="position:fixed"]),
.screen [style*="linear-gradient"][style*="#1e293b"]:not([style*="position:fixed"]),
.screen [style*="linear-gradient"][style*="#050a12"]:not([style*="position:fixed"]),
.screen [style*="linear-gradient"][style*="#0c1929"]:not([style*="position:fixed"]),
.screen [style*="linear-gradient"][style*="#070e1a"]:not([style*="position:fixed"]) {
  background: #FFFFFF !important;
  color: #111827 !important;
}

/* ====== TEXT LEGIBILITY — Force dark readable text ====== */
.screen [style*="color:#f8fafc"],
.screen [style*="color:#e2e8f0"],
.screen [style*="color: #f8fafc"],
.screen [style*="color: #e2e8f0"] {
  color: #111827 !important;
}
.screen [style*="color:#94a3b8"],
.screen [style*="color: #94a3b8"] {
  color: #6b7280 !important;
}
.screen [style*="color:#64748b"],
.screen [style*="color: #64748b"] {
  color: #6b7280 !important;
}
.screen [style*="color:#475569"],
.screen [style*="color: #475569"] {
  color: #4b5563 !important;
}
.screen [style*="color:#374151"] {
  color: #111827 !important;
}
.screen [style*="color:#1a202c"] {
  color: #111827 !important;
}
/* Light colors on what WERE dark backgrounds — now need to be dark */
.screen [style*="color:#718096"] {
  color: #4b5563 !important;
}
.screen [style*="color:#9ca3af"] {
  color: #6b7280 !important;
}

/* ====== INPUTS — Clean white with visible borders ====== */
.screen input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
.screen select,
.screen textarea {
  background: #FFFFFF !important;
  color: #111827 !important;
  border: 1.5px solid #d1d5db !important;
  border-radius: 10px !important;
  box-shadow: 0 1px 2px rgba(0,0,0,0.04) !important;
  transition: border-color 0.2s !important;
}
.screen input:focus,
.screen select:focus,
.screen textarea:focus {
  border-color: #3b82f6 !important;
  box-shadow: 0 0 0 3px rgba(59,130,246,0.1) !important;
  outline: none !important;
}
.screen input[type="range"] {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

/* ====== TABLES — Clean alternating rows ====== */
.screen table {
  background: #FFFFFF !important;
  border-collapse: collapse !important;
}
.screen thead tr,
.screen th {
  background: #f9fafb !important;
  color: #374151 !important;
  border-bottom: 2px solid #e5e7eb !important;
}
.screen td {
  color: #111827 !important;
  border-bottom: 1px solid #f3f4f6 !important;
}

/* ====== DARK BORDER FIX ====== */
.screen [style*="border:1px solid rgba(255,255,255"],
.screen [style*="border: 1px solid rgba(255,255,255"],
.screen [style*="border-bottom:1px solid rgba(255,255,255"],
.screen [style*="border-bottom:2px solid rgba(255,255,255"],
.screen [style*="border-bottom:1px solid rgba(0,0,0,0.06)"],
.screen [style*="border-bottom:1px solid rgba(0,0,0,0.03)"] {
  border-color: #e5e7eb !important;
}
.screen [style*="border:1px solid rgba(0,0,0,0.06)"],
.screen [style*="border:1px solid rgba(0,0,0,0.05)"],
.screen [style*="border:1px solid rgba(0,0,0,0.1)"] {
  border-color: #e5e7eb !important;
}

/* ====== CARDS — White with clean shadow ====== */
.screen [style*="border-radius:12px"][style*="padding"],
.screen [style*="border-radius:14px"][style*="padding"],
.screen [style*="border-radius:16px"][style*="padding"],
.screen [style*="border-radius:10px"][style*="padding:12px"],
.screen [style*="border-radius:10px"][style*="padding:14px"],
.screen [style*="border-radius:10px"][style*="padding:16px"] {
  box-shadow: 0 1px 3px rgba(0,0,0,0.08), 0 1px 2px rgba(0,0,0,0.04) !important;
}

/* ====== ACCENT TINTED BACKGROUNDS → PURE WHITE ====== */
/* Fieldpiece standard: NO colored tints on ANY container */
/* Protected: buttons keep accent bg, spans (inline badges) keep theirs */
.screen [style*="background:rgba(239,68,68"]:not(button):not(span),
.screen [style*="background:rgba(59,130,246"]:not(button):not(span),
.screen [style*="background:rgba(168,85,247"]:not(button):not(span),
.screen [style*="background:rgba(124,58,237"]:not(button):not(span),
.screen [style*="background:rgba(245,158,11"]:not(button):not(span),
.screen [style*="background:rgba(251,191,36"]:not(button):not(span),
.screen [style*="background:rgba(34,197,94"]:not(button):not(span),
.screen [style*="background:rgba(52,211,153"]:not(button):not(span),
.screen [style*="background:rgba(255,107,53"]:not(button):not(span),
.screen [style*="background:rgba(251,146,60"]:not(button):not(span),
.screen [style*="background:rgba(34,211,238"]:not(button):not(span),
.screen [style*="background:rgba(74,222,128"]:not(button):not(span),
.screen [style*="background:rgba(20,184,166"]:not(button):not(span),
.screen [style*="background:rgba(255,255,255,0.03"]:not(button):not(span),
.screen [style*="background:rgba(255,255,255,0.04"]:not(button):not(span),
.screen [style*="background:rgba(255,255,255,0.06"]:not(button):not(span),
.screen [style*="background:rgba(255,255,255,0.08"]:not(button):not(span),
.screen [style*="background:rgba(255,255,255,0.1"]:not(button):not(span),
.screen [style*="background:rgba(0,0,0,0.02"]:not(button):not(span),
.screen [style*="background:rgba(0,0,0,0.03"]:not(button):not(span),
.screen [style*="background:rgba(0,0,0,0.04"]:not(button):not(span),
.screen [style*="background:rgba(0,0,0,0.05"]:not(button):not(span),
.screen [style*="background:rgba(0,0,0,0.06"]:not(button):not(span) {
  background: #FFFFFF !important;
  border-color: #e5e7eb !important;
  color: #111827 !important;
}
/* Gradient containers with rgba accent tints → white */
.screen [style*="linear-gradient"][style*="rgba(239,68,68"]:not(button):not([style*="position:absolute"]),
.screen [style*="linear-gradient"][style*="rgba(59,130,246"]:not(button):not([style*="position:absolute"]),
.screen [style*="linear-gradient"][style*="rgba(168,85,247"]:not(button):not([style*="position:absolute"]),
.screen [style*="linear-gradient"][style*="rgba(245,158,11"]:not(button):not([style*="position:absolute"]),
.screen [style*="linear-gradient"][style*="rgba(251,191,36"]:not(button):not([style*="position:absolute"]) {
  background: #FFFFFF !important;
  border-color: #e5e7eb !important;
  color: #111827 !important;
}

/* ====== COLORED TEXT → DARK PROFESSIONAL ====== */
/* ALL accent-colored text → clean dark (Fieldpiece: black text only) */
/* Protected: buttons, section headers (letter-spacing), inline badges (span) */
.screen [style*="color:#f87171"]:not(button):not(span):not([style*="letter-spacing"]),
.screen [style*="color:#ef4444"]:not(button):not(span):not([style*="letter-spacing"]),
.screen [style*="color:#dc2626"]:not(button):not(span):not([style*="letter-spacing"]),
.screen [style*="color:#60a5fa"]:not(button):not(span):not([style*="letter-spacing"]),
.screen [style*="color:#3b82f6"]:not(button):not(span):not([style*="letter-spacing"]),
.screen [style*="color:#c084fc"]:not(button):not(span):not([style*="letter-spacing"]),
.screen [style*="color:#a78bfa"]:not(button):not(span):not([style*="letter-spacing"]),
.screen [style*="color:#f59e0b"]:not(button):not(span):not([style*="letter-spacing"]),
.screen [style*="color:#fbbf24"]:not(button):not(span):not([style*="letter-spacing"]),
.screen [style*="color:#34d399"]:not(button):not(span):not([style*="letter-spacing"]),
.screen [style*="color:#22c55e"]:not(button):not(span):not([style*="letter-spacing"]),
.screen [style*="color:#4ade80"]:not(button):not(span):not([style*="letter-spacing"]),
.screen [style*="color:#14b8a6"]:not(button):not(span):not([style*="letter-spacing"]),
.screen [style*="color:#10b981"]:not(button):not(span):not([style*="letter-spacing"]),
.screen [style*="color:#eab308"]:not(button):not(span):not([style*="letter-spacing"]),
.screen [style*="color:#FF6B35"]:not(button):not(span):not([style*="letter-spacing"]),
.screen [style*="color:#e11d48"]:not(button):not(span):not([style*="letter-spacing"]),
.screen [style*="color:#8b5cf6"]:not(button):not(span):not([style*="letter-spacing"]),
.screen [style*="color:#38bdf8"]:not(button):not(span):not([style*="letter-spacing"]),
.screen [style*="color:#cbd5e1"]:not(button):not(span),
.screen [style*="color:#e2e8f0"]:not(button):not(span),
.screen [style*="color:#f8fafc"]:not(button):not(span) {
  color: #111827 !important;
}

/* ====== RESULT/VALUE BOXES ====== */
.screen [style*="font-size:28px"][style*="font-weight:900"],
.screen [style*="font-size:32px"][style*="font-weight:900"],
.screen [style*="font-size:36px"][style*="font-weight:900"],
.screen [style*="font-size:24px"][style*="font-weight:900"],
.screen [style*="font-size:20px"][style*="font-weight:900"],
.screen [style*="font-size:20px"][style*="font-weight:800"],
.screen [style*="font-size:18px"][style*="font-weight:800"],
.screen [style*="font-size:16px"][style*="font-weight:800"],
.screen [style*="font-size:15px"][style*="font-weight:800"] {
  color: #111827 !important;
}

/* ====== BACK BUTTONS ====== */
.screen button[style*="rgba(0,0,0,0.05)"],
.screen button[style*="rgba(255,255,255,0.08)"],
.screen button[style*="rgba(0,0,0,0.04)"] {
  background: #f3f4f6 !important;
  color: #374151 !important;
  border: 1px solid #e5e7eb !important;
}

/* ====== STICKY HEADERS — clean white bar ====== */
.screen [style*="position:sticky"] {
  background: #FFFFFF !important;
  border-bottom: 1px solid #e5e7eb !important;
  box-shadow: 0 1px 2px rgba(0,0,0,0.04) !important;
}

/* ====== EMPTY STATES ====== */
.screen [style*="opacity:0.5"],
.screen [style*="opacity:0.4"],
.screen [style*="opacity:0.45"] {
  opacity: 0.6 !important;
}

/* ====== SCROLLABLE AREAS ====== */
.screen [style*="overflow-y:auto"],
.screen [style*="overflow-y: auto"],
.screen [style*="overflow-x:auto"] {
  background: transparent !important;
}

/* ====== BLE SCREEN — Premium gauges ====== */
#bluetoothToolsScreen {
  background: #FFFFFF !important;
  color: #111827 !important;
}
#bluetoothToolsScreen .ble-header {
  background: #FFFFFF !important;
  border-bottom: 1px solid #e5e7eb !important;
  box-shadow: 0 1px 2px rgba(0,0,0,0.04) !important;
}
#bluetoothToolsScreen .ble-title { color: #111827 !important; }
#bluetoothToolsScreen .ble-subtitle { color: #6b7280 !important; }
#bluetoothToolsScreen .ble-back-btn {
  background: #f3f4f6 !important;
  color: #374151 !important;
  border: 1px solid #e5e7eb !important;
}
#bluetoothToolsScreen .ble-status-bar {
  background: #f9fafb !important;
  border: 1px solid #e5e7eb !important;
}
#bluetoothToolsScreen .ble-status-text { color: #374151 !important; }
#bluetoothToolsScreen .ble-scan-btn {
  box-shadow: 0 4px 14px rgba(255,107,53,0.25) !important;
}
#bluetoothToolsScreen .ble-device-card {
  background: #FFFFFF !important;
  border: 1px solid #e5e7eb !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.06) !important;
}
#bluetoothToolsScreen .ble-device-card.fieldpiece {
  border-color: rgba(255,107,53,0.3) !important;
  background: #FFFFFF !important;
}
#bluetoothToolsScreen .ble-device-icon { background: #f3f4f6 !important; }
#bluetoothToolsScreen .ble-device-card.fieldpiece .ble-device-icon { background: rgba(255,107,53,0.08) !important; }
#bluetoothToolsScreen .ble-device-name { color: #111827 !important; }
#bluetoothToolsScreen .ble-device-rssi { color: #6b7280 !important; }
#bluetoothToolsScreen .ble-rssi-bar { background: #e5e7eb !important; }
#bluetoothToolsScreen .ble-rssi-bar.active { background: #22c55e !important; }
#bluetoothToolsScreen .ble-connect-btn {
  border: 1px solid rgba(255,107,53,0.3) !important;
  background: rgba(255,107,53,0.06) !important;
  color: #e85d2c !important;
}
#bluetoothToolsScreen .ble-connected-panel {
  background: rgba(34,197,94,0.04) !important;
  border: 1px solid rgba(34,197,94,0.2) !important;
}
#bluetoothToolsScreen .ble-connected-name { color: #111827 !important; }
#bluetoothToolsScreen .ble-gauge-card {
  background: #FFFFFF !important;
  border: 1px solid #e5e7eb !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.08) !important;
}
#bluetoothToolsScreen .ble-gauge-value { color: #111827 !important; }
#bluetoothToolsScreen .ble-gauge-unit { color: #6b7280 !important; }
#bluetoothToolsScreen .ble-empty-state { color: #6b7280 !important; }
#bluetoothToolsScreen .ble-unavailable-title { color: #111827 !important; }
#bluetoothToolsScreen .ble-unavailable-text { color: #6b7280 !important; }
#bluetoothToolsScreen .ble-section-label { color: #FF6B35 !important; }

/* ====== SVG GAUGE COMPONENT ====== */
.pm-gauge-wrap {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 8px 0;
}
.pm-gauge-svg { width: 100%; max-width: 140px; }
.pm-gauge-track { fill: none; stroke: #e5e7eb; stroke-width: 10; stroke-linecap: round; }
.pm-gauge-fill { fill: none; stroke-width: 10; stroke-linecap: round; transition: stroke-dashoffset 0.6s cubic-bezier(0.4,0,0.2,1); }
.pm-gauge-value { font-size: 26px; font-weight: 800; fill: #111827; font-variant-numeric: tabular-nums; }
.pm-gauge-unit { font-size: 11px; fill: #6b7280; font-weight: 600; }
.pm-gauge-label { font-size: 11px; color: #6b7280; font-weight: 600; margin-top: 4px; text-align: center; }
.pm-gauge-sub { font-size: 18px; font-weight: 700; color: #111827; margin-top: 2px; text-align: center; }

/* ====== MODAL OVERLAYS — keep dark dim, but white content ====== */
.screen [style*="position:fixed"][style*="rgba(0,0,0"] {
  /* Keep dark overlay for modals — intentional */
}
/* But modal CONTENT inside should be white */
.screen [style*="position:fixed"] > div[style*="border-radius"] {
  background: #FFFFFF !important;
  color: #111827 !important;
}

/* ====== PROTECT ACCENT BUTTONS ====== */
/* Orange, blue, purple, green gradient buttons should keep their color */
.screen button[style*="background:linear-gradient(135deg,#FF6B35"],
.screen button[style*="background:linear-gradient(135deg,#3b82f6"],
.screen button[style*="background:linear-gradient(135deg,#7c3aed"],
.screen button[style*="background:linear-gradient(135deg,#6d28d9"],
.screen button[style*="background:linear-gradient(135deg,#22c55e"],
.screen button[style*="background:linear-gradient(135deg,#ef4444"],
.screen button[style*="background:linear-gradient(135deg,#f59e0b"],
.screen [style*="background:linear-gradient(135deg,#FF6B35"][style*="cursor:pointer"],
.screen [style*="background:linear-gradient(135deg,#ff6b2b"] {
  color: #FFFFFF !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.15) !important;
}

/* Badge colors preserved via :not(span) in accent override rules above */

/* ====== PROTECT STATUS DOTS ====== */
.screen .ble-status-dot.on { background: #22c55e !important; }
.screen .ble-status-dot.off { background: #ef4444 !important; }

/* ====== SECTION LABELS — accent colored ====== */
.screen [style*="letter-spacing:1px"][style*="font-weight:800"],
.screen [style*="letter-spacing:1.2px"][style*="font-weight:800"],
.screen [style*="letter-spacing:0.8px"][style*="font-weight:700"] {
  /* Keep their accent colors */
}

/* ====== GRID/CARD SPACING IMPROVEMENTS ====== */
@media (max-width: 767px) {
  .screen [style*="display:grid"][style*="grid-template-columns:1fr 1fr"][style*="gap:6px"] {
    gap: 10px !important;
  }
}