:root,
:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #0e0e11;
  --surface: #141419;
  --ink: #eceae4;
  --dim: #a6a3a9;
  --accent: #ff4a2b;
  --accent-2: #5aa9ff;
  --line: rgba(236, 234, 228, .20);
  --line-soft: rgba(236, 234, 228, .09);
  --hover: rgba(236, 234, 228, .05);
  --sans: Inter, "Helvetica Neue", Helvetica, Arial, system-ui, sans-serif;
  --mono: "SFMono-Regular", ui-monospace, Menlo, Consolas, monospace;
}

:root[data-theme="light"] {
  color-scheme: light;
  --bg: #f4f2ed;
  --surface: #faf9f5;
  --ink: #16161a;
  --dim: #77746c;
  --accent: #c8341a;
  --accent-2: #1d4ed8;
  --line: rgba(22, 22, 26, .20);
  --line-soft: rgba(22, 22, 26, .09);
  --hover: rgba(22, 22, 26, .05);
}

html { background: var(--bg); }
body {
  background: var(--bg) !important;
  color: var(--ink);
  font-family: var(--sans);
  font-size: 15px;
  line-height: 1.55;
  letter-spacing: -.01em;
}

.navbar {
  position: sticky;
  top: 0;
  z-index: 40;
  min-height: 4.25rem;
  background: color-mix(in srgb, var(--bg) 94%, transparent) !important;
  border-bottom: 1px solid var(--line);
  box-shadow: none !important;
  backdrop-filter: blur(14px);
}

.james-brand {
  display: inline-flex;
  align-items: center;
  gap: .72rem;
  margin-right: .65rem;
  color: var(--ink);
  text-decoration: none;
}
.james-glyph {
  width: 1.9rem;
  height: 1.9rem;
  display: grid;
  place-items: center;
  border: 1px solid var(--ink);
}
.james-glyph span { width: .7rem; height: .7rem; background: var(--accent); }
.james-brand-copy { display: grid; line-height: 1; }
.james-brand-copy strong { font-size: 1.12rem; font-weight: 560; letter-spacing: -.04em; }
.james-brand-copy small {
  margin-top: .27rem;
  color: var(--dim);
  font-family: var(--mono);
  font-size: .55rem;
  letter-spacing: .09em;
  text-transform: uppercase;
}

h1, h2, h3, h4 { color: var(--ink); font-weight: 480 !important; letter-spacing: -.035em; }
a { text-underline-offset: 3px; }

.btn, .tab, .badge, .input, .select, .textarea, .file-input {
  border-radius: 0 !important;
}
.btn, .tab, .menu, label, .label-text {
  font-family: var(--sans);
  letter-spacing: .005em;
}
.btn {
  min-height: 2.25rem;
  background: transparent !important;
  color: var(--ink) !important;
  border-color: var(--line) !important;
  box-shadow: none !important;
  text-transform: none;
  font-size: .78rem;
  font-weight: 520;
}
.btn:hover { background: var(--hover) !important; border-color: var(--ink) !important; color: var(--ink) !important; }
.btn-active, .tab-active, .btn-primary {
  background: var(--ink) !important;
  border-color: var(--ink) !important;
  color: var(--bg) !important;
}
.btn-active:hover, .tab-active:hover, .btn-primary:hover {
  background: var(--ink) !important;
  color: var(--bg) !important;
}
.btn.btn-error, .badge.badge-error { background: #b91c1c !important; color: #fff !important; }
.btn.btn-secondary, .badge.badge-secondary { background: var(--accent-2) !important; color: #fff !important; }
.btn.btn-success, .badge.badge-success { background: #15803d !important; color: #fff !important; }
.btn.btn-warning, .badge.badge-warning { background: #a16207 !important; color: #fff !important; }
.james-theme-toggle { min-width: 4.6rem; color: var(--accent); }

.navbar .btn-ghost {
  border-color: transparent !important;
  color: var(--dim) !important;
}
.navbar .btn-ghost:hover { color: var(--ink) !important; background: transparent !important; }
.navbar .btn-ghost.btn-active {
  color: var(--ink) !important;
  background: transparent !important;
  border-color: transparent transparent var(--accent) !important;
}

.card, .stats, .stat, .alert, .dropdown-content, .modal-box, .collapse {
  border-radius: 0 !important;
  box-shadow: none !important;
}
.card, .stats, .alert, .modal-box, .collapse {
  background: var(--surface) !important;
  border: 1px solid var(--line-soft);
}
.card-title { font-weight: 480 !important; }
.stat + .stat { border-color: var(--line-soft); }
.stat-title, .text-base-content\/60, .opacity-60, .opacity-70 { color: var(--dim); }
.stat-value { color: var(--ink); font-weight: 480; letter-spacing: -.045em; }

.dropdown-content {
  background: var(--surface) !important;
  border: 1px solid var(--line) !important;
}
.menu li > a { border-radius: 0; }
.menu li > a:hover { background: var(--hover); color: var(--accent); }

.input, .select, .textarea, .file-input {
  font-family: var(--sans);
  background: transparent !important;
  border-color: var(--line) !important;
  color: var(--ink) !important;
  outline: none !important;
}
.input:focus, .select:focus, .textarea:focus { border-color: var(--accent) !important; }
.tabs, .tabs-boxed { background: transparent !important; border-color: var(--line); }
.tab {
  background: transparent !important;
  color: var(--ink) !important;
  text-transform: none;
  font-size: .78rem;
  font-weight: 500;
}
.tab:hover { background: var(--hover) !important; color: var(--ink) !important; }
.tab-active, .tab-active:hover { background: var(--ink) !important; color: var(--bg) !important; }
.badge {
  background: transparent !important;
  color: var(--dim) !important;
  border-color: var(--line) !important;
  font-family: var(--mono);
  letter-spacing: .035em;
}
.text-error { color: #f87171 !important; }

.bg-base-100, .bg-base-200, .bg-base-300 { background-color: transparent !important; }
.table { background: transparent !important; color: var(--ink) !important; }
.table :where(th, td) { border-color: var(--line-soft); }
.table th {
  background: transparent !important;
  color: var(--dim) !important;
  font-family: var(--mono);
  font-size: .66rem;
  font-weight: 500;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.table-zebra tbody tr:nth-child(even),
.table-zebra tbody tr:nth-child(even) :where(th, td) { background: var(--hover) !important; }
.table-zebra tbody tr:nth-child(odd),
.table-zebra tbody tr:nth-child(odd) :where(th, td) { background: transparent !important; }
.table tbody tr:hover { background: var(--hover) !important; }

.checkbox, .radio, .toggle {
  color: var(--accent) !important;
  border-color: var(--line) !important;
  box-shadow: none !important;
}
.checkbox:checked, .radio:checked { background-color: var(--accent) !important; border-color: var(--accent) !important; }

footer { border-top: 1px solid var(--line-soft); color: var(--dim); }

@media (max-width: 767px) {
  .navbar > div { align-items: center; }
  .james-brand-copy small { display: none; }
  .james-brand { margin-right: .2rem; }
}
