/* ─── Floor Plan Lobby ───────────────────────────────────────────────────────
   SVG-based architectural overhead view of the gallery.
   Companion to js/lobby-floorplan.js
   ─────────────────────────────────────────────────────────────────────────── */

.fp {
  position: relative;
  width: 100%;
  height: 100vh;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #050506;
}

.fp__svg {
  width: 100%;
  height: 100%;
  /* preserveAspectRatio="xMidYMid meet" (SVG default) — maintains 1200×820
     aspect ratio, centered, with dark bg visible on letterboxed sides */
  transition: transform 0.65s cubic-bezier(0.4, 0, 0.2, 1),
              opacity   0.65s cubic-bezier(0.4, 0, 0.2, 1);
  cursor: default;
}

.fp__svg--zooming {
  transform: scale(5);
  opacity: 0;
}

/* ── Room cells ──────────────────────────────────────────────────────────── */

.fp__room {
  cursor: pointer;
}

.fp__room-bg {
  fill-opacity: 0.5;
  stroke: #1c1c28;
  stroke-width: 1.5;
  transition: fill-opacity 0.2s ease, stroke 0.2s ease;
}

.fp__room--hover .fp__room-bg {
  fill-opacity: 0.82;
  stroke: var(--room-glow, #c9b99a);
  stroke-width: 2;
  filter: drop-shadow(0 0 10px var(--room-glow, rgba(201, 185, 154, 0.35)));
}

/* ── Room text ───────────────────────────────────────────────────────────── */

.fp__room-name {
  fill: #c9b99a;
  font-family: 'Cormorant Garamond', serif;
  font-weight: 600;
  font-size: 14.5px;
  text-anchor: middle;
  dominant-baseline: middle;
  pointer-events: none;
}

.fp__room-sub {
  fill: #40404e;
  font-family: 'Raleway', sans-serif;
  font-size: 9px;
  font-weight: 300;
  text-anchor: middle;
  dominant-baseline: middle;
  pointer-events: none;
  letter-spacing: 0.05em;
}

.fp__room-count {
  fill: #303040;
  font-family: 'Raleway', sans-serif;
  font-size: 10px;
  font-weight: 400;
  text-anchor: middle;
  dominant-baseline: middle;
  pointer-events: none;
  letter-spacing: 0.04em;
}

.fp__room-num {
  fill: #28283a;
  font-family: 'Raleway', sans-serif;
  font-size: 8.5px;
  font-weight: 300;
  pointer-events: none;
  letter-spacing: 0.06em;
}

/* Hover brightening */
.fp__room--hover .fp__room-name  { fill: #e8dfc8; }
.fp__room--hover .fp__room-sub   { fill: #7a7888; }
.fp__room--hover .fp__room-count { fill: #8a8898; }
.fp__room--hover .fp__room-num   { fill: #5a5868; }

/* ── Title / labels ──────────────────────────────────────────────────────── */

.fp__title {
  fill: #d8d4cf;
  font-family: 'Cormorant Garamond', serif;
  font-size: 20px;
  font-weight: 300;
  text-anchor: middle;
  dominant-baseline: middle;
  letter-spacing: 0.2em;
}

.fp__plan-label {
  fill: #2c2c3c;
  font-family: 'Raleway', sans-serif;
  font-size: 8.5px;
  font-weight: 400;
  text-anchor: middle;
  dominant-baseline: middle;
  letter-spacing: 0.32em;
}

/* ── Corridor lines ───────────────────────────────────────────────────────── */

.fp__corridor-line {
  stroke: #0d0d16;
  stroke-width: 1;
  stroke-dasharray: 3 10;
  pointer-events: none;
}

/* ── Compass ─────────────────────────────────────────────────────────────── */

.fp__compass-line {
  stroke: #2c2c3c;
  stroke-width: 1.5;
}

.fp__compass-arrow {
  fill: #c9b99a;
  opacity: 0.55;
}

.fp__compass-n {
  fill: #3a3a4c;
  font-family: 'Raleway', sans-serif;
  font-size: 8.5px;
  font-weight: 400;
  dominant-baseline: middle;
  letter-spacing: 0.1em;
}

/* ── Footer ──────────────────────────────────────────────────────────────── */

.fp__footer {
  fill: #222232;
  font-family: 'Raleway', sans-serif;
  font-size: 8.5px;
  font-weight: 300;
  dominant-baseline: middle;
  letter-spacing: 0.18em;
}

/* ── Tooltip ─────────────────────────────────────────────────────────────── */

.fp__tooltip {
  position: absolute;
  width: 200px;
  padding: 10px 14px;
  background: rgba(10, 10, 16, 0.96);
  border: 1px solid #222232;
  border-radius: 3px;
  pointer-events: none;
  opacity: 0;
  transform: translateY(5px);
  transition: opacity 0.15s ease, transform 0.15s ease;
  z-index: 10;
}

.fp__tooltip--visible {
  opacity: 1;
  transform: translateY(0);
}

.fp__tt-name {
  display: block;
  color: #c9b99a;
  font-family: 'Cormorant Garamond', serif;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.2;
  margin-bottom: 3px;
}

.fp__tt-sub {
  display: block;
  color: #565464;
  font-family: 'Raleway', sans-serif;
  font-size: 10px;
  font-weight: 300;
  margin-bottom: 4px;
}

.fp__tt-count {
  display: block;
  color: #3a3848;
  font-family: 'Raleway', sans-serif;
  font-size: 10px;
  font-weight: 400;
  letter-spacing: 0.05em;
}