/* ── kazusa home portal — shared styles ── */
:root {
  --bg: #fafafa; --card-bg: #fff; --border: #e5e7eb; --text: #171717;
  --text-muted: #737373; --text-subtle: #a3a3a3; --hover-bg: #f5f5f5;
  --radius: 12px; --shadow: 0 1px 3px rgba(0,0,0,.06);
  --danger: #ef4444; --success: #22c55e; --primary: #3b82f6;
  --warning: #f59e0b;
}
/* auto + system dark */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme]) {
    --bg: #0a0a0a; --card-bg: #171717; --border: #262626; --text: #fafafa;
    --text-muted: #a3a3a3; --text-subtle: #525252; --hover-bg: #1a1a1a;
    --shadow: 0 1px 3px rgba(0,0,0,.3);
    --danger: #f87171; --primary: #60a5fa; --warning: #fbbf24;
  }
}
/* manual dark */
:root[data-theme="dark"] {
  --bg: #0a0a0a; --card-bg: #171717; --border: #262626; --text: #fafafa;
  --text-muted: #a3a3a3; --text-subtle: #525252; --hover-bg: #1a1a1a;
  --shadow: 0 1px 3px rgba(0,0,0,.3);
  --danger: #f87171; --primary: #60a5fa; --warning: #fbbf24;
}

* { margin: 0; padding: 0; box-sizing: border-box; }
body {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
  background: var(--bg); color: var(--text); -webkit-tap-highlight-color: transparent;
}

a:not(.btn) { color: inherit; }

/* Lucide icons inherit the surrounding UI color and align with text controls. */
.lucide-icon, .lucide {
  width: 1em; height: 1em; stroke-width: 1.9;
  flex: 0 0 auto; vertical-align: -0.14em;
}
.btn .lucide { width: 1.05em; height: 1.05em; }

/* ── Buttons ── */
.btn, a.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  padding: 8px 18px; border: 1px solid transparent; border-radius: 8px;
  background: var(--card-bg); color: var(--text);
  font-size: 13px; font-weight: 600; line-height: 1.4;
  text-decoration: none; white-space: nowrap;
  cursor: pointer; transition: background .15s, color .15s, filter .15s;
}
.btn:hover:not(:disabled), a.btn:hover:not(:disabled) { background: var(--hover-bg); }
.btn:disabled, .btn:disabled:hover, a.btn:disabled, a.btn:disabled:hover {
  background: var(--border); color: var(--text-muted); border-color: transparent;
  cursor: not-allowed; filter: none;
}

.btn-sm, a.btn-sm { padding: 5px 12px; font-size: 12px; border-radius: 6px; }

.btn-primary, a.btn-primary { background: var(--primary); color: #fff; }
.btn-primary:hover:not(:disabled), a.btn-primary:hover:not(:disabled) { filter: brightness(1.15); }

.btn-outline, a.btn-outline {
  background: none; border-color: var(--border); color: var(--text);
}
.btn-outline:hover:not(:disabled), a.btn-outline:hover:not(:disabled) { background: var(--hover-bg); }

.btn-danger, a.btn-danger { background: var(--danger); color: #fff; }
.btn-danger:hover:not(:disabled), a.btn-danger:hover:not(:disabled) { filter: brightness(1.15); }

.btn-danger-outline, a.btn-danger-outline {
  background: none; border-color: var(--danger); color: var(--danger);
}
.btn-danger-outline:hover:not(:disabled), a.btn-danger-outline:hover:not(:disabled) { background: var(--danger); color: #fff; }

.badge { display: inline-block; padding: 2px 8px; border-radius: 4px; font-size: 11px; font-weight: 500; }
.badge-admin { background: #dbeafe; color: #1d4ed8; }
.badge-user { background: #f3f4f6; color: #6b7280; }
.badge-custom { background: #fef3c7; color: #92400e; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme]) .badge-admin { background: #1e3a5f; color: #93c5fd; }
  :root:not([data-theme]) .badge-user { background: #262626; color: #a3a3a3; }
  :root:not([data-theme]) .badge-custom { background: #422006; color: #fbbf24; }
}
:root[data-theme="dark"] .badge-admin { background: #1e3a5f; color: #93c5fd; }
:root[data-theme="dark"] .badge-user { background: #262626; color: #a3a3a3; }
:root[data-theme="dark"] .badge-custom { background: #422006; color: #fbbf24; }

.msg { padding: 8px 12px; border-radius: 6px; font-size: 13px; margin-bottom: 12px; display: none; }
.msg-ok { background: #f0fdf4; color: #166534; }
.msg-err { background: #fef2f2; color: #991b1b; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme]) .msg-ok { background: #052e16; }
  :root:not([data-theme]) .msg-err { background: #2a1010; }
}
:root[data-theme="dark"] .msg-ok { background: #052e16; }
:root[data-theme="dark"] .msg-err { background: #2a1010; }

/* ── Theme toggle ── */
.theme-toggle {
  position: fixed; top: 16px; right: 16px; z-index: 999;
  width: 36px; height: 36px; border-radius: 50%;
  border: 1px solid var(--border); background: var(--card-bg);
  color: var(--text-muted); cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: background .15s, color .15s;
  box-shadow: var(--shadow);
}
.theme-toggle:hover { background: var(--hover-bg); color: var(--text); }
.theme-toggle .lucide { width: 17px; height: 17px; }
