/* Reality Rift — Arcade-Overrides für das Laravel-Buchungssystem (Kalender, Checkout,
 * Login, Gutschein). Lädt NACH tailwind.css und rr-arcade.css. Ziel: die Backend-Seiten
 * fühlen sich wie dieselbe Website an (Schwarz, Kernblau, eine Formsprache), ohne
 * 856 Zeilen Blade umzubauen. Vollständiger Umbau = eigener Arbeitsauftrag
 * (rr-design-system-v1.md, Abschnitt Backend). */

/* Grundfläche */
body, .bg-blue-900, .bg-primary, .bg-\[\#010b2b\] { background-color: var(--rr-bg) !important; color: var(--rr-text); }
.bg-blue-700, .bg-blue-800 { background-color: var(--rr-bg-soft) !important; }
.bg-blue-100, .bg-white\/10, .bg-blue-50 { background-color: rgb(255 255 255 / 0.06) !important; color: var(--rr-text) !important; }
.bg-blue-400, .bg-blue-500, .bg-blue-600 { background-color: var(--rr-electric) !important; color: #050507 !important; }
.text-blue-900, .text-blue-800, .text-blue-700 { color: var(--rr-text) !important; }
.text-blue-400, .text-blue-500, .text-blue-300 { color: var(--rr-electric) !important; }
.border-blue-100, .border-blue-200, .border-blue-300, .border-blue-400 { border-color: rgb(94 139 255 / 0.4) !important; }

/* Eine Formsprache: alle Rundungen → geschnittene Ecke */
[class*="rounded"] {
  border-radius: 0 !important;
  clip-path: polygon(var(--cut, 10px) 0, 100% 0, 100% calc(100% - var(--cut, 10px)), calc(100% - var(--cut, 10px)) 100%, 0 100%, 0 var(--cut, 10px));
}
.rounded-full { --cut: 4px; }
.rounded, .rounded-lg, .rounded-md { --cut: 8px; }
.rounded-xl, .rounded-2xl, .rounded-3xl, .rounded-20 { --cut: 14px; }
/* Kreise bleiben Kreise: Icons, Avatare, Schritt-Nummern */
.rounded-full.w-6, .rounded-full.w-8, .rounded-full.w-10, .rounded-full.w-12, .rounded-full.h-6, .rounded-full.h-8, .rounded-full.h-10, .rounded-full.h-12, svg[class*="rounded"] {
  clip-path: none !important; border-radius: 9999px !important;
}

/* Buttons: ein System */
.btn-primary, .btn-white, button[type="submit"], .bg-blue-400.text-white, a.bg-blue-400 {
  background: linear-gradient(180deg, var(--rr-electric), var(--rr-blue-light)) !important;
  color: #fff !important;
  font-family: var(--rr-font-display); text-transform: uppercase; letter-spacing: .06em; font-weight: 700;
  border: 0 !important; border-radius: 0 !important; min-height: 48px; padding: 0 24px;
  box-shadow: 0 4px 0 #041088, inset 3px 0 0 var(--rr-yellow) !important;
  clip-path: polygon(8px 0, 100% 0, 100% calc(100% - 8px), calc(100% - 8px) 100%, 0 100%, 0 8px);
  transition: transform .15s ease, box-shadow .15s ease;
}
.btn-primary:hover, .btn-white:hover, button[type="submit"]:hover { transform: translateY(-1px); box-shadow: 0 5px 0 #041088, inset 6px 0 0 var(--rr-yellow), var(--rr-glow-outer) !important; }
.btn-primary:active, .btn-white:active, button[type="submit"]:active { transform: translateY(3px); box-shadow: 0 1px 0 #041088, inset 3px 0 0 var(--rr-yellow) !important; }
.btn-secondary, .btn-outline {
  background: transparent !important; color: var(--rr-electric) !important; border: 2px solid var(--rr-electric) !important;
  font-family: var(--rr-font-display); text-transform: uppercase; letter-spacing: .06em; font-weight: 700; min-height: 48px; padding: 0 24px; border-radius: 0 !important;
  box-shadow: 0 4px 0 rgb(94 139 255 / .4), inset 3px 0 0 var(--rr-yellow) !important;
  clip-path: polygon(8px 0, 100% 0, 100% calc(100% - 8px), calc(100% - 8px) 100%, 0 100%, 0 8px);
}
.btn-secondary:hover { background: rgb(94 139 255 / .15) !important; }

/* Kalender/Slot-Buttons: gewählt = Kernblau, verfügbar = Rahmen, gesperrt = gedimmt */
[wire\:click*="selectDate"], [wire\:click*="selectSession"], [wire\:click*="selectTime"], .cursor-pointer.bg-blue-100 {
  background: rgb(255 255 255 / .05) !important; border: 1px solid rgb(94 139 255 / .35) !important; color: var(--rr-text) !important;
}
[wire\:click*="selectDate"]:hover, [wire\:click*="selectSession"]:hover, [wire\:click*="selectTime"]:hover { border-color: var(--rr-electric) !important; box-shadow: var(--rr-glow-inner); }
.bg-blue-400[wire\:click], .bg-blue-400.text-white:not(button) { background: var(--rr-electric) !important; color: #050507 !important; }
button:disabled, .cursor-not-allowed, .opacity-50 { opacity: .35 !important; }

/* Eingaben */
input[type="text"], input[type="email"], input[type="tel"], input[type="number"], input[type="password"], select, textarea {
  background: rgb(255 255 255 / .05) !important; color: var(--rr-text) !important; border: 1px solid rgb(94 139 255 / .35) !important; border-radius: 0 !important;
}
input:focus, select:focus, textarea:focus { outline: none; border-color: var(--rr-electric) !important; box-shadow: var(--rr-glow-inner) !important; }
::placeholder { color: var(--rr-muted) !important; }

/* Überschriften in der Display-Schrift, Mono-Kicker */
h1, h2, .text-3xl, .text-4xl { font-family: var(--rr-font-display); text-transform: uppercase; letter-spacing: .01em; }