/* Administração → Escritório → Planta (public/admin-planta.js). Mesma cara do admin.css; tudo com prefixo adm-pl-.
   O SVG é desenhado em metros: as espessuras e letras abaixo são em metros também. */
.adm-pl-icone { background: #EEF1FE; color: #4F5BD5; }

.adm-pl-barra { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; margin-bottom: 8px; }
.adm-pl-ferramentas { display: flex; gap: 4px; padding: 4px; border-radius: 13px; background: var(--a-fundo); }
.adm-pl-ferr { display: inline-flex; align-items: center; gap: 6px; height: 34px; padding: 0 12px; border: 0; border-radius: 9px; background: none; color: var(--a-suave); font: 600 13.5px/1 var(--corpo); cursor: pointer; }
.adm-pl-ferr svg { width: 17px; height: 17px; }
.adm-pl-ferr:hover { color: var(--a-tinta); }
.adm-pl-ferr[aria-pressed="true"] { background: #fff; color: var(--a-tinta); box-shadow: 0 1px 3px rgba(31, 27, 45, .12); }
.adm-pl-ferr[aria-pressed="true"] svg { color: var(--a-acento); }
.adm-pl-historia { display: flex; gap: 4px; }
.adm-pl-icone-bt { width: 36px; height: 36px; display: grid; place-items: center; padding: 0; border: 1px solid var(--a-linha); border-radius: 10px; background: #fff; color: var(--a-tinta); cursor: pointer; }
.adm-pl-icone-bt svg { width: 17px; height: 17px; }
.adm-pl-icone-bt:hover:not(:disabled) { background: var(--a-fundo); }
.adm-pl-icone-bt:disabled { opacity: .35; cursor: default; }
.adm-pl-tamanho { display: flex; align-items: center; gap: 8px; margin-left: auto; font-size: 13px; color: var(--a-suave); }
.adm-pl-tamanho label { display: inline-flex; align-items: center; gap: 6px; }
.adm-pl-tamanho input, .adm-pl-num input { width: 66px; height: 34px; padding: 0 8px; border: 1px solid #DCD4E6; border-radius: 9px; background: #fff; color: var(--a-tinta); font: 500 13.5px var(--mono); }
.adm-pl-tamanho input:focus-visible, .adm-pl-num input:focus-visible { outline: 2px solid var(--a-acento); outline-offset: 1px; }
.adm-pl-dica { margin: 0 0 10px; min-height: 1.5em; font-size: 13px; color: var(--a-suave); }

/* a planta */
.adm-pl-quadro { border-radius: 14px; border: 1px solid var(--a-linha); background: #FBF9F6; overflow: hidden; }
#adm-pl-svg { display: block; width: 100%; height: auto; touch-action: none; user-select: none; -webkit-user-select: none; font-family: var(--corpo); }
#adm-pl-svg:focus-visible { outline: 2px solid var(--a-acento); outline-offset: -2px; }
#adm-pl-svg[data-ferramenta="parede"], #adm-pl-svg[data-ferramenta="vidro"] { cursor: crosshair; }
#adm-pl-svg[data-ferramenta="porta"] .adm-pl-linha { cursor: copy; }
.adm-pl-chao { fill: #F6F1EA; }
.adm-pl-grade { fill: none; stroke: rgba(31, 27, 45, .07); stroke-width: .02; pointer-events: none; }
.adm-pl-amb { pointer-events: none; }
.adm-pl-amb rect { fill: color-mix(in srgb, var(--cor) 9%, transparent); stroke: color-mix(in srgb, var(--cor) 55%, transparent); stroke-width: .04; stroke-dasharray: .14 .1; }
.adm-pl-amb text { fill: color-mix(in srgb, var(--cor) 70%, #1F1B2D); font-size: .36px; font-weight: 600; text-anchor: middle; }
.adm-pl-amb .adm-pl-med { font: 500 .28px var(--mono); fill: #6A6480; }
.adm-pl-amb.cortado rect { stroke: #9A5B0C; stroke-dasharray: none; }
.adm-pl-movel { fill: rgba(31, 27, 45, .07); stroke: rgba(31, 27, 45, .28); stroke-width: .025; pointer-events: none; }
/* no Mover o móvel pega o clique (escolher, arrastar); nas outras ferramentas o clique passa para o chão */
#adm-pl-svg[data-ferramenta="mover"] .adm-pl-movel { pointer-events: all; cursor: grab; }
#adm-pl-svg[data-ferramenta="mover"] .adm-pl-movel:hover { stroke: #6B4EE6; stroke-width: .045; }
.adm-pl-movel.levado { fill: rgba(107, 78, 230, .16); stroke: #8A74EC; stroke-width: .04; }
.adm-pl-movel.ruim { fill: rgba(201, 51, 58, .16); stroke: #C9333A; stroke-width: .05; }
.adm-pl-movel.sel { fill: rgba(107, 78, 230, .22); stroke: var(--a-acento); stroke-width: .07; }
.adm-pl-movel.sel.ruim { fill: rgba(201, 51, 58, .2); }
.adm-pl-laco { fill: rgba(107, 78, 230, .08); stroke: var(--a-acento); stroke-width: .035; stroke-dasharray: .14 .09; pointer-events: none; }
.adm-pl-guia { stroke: #E0574F; stroke-width: .03; stroke-dasharray: .16 .1; pointer-events: none; }
.adm-pl-fora { fill: none; stroke: #CDBFAE; stroke-width: .25; stroke-linecap: square; pointer-events: none; }
.adm-pl-parapeito { fill: none; stroke: #8CC4E6; stroke-width: .1; stroke-dasharray: .25 .15; pointer-events: none; }
.adm-pl-rotulo { fill: #6A6480; font-size: .32px; font-weight: 600; text-anchor: middle; pointer-events: none; }
.adm-pl-rua { cursor: ns-resize; }
.adm-pl-rua rect { fill: #E8D3B5; stroke: #B8925F; stroke-width: .04; }
.adm-pl-rua.sel rect { stroke: var(--a-acento); stroke-width: .07; }

.adm-pl-linha { cursor: grab; }
.adm-pl-linha .adm-pl-toque { stroke: transparent; stroke-width: .5; stroke-linecap: round; }
.adm-pl-trecho { stroke: #3B3A4A; stroke-width: .14; stroke-linecap: square; pointer-events: none; }
.adm-pl-linha.vidro .adm-pl-trecho { stroke: #2E8BFF; stroke-width: .1; }
.adm-pl-linha.fosco .adm-pl-trecho { stroke: #9FB4CC; stroke-width: .12; }
.adm-pl-linha:hover .adm-pl-trecho { stroke: #6B4EE6; }
.adm-pl-linha.sel .adm-pl-toque { stroke: rgba(107, 78, 230, .18); }
.adm-pl-linha.sel .adm-pl-trecho { stroke: var(--a-acento); }
.adm-pl-porta { cursor: ew-resize; }
.adm-pl-porta-toque { stroke: transparent; stroke-width: .5; }
.adm-pl-porta-vao { stroke: #D9822B; stroke-width: .06; stroke-dasharray: .12 .08; pointer-events: none; }
.adm-pl-porta:hover .adm-pl-porta-vao, .adm-pl-porta.sel .adm-pl-porta-vao { stroke-width: .11; }
.adm-pl-ponta { fill: #fff; stroke: var(--a-acento); stroke-width: .06; cursor: move; }
.adm-pl-porta .adm-pl-ponta { stroke: #D9822B; }
.adm-pl-cota { fill: var(--a-acento); font: 600 .32px var(--mono); text-anchor: middle; pointer-events: none; paint-order: stroke; stroke: #fff; stroke-width: .08; }
.adm-pl-nova { stroke: #3B3A4A; stroke-width: .14; stroke-linecap: square; opacity: .7; pointer-events: none; }
.adm-pl-nova.vidro { stroke: #2E8BFF; stroke-width: .1; }
.adm-pl-alca { cursor: ew-resize; }
.adm-pl-alca[data-tamanho="D"] { cursor: ns-resize; }
.adm-pl-alca rect { fill: var(--a-acento); opacity: .8; }
.adm-pl-alca:hover rect { opacity: 1; }
.adm-pl-medida { fill: #6A6480; font: 500 .3px var(--mono); text-anchor: middle; pointer-events: none; }

/* lado: propriedades e avisos */
.adm-pl-titulo { font-size: 14px; font-weight: 600; color: var(--a-tinta); }
.adm-pl-nota { margin: 0; font-size: 12.5px; color: var(--a-suave); }
.adm-pl-num { display: inline-flex; align-items: center; gap: 6px; color: var(--a-tinta); }
.adm-pl-seg { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; padding: 4px; border-radius: 11px; background: #fff; border: 1px solid var(--a-linha); }
.adm-pl-seg button { height: 30px; border: 0; border-radius: 8px; background: none; color: var(--a-tinta); font: 600 13px/1 var(--corpo); cursor: pointer; }
.adm-pl-seg button[aria-checked="true"] { background: var(--a-acento-suave); box-shadow: inset 0 0 0 1.5px var(--a-acento); }
.adm-pl-dados { display: grid; gap: 4px; margin: 0; }
.adm-pl-dados div { display: flex; justify-content: space-between; gap: 10px; font-size: 13px; }
.adm-pl-dados dt { color: var(--a-suave); }
.adm-pl-dados dd { margin: 0; font: 500 12.5px var(--mono); color: var(--a-tinta); }
.adm-pl-botoes { display: flex; flex-wrap: wrap; gap: 6px; }
.adm-pl-botoes .adm-sec { height: 32px; padding: 0 10px; font-size: 13px; }
.adm-pl-resumo { display: grid; gap: 4px; }
.adm-pl-resumo strong { font: 600 18px/1.2 var(--titulo); color: var(--a-tinta); }
.adm-pl-resumo span { font-size: 13px; color: var(--a-suave); }
.adm-pl-resumo .adm-pl-nota { margin-top: 6px; }
.adm-pl-avisos ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.adm-pl-avisos li { display: flex; align-items: flex-start; gap: 7px; padding: 8px 10px; border-radius: 10px; background: #FFF8EA; color: var(--a-alerta); font-size: 12.5px; }
.adm-pl-avisos li.ruim { background: #FDECEC; color: var(--a-ruim); }
.adm-pl-avisos li.info { background: var(--a-fundo); color: var(--a-suave); }
.adm-pl-lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; font-size: 13px; color: var(--a-tinta); }
.adm-pl-lista b { font: 500 12px var(--mono); color: var(--a-suave); }
.adm-pl-avisos svg { width: 14px; height: 14px; flex: none; margin-top: 2px; }

@media (max-width: 860px) {
  .adm-pl-tamanho { margin-left: 0; }
}
