/* Lotes, estructura y plano */
.lot-status {
    display: inline-block;
    padding: .15rem .6rem;
    border-radius: 999px;
    color: #fff;
    font-size: .78rem;
    font-weight: 600;
    white-space: nowrap;
}

.content.content-full { width: 100%; max-width: none; padding: 0; gap: 0; }

.filter-bar { display: flex; flex-wrap: wrap; gap: .75rem; align-items: flex-end; margin-bottom: 1rem; }
.filter-bar .field { min-width: 12rem; flex: 1 1 12rem; }
.numeric { text-align: right; font-variant-numeric: tabular-nums; }

.lot-facts { display: grid; grid-template-columns: max-content 1fr; gap: .35rem 1rem; margin: 0; }
.lot-facts dt { color: var(--text-muted); font-size: .85rem; }
.lot-facts dd { margin: 0; font-weight: 500; }

.lot-detail-grid { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 1rem; align-items: start; }
@media (max-width: 960px) { .lot-detail-grid { grid-template-columns: 1fr; } }
.lot-detail-grid .form-card + .form-card { margin-top: 1rem; }
.lot-mini-map { height: 260px; border-radius: .5rem; overflow: hidden; }

.status-summary { display: grid; grid-template-columns: repeat(auto-fill, minmax(11rem, 1fr)); gap: 1rem; margin-bottom: 1.5rem; }
.status-tile { background: var(--surface, #fff); border: 1px solid var(--border, #e5e7eb); border-left-width: 6px; border-radius: .6rem; padding: .9rem 1rem; }
.status-tile strong { display: block; font-size: 1.8rem; line-height: 1.1; }
.status-tile span { color: var(--text-muted); font-size: .9rem; }

.file-list { list-style: none; margin: 0; padding: 0; display: grid; gap: .5rem; }
.file-list li { display: flex; align-items: center; justify-content: space-between; gap: .75rem; }
.photo-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(8rem, 1fr)); gap: .6rem; margin-bottom: 1rem; }
.photo-grid figure { margin: 0; }
.photo-grid img { width: 100%; height: 6.5rem; object-fit: cover; border-radius: .4rem; display: block; }
.photo-grid figcaption { font-size: .78rem; display: flex; justify-content: space-between; align-items: center; gap: .3rem; }

