/*
 * Realistic broken deploy — wrong white theme, layout collapse, dead UI.
 * Loaded only when SITE_BROKEN_MODE=1 (non-blocked paths).
 */

/* ── Wrong theme: white shell, partial dark header (CSS half-loaded) ── */
:root {
  --parchment: #ffffff !important;
  --cream: #fafafa !important;
  --ink: #1c1917 !important;
  --stone: #44403c !important;
  --sand: #d6d3d1 !important;
  --forest: #ffffff !important;
  --gold: #78716c !important;
}

html.site-broken-ugly {
  scroll-behavior: auto !important;
}

body {
  background: #ffffff !important;
  color: #1c1917 !important;
  overflow-x: auto !important;
}

.void-grid {
  display: none !important;
}

/* Header kept dark — rest of page flipped to white (classic partial deploy) */
header,
#navbar-inner,
nav.bg-forest\/95,
header .bg-forest {
  background: #1c3a2e !important;
  border-bottom: 1px solid #0f241c !important;
}

header a,
header button,
header .text-stone,
header .text-cream {
  color: #a8b5b0 !important;
}

/* Main content: white shell, readable dark type */
main,
section,
article,
.glass-panel,
.bg-parchment,
.bg-cream,
.bg-void,
[class*="bg-parchment"],
[class*="bg-cream"] {
  background: #ffffff !important;
  background-color: #ffffff !important;
}

h1, h2, h3, h4, h5, h6,
.font-display,
.text-ink {
  color: #1c1917 !important;
}

p, li, label, .text-stone {
  color: #44403c !important;
}

span:not(header span) {
  color: inherit !important;
}

.text-muted,
.text-fog,
.text-gray-400,
.text-gray-500 {
  color: #78716c !important;
}

/* Forest buttons → white box, dark label (broken styling, readable) */
a.bg-forest,
button.bg-forest,
.btn-primary,
.bg-forest {
  background: #ffffff !important;
  color: #1c1917 !important;
  border: 1px solid #a8a29e !important;
  box-shadow: none !important;
}

/* Links revert to default blue underline */
main a:not(.bg-forest),
section a:not(.bg-forest),
footer a {
  color: #0000ee !important;
  text-decoration: underline !important;
}

/* Forms: readable but flat / wrong borders */
input,
textarea,
select {
  background: #fff !important;
  color: #1c1917 !important;
  border: 1px solid #d6d3d1 !important;
}

input::placeholder,
textarea::placeholder {
  color: #a8a29e !important;
}

/* Google Fonts failed */
body,
.font-sans,
p, li, label, input, textarea, select, button {
  font-family: Arial, Helvetica, sans-serif !important;
}

h1, h2, h3, h4, h5, h6,
.font-display {
  font-family: Georgia, serif !important;
  letter-spacing: 0 !important;
}

.section-number,
.font-mono {
  font-family: "Courier New", monospace !important;
}

/* Layout regressions */
main,
#main-content,
[role="main"] {
  padding-top: 0 !important;
  margin-top: -4.5rem !important;
}

.max-w-7xl,
.max-w-6xl,
.max-w-5xl,
.max-w-4xl {
  max-width: 112% !important;
  margin-left: -4% !important;
}

.grid {
  display: block !important;
}

.grid > * {
  width: 100% !important;
  margin-bottom: 0.5rem !important;
}

.flex {
  flex-wrap: wrap !important;
  gap: 0.25rem !important;
}

main .flex > *,
section .flex > * {
  flex: 1 1 100% !important;
  min-width: 100% !important;
}

header nav.flex > *,
header .flex > * {
  flex: 0 1 auto !important;
  min-width: 0 !important;
}

.glass-panel {
  border: 1px solid #f0f0f0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0.75rem !important;
}

img {
  max-width: 130% !important;
  opacity: 0.35 !important;
  filter: grayscale(1) !important;
}

.text-transparent.bg-clip-text {
  color: #57534e !important;
  background: none !important;
  -webkit-text-fill-color: #57534e !important;
}

footer {
  margin-top: -5rem !important;
  background: #fff !important;
  border-top: none !important;
  z-index: 30 !important;
}

footer,
footer p,
footer h4 {
  color: #44403c !important;
}

footer a {
  color: #0000ee !important;
}

#section-tracker {
  display: none !important;
}

.cursor-dot,
.cursor-ring,
#reading-progress {
  display: none !important;
}

.reveal,
.reveal-subtle {
  opacity: 0.4 !important;
  transform: translateY(24px) !important;
}

section {
  margin-left: -16px !important;
  padding-right: 0 !important;
  overflow: hidden !important;
}

section + section {
  margin-top: -2rem !important;
}

/* Mega menu visible but clipped / unusable */
.mega-menu {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: none !important;
  max-height: 40px !important;
  overflow: hidden !important;
  border: 1px solid #eee !important;
}

#mobile-menu {
  max-height: 120px !important;
  overflow: hidden !important;
  opacity: 0.95 !important;
}

/* Booking */
.progress-bar {
  opacity: 0.2 !important;
}

.progress-step {
  transform: translateX(-12px) !important;
  color: #57534e !important;
}

/* Mark broken controls */
.site-broken-ugly [data-broken-hint]::after {
  content: "";
}