/* ═══════════════════════════════════════════════════════════
   UNIFIED CARD SYSTEM — Same style across all pages
   ═══════════════════════════════════════════════════════════ */

/* ── Universal Card ─────────────────────────────────────── */
.ucard {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 14px;
  overflow: hidden;
  transition: border-color .15s, transform .15s, box-shadow .15s;
  position: relative;
  display: flex;
  flex-direction: column;
}
.ucard::before {
  content:'';position:absolute;top:0;left:0;right:0;height:3px;
  background:linear-gradient(90deg,var(--accent),#388bfd);
  opacity:0;transition:opacity .15s;
}
.ucard:hover { border-color:var(--accent); transform:translateY(-2px); box-shadow:0 8px 30px rgba(31,156,240,.15); }
.ucard:hover::before { opacity:1; }

/* ── Card body ──────────────────────────────────────────── */
.ucard-body  { padding:14px; flex:1; display:flex; flex-direction:column; gap:8px; }
.ucard-foot  { padding:10px 14px; border-top:1px solid var(--border); display:flex; align-items:center; justify-content:space-between; background:rgba(0,0,0,.06); }

/* ── Icon + Title head ──────────────────────────────────── */
.ucard-head  { display:flex; align-items:flex-start; gap:10px; }
.ucard-ico   { width:42px;height:42px;border-radius:10px;background:var(--accent-dim);display:flex;align-items:center;justify-content:center;font-size:20px;flex-shrink:0; }
.ucard-img   { width:42px;height:42px;border-radius:10px;object-fit:cover;flex-shrink:0; }
.ucard-title { font-size:13px;font-weight:600;color:var(--text-primary);line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden; }
.ucard-sub   { font-size:11px;color:var(--accent);margin-top:3px;font-weight:500; }
.ucard-muted { font-size:11px;color:var(--text-muted);margin-top:3px; }

/* ── Meta chips ─────────────────────────────────────────── */
.ucard-meta  { display:flex;align-items:center;gap:5px;flex-wrap:wrap; }
.uchip       { font-size:10px;padding:2px 8px;border-radius:10px;font-weight:600;white-space:nowrap; }
.uchip-sold  { background:var(--bg-hover);color:var(--text-muted); }
.uchip-247   { background:rgba(63,185,80,.1);color:var(--green);border:1px solid rgba(63,185,80,.2); }
.uchip-cat   { background:var(--accent-dim);color:var(--accent); }
.uchip-tag   { background:var(--bg-hover);color:var(--text-muted);border:1px solid var(--border); }
.uchip-new   { background:rgba(188,140,255,.12);color:var(--purple);border:1px solid rgba(188,140,255,.2); }
.uchip-hot   { background:rgba(248,81,73,.1);color:var(--red);border:1px solid rgba(248,81,73,.2); }
.uchip-feat  { background:rgba(210,153,34,.1);color:var(--yellow);border:1px solid rgba(210,153,34,.2); }

/* ── Price ──────────────────────────────────────────────── */
.ucard-price      { font-size:20px;font-weight:800;color:var(--accent); }
.ucard-price-free { font-size:15px;font-weight:700;color:var(--green); }
.ucard-price-old  { font-size:11px;color:var(--text-muted);text-decoration:line-through; }

/* ── Grid system ────────────────────────────────────────── */
.ugrid { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:12px; margin-bottom:24px; }
.ugrid-2 { grid-template-columns:repeat(auto-fill,minmax(320px,1fr)); }

@media(max-width:768px){.ugrid{grid-template-columns:repeat(2,1fr);gap:8px}}
@media(max-width:380px){.ugrid{grid-template-columns:1fr}}

/* ── News card horizontal ───────────────────────────────── */
.news-card { background:var(--bg-card);border:1px solid var(--border);border-radius:14px;overflow:hidden;display:flex;gap:0;transition:border-color .15s,transform .15s;text-decoration:none;margin-bottom:10px; }
.news-card:hover { border-color:var(--accent);transform:translateY(-1px); }
.news-card-img { width:80px;min-height:80px;background:var(--bg-card-2);display:flex;align-items:center;justify-content:center;font-size:28px;flex-shrink:0; }
.news-card-img img { width:80px;height:100%;object-fit:cover; }
.news-card-body { padding:12px 14px;flex:1;min-width:0; }
.news-card-title { font-size:13px;font-weight:600;color:var(--text-primary);line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin-bottom:5px; }
.news-card-meta { font-size:11px;color:var(--text-muted);display:flex;gap:10px;flex-wrap:wrap; }

/* ── Request card ───────────────────────────────────────── */
.req-card { background:var(--bg-card);border:1px solid var(--border);border-radius:14px;padding:14px;display:flex;gap:12px;align-items:flex-start;transition:border-color .15s,transform .15s; }
.req-card:hover { border-color:var(--accent);transform:translateY(-1px); }
.req-type-badge { width:48px;height:48px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;text-align:center;line-height:1.2;flex-shrink:0; }

/* ── IMEI service card ──────────────────────────────────── */
.imei-svc-card { background:var(--bg-card);border:1px solid var(--border);border-radius:12px;padding:12px 14px;display:flex;align-items:center;justify-content:space-between;gap:10px;transition:border-color .15s,background .15s;cursor:pointer;margin-bottom:6px; }
.imei-svc-card:hover,.imei-svc-card.active { border-color:var(--accent);background:var(--bg-card-2); }
.imei-svc-card.active { background:var(--accent-dim); }

/* ── Section header ─────────────────────────────────────── */
.sec-hdr { display:flex;align-items:center;justify-content:space-between;margin-bottom:12px; }
.sec-hdr h2 { font-size:16px;font-weight:700;color:var(--text-primary); }
.sec-hdr a { font-size:12px;color:var(--accent); }