/* ── Lorewoven Dark Fantasy Theme ── */
@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;600;700&family=Cormorant+Garamond:ital,wght@0,400;0,600;1,400&display=swap');

:root {
  --lw-black:      #080306;
  --lw-surface:    #0f0507;
  --lw-surface-2:  #18080c;
  --lw-surface-3:  #200e10;
  --lw-border:     #3a1218;
  --lw-gold:       #d4a840;
  --lw-gold-light: #f2c84e;
  --lw-gold-dim:   #a07e2e;
  --lw-red:        #8c1a20;
  --lw-red-light:  #b02530;
  --lw-cream:      #f0e8dc;
  --lw-cream-dim:  #c8b8a2;
  --lw-muted:      #907268;
}

/* ── Base ── */
body {
  background-color: var(--lw-black) !important;
  background-image: none !important;
  color: var(--lw-cream);
  font-family: 'Cormorant Garamond', Georgia, serif;
}

h1, h2, h3 {
  font-family: 'Cinzel', serif;
  color: var(--lw-cream);
}

/* ── Navigation ── */
nav {
  background-color: var(--lw-surface) !important;
  border-bottom: 1px solid var(--lw-border);
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.6) !important;
}

nav a {
  color: var(--lw-cream-dim) !important;
}

nav a:hover {
  color: var(--lw-gold) !important;
}

/* Logo */
nav a.text-2xl {
  color: var(--lw-gold) !important;
  font-family: 'Cinzel', serif;
}

nav span {
  color: var(--lw-muted) !important;
}

/* ── Cards & Panels ── */
.bg-white {
  background-color: var(--lw-surface-2) !important;
  color: var(--lw-cream) !important;
  border: 1px solid var(--lw-border);
}

.bg-gray-50 {
  background-color: var(--lw-surface) !important;
  color: var(--lw-muted) !important;
}

/* ── Form Inputs ── */
input[type="text"],
input[type="email"],
input[type="password"],
input[type="url"],
input[type="date"],
select,
textarea {
  background-color: var(--lw-surface-3) !important;
  color: var(--lw-cream) !important;
  border-color: var(--lw-border) !important;
}

input::placeholder,
textarea::placeholder {
  color: var(--lw-muted) !important;
}

input:focus,
select:focus,
textarea:focus {
  border-color: var(--lw-gold-dim) !important;
  box-shadow: 0 0 0 1px var(--lw-gold-dim) !important;
}

select option {
  background-color: var(--lw-surface-3);
  color: var(--lw-cream);
}

label {
  color: var(--lw-cream-dim) !important;
}

/* ── Buttons ── */

/* Primary (bg-gray-700) → blood red */
.bg-gray-700 {
  background-color: var(--lw-red) !important;
  color: var(--lw-cream) !important;
}
.hover\:bg-gray-700:hover,
.hover\:bg-gray-800:hover {
  background-color: var(--lw-red-light) !important;
}

/* Create/Add (bg-green-500) → gold */
.bg-green-500 {
  background-color: var(--lw-gold-dim) !important;
  color: var(--lw-cream) !important;
}
.hover\:bg-green-600:hover {
  background-color: var(--lw-gold) !important;
  color: var(--lw-black) !important;
}

/* Edit (bg-blue-500) → muted gold */
.bg-blue-500 {
  background-color: var(--lw-gold-dim) !important;
  color: var(--lw-cream) !important;
}
.hover\:bg-blue-600:hover {
  background-color: var(--lw-gold) !important;
  color: var(--lw-black) !important;
}

/* Delete / Logout (bg-red-500) → blood red */
.bg-red-500 {
  background-color: var(--lw-red) !important;
}
.hover\:bg-red-600:hover {
  background-color: var(--lw-red-light) !important;
}

/* Cancel (bg-gray-300) */
.bg-gray-300 {
  background-color: var(--lw-surface-3) !important;
  color: var(--lw-cream-dim) !important;
  border: 1px solid var(--lw-border) !important;
}
.hover\:bg-gray-400:hover {
  background-color: var(--lw-border) !important;
}

/* Secondary surface button (bg-gray-800 on homepage) */
.bg-gray-800 {
  background-color: var(--lw-surface-2) !important;
  border: 1px solid var(--lw-border);
}

/* ── Text Colors ── */
.text-gray-800 { color: var(--lw-cream)      !important; }
.text-gray-700 { color: var(--lw-cream-dim)  !important; }
.text-gray-600 { color: var(--lw-cream-dim)  !important; }
.text-gray-500 { color: var(--lw-muted)      !important; }
.text-white    { color: var(--lw-cream)      !important; }
.text-blue-600 { color: var(--lw-gold-dim)   !important; }
.text-red-600  { color: #e07070              !important; }

.hover\:text-gray-300:hover { color: var(--lw-gold) !important; }

/* ── Borders ── */
.border-t, .border-b, .border {
  border-color: var(--lw-border) !important;
}

/* ── Tags ── */
/* Story tags (bg-red-300) → warm gold tint */
.bg-red-300 {
  background-color: rgba(201, 168, 76, 0.18) !important;
  color: var(--lw-gold-light) !important;
  border: 1px solid rgba(201, 168, 76, 0.3);
}

/* Race badge (bg-blue-100) */
.bg-blue-100 {
  background-color: rgba(201, 168, 76, 0.12) !important;
  color: var(--lw-cream-dim) !important;
  border: 1px solid rgba(201, 168, 76, 0.2);
}

/* Class / fallback badge (bg-gray-100) */
.bg-gray-100 {
  background-color: var(--lw-surface-3) !important;
  color: var(--lw-muted) !important;
}

/* Public badge (bg-green-100) */
.bg-green-100 {
  background-color: rgba(201, 168, 76, 0.12) !important;
  border: 1px solid rgba(201, 168, 76, 0.25);
}
.text-green-600,
.text-green-700 { color: var(--lw-gold) !important; }

/* ── Flash / Alert Messages ── */
.bg-red-100 {
  background-color: rgba(122, 21, 21, 0.25) !important;
  border-color: var(--lw-red) !important;
}
.text-red-700 { color: #e8a0a0 !important; }

.bg-green-100 {
  background-color: rgba(201, 168, 76, 0.12) !important;
  border-color: var(--lw-gold-dim) !important;
}
.text-green-700 { color: var(--lw-gold-light) !important; }

/* Resend verification info box (bg-blue-50) */
.bg-blue-50 {
  background-color: var(--lw-surface-3) !important;
  border-color: var(--lw-border) !important;
}
.border-blue-200 { border-color: var(--lw-border) !important; }
.text-blue-800   { color: var(--lw-cream-dim) !important; }

/* Purple email highlight on resend page */
.text-purple-600 { color: var(--lw-gold) !important; }

/* ── Email Verification Banner ── */
.bg-yellow-500 {
  background-color: #1a1000 !important;
  border-top: 1px solid var(--lw-gold-dim);
  border-bottom: 1px solid var(--lw-gold-dim);
}
.bg-yellow-50  { background-color: var(--lw-surface-3) !important; }
.hover\:bg-yellow-50:hover { background-color: var(--lw-border) !important; }
.text-yellow-600 { color: var(--lw-gold) !important; }

/* ── Prose / Story content ── */
.prose { color: var(--lw-cream) !important; }

/* ── Footer ── */
footer {
  color: var(--lw-muted) !important;
  border-top: 1px solid var(--lw-border);
}

/* ── Checkbox ── */
input[type="checkbox"] {
  accent-color: var(--lw-gold);
}