/* GBRemote light theme completeness patch v2 - 2026-10-03
   Completes light-mode coverage for modular/dynamic UI surfaces.
   Intentionally excludes #webremote so the remote viewer stays dark. */

html[data-theme="light"] {
  --gb-light-surface: #ffffff;
  --gb-light-surface-soft: #f8fafc;
  --gb-light-surface-muted: #f1f5f9;
  --gb-light-text: #0f172a;
  --gb-light-muted: #64748b;
  --gb-light-border: rgba(15, 23, 42, .11);
  --gb-light-shadow: 0 16px 42px rgba(15, 23, 42, .08);
}

/* ---------------------------------------------------------
   Shared dynamic surfaces - every normal section except viewer
   --------------------------------------------------------- */
html[data-theme="light"] .section:not(#webremote) .modal-card,
html[data-theme="light"] .section:not(#webremote) .dialog,
html[data-theme="light"] .section:not(#webremote) .drawer,
html[data-theme="light"] .section:not(#webremote) .panel,
html[data-theme="light"] .section:not(#webremote) .detail-panel,
html[data-theme="light"] .section:not(#webremote) [role="dialog"],
html[data-theme="light"] .section:not(#webremote) .support-detail {
  background: var(--gb-light-surface) !important;
  color: var(--gb-light-text) !important;
  border-color: var(--gb-light-border) !important;
  box-shadow: var(--gb-light-shadow) !important;
}

html[data-theme="light"] .section:not(#webremote) pre,
html[data-theme="light"] .section:not(#webremote) code {
  color: #1e3a5f;
}

/* ---------------------------------------------------------
   Ticket / assistance UI - app + admin
   --------------------------------------------------------- */
html[data-theme="light"] #tickets .support-toolbar,
html[data-theme="light"] #assistance .support-toolbar,
html[data-theme="light"] #tickets .support-compose,
html[data-theme="light"] #assistance .support-compose {
  border-color: var(--gb-light-border) !important;
  color: var(--gb-light-text) !important;
}

html[data-theme="light"] #tickets .support-thread,
html[data-theme="light"] #assistance .support-thread {
  background: var(--gb-light-surface-soft) !important;
  color: var(--gb-light-text) !important;
  border-color: var(--gb-light-border) !important;
}

html[data-theme="light"] #tickets .support-meta,
html[data-theme="light"] #assistance .support-meta {
  color: var(--gb-light-text) !important;
}

html[data-theme="light"] #tickets .support-meta > div,
html[data-theme="light"] #assistance .support-meta > div {
  color: var(--gb-light-muted) !important;
}

html[data-theme="light"] #tickets .support-meta > strong,
html[data-theme="light"] #assistance .support-meta > strong {
  color: var(--gb-light-text) !important;
}

html[data-theme="light"] #tickets .support-message,
html[data-theme="light"] #assistance .support-message {
  background: var(--gb-light-surface) !important;
  color: var(--gb-light-text) !important;
  border: 1px solid var(--gb-light-border) !important;
  box-shadow: 0 5px 18px rgba(15, 23, 42, .045) !important;
}

html[data-theme="light"] #tickets .support-message.user,
html[data-theme="light"] #assistance .support-message.user {
  background: #f8fafc !important;
}

html[data-theme="light"] #tickets .support-message.operator,
html[data-theme="light"] #assistance .support-message.operator {
  background: #eef7ff !important;
  border-color: rgba(24, 142, 232, .16) !important;
}

html[data-theme="light"] #tickets .support-message.internal,
html[data-theme="light"] #assistance .support-message.internal {
  background: #fff8e6 !important;
  border-color: rgba(198, 124, 0, .20) !important;
}

html[data-theme="light"] #tickets .support-message small,
html[data-theme="light"] #assistance .support-message small {
  color: var(--gb-light-muted) !important;
}

/* ---------------------------------------------------------
   Dynamic DNS admin module
   --------------------------------------------------------- */
html[data-theme="light"] #ddns {
  --ddns-border: rgba(15, 23, 42, .11);
  --ddns-muted: #64748b;
  --ddns-good: #15803d;
  --ddns-warn: #a16207;
  --ddns-bad: #be123c;
}

html[data-theme="light"] .ddns-toolbar input,
html[data-theme="light"] .ddns-toolbar select,
html[data-theme="light"] #ddns input:not([type="checkbox"]):not([type="radio"]),
html[data-theme="light"] #ddns select,
html[data-theme="light"] #ddns textarea {
  background: var(--gb-light-surface) !important;
  color: var(--gb-light-text) !important;
  border-color: var(--gb-light-border) !important;
}

html[data-theme="light"] .ddns-table th {
  background: var(--gb-light-surface-soft) !important;
  color: var(--gb-light-muted) !important;
}

html[data-theme="light"] .ddns-table td {
  color: var(--gb-light-text) !important;
  border-color: var(--gb-light-border) !important;
}

html[data-theme="light"] .ddns-fqdn,
html[data-theme="light"] .ddns-pager,
html[data-theme="light"] .ddns-empty,
html[data-theme="light"] .ddns-kv > span {
  color: var(--gb-light-muted) !important;
}

