/* components.css — أنماط المكونات المشتركة */

/* ── أزرار ── */
.btn { display:inline-flex; align-items:center; gap:6px; padding:9px 18px; border-radius:var(--radius); font-size:.9rem; font-weight:600; cursor:pointer; border:none; transition:opacity .15s,transform .1s; text-decoration:none; }
.btn:active { transform:scale(.97); }
.btn:disabled { opacity:.4; cursor:not-allowed; }
.btn--primary   { background:var(--color-primary); color:#fff; }
.btn--secondary { background:var(--color-bg); color:var(--color-text); border:1px solid var(--color-border); }
.btn--success   { background:var(--color-success); color:#fff; }
.btn--danger    { background:var(--color-danger);  color:#fff; }
.btn:hover:not(:disabled) { opacity:.88; }

/* ── بطاقات ── */
.card { background:var(--color-surface); border:1px solid var(--color-border); border-radius:var(--radius-lg); box-shadow:var(--shadow); overflow:hidden; }
.card__body { padding:16px; }

/* ── شريط تقدم ── */
.progress-bar { height:8px; background:var(--color-border); border-radius:99px; overflow:hidden; }
.progress-bar__fill { height:100%; background:var(--color-primary); border-radius:99px; transition:width .4s ease; }

/* ── شارات ── */
.badge { display:inline-block; padding:2px 10px; border-radius:99px; font-size:.72rem; font-weight:700; }
.badge--primary { background:#dbeafe; color:#1d4ed8; }
.badge--success { background:#dcfce7; color:#15803d; }
.badge--warning { background:#fef3c7; color:#b45309; }
.badge--danger  { background:#fee2e2; color:#dc2626; }

/* ── حقول الإدخال ── */
.input { width:100%; padding:9px 12px; border:1px solid var(--color-border); border-radius:var(--radius); font-size:.9rem; font-family:inherit; background:var(--color-surface); color:var(--color-text); transition:border-color .15s; }
.input:focus { outline:none; border-color:var(--color-primary); }

/* ── رسائل التنبيه ── */
.alert { padding:12px 16px; border-radius:var(--radius); font-size:.88rem; margin-bottom:12px; }
.alert--success { background:#dcfce7; color:#15803d; border:1px solid #86efac; }
.alert--warning { background:#fef3c7; color:#b45309; border:1px solid #fde68a; }
.alert--error   { background:#fee2e2; color:#dc2626; border:1px solid #fca5a5; }
.alert--info    { background:#dbeafe; color:#1d4ed8; border:1px solid #93c5fd; }

/* ── جداول ── */
.table { width:100%; border-collapse:collapse; font-size:.88rem; }
.table th,.table td { padding:10px 12px; border-bottom:1px solid var(--color-border); text-align:right; }
.table th { background:var(--color-bg); font-weight:600; font-size:.8rem; color:var(--color-text-muted); }
.table tr:last-child td { border-bottom:none; }
.table tr:hover td { background:#fafafa; }