/* Piezas compartidas: emojis, botones, campos, avisos, plano vivo y ficha de cotización. Sin colores sueltos. */
.emoji{width:56px;height:56px;object-fit:contain;flex:none}
.emoji.chico{width:32px;height:32px}.emoji.grande{width:88px;height:88px}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:48px;padding:0 1.35rem;border-radius:999px;border:1px solid transparent;cursor:pointer;font-weight:500;letter-spacing:.02em;text-decoration:none;transition:background .2s,transform .2s var(--curva),border-color .2s}
.btn:active{transform:scale(.98)}
.btn.primario{background:var(--marca);color:var(--sobre-marca)}
.btn.primario:hover{background:var(--marca-hover)}
.btn.fantasma{background:transparent;border-color:currentColor;color:inherit}
.btn.chico{min-height:44px;padding:0 1rem;font-size:var(--t-chico)}
.btn[disabled]{opacity:.55;cursor:not-allowed}

.campo{display:grid;gap:.35rem;margin-bottom:1rem}
.campo label{font-weight:500;font-size:var(--t-chico);letter-spacing:.02em}
.campo input,.campo select,.campo textarea{min-height:48px;padding:.7rem .9rem;border-radius:var(--radio-chico);border:1px solid var(--linea);background:var(--superficie);color:var(--tinta)}
.campo textarea{min-height:96px;resize:vertical}
.campo .ayuda{font-size:var(--t-chico);color:var(--tinta-2)}
.campo .err{font-size:var(--t-chico);color:var(--error)}
.casilla{display:flex;gap:.7rem;align-items:flex-start;font-size:var(--t-chico);line-height:1.45;margin:.5rem 0 1rem}
.casilla input{width:22px;height:22px;flex:none;margin-top:1px;accent-color:var(--marca)}

#avisos{position:fixed;left:50%;top:max(12px,env(safe-area-inset-top));transform:translateX(-50%);z-index:90;display:grid;gap:.5rem;width:min(92vw,420px)}
.aviso{padding:.8rem 1rem;border-radius:12px;background:var(--tinta);color:var(--fondo);box-shadow:var(--sombra);opacity:0;transform:translateY(-8px);transition:opacity .3s,transform .3s var(--curva);font-size:var(--t-chico)}
.aviso.on{opacity:1;transform:none}.aviso.error{background:var(--error);color:var(--superficie)}