html[data-theme="light"] .ddns-badge {
  background: #eef2f7 !important;
}

html[data-theme="light"] .ddns-note {
  background: #fff8e6 !important;
  color: #725400 !important;
  border-color: rgba(198, 124, 0, .20) !important;
}

html[data-theme="light"] .ddns-modal {
  background: rgba(15, 23, 42, .28) !important;
  backdrop-filter: blur(8px);
}

html[data-theme="light"] .ddns-modal-card {
  background: var(--gb-light-surface) !important;
  color: var(--gb-light-text) !important;
  border-color: var(--gb-light-border) !important;
  box-shadow: 0 28px 90px rgba(15, 23, 42, .18) !important;
}

html[data-theme="light"] .ddns-x {
  color: #64748b !important;
}

html[data-theme="light"] .ddns-modal label {
  color: #52657a !important;
}

html[data-theme="light"] .ddns-modal label input,
html[data-theme="light"] .ddns-modal label select,
html[data-theme="light"] .ddns-modal label textarea {
  background: var(--gb-light-surface) !important;
  color: var(--gb-light-text) !important;
}

html[data-theme="light"] .ddns-token,
html[data-theme="light"] .ddns-code {
  background: var(--gb-light-surface-muted) !important;
  color: #155e8d !important;
  border-color: rgba(24, 142, 232, .16) !important;
}

html[data-theme="light"] .ddns-provider {
  background: #eef7ff !important;
  color: var(--gb-light-text) !important;
  border-color: rgba(24, 142, 232, .15) !important;
}

html[data-theme="light"] .ddns-check {
  background: #fff8e6 !important;
  color: #5f4a00 !important;
  border-color: rgba(198, 124, 0, .18) !important;
}

/* ---------------------------------------------------------
   Update manager - dynamically injected into admin
   --------------------------------------------------------- */
html[data-theme="light"] #updates .update-head {
  background: linear-gradient(180deg, #ffffff, #f8fafc) !important;
  color: var(--gb-light-text) !important;
  border-color: var(--gb-light-border) !important;
  box-shadow: 0 9px 28px rgba(15, 23, 42, .055) !important;
}

html[data-theme="light"] #updates .update-head h3,
html[data-theme="light"] #updates .update-detail h3,
html[data-theme="light"] #updates label {
  color: var(--gb-light-text) !important;
}

html[data-theme="light"] #updates .update-head small,
html[data-theme="light"] #updates .update-status {
  color: var(--gb-light-muted) !important;
}

html[data-theme="light"] #updates .update-check {
  background: var(--gb-light-surface-soft) !important;
  color: #42556b !important;
  border-color: var(--gb-light-border) !important;
}

html[data-theme="light"] #updates pre,
html[data-theme="light"] #updates .update-detail pre {
  background: var(--gb-light-surface-muted) !important;
  color: #183153 !important;
  border: 1px solid var(--gb-light-border) !important;
}

/* ---------------------------------------------------------
   Audit / device / commercial dynamically generated details
   --------------------------------------------------------- */
html[data-theme="light"] #auditMetadata,
html[data-theme="light"] #audit .audit-metadata-wrap pre,
html[data-theme="light"] #audit .audit-detail,
html[data-theme="light"] #adminDevices .device-detail,
html[data-theme="light"] #adminDevices .device-panel,
html[data-theme="light"] #commercialOrders .com-detail,
html[data-theme="light"] #commercialOrders .com-panel,
html[data-theme="light"] #commercialSettings .com-detail,
html[data-theme="light"] #commercialSettings .com-panel {
  background: var(--gb-light-surface-soft) !important;
  color: var(--gb-light-text) !important;
  border-color: var(--gb-light-border) !important;
}

html[data-theme="light"] #audit .audit-row:hover td,
html[data-theme="light"] #adminDevices .device-row:hover td,
html[data-theme="light"] #commercialOrders tbody tr:hover td {
  background: rgba(24, 142, 232, .035) !important;
}

/* Dynamic forms inside normal sections. This deliberately excludes Web Remote. */
html[data-theme="light"] .section:not(#webremote) input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
html[data-theme="light"] .section:not(#webremote) select,
html[data-theme="light"] .section:not(#webremote) textarea {
  background: var(--gb-light-surface) !important;
  color: var(--gb-light-text) !important;
  border-color: var(--gb-light-border) !important;
}

html[data-theme="light"] .section:not(#webremote) input[type="file"] {
  background: var(--gb-light-surface-soft) !important;
  color: var(--gb-light-text) !important;
}

html[data-theme="light"] .section:not(#webremote) input[type="file"]::file-selector-button {
  background: #eaf2fb;
  color: #1f4f78;
  border: 0;
  border-right: 1px solid var(--gb-light-border);
  padding: 8px 12px;
  margin-right: 10px;
  cursor: pointer;
}

/* Preserve deliberately dark remote rendering surfaces. */
html[data-theme="light"] #webremote canvas,
html[data-theme="light"] #webremote video,
html[data-theme="light"] #webremote .viewport,
html[data-theme="light"] #webremote #viewport,
html[data-theme="light"] #webremote .remote-screen,
html[data-theme="light"] #webremote .viewer {
  background: #000 !important;
}