/* ===== Design Tokens (FrankenUI HSL Variable Overrides) ===== */

.uk-theme-mystischer-stein {
  --primary: 354 82% 24%;
  --primary-foreground: 0 0% 100%;
  --background: 30 33% 97%;
  --foreground: 0 0% 10%;
  --card: 0 0% 100%;
  --card-foreground: 0 0% 10%;
  --popover: 0 0% 100%;
  --popover-foreground: 0 0% 10%;
  --muted: 30 25% 94%;
  --muted-foreground: 0 0% 42%;
  --accent: 40 50% 55%;
  --accent-foreground: 0 0% 17%;
  --secondary: 30 25% 94%;
  --secondary-foreground: 0 0% 10%;
  --border: 0 0% 88%;
  --input: 0 0% 88%;
  --ring: 354 82% 24%;
  --destructive: 0 84% 60%;
  --destructive-foreground: 0 0% 100%;
  --chart-1: 354 82% 24%;
  --chart-2: 40 50% 55%;
  --chart-3: 30 25% 70%;
  --chart-4: 0 0% 42%;
  --chart-5: 354 60% 40%;
  --radius: 0.4rem;

  /* Checkbox/indeterminate checkmark artwork (missing from custom themes by default,
     which leaves --uk-form-checkbox-image undefined and the checkmark invisible). */
  --uk-form-checkbox-image: url("data:image/svg+xml,%3Csvg width='15' height='15' viewBox='0 0 15 15' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='100%25' height='100%25' fill='%236f0b15' /%3E%3Cpath d='M11.4669 3.72684C11.7558 3.91574 11.8369 4.30308 11.648 4.59198L7.39799 11.092C7.29783 11.2452 7.13556 11.3467 6.95402 11.3699C6.77247 11.3931 6.58989 11.3355 6.45446 11.2124L3.70446 8.71241C3.44905 8.48022 3.43023 8.08494 3.66242 7.82953C3.89461 7.57412 4.28989 7.55529 4.5453 7.78749L6.75292 9.79441L10.6018 3.90792C10.7907 3.61902 11.178 3.53795 11.4669 3.72684Z' fill='%23ffffff' fill-rule='evenodd' clip-rule='evenodd' %3E%3C/path%3E%3C/svg%3E");
  --uk-form-checkbox-image-indeterminate: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Crect fill='%236f0b15' x='3' y='8' width='10' height='1' /%3E%3C/svg%3E");
}

/* Dark mode variant */
.dark.uk-theme-mystischer-stein {
  --primary: 354 70% 45%;
  --primary-foreground: 0 0% 100%;
  --background: 0 0% 7%;
  --foreground: 30 10% 90%;
  --card: 0 0% 10%;
  --card-foreground: 30 10% 90%;
  --popover: 0 0% 10%;
  --popover-foreground: 30 10% 90%;
  --muted: 0 0% 15%;
  --muted-foreground: 0 0% 60%;
  --accent: 40 45% 50%;
  --accent-foreground: 0 0% 100%;
  --secondary: 0 0% 15%;
  --secondary-foreground: 30 10% 90%;
  --border: 0 0% 20%;
  --input: 0 0% 20%;
  --ring: 354 70% 45%;
  --destructive: 0 70% 50%;
  --destructive-foreground: 0 0% 100%;
  --chart-1: 354 70% 45%;
  --chart-2: 40 45% 50%;
  --chart-3: 30 20% 50%;
  --chart-4: 0 0% 55%;
  --chart-5: 354 50% 55%;

  --uk-form-checkbox-image: url("data:image/svg+xml,%3Csvg width='15' height='15' viewBox='0 0 15 15' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='100%25' height='100%25' fill='%23c32232' /%3E%3Cpath d='M11.4669 3.72684C11.7558 3.91574 11.8369 4.30308 11.648 4.59198L7.39799 11.092C7.29783 11.2452 7.13556 11.3467 6.95402 11.3699C6.77247 11.3931 6.58989 11.3355 6.45446 11.2124L3.70446 8.71241C3.44905 8.48022 3.43023 8.08494 3.66242 7.82953C3.89461 7.57412 4.28989 7.55529 4.5453 7.78749L6.75292 9.79441L10.6018 3.90792C10.7907 3.61902 11.178 3.53795 11.4669 3.72684Z' fill='%23ffffff' fill-rule='evenodd' clip-rule='evenodd' %3E%3C/path%3E%3C/svg%3E");
  --uk-form-checkbox-image-indeterminate: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Crect fill='%23c32232' x='3' y='8' width='10' height='1' /%3E%3C/svg%3E");
}