/* ───────── Plano vivo ───────── */
.plano{display:grid;gap:.75rem}
.plano-barra{display:flex;flex-wrap:wrap;gap:.75rem 1.25rem;align-items:center;justify-content:space-between}
.plano-leyenda{display:flex;flex-wrap:wrap;gap:.9rem;font-size:var(--t-chico)}
.plano-leyenda span{display:inline-flex;align-items:center;gap:.4rem}
.ley{width:14px;height:14px;border-radius:4px;display:inline-block}
.ley.disponible{background:var(--disponible)}.ley.apartado{background:var(--apartado)}.ley.vendido{background:var(--vendido)}
.plano-filtros{display:flex;flex-wrap:wrap;gap:.4rem;align-items:center}
.chip-f{min-height:44px;padding:0 .9rem;border-radius:999px;border:1px solid currentColor;background:transparent;cursor:pointer;font-size:var(--t-chico);opacity:.75}
.chip-f[aria-pressed="true"]{background:var(--marca);color:var(--sobre-marca);border-color:var(--marca);opacity:1}
.solo-libres{display:inline-flex;gap:.45rem;align-items:center;min-height:44px;font-size:var(--t-chico);padding:0 .3rem}
.solo-libres input{width:20px;height:20px;accent-color:var(--marca)}
.plano-lienzo{position:relative;border-radius:var(--radio);overflow:hidden;background:var(--superficie-2);aspect-ratio:569/644;max-height:78vh;margin-inline:auto;width:100%}
.oscuro .plano-lienzo{background:var(--noche-3)}
.plano-svg{width:100%;height:100%;display:block;touch-action:manipulation}
.plano-fondo{opacity:.9}
.oscuro .plano-fondo{opacity:.55;filter:invert(1) hue-rotate(180deg) sepia(.35)}
.plano .u{cursor:pointer;stroke-width:1.2;transition:fill .25s,opacity .4s,stroke-width .2s;opacity:0}
.plano.entra .u{opacity:1;transition-delay:calc(var(--i) * 8ms)}
.plano .u.disponible{fill:color-mix(in srgb,var(--disponible) 42%,transparent);stroke:var(--disponible)}
.plano .u.apartado{fill:color-mix(in srgb,var(--apartado) 55%,transparent);stroke:var(--apartado)}
.plano .u.vendido,.plano .u.bloqueado{fill:color-mix(in srgb,var(--vendido) 60%,transparent);stroke:var(--vendido);cursor:default}
.plano .u:hover,.plano .u:focus-visible{stroke-width:2.6;outline:none}
.plano .u.sel{stroke:var(--marfil);stroke-width:3;fill:color-mix(in srgb,var(--marca) 80%,transparent);animation:latido 1.8s ease-in-out infinite}
.plano .u.apagado{opacity:.15}
@keyframes latido{50%{fill:color-mix(in srgb,var(--marca) 55%,transparent)}}
.plano-todo{position:absolute;right:.75rem;bottom:.75rem;min-height:44px;padding:0 1rem;border-radius:999px;border:0;background:var(--tinta);color:var(--fondo);cursor:pointer;font-size:var(--t-chico);box-shadow:var(--sombra)}
.plano-lista summary{cursor:pointer;min-height:44px;display:flex;align-items:center;font-size:var(--t-chico);color:inherit;opacity:.85}
.plano-lista ul{list-style:none;padding:0;margin:.5rem 0 0;display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:.4rem;max-height:320px;overflow:auto}
.plano-lista button{width:100%;min-height:44px;display:flex;gap:.5rem;align-items:center;justify-content:space-between;padding:.4rem .7rem;border-radius:10px;border:1px solid var(--linea);background:transparent;cursor:pointer;font-size:var(--t-chico);text-align:left;color:inherit}
.oscuro .plano-lista button{border-color:var(--linea-noche)}
.plano-lista button.vendido{opacity:.5}

/* Ficha del consultorio elegido + cotización */
.ficha{border-radius:var(--radio);padding:1.25rem;background:var(--superficie);box-shadow:var(--sombra);color:var(--tinta)}
.oscuro .ficha{background:var(--noche-3);color:var(--marfil);box-shadow:var(--sombra-noche);border:1px solid var(--linea-noche)}
.ficha h3{font:500 var(--t-2)/1.1 var(--display);margin:.1rem 0 .3rem}
.ficha .precio{font:500 clamp(1.8rem,5vw,2.5rem)/1 var(--display);color:var(--marca-texto);margin:.4rem 0}
.oscuro .ficha .precio{color:var(--marca)}
.ficha dl{display:grid;grid-template-columns:1fr auto;gap:.45rem 1rem;margin:1rem 0;font-size:.95rem}
.ficha dt{color:var(--tinta-2)}.oscuro .ficha dt{color:var(--marfil-2)}
.ficha dd{margin:0;text-align:right;font-weight:500}
.ficha .nota{font-size:var(--t-chico);color:var(--tinta-2)}.oscuro .ficha .nota{color:var(--marfil-2)}
.estado-chip{display:inline-flex;align-items:center;gap:.35rem;padding:.25rem .7rem;border-radius:999px;font-size:var(--t-chico);font-weight:500}
.estado-chip.disponible{background:color-mix(in srgb,var(--disponible) 22%,transparent)}
.estado-chip.apartado{background:color-mix(in srgb,var(--apartado) 25%,transparent)}
.estado-chip.vendido,.estado-chip.bloqueado{background:color-mix(in srgb,var(--vendido) 30%,transparent)}