/* floor-plan.css — SVG zone styles, animations, tooltips */

.floor-plan-svg {
  width: 100%;
  height: 100%;
  max-height: 100%;
  display: block;
  object-fit: contain;
}

/* Zone rectangles */
.zone-rect {
  stroke-width: 1.5;
  transition: fill var(--transition-fast), stroke var(--transition-fast);
  cursor: pointer;
}

.zone-rect:hover {
  stroke-width: 2.5;
  filter: brightness(0.93);
}

/* Zone labels */
.zone-label {
  font-family: var(--font-family);
  font-size: 9px;
  font-weight: 500;
  fill: #334155;
  pointer-events: none;
  text-anchor: middle;
  dominant-baseline: middle;
}

.zone-label-sub {
  font-size: 8px;
  fill: #64748b;
}

/* Floor type colors */
.zone-floor-1 { fill: #f0ebe4; stroke: #c4b5a0; }
.zone-floor-2 { fill: #dbeafe; stroke: #93c5fd; }
.zone-floor-P { fill: #d1fae5; stroke: #6ee7b7; }

/* Alert state overlays */
.zone-alert-yellow {
  stroke: var(--color-yellow) !important;
  stroke-width: 2.5 !important;
  animation: pulse-zone-yellow 1.8s infinite;
}

.zone-alert-red {
  stroke: var(--color-red) !important;
  stroke-width: 2.5 !important;
  animation: pulse-zone-red 1.2s infinite;
}

@keyframes pulse-zone-yellow {
  0%, 100% { stroke-opacity: 1; }
  50% { stroke-opacity: 0.4; }
}

@keyframes pulse-zone-red {
  0%, 100% { stroke-opacity: 1; stroke-width: 2.5; }
  50% { stroke-opacity: 0.5; stroke-width: 4; }
}

/* Alert fill tints */
.zone-fill-red {
  fill: #fef2f2 !important;
}

.zone-fill-yellow {
  fill: #fffbeb !important;
}

/* Occupancy dots */
.dot-layer circle {
  pointer-events: none;
}

.occ-dot-green { fill: var(--color-green); opacity: 0.75; }
.occ-dot-yellow { fill: var(--color-yellow); opacity: 0.8; }
.occ-dot-red { fill: var(--color-red); opacity: 0.85; }

/* Connecting paths (escalators/stairs) */
.connector-path {
  fill: none;
  stroke: #94a3b8;
  stroke-width: 1.5;
  stroke-dasharray: 5 4;
  pointer-events: none;
}

/* Legend */
.floor-legend {
  font-family: var(--font-family);
  font-size: 9px;
  fill: #64748b;
}

.legend-rect {
  stroke-width: 1;
}

/* Tooltip */
.fp-tooltip {
  position: absolute;
  background: var(--color-text);
  color: #fff;
  border-radius: var(--border-radius-sm);
  padding: 6px 10px;
  font-size: var(--font-size-xs);
  pointer-events: none;
  z-index: 50;
  white-space: nowrap;
  box-shadow: var(--shadow-md);
  transform: translate(-50%, -110%);
}

.fp-tooltip strong {
  display: block;
  font-weight: 600;
  margin-bottom: 2px;
}

.fp-tooltip-wrap {
  position: relative;
}

/* Capacity badge (alert count in zone center) */
.zone-capacity-badge {
  font-family: var(--font-family);
  font-size: 8px;
  font-weight: 700;
  fill: var(--color-red);
  pointer-events: none;
  text-anchor: middle;
}
