/* legal-modal.css — mobile footer collapse + "Legal & About" modal for the map pages
   (buy/listings/rent). Loaded ONLY on those pages, so these rules never touch the
   scrolling content pages. On mobile the tall legal footer collapses to a compact bar
   so the Leaflet map (.main{flex:1}) reclaims the vertical space; the disclaimer + footer
   links move into an accessible dialog. Desktop is intentionally left unchanged. */

/* Trigger — hidden on desktop (full footer shows the disclaimer inline) */
.legal-modal-trigger{display:none}

@media(max-width:768px){
  /* Collapse the footer into a single ~44px bar → map gains the reclaimed height */
  .site-footer{margin-top:0;padding:.55rem 1rem;min-height:44px;display:flex;align-items:center;justify-content:space-between;gap:.75rem}
  .site-footer .footer-links{display:none}
  .site-footer .footer-disclaimer{display:none}
  .site-footer > p{margin:0;font-size:.72rem;color:#64748b;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
  .legal-modal-trigger{display:inline-flex;align-items:center;gap:.3rem;flex:0 0 auto;min-height:44px;padding:0 .35rem;background:none;border:0;font:inherit;font-size:.72rem;color:#60a5fa;cursor:pointer;text-decoration:underline;white-space:nowrap}
}

/* --- Modal (dark slate, matches the pet-modal look) --- */
.legal-modal-backdrop{position:fixed;inset:0;z-index:9000;display:flex;align-items:center;justify-content:center;padding:1rem;background:rgba(2,6,23,.72)}
.legal-modal-backdrop[hidden]{display:none}
.legal-modal{background:#1e293b;color:#cbd5e1;border:1px solid #334155;border-radius:14px;width:100%;max-width:600px;max-height:85vh;overflow-y:auto;padding:1.2rem 1.4rem 1.4rem;box-shadow:0 20px 60px rgba(0,0,0,.6)}
.legal-modal-head{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:.75rem}
.legal-modal-title{margin:0;font-size:1.05rem;font-weight:700;color:#f1f5f9}
.legal-modal-close{background:transparent;border:none;color:#94a3b8;cursor:pointer;font-size:1.4rem;line-height:1;padding:.1rem .45rem;border-radius:4px;transition:color .15s}
.legal-modal-close:hover{color:#f1f5f9}
.legal-modal-close:focus-visible{outline:2px solid #FBBF24;outline-offset:2px;color:#f1f5f9}
/* Cloned nodes inherit the mobile display:none — force them visible inside the modal */
.legal-modal .footer-links{display:flex!important;flex-wrap:wrap;gap:1.1rem;justify-content:center;margin:0 0 1rem}
.legal-modal .footer-links a{color:#60a5fa;text-decoration:none;font-size:.9rem}
.legal-modal .footer-links a:hover{color:#93c5fd}
.legal-modal .footer-disclaimer{display:block!important;margin:0;max-width:none;font-size:.8rem;line-height:1.6;color:#94a3b8}