.structure-tree ul { list-style: none; margin: 0; padding-left: 1.4rem; border-left: 2px solid var(--border, #e5e7eb); }
.structure-tree > ul { padding-left: 0; border-left: 0; }
.structure-tree li { margin: .5rem 0; }
.structure-node { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; }
.structure-node strong { margin-right: .25rem; }
.structure-node small { color: var(--text-muted); }

/* Plano */
.map-layout { display: grid; grid-template-columns: minmax(0, 1fr) 21rem; height: calc(100vh - 4.5rem); }
.map-layout.is-public { height: 100vh; }
.map-stage { position: relative; min-height: 22rem; }
.map-canvas { position: absolute; inset: 0; }
.map-empty { position: absolute; z-index: 500; top: 1rem; left: 50%; transform: translateX(-50%); background: #fff; padding: .6rem 1rem; border-radius: .5rem; box-shadow: 0 2px 10px rgba(0,0,0,.2); }
.map-side { overflow-y: auto; padding: 1rem; background: var(--surface, #fff); border-left: 1px solid var(--border, #e5e7eb); display: grid; gap: 1.25rem; align-content: start; }
.map-side h1 { font-size: 1.25rem; margin: 0; }
.map-side h2 { font-size: 1.05rem; margin: 0; }
.map-side header { display: flex; justify-content: space-between; align-items: center; gap: .5rem; margin-bottom: .6rem; }
.map-legend { list-style: none; margin: 0; padding: 0; display: grid; gap: .3rem; font-size: .88rem; }
.lot-swatch { display: inline-block; width: .9rem; height: .9rem; border-radius: .2rem; margin-right: .5rem; vertical-align: -2px; }
.lot-photos { display: grid; grid-template-columns: repeat(2, 1fr); gap: .4rem; margin-top: .8rem; }
.lot-photos img { width: 100%; height: 5.5rem; object-fit: cover; border-radius: .4rem; }
.lot-label { background: transparent; border: 0; box-shadow: none; font-weight: 700; font-size: .68rem; letter-spacing: .01em; color: #1a2418; text-shadow: 0 0 3px #fff, 0 0 3px #fff; }
.lot-label::before { display: none; }
.street-label { background: transparent; border: 0; box-shadow: none; font-weight: 600; font-size: .62rem; letter-spacing: .04em; color: #6b6358; text-transform: uppercase; text-shadow: 0 0 3px #fff, 0 0 3px #fff; }
.street-label::before { display: none; }
.import-box { display: grid; gap: .6rem; }
.import-result ul { margin: .3rem 0 0; padding-left: 1.2rem; font-size: .85rem; max-height: 8rem; overflow: auto; }
.public-topbar { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: .6rem 1rem; background: #12263a; color: #fff; }
.public-topbar a { color: #fff; }
.public-topbar .brand-copy { color: #fff; }

@media (max-width: 900px) {
    .map-layout { grid-template-columns: 1fr; grid-template-rows: 55vh auto; height: auto; }
    .map-layout.is-public { height: auto; }
    .map-side { border-left: 0; border-top: 1px solid var(--border, #e5e7eb); }
}

/* Dashboard */
.kpi-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(12rem, 1fr)); gap: 1rem; }
.kpi { background: var(--surface, #fff); border: 1px solid var(--border, #e5e7eb); border-radius: .6rem; padding: .9rem 1rem; }
.kpi strong { display: block; font-size: 1.7rem; line-height: 1.15; font-variant-numeric: tabular-nums; }
.kpi span { color: var(--text-muted); font-size: .85rem; }
.kpi small { display: block; margin-top: .2rem; font-size: .78rem; }
.kpi .up { color: #2e9e5b; } .kpi .down { color: #d6453d; }
.dash-section { margin-top: 1.5rem; }
.dash-section > h2 { font-size: 1.05rem; margin: 0 0 .6rem; }
.chart-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(22rem, 1fr)); gap: 1rem; }
.chart-card { background: var(--surface, #fff); border: 1px solid var(--border, #e5e7eb); border-radius: .6rem; padding: 1rem; }
.chart-card h3 { margin: 0 0 .6rem; font-size: .95rem; }
.chart-card svg { width: 100%; max-height: 260px; }
.chart-card [data-chart-type="donut"] svg { max-width: 220px; display: block; margin: 0 auto; }
.chart-legend { list-style: none; margin: .6rem 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: .3rem 1rem; font-size: .82rem; }
.hbars { display: grid; gap: .5rem; }
.hbar { display: grid; grid-template-columns: 8rem 1fr 6rem; gap: .5rem; align-items: center; font-size: .85rem; }
.hbar-track { background: #eef2f6; border-radius: 999px; height: .7rem; overflow: hidden; display: block; }
.hbar-fill { display: block; height: 100%; border-radius: 999px; }
.hbar-value { text-align: right; font-variant-numeric: tabular-nums; }
.alert-list { list-style: none; margin: 0; padding: 0; display: grid; gap: .5rem; }
.alert-item { display: flex; gap: .75rem; align-items: flex-start; padding: .6rem .8rem; border-radius: .5rem; border: 1px solid var(--border, #e5e7eb); border-left-width: 5px; background: var(--surface, #fff); }
.alert-item.sev-3 { border-left-color: #d6453d; } .alert-item.sev-2 { border-left-color: #e0a21b; } .alert-item.sev-1 { border-left-color: #2f6fd1; }
.alert-item a { text-decoration: none; color: inherit; display: block; }
.nav-count { margin-left: auto; background: #d6453d; color: #fff; border-radius: 999px; font-size: .72rem; padding: 0 .45rem; min-width: 1.2rem; text-align: center; }
.report-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr)); gap: 1rem; }
.report-card { background: var(--surface, #fff); border: 1px solid var(--border, #e5e7eb); border-radius: .6rem; padding: 1rem; display: grid; gap: .5rem; align-content: start; }
.audit-changes { max-width: 32rem; white-space: pre-wrap; font-size: .75rem; }
@media (max-width: 600px) { .hbar { grid-template-columns: 5rem 1fr 4.5rem; } }

/* CRM y biblioteca comercial */
.crm-board { display: grid; grid-template-columns: repeat(6, minmax(13rem, 1fr)); gap: .75rem; overflow-x: auto; padding-bottom: .5rem; align-items: start; }
.crm-column { background: var(--surface, #fff); border: 1px solid var(--border, #e5e7eb); border-top: 4px solid var(--stage-color); border-radius: .6rem; padding: .6rem; display: grid; gap: .5rem; }
.crm-column > header { display: flex; justify-content: space-between; align-items: center; }
.crm-count { background: var(--stage-color); color: #fff; border-radius: 999px; font-size: .75rem; font-weight: 700; padding: 0 .5rem; min-width: 1.4rem; text-align: center; }
.crm-cards { display: grid; gap: .45rem; max-height: calc(100vh - 17rem); overflow-y: auto; }
.crm-card { display: grid; gap: .15rem; padding: .5rem .6rem; border: 1px solid var(--border, #e5e7eb); border-radius: .45rem; color: inherit; text-decoration: none; background: #fafbfc; }
.crm-card:hover, .crm-card:focus-visible { border-color: var(--stage-color); background: #fff; }
.crm-card small { font-size: .78rem; color: var(--text-secondary); }
.crm-overdue { color: #d6453d !important; font-weight: 600; }
.crm-muted { color: var(--text-muted) !important; }
.crm-panel { margin-top: 1rem; }
.crm-panel-header { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: .5rem; margin-bottom: .5rem; }
.crm-panel-header h2 { margin: 0; font-size: 1.1rem; display: flex; align-items: center; gap: .5rem; }
.crm-subtitle { margin: 0 0 .6rem; font-size: 1rem; }
.crm-activity-form { display: grid; grid-template-columns: 10rem 1fr auto; gap: .5rem; align-items: start; margin-bottom: .75rem; }
.crm-timeline { list-style: none; margin: 0; padding: 0; display: grid; gap: .6rem; max-height: 28rem; overflow-y: auto; }
.crm-timeline li { display: grid; gap: .15rem; padding-left: .75rem; border-left: 3px solid var(--border, #e5e7eb); }
.crm-timeline-meta { font-size: .78rem; color: var(--text-secondary); }
.crm-timeline-text { white-space: pre-wrap; }
.crm-closed { margin-top: .75rem; font-size: .88rem; }
.crm-closed summary { cursor: pointer; color: var(--text-secondary); margin-bottom: .5rem; }
.crm-inline-form { margin-top: .75rem; }
.material-thumb { width: 4.5rem; }
.material-thumb img { width: 4rem; height: 3rem; object-fit: cover; border-radius: .35rem; display: block; }
.material-icon { display: grid; place-items: center; width: 4rem; height: 3rem; border-radius: .35rem; background: #eef2f6; color: var(--text-secondary); font-size: .72rem; font-weight: 700; }
.material-tag { display: inline-block; margin: 0 .25rem .25rem 0; padding: 0 .45rem; border-radius: 999px; background: #eef2f6; color: inherit; font-size: .75rem; text-decoration: none; }
tr.is-muted td { opacity: .6; }
@media (max-width: 700px) { .crm-activity-form { grid-template-columns: 1fr; } }