/* ===== Typography ===== */

body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6,
.uk-h1, .uk-h2, .uk-h3, .uk-h4, .uk-h5, .uk-h6 {
  font-family: 'Playfair Display', Georgia, 'Times New Roman', serif;
  font-weight: 400;
  letter-spacing: 0.01em;
}

/* ===== Navbar ===== */

.mystischer-stein-navbar {
  background: hsl(0 0% 100%);
  border-bottom: 1px solid hsl(var(--border));
}

.mystischer-stein-nav-link {
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-size: 0.78rem;
  font-family: 'Inter', sans-serif;
  font-weight: 400;
  color: hsl(var(--muted-foreground));
  transition: color 0.3s ease;
  text-decoration: none;
}

.mystischer-stein-nav-link:hover {
  color: hsl(var(--primary));
  text-decoration: none;
}

.mystischer-stein-nav-active {
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-size: 0.78rem;
  font-family: 'Inter', sans-serif;
  font-weight: 600;
  color: hsl(var(--primary));
  text-decoration: none;
}

.mystischer-stein-brand {
  font-family: 'Playfair Display', Georgia, serif;
  font-weight: 500;
  letter-spacing: 0.05em;
  color: hsl(var(--foreground));
  text-decoration: none;
}

.mystischer-stein-brand:hover {
  text-decoration: none;
  color: hsl(var(--primary));
}

/* ===== Cards ===== */

.mystischer-stein-card {
  border: 1px solid hsl(var(--border));
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 1px 2px rgba(0, 0, 0, 0.02);
  transition: box-shadow 0.3s ease;
}

.mystischer-stein-card:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06), 0 2px 4px rgba(0, 0, 0, 0.03);
}

/* ===== Page Title ===== */

.mystischer-stein-page-title {
  font-weight: 400;
  letter-spacing: 0.02em;
  color: hsl(var(--foreground));
}

/* ===== Gold Accent Button ===== */

.btn-accent-gold {
  background-color: hsl(40 50% 55%);
  color: hsl(0 0% 10%);
  border: none;
  font-family: 'Inter', sans-serif;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-size: 0.85rem;
  padding: 0.5rem 1.5rem;
  border-radius: var(--radius);
  cursor: pointer;
  transition: background-color 0.3s ease, box-shadow 0.3s ease;
}

.btn-accent-gold:hover {
  background-color: hsl(40 55% 48%);
  box-shadow: 0 2px 8px rgba(197, 162, 88, 0.3);
}

/* ===== Form Refinements ===== */

.uk-theme-mystischer-stein .uk-input,
.uk-theme-mystischer-stein .uk-select,
.uk-theme-mystischer-stein .uk-textarea {
  font-family: 'Inter', sans-serif;
  border-radius: var(--radius);
}

.uk-theme-mystischer-stein .uk-form-label {
  font-family: 'Inter', sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-size: 0.75rem;
  font-weight: 500;
  color: hsl(var(--muted-foreground));
}

/* ===== Table Refinements ===== */

.uk-theme-mystischer-stein th {
  font-family: 'Inter', sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-size: 0.75rem;
  font-weight: 600;
  color: hsl(var(--muted-foreground));
}

/* ===== Subtle Divider ===== */

.mystischer-stein-divider {
  border: none;
  border-top: 1px solid hsl(var(--border));
  margin: 2rem 0;
}