.listings-controls { display:flex; gap:10px; margin-bottom:20px; }
.ls-header { display:flex; justify-content:space-between; align-items:center; margin-bottom:12px; }
.ls-title  { font-size:14px; font-weight:600; }
.ls-count  { font-size:11px; padding:3px 9px; border-radius:20px; background:rgba(75,142,240,0.12); color:var(--primary2); font-weight:600; }
.listing-row { display:flex; align-items:center; gap:14px; padding:14px 16px; border:1px solid var(--border); border-radius:12px; margin-bottom:10px; background:var(--card); cursor:pointer; transition:all 0.18s; }
.listing-row:hover { border-color:rgba(75,142,240,0.22); box-shadow:0 0 18px rgba(37,99,200,0.07); }
.listing-thumb  { width:52px; height:52px; border-radius:10px; background:var(--card2); display:flex; align-items:center; justify-content:center; font-size:24px; flex-shrink:0; }
.listing-info   { flex:1; }
.listing-name   { font-size:14px; font-weight:600; margin-bottom:3px; }
.listing-meta   { font-size:11.5px; color:var(--muted); display:flex; gap:10px; flex-wrap:wrap; }
.platform-badge { font-size:10px; padding:2px 7px; border-radius:4px; font-weight:600; }
.badge-ebay  { background:rgba(75,142,240,0.14); color:#7ab5ff; }
.badge-fb    { background:rgba(139,92,246,0.14); color:#a78bfa; }
.listing-price  { font-size:16px; font-weight:700; color:var(--primary2); }
.listing-status { font-size:11px; padding:3px 8px; border-radius:6px; font-weight:600; background:rgba(22,163,74,0.1); color:var(--green); }
.listing-actions-row { display:flex; flex-direction:column; align-items:flex-end; gap:6px; padding-right:4px; }
.status-draft { background: rgba(245,175,2,0.12) !important;  color: #F5AF02 !important; }
.status-sold  { background: rgba(22,163,74,0.12)  !important; color: var(--green) !important; }
.listing-row-sold { opacity: 0.6; }
.listing-row-sold:hover { opacity: 0.85; }
.listing-name-sold { text-decoration: line-through; text-decoration-color: rgba(0,0,0,0.3); }

.listing-menu-wrap { position: relative; flex-shrink: 0; }
.listing-menu-btn { width: 34px; height: 34px; border-radius: 8px; background: var(--card2); border: 1px solid var(--border); cursor: pointer; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3.5px; transition: background 0.15s, border-color 0.15s; }
.listing-menu-btn span { display: block; width: 4px; height: 4px; border-radius: 50%; background: var(--muted); transition: background 0.15s; }
.listing-menu-btn:hover, .listing-menu-btn.active { background: rgba(75,142,240,0.1); border-color: rgba(75,142,240,0.25); }
.listing-menu-btn:hover span, .listing-menu-btn.active span { background: var(--primary2); }
.listing-menu-dropdown { background: #ffffff; border: 1px solid rgba(37,99,200,0.15); border-radius: 12px; padding: 5px; min-width: 172px; z-index: 9999; box-shadow: 0 8px 32px rgba(37,99,200,0.12), 0 2px 8px rgba(0,0,0,0.08); animation: fadeIn 0.12s ease; }
.listing-menu-item { display: flex; align-items: center; gap: 9px; padding: 8px 11px; border-radius: 8px; font-size: 13px; font-weight: 500; cursor: pointer; transition: background 0.12s; color: var(--text); }
.listing-menu-item:hover { background: rgba(37,99,200,0.05); }
.lmi-icon { font-size: 14px; width: 18px; text-align: center; flex-shrink: 0; }
.listing-menu-divider { height: 1px; background: var(--border); margin: 4px 6px; }
.action-sold   { color: var(--green)    !important; }
.action-active { color: var(--primary2) !important; }
.action-draft  { color: #F5AF02        !important; }
.action-edit   { color: var(--text)    !important; }
.action-delete { color: var(--red)     !important; }
.action-delete:hover { background: rgba(220,38,38,0.08) !important; }

.detail-modal { max-width: 560px; }
.detail-hero { position: relative; height: 220px; overflow: hidden; border-bottom: 1px solid var(--border); }
.detail-hero-img { width: 100%; height: 100%; object-fit: cover; display: block; }
.detail-hero-emoji { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; font-size: 72px; background: linear-gradient(135deg, #070f1d, #0d1e3d); }
.detail-hero-overlay { position: absolute; inset: 0; background: linear-gradient(to top, rgba(6,12,24,0.85) 0%, transparent 55%); }
.detail-hero-info { position: absolute; bottom: 0; left: 0; right: 0; padding: 16px 20px; }
.detail-hero-title { font-size: 15px; font-weight: 700; line-height: 1.3; margin-bottom: 6px; color: #fff; }
.detail-hero-badges { display: flex; gap: 6px; flex-wrap: wrap; }
.detail-body { padding: 18px 20px; }
.detail-specs-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 16px; }
.detail-spec { background: var(--card2); border: 1px solid var(--border); border-radius: 10px; padding: 10px 13px; }
.detail-spec-label { font-size: 10px; color: var(--muted); text-transform: uppercase; letter-spacing: 0.4px; margin-bottom: 3px; }
.detail-spec-val   { font-size: 13px; font-weight: 600; }
.detail-desc-label { font-size: 11px; color: var(--muted); text-transform: uppercase; letter-spacing: 0.4px; margin-bottom: 8px; }
.detail-desc-body  { font-size: 12.5px; color: var(--muted); line-height: 1.65; white-space: pre-wrap; max-height: 120px; overflow-y: auto; }
.detail-actions { padding: 14px 20px 20px; border-top: 1px solid var(--border); display: flex; gap: 8px; flex-wrap: wrap; }
.detail-action-btn { flex: 1; min-width: 0; padding: 9px 10px; border-radius: 9px; font-size: 12px; font-weight: 600; cursor: pointer; border: 1px solid transparent; transition: all 0.15s; display: flex; align-items: center; justify-content: center; gap: 5px; }
.dab-sold   { background: rgba(22,163,74,0.1);   color: var(--green);    border-color: rgba(22,163,74,0.2);   }
.dab-sold:hover   { background: rgba(22,163,74,0.18);   }
.dab-unsell { background: rgba(75,142,240,0.1);  color: var(--primary2); border-color: rgba(75,142,240,0.2);  }
.dab-unsell:hover { background: rgba(75,142,240,0.18);  }
.dab-draft  { background: rgba(245,175,2,0.1);   color: #F5AF02;         border-color: rgba(245,175,2,0.2);   }
.dab-draft:hover  { background: rgba(245,175,2,0.18);   }
.dab-edit   { background: rgba(0,0,0,0.04); color: var(--text);    border-color: var(--border); }
.dab-edit:hover   { background: rgba(0,0,0,0.08);  }
.dab-delete { background: rgba(220,38,38,0.08);  color: var(--red);      border-color: rgba(220,38,38,0.15);  }
.dab-delete:hover { background: rgba(220,38,38,0.16);   }

.ls-filter-tabs { display: flex; gap: 6px; margin-bottom: 16px; }
.ls-filter-tab { display: flex; align-items: center; gap: 6px; padding: 6px 14px; border-radius: 8px; font-size: 12.5px; font-weight: 500; cursor: pointer; transition: all 0.15s; color: var(--muted); background: transparent; border: 1px solid transparent; }
.ls-filter-tab:hover { background: rgba(75,142,240,0.06); color: var(--text); }
.ls-filter-tab.active { background: linear-gradient(135deg, rgba(37,99,200,0.15), rgba(75,142,240,0.08)); color: var(--primary2); border-color: rgba(75,142,240,0.2); }
.ls-filter-count { font-size: 10.5px; font-weight: 700; background: rgba(0,0,0,0.07); padding: 1px 6px; border-radius: 10px; }
.ls-filter-tab.active .ls-filter-count { background: rgba(75,142,240,0.18); }

@media (max-width: 640px) {
  .listings-controls { gap: 8px; }
  .search-wrap { min-width: 0; flex: 1; }
  .select-input { font-size: 13px !important; flex: 1; min-width: 0; }
  .ls-filter-tabs { gap: 4px; flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; padding-bottom: 2px; }
  .ls-filter-tabs::-webkit-scrollbar { display: none; }
  .ls-filter-tab { flex-shrink: 0; font-size: 12px !important; padding: 5px 10px !important; min-height: 36px; }
  .listing-row { padding: 10px 12px !important; gap: 10px !important; }
  .listing-thumb { width: 44px !important; height: 44px !important; flex-shrink: 0; }
  .listing-name { font-size: 13px !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: calc(100vw - 180px); }
  .listing-price { font-size: 14px !important; }
  .listing-menu-btn { width: 30px !important; height: 30px !important; }
}