/* Light theme only. Dark rules live in styles.css and are not edited here. */
html.light-theme,
html[data-theme="light"] {
  color-scheme: light;
}

html.light-theme body,
html[data-theme="light"] body {
  background: #f3eef8;
  color: #161022;
}

html.light-theme h1,
html.light-theme h2,
html.light-theme h3,
html.light-theme h4,
html.light-theme strong,
html[data-theme="light"] h1,
html[data-theme="light"] h2,
html[data-theme="light"] h3,
html[data-theme="light"] h4,
html[data-theme="light"] strong {
  color: #161022;
}

html.light-theme .liquid-glass,
html[data-theme="light"] .liquid-glass {
  color: #161022;
  background: linear-gradient(
    155deg,
    rgba(255, 255, 255, 0.74) 0%,
    rgba(255, 255, 255, 0.52) 100%
  ) !important;
  border-color: rgba(60, 30, 90, 0.1) !important;
  box-shadow: inset 0 1px 0 #fff, 0 10px 28px rgba(50, 24, 80, 0.07) !important;
  backdrop-filter: blur(22px) saturate(160%) !important;
  -webkit-backdrop-filter: blur(22px) saturate(160%) !important;
}

html.light-theme .liquid-glass [style*="color: #fff"],
html.light-theme .liquid-glass [style*="color:#fff"],
html.light-theme [style*="color: #fff"],
html.light-theme [style*="color:#fff"],
html[data-theme="light"] .liquid-glass [style*="color: #fff"],
html[data-theme="light"] .liquid-glass [style*="color:#fff"],
html[data-theme="light"] [style*="color: #fff"],
html[data-theme="light"] [style*="color:#fff"] {
  color: #161022 !important;
}

html.light-theme .nav a:hover,
html.light-theme .nav-link:hover,
html.light-theme .nav a.active,
html.light-theme .nav-link.active,
html[data-theme="light"] .nav a:hover,
html[data-theme="light"] .nav-link:hover,
html[data-theme="light"] .nav a.active,
html[data-theme="light"] .nav-link.active {
  color: #161022 !important;
  background: rgba(91, 63, 196, 0.1) !important;
}

html.light-theme .inbox-item .from,
html.light-theme .msg-header .from,
html[data-theme="light"] .inbox-item .from,
html[data-theme="light"] .msg-header .from {
  color: #161022 !important;
}
html.light-theme .inbox-item .time,
html.light-theme .msg-header .time,
html[data-theme="light"] .inbox-item .time,
html[data-theme="light"] .msg-header .time {
  color: rgba(22, 16, 34, 0.5) !important;
}

html.light-theme .address-display,
html[data-theme="light"] .address-display {
  background: #fff !important;
  color: #161022 !important;
  border-color: rgba(60, 30, 90, 0.14) !important;
}

html.light-theme .multi-chip.active,
html.light-theme .seg-btn.active,
html.light-theme .stack-btn:hover,
html.light-theme .pool-chip:hover:not(:disabled),
html.light-theme .seg-btn:hover:not(:disabled),
html[data-theme="light"] .multi-chip.active,
html[data-theme="light"] .seg-btn.active {
  color: #161022 !important;
}

html.light-theme input,
html.light-theme textarea,
html.light-theme select,
html[data-theme="light"] input,
html[data-theme="light"] textarea,
html[data-theme="light"] select {
  color: #161022;
  background: #fff;
}

