/* Coverage Map View */
#view-coverage{display:flex;flex-direction:column;flex:1;overflow:hidden}

/* Stats strip */
#cov-stats{display:flex;gap:12px;padding:16px 20px;background:var(--surface);border-bottom:1px solid var(--border);flex-shrink:0;overflow-x:auto}
.cov-stat{background:var(--surface2);border-radius:var(--radius);padding:12px 16px;min-width:140px;display:flex;flex-direction:column;gap:2px}
.cov-stat-num{font-size:22px;font-weight:700;font-family:var(--font);color:var(--text)}
.cov-stat-label{font-size:11px;color:var(--text-faint);font-weight:600;text-transform:uppercase;letter-spacing:.5px}
.cov-stat-sub{font-size:11px;color:var(--text-dim);margin-top:2px}

/* Body: sidebar + map */
#cov-body{display:flex;flex:1;overflow:hidden}

/* Sidebar */
#cov-sidebar{width:260px;flex-shrink:0;border-right:1px solid var(--border);background:var(--surface);padding:16px;overflow-y:auto;display:flex;flex-direction:column;gap:16px}
#cov-sidebar h3{font-size:14px;font-weight:700;color:var(--text);margin:0}

#cov-filters{display:flex;flex-direction:column;gap:10px}
.cov-filter-group{display:flex;flex-direction:column;gap:4px}
.cov-filter-group label{font-size:11px;color:var(--text-faint);font-weight:600;text-transform:uppercase;letter-spacing:.5px}
.cov-filter-group select{padding:6px 8px;background:var(--surface2);border:1px solid var(--border);border-radius:var(--radius);color:var(--text);font-size:12px;outline:none}
.cov-filter-group select:focus{border-color:var(--accent)}

.cov-toggle{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--text-dim);cursor:pointer}
.cov-toggle input{accent-color:var(--accent)}

/* Search */
#cov-search-wrap{display:flex;gap:6px;align-items:center}
#cov-search{flex:1;font-size:12px;padding:7px 10px}

/* Density toggle */
.cov-density-toggle{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--text-dim);cursor:pointer;padding-top:6px;border-top:1px solid var(--border)}
.cov-density-toggle input{accent-color:#dc2626}
.cov-density-info{font-size:11px;color:var(--text-faint);margin-top:2px}

/* Legend */
#cov-legend{display:flex;flex-direction:column;gap:6px;padding-top:8px;border-top:1px solid var(--border)}
#cov-legend h4{font-size:11px;color:var(--text-faint);font-weight:600;text-transform:uppercase;letter-spacing:.5px;margin:0}
.cov-legend-item{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--text-dim)}
.cov-legend-swatch{width:16px;height:12px;border-radius:3px;border:1px solid rgba(0,0,0,.15);flex-shrink:0}

/* Detail panel (click info) */
#cov-detail{display:flex;flex-direction:column;gap:8px;padding-top:8px;border-top:1px solid var(--border)}
#cov-detail:empty{display:none;border:none;padding:0}
.cov-detail-title{font-size:14px;font-weight:700;color:var(--text);font-family:var(--font)}
.cov-detail-row{font-size:12px;color:var(--text-dim);display:flex;justify-content:space-between}
.cov-detail-row span:last-child{font-weight:600;color:var(--text)}
.cov-detail-suppliers{display:flex;flex-direction:column;gap:4px;margin-top:4px}
.cov-detail-supplier{font-size:12px;padding:6px 8px;background:var(--surface2);border-radius:var(--radius);display:flex;justify-content:space-between;align-items:center}
.cov-detail-supplier .types{display:flex;gap:4px}
.cov-detail-supplier .type-badge{font-size:10px;padding:1px 6px;border-radius:10px;font-weight:600}
.type-mulch{background:#dcfce7;color:#166534}
.type-soil{background:#fef3c7;color:#92400e}
.type-stone{background:#e0e7ff;color:#3730a3}
.cov-mm-badge{font-size:10px;padding:1px 6px;border-radius:10px;background:#fef3c7;color:#92400e;font-weight:600}

/* Map container */
#cov-map-wrap{flex:1;position:relative;min-width:0}
#cov-map{position:absolute;inset:0}

/* Loading overlay */
.cov-loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(255,248,239,.8);z-index:1;font-size:14px;color:var(--text-dim);gap:10px}

/* Supplier multi-select */
.cov-supplier-select{position:relative}
.cov-supplier-input{width:100%;padding:6px 8px;background:var(--surface2);border:1px solid var(--border);border-radius:var(--radius);color:var(--text);font-size:12px;outline:none}
.cov-supplier-input:focus{border-color:var(--accent)}
.cov-supplier-dropdown{display:none;position:absolute;top:100%;left:0;right:0;max-height:220px;overflow-y:auto;background:var(--surface);border:1px solid var(--border);border-radius:0 0 var(--radius) var(--radius);box-shadow:var(--shadow-md);z-index:10}
.cov-supplier-dd-item{display:flex;align-items:center;gap:6px;padding:6px 10px;font-size:12px;cursor:pointer;color:var(--text)}
.cov-supplier-dd-item:hover{background:var(--surface2)}
.cov-supplier-dd-item.checked{background:rgba(92,168,92,.06)}
.cov-supplier-dd-item input{pointer-events:none;accent-color:var(--accent)}
.cov-dd-sku{font-family:var(--font);font-size:10px;color:var(--text-faint);margin-left:auto}
.cov-supplier-pills{display:flex;flex-wrap:wrap;gap:4px;margin-top:6px}
.cov-s-pill{display:inline-flex;align-items:center;gap:3px;padding:2px 6px 2px 8px;background:rgba(92,168,92,.1);border:1px solid rgba(92,168,92,.25);border-radius:10px;font-size:11px;font-weight:600;color:#3d7a3d}
.cov-s-pill button{border:none;background:none;color:#3d7a3d;cursor:pointer;font-size:13px;padding:0 1px;line-height:1}
.cov-s-pill button:hover{color:var(--red)}
.cov-clear-all{font-size:11px;color:var(--text-faint);text-decoration:none;padding:3px 0}
.cov-clear-all:hover{color:var(--red)}

/* Gap list */
.cov-gap-item{display:grid;grid-template-columns:55px 70px 1fr;gap:6px;align-items:center;padding:6px 8px;border-radius:var(--radius);cursor:pointer;font-size:12px;border-left:3px solid #dc2626}
.cov-gap-item:hover{background:var(--surface2)}
.cov-gap-zip{font-family:var(--font);font-weight:700;color:var(--text)}
.cov-gap-pop{font-family:var(--font);font-weight:600;color:var(--text-dim);text-align:right}
.cov-gap-suppliers{font-size:11px;color:var(--text-faint);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* Mobile */
@media(max-width:768px){
  #cov-body{flex-direction:column}
  #cov-sidebar{width:100%;max-height:200px;border-right:none;border-bottom:1px solid var(--border)}
  #cov-map-wrap{min-height:400px}
  #cov-stats{flex-wrap:wrap}
}
