/* ═══════════════════════════════════════════════════════════
   مكوّن رفع الملفات الموحّد — مستوحى من Jakub Antalik (2019)
   بألوان زاد. يُحسّن أي <input type="file"> تلقائياً.
   ═══════════════════════════════════════════════════════════ */
:root{
  --up-emerald:#1A5C3A; --up-emerald-dark:#0B3D2E; --up-gold:#D4AF37; --up-gold-dark:#B8962E;
  --up-line:#e7e2d2; --up-muted:#7b8079; --up-cream:#FAF8F0;
}
/* منطقة الإفلات (تحلّ محل input الخام) */
.upz{position:relative;border:2px dashed var(--up-line);border-radius:14px;padding:18px 16px;text-align:center;background:#fdfdfb;cursor:pointer;transition:.2s;display:block}
.upz:hover{border-color:var(--up-emerald);background:#f7faf8}
.upz.drag{border-color:var(--up-emerald);background:#eef4f0}
.upz input[type="file"]{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%}
.upz .upz-ic{font-size:26px;color:var(--up-emerald);display:block;margin-bottom:6px}
.upz .upz-t{font-size:13px;font-weight:700;color:#1f2421}
.upz .upz-s{font-size:11px;color:var(--up-muted);margin-top:3px}
/* بطاقات الملفات المختارة */
.upz-files{display:flex;flex-direction:column;gap:8px;margin-top:10px}
.upz-file{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid var(--up-line);border-radius:11px;padding:8px 10px;text-align:right}
.upz-thumb{width:42px;height:42px;border-radius:9px;object-fit:cover;flex:0 0 auto;background:#eef4f0;display:flex;align-items:center;justify-content:center;color:var(--up-emerald);font-size:20px;overflow:hidden}
.upz-thumb img{width:100%;height:100%;object-fit:cover}
.upz-meta{flex:1;min-width:0}
.upz-name{font-size:12.5px;font-weight:700;color:#1f2421;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.upz-size{font-size:11px;color:var(--up-muted);margin-top:1px}
.upz-rm{width:28px;height:28px;border-radius:50%;border:none;background:#fdecec;color:#dc2626;cursor:pointer;font-size:14px;flex:0 0 auto;display:flex;align-items:center;justify-content:center}
.upz-rm:hover{background:#dc2626;color:#fff}

/* بطاقة التقدّم العائمة (مصغّر/موسّع) — أثناء الإرسال */
.upcard{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(120%);z-index:99999;background:#fff;border-radius:18px;box-shadow:0 18px 50px rgba(11,61,46,.28);overflow:hidden;width:440px;max-width:92vw;opacity:0;transition:transform .45s cubic-bezier(.22,1,.36,1),opacity .35s}
.upcard.show{transform:translateX(-50%) translateY(0);opacity:1}
.upcard .upc-fill{position:absolute;inset:0;background:linear-gradient(90deg,rgba(26,92,58,.14),rgba(26,92,58,.06));width:0%;transition:width .3s ease;z-index:0}
.upcard.done .upc-fill{background:linear-gradient(90deg,rgba(26,92,58,.20),rgba(212,175,55,.16))}
.upcard .upc-line{position:absolute;bottom:0;right:0;height:3px;background:linear-gradient(90deg,var(--up-gold),var(--up-emerald));width:0%;transition:width .3s ease;z-index:2}
.upc-mini{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:18px 20px}
.upc-mini h4{font-size:15px;font-weight:800;color:#1f2421;margin:0}
.upc-sub{font-size:12px;color:var(--up-muted);margin-top:3px}
.upc-acts{display:flex;gap:4px}
.upc-btn{width:32px;height:32px;border-radius:50%;border:none;background:rgba(13,61,46,.06);color:var(--up-emerald);font-size:15px;display:flex;align-items:center;justify-content:center;cursor:pointer}
.upc-btn:hover{background:rgba(13,61,46,.13)}
.upcard .upc-expanded{position:relative;z-index:1;display:none;padding:4px 20px 16px}
.upcard.open .upc-mini{display:none}
.upcard.open .upc-expanded{display:block}
.upcard.open .upc-fill,.upcard.open .upc-line{display:none}
.upc-head{display:flex;align-items:center;justify-content:space-between;padding:16px 0 12px;border-bottom:1px solid var(--up-line)}
.upc-head h4{font-size:15px;font-weight:800;margin:0}
.upc-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid #f1eee2}
.upc-row:last-child{border:0}
.upc-rfile{flex:1;min-width:0}
.upc-rname{font-size:13px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.upc-rbar{height:3px;background:#eee8d8;border-radius:100px;overflow:hidden;margin-top:7px}
.upc-rbar>span{display:block;height:100%;background:linear-gradient(90deg,var(--up-emerald),var(--up-gold));border-radius:100px;transition:width .3s}
.upc-rmeta{font-size:11.5px;color:var(--up-muted);white-space:nowrap}
.upc-done-ic{color:var(--up-emerald);font-size:18px}
@media (max-width:520px){.upcard{width:94vw;bottom:14px}}