html.light-theme .footer strong,
html[data-theme="light"] .footer strong { color: #161022 !important; }

html.light-theme .faq-item,
html[data-theme="light"] .faq-item { color: #161022; }
html.light-theme .faq-content,
html[data-theme="light"] .faq-content { color: rgba(22, 16, 34, 0.74); }

html.light-theme .home-showcase-card,
html[data-theme="light"] .home-showcase-card {
  background: #fff;
  color: #161022;
  border-color: rgba(60, 30, 90, 0.12);
}

html.light-theme .showcase-pill,
html[data-theme="light"] .showcase-pill {
  background: #f6f2fb;
  color: #161022;
  border-color: rgba(60, 30, 90, 0.1);
}

html.light-theme .sf-item,
html[data-theme="light"] .sf-item { color: rgba(22, 16, 34, 0.78); }

html.light-theme .auth-feature-text h4,
html.light-theme .auth-showcase-panel h1,
html.light-theme .auth-card-enterprise h2,
html[data-theme="light"] .auth-feature-text h4,
html[data-theme="light"] .auth-showcase-panel h1,
html[data-theme="light"] .auth-card-enterprise h2 { color: #161022 !important; }

html.light-theme .auth-feature-item,
html.light-theme .auth-card-enterprise,
html[data-theme="light"] .auth-feature-item,
html[data-theme="light"] .auth-card-enterprise {
  background: #fff;
  border-color: rgba(60, 30, 90, 0.1);
  color: #161022;
}

html.light-theme .vt-tab,
html.light-theme .btn-close,
html[data-theme="light"] .vt-tab,
html[data-theme="light"] .btn-close { color: rgba(22, 16, 34, 0.7); }
html.light-theme .vt-tab:hover,
html.light-theme .vt-tab.active,
html.light-theme .btn-close:hover,
html[data-theme="light"] .vt-tab:hover,
html[data-theme="light"] .vt-tab.active,
html[data-theme="light"] .btn-close:hover { color: #161022; }

html.light-theme .modal-card,
html[data-theme="light"] .modal-card {
  background: #fff;
  color: #161022;
}

html.light-theme .dev-table,
html[data-theme="light"] .dev-table { color: #161022; }
html.light-theme .dev-table th,
html[data-theme="light"] .dev-table th { color: rgba(22, 16, 34, 0.55); }

html.light-theme .acct-meter-track,
html[data-theme="light"] .acct-meter-track { background: rgba(22, 16, 34, 0.08); }

html.light-theme .dev-stat b,
html.light-theme .profile-stat b,
html.light-theme .plan-cell b,
html.light-theme .acct-row b,
html.light-theme .pack-units,
html.light-theme .pack-price,
html.light-theme .dev-desk-head h4,
html.light-theme .dev-table-head strong,
html.light-theme .dev-table td,
html.light-theme .dev-key-name,
html.light-theme .profile-name,
html[data-theme="light"] .dev-stat b,
html[data-theme="light"] .profile-stat b,
html[data-theme="light"] .plan-cell b,
html[data-theme="light"] .acct-row b,
html[data-theme="light"] .pack-units,
html[data-theme="light"] .pack-price,
html[data-theme="light"] .dev-desk-head h4,
html[data-theme="light"] .dev-table-head strong,
html[data-theme="light"] .dev-table td,
html[data-theme="light"] .dev-key-name,
html[data-theme="light"] .profile-name {
  color: #161022 !important;
}

html.light-theme .dev-table-wrap,
html[data-theme="light"] .dev-table-wrap {
  background: #fff !important;
  border: 1px solid rgba(60, 30, 90, 0.12) !important;
}

html.light-theme .dev-table th,
html[data-theme="light"] .dev-table th {
  color: rgba(22, 16, 34, 0.55) !important;
  border-bottom-color: rgba(60, 30, 90, 0.1) !important;
}

html.light-theme .dev-table td,
html[data-theme="light"] .dev-table td {
  border-bottom-color: rgba(60, 30, 90, 0.08) !important;
}

html.light-theme .dev-table tr:hover td,
html[data-theme="light"] .dev-table tr:hover td {
  background: rgba(22, 16, 34, 0.04) !important;
}

html.light-theme .dev-token,
html[data-theme="light"] .dev-token {
  color: #0b7d56 !important;
  background: rgba(11, 125, 86, 0.1) !important;
}

html.light-theme .dev-status,
html[data-theme="light"] .dev-status { color: #0b7d56 !important; }

html.light-theme .dev-stat,
html.light-theme .profile-stat,
html.light-theme .plan-cell,
html[data-theme="light"] .dev-stat,
html[data-theme="light"] .profile-stat,
html[data-theme="light"] .plan-cell {
  background: #fff !important;
  border: 1px solid rgba(60, 30, 90, 0.12) !important;
}

/* Inbox */
html.light-theme #viewInbox,
html[data-theme="light"] #viewInbox { color: #161022; }

html.light-theme .inbox-stack,
html[data-theme="light"] .inbox-stack {
  background: #fff !important;
  border-color: rgba(60, 30, 90, 0.12) !important;
  color: #161022;
}

html.light-theme .address-display,
html[data-theme="light"] .address-display {
  background: #f6f2fb !important;
  color: #161022 !important;
  border-color: rgba(60, 30, 90, 0.16) !important;
}

html.light-theme .stack-addr,
html[data-theme="light"] .stack-addr { color: rgba(22, 16, 34, 0.55) !important; }

html.light-theme .stack-kicker,
html[data-theme="light"] .stack-kicker {
  color: #0b7d56;
  background: rgba(11, 125, 86, 0.08);
  border-color: rgba(11, 125, 86, 0.2);
}

html.light-theme .search-box input,
html[data-theme="light"] .search-box input {
  background: #fff !important;
  color: #161022 !important;
  border-color: rgba(60, 30, 90, 0.16) !important;
}

html.light-theme .inbox-item,
html[data-theme="light"] .inbox-item {
  background: #fff !important;
  border-color: rgba(60, 30, 90, 0.12) !important;
  color: #161022 !important;
}
html.light-theme .inbox-item .from,
html.light-theme .msg-header .from,
html.light-theme .inbox-item .subject,
html.light-theme .empty-title,
html.light-theme .msg-header h3,
html[data-theme="light"] .inbox-item .from,
html[data-theme="light"] .msg-header .from,
html[data-theme="light"] .inbox-item .subject,
html[data-theme="light"] .empty-title,
html[data-theme="light"] .msg-header h3 {
  color: #161022 !important;
}
html.light-theme .inbox-item .time,
html.light-theme .msg-header .time,
html.light-theme .inbox-item .preview,
html[data-theme="light"] .inbox-item .time,
html[data-theme="light"] .msg-header .time,
html[data-theme="light"] .inbox-item .preview {
  color: rgba(22, 16, 34, 0.5) !important;
}

html.light-theme .empty-card,
html.light-theme .reader-card,
html[data-theme="light"] .empty-card,
html[data-theme="light"] .reader-card {
  background: #fff !important;
  border-color: rgba(60, 30, 90, 0.12) !important;
  color: #161022;
}

html.light-theme .msg-body.plain,
html[data-theme="light"] .msg-body.plain { color: rgba(22, 16, 34, 0.82) !important; }

html.light-theme .msg-body.html-frame,
html.light-theme .msg-body iframe,
html[data-theme="light"] .msg-body.html-frame,
html[data-theme="light"] .msg-body iframe {
  background: #fff !important;
}

html.light-theme .cat-filter-btn,
html[data-theme="light"] .cat-filter-btn {
  background: #fff;
  color: rgba(22, 16, 34, 0.72);
  border-color: rgba(60, 30, 90, 0.14);
}
html.light-theme .cat-filter-btn:hover,
html.light-theme .cat-filter-btn.active,
html[data-theme="light"] .cat-filter-btn:hover,
html[data-theme="light"] .cat-filter-btn.active {
  color: #161022 !important;
  background: rgba(91, 63, 196, 0.1) !important;
  border-color: rgba(91, 63, 196, 0.25) !important;
}

html.light-theme .mbox-chip,
html.light-theme .mbox-add,
html[data-theme="light"] .mbox-chip,
html[data-theme="light"] .mbox-add {
  background: #fff;
  color: #161022;
  border-color: rgba(60, 30, 90, 0.14);
}
html.light-theme .mbox-chip.active,
html.light-theme .mbox-chip:hover,
html[data-theme="light"] .mbox-chip.active,
html[data-theme="light"] .mbox-chip:hover {
  color: #161022 !important;
}
html.light-theme .mbox-x,
html[data-theme="light"] .mbox-x { color: rgba(22, 16, 34, 0.45); }

html.light-theme .available-domains-panel,
html[data-theme="light"] .available-domains-panel {
  background: #f6f2fb !important;
  border-color: rgba(60, 30, 90, 0.12) !important;
  color: #161022 !important;
}
html.light-theme .available-domains-panel .pool-chip,
html[data-theme="light"] .available-domains-panel .pool-chip {
  color: #0b7d56 !important;
  background: rgba(11, 125, 86, 0.1) !important;
}

html.light-theme .workspace,
html[data-theme="light"] .workspace {
  background: rgba(246, 242, 251, 0.65) !important;
  border-color: rgba(60, 30, 90, 0.08) !important;
}

html.light-theme .status-dot.off,
html[data-theme="light"] .status-dot.off {
  background: rgba(22, 16, 34, 0.28);
}

html.light-theme .ttl-pill.warn,
html[data-theme="light"] .ttl-pill.warn { color: #8a5a00; }
html.light-theme .ttl-pill.danger,
html[data-theme="light"] .ttl-pill.danger { color: #c81e3a; }

html.light-theme .cat-pill.tag-finance,
html[data-theme="light"] .cat-pill.tag-finance { color: #8a5a00; }

@media (max-width: 768px) {
  html.light-theme .topbar .nav,
  html[data-theme="light"] .topbar .nav {
    background: #fff !important;
    border-color: rgba(60, 30, 90, 0.12) !important;
    box-shadow: 0 18px 40px rgba(50, 24, 80, 0.12) !important;
  }
  html.light-theme .topbar .nav-link,
  html[data-theme="light"] .topbar .nav-link {
    color: #161022 !important;
    background: rgba(22, 16, 34, 0.04) !important;
  }
  html.light-theme .topbar .nav-link:hover,
  html.light-theme .topbar .nav-link.active,
  html[data-theme="light"] .topbar .nav-link:hover,
  html[data-theme="light"] .topbar .nav-link.active {
    color: #161022 !important;
    background: rgba(91, 63, 196, 0.1) !important;
  }
  html.light-theme .lang-chip,
  html[data-theme="light"] .lang-chip {
    color: #161022 !important;
    background: #fff !important;
    border-color: rgba(60, 30, 90, 0.14) !important;
  }
  html.light-theme .mobile-menu-tools,
  html[data-theme="light"] .mobile-menu-tools {
    border-top-color: rgba(60, 30, 90, 0.1) !important;
  }
}