/* ═══════════════════════════════════════════════════════════════
   Plan 2D — SVG Floorplan, Drawing Tools, Hints
   ═══════════════════════════════════════════════════════════════ */

/* ── Floorplan container ────────────────────────────────────── */
.room-stage #planWrap { height: 100%; width: 100%; min-height: 0; }
#floorplanSvg { width: 100%; height: 100%; }
.room-stage, #floorplanStage { position: relative; overflow: hidden; }

/* Override floorplan inline styles inside canvas */
.canvas__scene #planWrap {
  border: none !important;
  border-radius: 0 !important;
  background: var(--bg-secondary) !important;
  min-height: 0 !important;
  flex: 1;
}

/* Scene hint */
/* Scene hint — в правом верхнем углу, чтобы не перекрывать toolbar (top-left) */
.scene-hint { position: absolute; top: 8px; right: 8px; left: auto; z-index: 10; }
.scene-hint.hint { position: absolute; top: 8px; right: 8px; left: auto; z-index: 10; display: inline-flex; align-items: center; flex-direction: row-reverse; }
.scene-hint.hint .tip { top: 0; right: 24px; left: auto; transform: none; }


/* ── SVG faces & shapes ─────────────────────────────────────── */
.face { cursor: pointer; stroke: #cfd9ee; stroke-width: 1; transition: .15s; -webkit-tap-highlight-color: transparent; }
.face:hover { filter: brightness(1.03); }
.face.active { stroke: var(--accent); stroke-width: 2; filter: drop-shadow(0 2px 8px rgba(244,163,0,.35)); }
.face:focus { outline: none; }
.face:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; border-radius: 2px; }
.floor { fill: #eef4ff; }
.ceiling { fill: #edfaff; }
.wall { fill: #f7f9fe; }
.label { font-size: 12px; fill: var(--text-primary); stroke: var(--bg-primary); stroke-width: 3px; paint-order: stroke fill; pointer-events: none; }
.leader { stroke: #c9d7ef; stroke-width: 1.5; stroke-dasharray: 3 3; pointer-events: none; }
.opening { stroke-width: 1; }
.opening-window { fill: url(#winGrad); stroke: #7aafe0; stroke-width: 1.2; }
.opening-door   { fill: url(#doorGrad); stroke: #9a7b5a; stroke-width: 1.2; }
.detail       { stroke: rgba(255,255,255,.85); stroke-width: 1.5; filter: drop-shadow(0 0 .5px rgba(0,60,120,.15)); }
.detail-frame { fill: none; stroke: rgba(255,255,255,.55); stroke-width: .8; }
.detail-glare { fill: rgba(255,255,255,.3); stroke: none; }
.detail-panel { fill: rgba(255,255,255,.15); stroke: rgba(255,255,255,.35); stroke-width: .6; }
.detail-knob  { fill: #c4a33a; stroke: #7a6420; stroke-width: .6; }

/* 2D edges */
#floorplanSvg .fp2d-edge { stroke: #cbd5e1; stroke-width: 2; vector-effect: non-scaling-stroke; shape-rendering: crispEdges; pointer-events: none; stroke-linecap: round; stroke-linejoin: round; }
#floorplanSvg .room-edges { pointer-events: none; }
#floorplanSvg .fp2d-edge.active { stroke: var(--accent); stroke-width: 4; filter: drop-shadow(0 0 6px rgba(244,163,0,.45)); }
#floorplanSvg .fp2d-sel { fill: none; stroke: var(--accent); stroke-width: 3; stroke-dasharray: 6 4; vector-effect: non-scaling-stroke; pointer-events: none; filter: drop-shadow(0 0 6px rgba(244,163,0,.35)); }
#floorplanSvg .fp2d-sel.ceiling { stroke-dasharray: 3 3; }
#floorplanSvg .fp2d-sel.floor { stroke-dasharray: none; }

/* 2D walls */
#floorplanSvg .fp2d-wall line { transition: stroke 0.15s ease; }
#floorplanSvg .fp2d-wall.active line:first-child { filter: drop-shadow(0 0 6px rgba(244,163,0,.45)); }
#floorplanSvg .fp2d-wall.locked { opacity: 0.7; }
#floorplanSvg .room.locked { opacity: 0.8; }
#floorplanSvg .room.locked rect, #floorplanSvg .room.locked polygon { fill: #f1f5f9 !important; stroke: #94a3b8 !important; }
#floorplanSvg .fp2d-wall circle[data-wall-handle] { transition: transform 0.15s ease, fill 0.15s ease; transform-box: fill-box; transform-origin: center; }
#floorplanSvg .fp2d-wall circle[data-wall-handle]:hover { fill: #fff7e6; transform: scale(1.15); }

/* Drawing modes */
#floorplanSvg.drawing-mode-wall { cursor: crosshair; }
#floorplanSvg.drawing-mode-wall .room, #floorplanSvg.drawing-mode-wall .fp2d-wall { pointer-events: none; }
#floorplanSvg.drawing-mode-pen { cursor: crosshair; }
#floorplanSvg.drawing-mode-pen .room, #floorplanSvg.drawing-mode-pen .fp2d-wall { pointer-events: none; }
#floorplanSvg.drawing-mode-polygon { cursor: crosshair; }
#floorplanSvg.drawing-mode-polygon .room, #floorplanSvg.drawing-mode-polygon .fp2d-wall { pointer-events: none; }

/* Snap indicators */
#floorplanSvg .snap-indicator { pointer-events: none; animation: snap-pulse 0.6s ease-in-out infinite; }
#floorplanSvg .snap-indicator circle { filter: drop-shadow(0 0 3px rgba(244,163,0,.5)); }


/* ── Drawing hints ──────────────────────────────────────────── */
.drawing-hint {
  position: absolute; bottom: 12px; left: 50%; transform: translateX(-50%);
  background: rgba(15, 23, 42, 0.9); color: #fff; padding: 8px 14px;
  border-radius: var(--r-sm); font-size: 12px; pointer-events: none;
  z-index: 100; white-space: nowrap; box-shadow: var(--shadow-md);
}
.drawing-hint b { color: #93c5fd; font-weight: 600; }

.drawing-mode-hint {
  position: absolute; top: 8px; left: 8px; background: rgba(59, 130, 246, 0.9);
  color: #fff; padding: 6px 10px; border-radius: 4px; font-size: 12px; font-weight: 500;
  z-index: 100; pointer-events: none; display: flex; align-items: center; gap: 6px;
}
.drawing-mode-hint::before { content: ''; width: 8px; height: 8px; background: #fff; border-radius: 50%; animation: pulse-dot 1.5s infinite; }


/* ── Vertical Tools Sidebar ─────────────────────────────────── */
.fp-tools-sidebar {
  position: absolute;
  left: 42px;
  top: 40px;
  z-index: 20;
  display: flex;
  flex-direction: column;
  padding: 4px;
  background: var(--bg-glass-thick);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-radius: var(--r-md);
  box-shadow: var(--shadow-md);
  border: 1px solid var(--separator);
}

.fp-tool-group {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.fp-tool {
  width: 34px;
  height: 34px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
  border-radius: var(--r-sm);
  background: transparent;
  cursor: pointer;
  transition: all var(--dur-fast);
  color: var(--text-secondary);
  font-family: inherit;
  font-size: 14px;
  font-weight: 600;
  padding: 0;
  line-height: 1;
}
.fp-tool:hover {
  background: var(--bg-secondary);
  color: var(--text-primary);
}
.fp-tool:hover .tool-ico { opacity: 1; }
.fp-tool.active {
  background: var(--accent);
  color: var(--accent-text);
}
.fp-tool.active .tool-ico {
  filter: brightness(0) invert(1);
  opacity: 1;
}

.fp-tool .tool-ico {
  width: 18px;
  height: 18px;
  display: block;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  opacity: 0.7;
}

.fp-tool-sep {
  height: 1px;
  margin: 4px 6px;
  background: var(--separator);
}
.fp-tool-sep-v {
  width: 1px;
  height: 20px;
  margin: 0 2px;
  background: var(--separator);
  align-self: center;
}

/* ── Bottom Bar (zoom + PDF + help) ────────────────────────── */
.fp-bottom-bar {
  position: absolute;
  left: 8px;
  bottom: 12px;
  z-index: 20;
  display: flex;
  align-items: center;
  gap: 2px;
  padding: 4px;
  background: var(--bg-glass-thick);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-radius: var(--r-md);
  box-shadow: var(--shadow-md);
  border: 1px solid var(--separator);
}
.fp-zoom-group {
  display: flex;
  gap: 2px;
}

/* Legacy: keep #drawingToolbar working for JS bindings */
#drawingToolbar { display: contents; }

/* Tool icons */
.tool-ico-select { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23475569'%3E%3Cpath d='M3 1l10 6-4 1 2 5-2 1-2-5-4 3V1z'/%3E%3C/svg%3E"); }
.tool-ico-wall { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23475569'%3E%3Crect x='2' y='2' width='12' height='3' rx='0.5'/%3E%3Crect x='2' y='6.5' width='12' height='3' rx='0.5'/%3E%3Crect x='2' y='11' width='12' height='3' rx='0.5'/%3E%3C/svg%3E"); }
.tool-ico-pen { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23475569'%3E%3Cpath d='M12.146.854a.5.5 0 01.708 0l2.292 2.292a.5.5 0 010 .708L5.854 13.146a.5.5 0 01-.354.147H3.207a.5.5 0 01-.353-.854l9.292-11.585zM11 2.707L4.707 9H3v1.707L11 2.707zM13.5 1.5L12.207 2.793 13.207 3.793 14.5 2.5l-1-1z'/%3E%3Cpath d='M1 14h14v1H1v-1z'/%3E%3C/svg%3E"); }
.tool-ico-grid { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23475569'%3E%3Cpath d='M0 1h16v1H0V1zm0 5h16v1H0V6zm0 5h16v1H0v-1zm0 4h16v1H0v-1zM1 0v16h1V0H1zm5 0v16h1V0H6zm5 0v16h1V0h-1zm4 0v16h1V0h-1z' opacity='.5'/%3E%3C/svg%3E"); }
.tool-ico-snap { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23475569'%3E%3Ccircle cx='8' cy='8' r='2'/%3E%3Cpath d='M8 0v4M8 12v4M0 8h4M12 8h4' stroke='%23475569' stroke-width='1.5' fill='none'/%3E%3C/svg%3E"); }
.tool-ico-straight { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23475569'%3E%3Cpath d='M1 8h14' stroke='%23475569' stroke-width='2' stroke-linecap='round'/%3E%3Cpath d='M1 13L8 3l7 10' stroke='%23475569' stroke-width='1.5' fill='none' stroke-dasharray='2 2'/%3E%3C/svg%3E"); }
.tool-ico-unlock { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23475569'%3E%3Cpath d='M11 1a3 3 0 00-3 3v2H3a1 1 0 00-1 1v7a1 1 0 001 1h8a1 1 0 001-1V7a1 1 0 00-1-1H9V4a2 2 0 114 0v1h1V4a3 3 0 00-3-3zM7 10a1 1 0 112 0v2a1 1 0 11-2 0v-2z'/%3E%3C/svg%3E"); }
.tool-ico-lock { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23475569'%3E%3Cpath d='M11 1a3 3 0 00-3 3v2H4a1 1 0 00-1 1v7a1 1 0 001 1h8a1 1 0 001-1V7a1 1 0 00-1-1h-1V4a3 3 0 00-3-3zm0 1a2 2 0 012 2v2H6V4a2 2 0 012-2zM7 10a1 1 0 112 0v2a1 1 0 11-2 0v-2z'/%3E%3C/svg%3E"); }
.tool-ico-polygon { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23475569'%3E%3Cpath d='M3 2L13 2L14 7L10 14L4 14L2 8Z' stroke='%23475569' stroke-width='1.5' fill='none' stroke-linejoin='round'/%3E%3Ccircle cx='3' cy='2' r='1.5'/%3E%3Ccircle cx='13' cy='2' r='1.5'/%3E%3Ccircle cx='14' cy='7' r='1.5'/%3E%3Ccircle cx='10' cy='14' r='1.5'/%3E%3Ccircle cx='4' cy='14' r='1.5'/%3E%3Ccircle cx='2' cy='8' r='1.5'/%3E%3C/svg%3E"); }

/* Polygon draw button */
.seg .polygon-draw-btn, .polygon-draw-btn {
  width: 30px; height: 30px; padding: 4px; border: 1px solid var(--separator-opaque); border-radius: var(--r-sm);
  background: var(--bg-primary); cursor: pointer; display: inline-flex; align-items: center; justify-content: center;
  transition: background var(--dur-fast), border-color var(--dur-fast); margin-right: 4px;
}
.polygon-draw-ico { display: block; width: 20px; height: 20px; background-size: contain; background-repeat: no-repeat; background-position: center; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 19l7-7 3 3-7 7-3-3z'/%3E%3Cpath d='M18 13l-1.5-7.5L2 2l3.5 14.5L13 18l5-5z'/%3E%3Cpath d='M2 2l7.586 7.586'/%3E%3Ccircle cx='11' cy='11' r='2'/%3E%3C/svg%3E"); }
.seg .polygon-draw-btn:hover, .polygon-draw-btn:hover { background: var(--bg-secondary); border-color: var(--separator-opaque); }
.polygon-draw-btn:hover .polygon-draw-ico { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230f172a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 19l7-7 3 3-7 7-3-3z'/%3E%3Cpath d='M18 13l-1.5-7.5L2 2l3.5 14.5L13 18l5-5z'/%3E%3Cpath d='M2 2l7.586 7.586'/%3E%3Ccircle cx='11' cy='11' r='2'/%3E%3C/svg%3E"); }
.seg .polygon-draw-btn.active, .polygon-draw-btn.active { background: #dbeafe; border-color: #3b82f6; }
.polygon-draw-btn.active .polygon-draw-ico { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231d4ed8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 19l7-7 3 3-7 7-3-3z'/%3E%3Cpath d='M18 13l-1.5-7.5L2 2l3.5 14.5L13 18l5-5z'/%3E%3Cpath d='M2 2l7.586 7.586'/%3E%3Ccircle cx='11' cy='11' r='2'/%3E%3C/svg%3E"); }
.polygon-draw-hint { position: absolute; bottom: 8px; left: 50%; transform: translateX(-50%); background: rgba(0,0,0,.8); color: #fff; padding: 6px 12px; border-radius: 4px; font-size: 12px; white-space: nowrap; pointer-events: none; z-index: 100; }

/* PDF & help buttons */
.btn-pdf { padding: 5px 10px !important; font-size: 12px !important; font-weight: 600; }
.btn-help-2d { min-width: 28px; padding: 4px 8px !important; font-size: 14px !important; font-weight: 700; border-radius: 50%; }

/* Hide 2D tools in 3D */
body.view-3d .fp-tools-sidebar,
body.view-3d .fp-bottom-bar { display: none !important; }
body.view-3d #schemeTools2d { display: none; }

/* Hide advanced tools in simple mode */
#insideWrap.simple .fp-tools-sidebar [data-advanced-tool],
#insideWrap.simple .fp-tools-sidebar .fp-tool-sep,
#insideWrap.simple #drawingToolbar [data-advanced-tool] { display: none; }