/* ============================================================
   StockLite — الأنماط الأساسية
   تصميم Mobile First — RTL — وضع ليلي اختياري
   ============================================================ */

/* ---------- الخط العربي (محلي — يعمل بدون إنترنت) ---------- */
@font-face {
    font-family: 'Cairo';
    font-style: normal;
    font-weight: 400 700;
    font-display: swap;
    src: url('fonts/cairo-arabic.woff2') format('woff2');
    unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+0890-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC, U+102E0-102FB, U+10E60-10E7E, U+10EC2-10EC4, U+10EFC-10EFF, U+1EE00-1EE03, U+1EE05-1EE1F, U+1EE21-1EE22, U+1EE24, U+1EE27, U+1EE29-1EE32, U+1EE34-1EE37, U+1EE39, U+1EE3B, U+1EE42, U+1EE47, U+1EE49, U+1EE4B, U+1EE4D-1EE4F, U+1EE51-1EE52, U+1EE54, U+1EE57, U+1EE59, U+1EE5B, U+1EE5D, U+1EE5F, U+1EE61-1EE62, U+1EE64, U+1EE67-1EE6A, U+1EE6C-1EE72, U+1EE74-1EE77, U+1EE79-1EE7C, U+1EE7E, U+1EE80-1EE89, U+1EE8B-1EE9B, U+1EEA1-1EEA3, U+1EEA5-1EEA9, U+1EEAB-1EEBB, U+1EEF0-1EEF1;
}
@font-face {
    font-family: 'Cairo';
    font-style: normal;
    font-weight: 400 700;
    font-display: swap;
    src: url('fonts/cairo-latin-ext.woff2') format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
    font-family: 'Cairo';
    font-style: normal;
    font-weight: 400 700;
    font-display: swap;
    src: url('fonts/cairo-latin.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ---------- المتغيّرات ---------- */
:root {
    --ms-primary: #2563eb;
    --ms-primary-dark: #1d4ed8;
    --ms-primary-soft: #e8effd;
    --ms-bg: #f4f6fb;
    --ms-surface: #ffffff;
    --ms-surface-2: #f8fafc;
    --ms-text: #0f172a;
    --ms-muted: #64748b;
    --ms-border: #e6eaf1;
    --ms-success: #16a34a;
    --ms-success-soft: #e7f7ed;
    --ms-danger: #dc2626;
    --ms-danger-soft: #fdecec;
    --ms-warning: #b45309;
    --ms-warning-soft: #fef4e6;
    --ms-radius: 16px;
    --ms-radius-sm: 12px;
    --ms-shadow: 0 1px 2px rgba(15, 23, 42, .04), 0 2px 6px rgba(15, 23, 42, .05);
    --ms-topbar-h: 60px;
    --ms-nav-h: 66px;
}

[data-bs-theme="dark"] {
    --ms-primary: #4b83ff;
    --ms-primary-dark: #3b74f5;
    --ms-primary-soft: #1c2b4a;
    --ms-bg: #0b1220;
    --ms-surface: #131c2e;
    --ms-surface-2: #182238;
    --ms-text: #e9eef9;
    --ms-muted: #94a3bd;
    --ms-border: #24314c;
    --ms-success: #34d399;
    --ms-success-soft: #14342a;
    --ms-danger: #f87171;
    --ms-danger-soft: #3a1d20;
    --ms-warning: #fbbf24;
    --ms-warning-soft: #3a2e12;
    --ms-shadow: none;
}

/* ---------- الأساس ---------- */
* { -webkit-tap-highlight-color: transparent; }

html { -webkit-text-size-adjust: 100%; }

body.ms-body {
    background: var(--ms-bg);
    color: var(--ms-text);
    font-family: 'Cairo', system-ui, -apple-system, 'Segoe UI', Tahoma, 'Noto Naskh Arabic', sans-serif;
    font-size: 15px;
    line-height: 1.6;
    min-height: 100vh;
    padding-bottom: calc(var(--ms-nav-h) + env(safe-area-inset-bottom, 0px) + 16px);
    padding-top: calc(var(--ms-topbar-h) + env(safe-area-inset-top, 0px));
}

a { color: var(--ms-primary); text-decoration: none; }
a:hover { color: var(--ms-primary-dark); }

:focus-visible {
    outline: 3px solid rgba(37, 99, 235, .35);
    outline-offset: 2px;
}

.text-muted { color: var(--ms-muted) !important; }

/* ---------- التخطيط ---------- */
.ms-container {
    max-width: 720px;
    margin: 0 auto;
    padding: 16px 0 8px;
}

.ms-main { min-height: 60vh; }

/* ---------- الشريط العلوي ---------- */
.ms-topbar {
    position: fixed;
    inset-inline: 0;
    top: 0;
    z-index: 1030;
    height: calc(var(--ms-topbar-h) + env(safe-area-inset-top, 0px));
    padding-top: env(safe-area-inset-top, 0px);
    background: color-mix(in srgb, var(--ms-surface) 88%, transparent);
    backdrop-filter: saturate(180%) blur(12px);
    -webkit-backdrop-filter: saturate(180%) blur(12px);
    border-bottom: 1px solid var(--ms-border);
}

.ms-topbar-inner {
    max-width: 720px;
    margin: 0 auto;
    height: var(--ms-topbar-h);
    padding: 0 14px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.ms-brand { display: flex; align-items: center; gap: 10px; color: var(--ms-text); }
.ms-brand:hover { color: var(--ms-text); }

.ms-brand-mark {
    width: 36px;
    height: 36px;
    border-radius: 11px;
    background: var(--ms-primary);
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 19px;
    flex: 0 0 auto;
}

.ms-brand-mark-lg { width: 54px; height: 54px; border-radius: 16px; font-size: 28px; }

.ms-brand-text { display: flex; flex-direction: column; line-height: 1.15; }
.ms-brand-title { font-weight: 700; font-size: 16px; }
.ms-brand-sub { font-size: 11px; color: var(--ms-muted); }

.ms-topbar-actions { display: flex; align-items: center; gap: 8px; }

.ms-avatar {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: var(--ms-primary-soft);
    color: var(--ms-primary);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 15px;
}

.ms-icon-btn {
    width: 40px;
    height: 40px;
    border-radius: 12px;
    border: 1px solid var(--ms-border);
    background: var(--ms-surface);
    color: var(--ms-text);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 17px;
    cursor: pointer;
    transition: background .15s ease, border-color .15s ease, color .15s ease;
    padding: 0;
}

.ms-icon-btn:hover { background: var(--ms-surface-2); }
.ms-icon-btn.is-danger { color: var(--ms-danger); }
.ms-icon-btn.is-ok { color: var(--ms-success); }

/* ---------- التنقل السفلي ---------- */
.ms-bottom-nav {
    position: fixed;
    inset-inline: 0;
    bottom: 0;
    z-index: 1030;
    height: calc(var(--ms-nav-h) + env(safe-area-inset-bottom, 0px));
    padding-bottom: env(safe-area-inset-bottom, 0px);
    display: flex;
    align-items: stretch;
    background: color-mix(in srgb, var(--ms-surface) 92%, transparent);
    backdrop-filter: saturate(180%) blur(12px);
    -webkit-backdrop-filter: saturate(180%) blur(12px);
    border-top: 1px solid var(--ms-border);
}

.ms-nav-item {
    flex: 1 1 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px;
    color: var(--ms-muted);
    font-size: 10.5px;
    font-weight: 600;
    padding: 6px 2px;
    transition: color .15s ease;
    min-width: 0;
}

.ms-nav-item i { font-size: 20px; }
.ms-nav-item span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.ms-nav-item.is-active { color: var(--ms-primary); }

/* ---------- العناوين ---------- */
.ms-page-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin: 4px 0 16px;
}

.ms-page-title { font-size: 21px; font-weight: 800; margin: 0; }
.ms-page-sub { margin: 2px 0 0; color: var(--ms-muted); font-size: 13px; }

.ms-back {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 13px;
    color: var(--ms-muted);
    margin-bottom: 2px;
}

.ms-btn-add { border-radius: 12px; font-weight: 600; flex: 0 0 auto; }

/* ---------- البطاقات ---------- */
.ms-card {
    background: var(--ms-surface);
    border: 1px solid var(--ms-border);
    border-radius: var(--ms-radius);
    padding: 16px;
    margin-bottom: 14px;
    box-shadow: var(--ms-shadow);
}

.ms-card-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 10px;
}

.ms-card-title { font-size: 15px; font-weight: 700; margin: 0 0 4px; display: flex; align-items: center; gap: 7px; }
.ms-card-title i { color: var(--ms-primary); }
.ms-card-link { font-size: 12.5px; font-weight: 600; }

/* ---------- الترحيب ---------- */
.ms-greeting { margin: 2px 0 16px; }
.ms-greeting-title { font-size: 23px; font-weight: 800; margin: 0; }
.ms-greeting-sub { color: var(--ms-muted); font-size: 13px; margin: 2px 0 0; }

/* ---------- الإحصائيات ---------- */
.ms-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 14px; }

.ms-stat {
    background: var(--ms-surface);
    border: 1px solid var(--ms-border);
    border-radius: var(--ms-radius);
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 2px;
    color: var(--ms-text);
    box-shadow: var(--ms-shadow);
}

.ms-stat:hover { color: var(--ms-text); border-color: var(--ms-primary); }

.ms-stat-icon {
    width: 38px;
    height: 38px;
    border-radius: 12px;
    background: var(--ms-primary-soft);
    color: var(--ms-primary);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    margin-bottom: 6px;
}

.ms-stat-value { font-size: 26px; font-weight: 800; line-height: 1.1; }
.ms-stat-label { font-size: 12.5px; color: var(--ms-muted); }

/* ---------- الأزرار الكبيرة ---------- */
.ms-quick-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 14px; }

.ms-action {
    border-radius: var(--ms-radius);
    padding: 18px 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    font-weight: 700;
    font-size: 15px;
    color: #fff;
    box-shadow: var(--ms-shadow);
}

.ms-action i { font-size: 20px; }
.ms-action-in { background: var(--ms-primary); }
.ms-action-in:hover { background: var(--ms-primary-dark); color: #fff; }
.ms-action-out { background: #0f766e; }
.ms-action-out:hover { background: #0d5f59; color: #fff; }

/* ---------- الملخّص ---------- */
.ms-summary {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    margin-bottom: 16px;
}

.ms-summary-item {
    background: var(--ms-surface);
    border: 1px solid var(--ms-border);
    border-radius: var(--ms-radius-sm);
    padding: 12px 10px;
    display: flex;
    flex-direction: column;
    gap: 2px;
    text-align: center;
    color: var(--ms-text);
    box-shadow: var(--ms-shadow);
}

.ms-summary-label { font-size: 11.5px; color: var(--ms-muted); }
.ms-summary-value { font-size: 17px; font-weight: 800; }

/* ---------- القوائم ---------- */
.ms-list { list-style: none; margin: 0 0 14px; padding: 0; }

.ms-row {
    background: var(--ms-surface);
    border: 1px solid var(--ms-border);
    border-radius: var(--ms-radius-sm);
    padding: 13px 14px;
    margin-bottom: 9px;
    display: flex;
    align-items: center;
    gap: 12px;
    box-shadow: var(--ms-shadow);
}

.ms-row.is-inactive { opacity: .62; }
.ms-row-main { flex: 1 1 auto; min-width: 0; }

.ms-row-title {
    font-weight: 700;
    font-size: 15px;
    color: var(--ms-text);
    display: block;
    overflow-wrap: anywhere;
}

.ms-row-title-link:hover { color: var(--ms-primary); }

.ms-row-meta { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 5px; }

.ms-chip {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 11.5px;
    padding: 2px 8px;
    border-radius: 999px;
    background: var(--ms-surface-2);
    color: var(--ms-muted);
    border: 1px solid var(--ms-border);
    white-space: nowrap;
}

.ms-chip i { font-size: 11px; }
.ms-chip-ok { background: var(--ms-success-soft); color: var(--ms-success); border-color: transparent; }
.ms-chip-off { background: var(--ms-danger-soft); color: var(--ms-danger); border-color: transparent; }

.ms-row-side { text-align: center; flex: 0 0 auto; min-width: 62px; }
.ms-row-qty { display: block; font-size: 19px; font-weight: 800; line-height: 1.15; }
.ms-row-qty-label { display: block; font-size: 10.5px; color: var(--ms-muted); }

.ms-row-actions { display: flex; align-items: center; gap: 6px; flex: 0 0 auto; }
.ms-row-actions form { margin: 0; }

/* ---------- قائمة العمليات ---------- */
.ms-op-list { list-style: none; margin: 0; padding: 0; }

.ms-op {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 11px 0;
    border-bottom: 1px dashed var(--ms-border);
}

.ms-op:last-child { border-bottom: 0; padding-bottom: 0; }
.ms-op-main { flex: 1 1 auto; min-width: 0; }

.ms-op-title { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.ms-op-wh { font-weight: 700; font-size: 14.5px; overflow-wrap: anywhere; }

.ms-op-tag {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 11.5px;
    padding: 2px 8px;
    border-radius: 999px;
    background: var(--ms-primary-soft);
    color: var(--ms-primary);
}

.ms-op-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    font-size: 11.5px;
    color: var(--ms-muted);
    margin-top: 3px;
}

.ms-op-qty { text-align: center; flex: 0 0 auto; }
.ms-op-qty-value { display: block; font-size: 17px; font-weight: 800; }
.ms-op-qty-label { display: block; font-size: 10.5px; color: var(--ms-muted); }

/* ---------- حالة فارغة ---------- */
.ms-empty {
    background: var(--ms-surface);
    border: 1px dashed var(--ms-border);
    border-radius: var(--ms-radius);
    padding: 32px 20px;
    text-align: center;
    margin-bottom: 14px;
}

.ms-empty-icon { font-size: 42px; color: var(--ms-muted); opacity: .55; line-height: 1; }
.ms-empty-title { font-weight: 700; font-size: 16px; margin-top: 10px; }
.ms-empty-text { color: var(--ms-muted); font-size: 13.5px; margin-top: 4px; }

/* ---------- البحث والفلاتر ---------- */
.ms-filter {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 14px;
    align-items: stretch;
}

.ms-search {
    position: relative;
    flex: 1 1 200px;
    display: flex;
    align-items: center;
}

.ms-search > i {
    position: absolute;
    inset-inline-start: 13px;
    color: var(--ms-muted);
    font-size: 15px;
    pointer-events: none;
}

.ms-search input {
    width: 100%;
    height: 46px;
    border-radius: var(--ms-radius-sm);
    border: 1px solid var(--ms-border);
    background: var(--ms-surface);
    color: var(--ms-text);
    padding: 0 38px 0 38px;
    font-size: 15px;
}

.ms-search input:focus { border-color: var(--ms-primary); outline: none; box-shadow: 0 0 0 3px rgba(37, 99, 235, .12); }

.ms-search-clear {
    position: absolute;
    inset-inline-end: 8px;
    width: 30px;
    height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    color: var(--ms-muted);
    background: var(--ms-surface-2);
}

.ms-status-select { flex: 0 0 130px; height: 46px; border-radius: var(--ms-radius-sm); }
.ms-warehouse-select { flex: 1 1 170px; height: 46px; border-radius: var(--ms-radius-sm); }
.ms-item-select { flex: 1 1 170px; height: 46px; border-radius: var(--ms-radius-sm); }

.ms-filter-row { display: flex; gap: 8px; flex: 1 1 100%; }
.ms-field { flex: 1 1 0; min-width: 0; }
.ms-filter-actions { display: flex; gap: 8px; flex: 1 1 100%; }
.ms-filter-actions .btn { flex: 1 1 0; }

/* ---------- النماذج ---------- */
.ms-form .ms-card { padding: 16px; }

.form-label { font-weight: 600; font-size: 13.5px; margin-bottom: 6px; }
.form-control, .form-select { border-radius: var(--ms-radius-sm); border-color: var(--ms-border); }
.form-control:focus, .form-select:focus { border-color: var(--ms-primary); box-shadow: 0 0 0 3px rgba(37, 99, 235, .12); }
.form-control-lg, .form-select-lg { font-size: 16px; min-height: 50px; border-radius: var(--ms-radius-sm); }
.form-text { font-size: 12px; color: var(--ms-muted); }

.input-group-text {
    background: var(--ms-surface-2);
    border-color: var(--ms-border);
    color: var(--ms-muted);
}

[data-bs-theme="dark"] .form-control,
[data-bs-theme="dark"] .form-select {
    background-color: var(--ms-surface-2);
    color: var(--ms-text);
    border-color: var(--ms-border);
}

/* ---------- اختيار الأصناف ---------- */
.ms-item-picker { position: relative; }
.ms-picker-search { position: relative; display: flex; align-items: center; }

.ms-picker-search > i {
    position: absolute;
    inset-inline-start: 13px;
    color: var(--ms-muted);
    pointer-events: none;
}

.ms-picker-search input {
    padding-inline-start: 38px;
    height: 46px;
    border-radius: var(--ms-radius-sm);
    background: var(--ms-surface);
    color: var(--ms-text);
}

/* ---------- أسطر الصرف ---------- */
.ms-lines { display: flex; flex-direction: column; gap: 12px; }

.ms-line {
    border: 1px solid var(--ms-border);
    border-radius: var(--ms-radius-sm);
    padding: 12px;
    background: var(--ms-surface-2);
}

.ms-line-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
.ms-line-no { font-size: 12.5px; font-weight: 700; color: var(--ms-muted); }

.ms-line-remove {
    border: 0;
    background: transparent;
    color: var(--ms-danger);
    font-size: 12.5px;
    font-weight: 600;
    padding: 4px 8px;
    border-radius: 8px;
    cursor: pointer;
}

.ms-line-remove:hover { background: var(--ms-danger-soft); }
.ms-line-qty { margin-top: 10px; }

/* ---------- أزرار لاصقة ---------- */
.ms-sticky-actions {
    position: sticky;
    bottom: calc(var(--ms-nav-h) + env(safe-area-inset-bottom, 0px) + 10px);
    padding: 10px 0 4px;
    margin-top: 4px;
    background: linear-gradient(to top, var(--ms-bg) 55%, transparent);
}

.ms-sticky-actions .btn { border-radius: 14px; font-weight: 700; }

/* ---------- التنبيهات ---------- */
.ms-alert { display: flex; gap: 10px; align-items: flex-start; border-radius: var(--ms-radius-sm); font-size: 14px; }
.ms-alert-body { flex: 1 1 auto; }
.ms-alert .btn-close { margin-inline-start: 4px; }

/* ---------- التوست ---------- */
.ms-toast-stack {
    position: fixed;
    top: calc(var(--ms-topbar-h) + env(safe-area-inset-top, 0px) + 10px);
    inset-inline: 0;
    z-index: 1090;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    pointer-events: none;
    padding: 0 12px;
}

.ms-toast-stack .toast { pointer-events: auto; width: min(100%, 480px); border-radius: var(--ms-radius-sm); }
.ms-toast-source { display: none; }

/* ---------- شريط عدم الاتصال ---------- */
.ms-offline-banner {
    position: fixed;
    top: 0;
    inset-inline: 0;
    z-index: 1100;
    background: #b45309;
    color: #fff;
    font-size: 13px;
    font-weight: 600;
    padding: 8px 14px;
    padding-top: calc(8px + env(safe-area-inset-top, 0px));
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    text-align: center;
}

/* ---------- بطاقة نتيجة العملية ---------- */
.ms-result-card {
    background: var(--ms-success-soft);
    border: 1px solid color-mix(in srgb, var(--ms-success) 30%, transparent);
    border-radius: var(--ms-radius);
    padding: 15px;
    margin-bottom: 14px;
}

.ms-result-head { display: flex; gap: 11px; align-items: flex-start; }
.ms-result-head > i { font-size: 22px; color: var(--ms-success); line-height: 1.2; }
.ms-result-title { font-weight: 800; font-size: 15px; }
.ms-result-meta { font-size: 12px; color: var(--ms-muted); margin-top: 3px; }

.ms-result-body {
    margin-top: 12px;
    background: var(--ms-surface);
    border-radius: var(--ms-radius-sm);
    padding: 10px 12px;
}

.ms-result-line {
    display: flex;
    flex-wrap: wrap;
    gap: 4px 12px;
    align-items: baseline;
    padding: 6px 0;
    border-bottom: 1px dashed var(--ms-border);
    font-size: 13.5px;
}

.ms-result-line:last-child { border-bottom: 0; }
.ms-result-item { font-weight: 700; flex: 1 1 100%; }
.ms-result-qty { color: var(--ms-muted); }
.ms-result-balance { color: var(--ms-success); font-weight: 600; }
.ms-result-total { padding-top: 8px; font-size: 13.5px; border-top: 1px solid var(--ms-border); margin-top: 4px; }
.ms-result-actions { display: flex; gap: 8px; margin-top: 12px; }

/* ---------- القوائم (المزيد) ---------- */
.ms-menu { list-style: none; margin: 0 0 14px; padding: 0; }

.ms-menu-item {
    display: flex;
    align-items: center;
    gap: 12px;
    background: var(--ms-surface);
    border: 1px solid var(--ms-border);
    border-radius: var(--ms-radius-sm);
    padding: 13px 14px;
    margin-bottom: 9px;
    color: var(--ms-text);
    box-shadow: var(--ms-shadow);
}

.ms-menu-item:hover { color: var(--ms-text); border-color: var(--ms-primary); }

.ms-menu-icon {
    width: 38px;
    height: 38px;
    border-radius: 12px;
    background: var(--ms-primary-soft);
    color: var(--ms-primary);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    flex: 0 0 auto;
}

.ms-menu-body { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; }
.ms-menu-title { font-weight: 700; font-size: 14.5px; }
.ms-menu-text { font-size: 12px; color: var(--ms-muted); }
.ms-menu-arrow { color: var(--ms-muted); font-size: 13px; }

.ms-about-row {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    padding: 8px 0;
    border-bottom: 1px dashed var(--ms-border);
    font-size: 13.5px;
}

.ms-about-row:last-child { border-bottom: 0; }
.ms-about-row span:first-child { color: var(--ms-muted); }

.ms-help { font-size: 13px; color: var(--ms-muted); line-height: 1.7; }

/* ---------- بطاقات التقارير ---------- */
.ms-report-cards { display: flex; flex-direction: column; gap: 10px; }

.ms-report-card {
    display: flex;
    align-items: center;
    gap: 13px;
    background: var(--ms-surface);
    border: 1px solid var(--ms-border);
    border-radius: var(--ms-radius);
    padding: 15px;
    color: var(--ms-text);
    box-shadow: var(--ms-shadow);
}

.ms-report-card:hover { color: var(--ms-text); border-color: var(--ms-primary); }

.ms-report-icon {
    width: 44px;
    height: 44px;
    border-radius: 13px;
    background: var(--ms-primary-soft);
    color: var(--ms-primary);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    flex: 0 0 auto;
}

.ms-report-body { flex: 1 1 auto; display: flex; flex-direction: column; min-width: 0; }
.ms-report-title { font-weight: 700; font-size: 15px; }
.ms-report-text { font-size: 12.5px; color: var(--ms-muted); }
.ms-report-arrow { color: var(--ms-muted); font-size: 13px; }

/* ---------- الجداول ---------- */
.ms-table-wrap {
    background: var(--ms-surface);
    border: 1px solid var(--ms-border);
    border-radius: var(--ms-radius);
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    margin-bottom: 14px;
    box-shadow: var(--ms-shadow);
}

.ms-table { font-size: 13.5px; margin: 0; color: var(--ms-text); }

.ms-table > thead > tr > th {
    background: var(--ms-surface-2);
    color: var(--ms-muted);
    font-weight: 700;
    font-size: 12px;
    white-space: nowrap;
    border-bottom: 1px solid var(--ms-border);
    padding: 10px 12px;
}

.ms-table > tbody > tr > td {
    padding: 10px 12px;
    border-bottom: 1px solid var(--ms-border);
    vertical-align: middle;
}

.ms-table > tbody > tr:last-child > td { border-bottom: 1px solid var(--ms-border); }
.ms-table > tfoot > tr > td { padding: 10px 12px; background: var(--ms-surface-2); font-size: 13px; }

.ms-cell-main { display: block; font-weight: 600; overflow-wrap: anywhere; }
.ms-cell-sub { display: block; font-size: 11.5px; color: var(--ms-muted); margin-top: 2px; }
.ms-cell-date { white-space: nowrap; font-variant-numeric: tabular-nums; }
.ms-cell-note { max-width: 220px; overflow-wrap: anywhere; font-size: 12.5px; color: var(--ms-muted); }

/* ---------- الترقيم ---------- */
.ms-pagination {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 16px;
}

.ms-pagination-info { font-size: 12.5px; color: var(--ms-muted); }
.ms-pagination .page-link { color: var(--ms-primary); border-radius: 9px; margin: 0 2px; border-color: var(--ms-border); }
.ms-pagination .page-item.active .page-link { background: var(--ms-primary); border-color: var(--ms-primary); color: #fff; }

/* ---------- صفحة الدخول ---------- */
.ms-login-body {
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
}

.ms-login-wrap {
    width: 100%;
    max-width: 420px;
    padding: 24px 16px calc(24px + env(safe-area-inset-bottom, 0px));
    margin: 0 auto;
}

.ms-login-card {
    background: var(--ms-surface);
    border: 1px solid var(--ms-border);
    border-radius: 20px;
    padding: 26px 20px;
    box-shadow: var(--ms-shadow);
}

.ms-login-brand { text-align: center; margin-bottom: 20px; display: flex; flex-direction: column; align-items: center; gap: 6px; }
.ms-login-title { font-size: 22px; font-weight: 800; margin: 6px 0 0; }
.ms-login-sub { font-size: 12.5px; color: var(--ms-muted); margin: 0; }
.ms-login-form .form-label { font-size: 13.5px; }
.ms-login-foot { text-align: center; font-size: 12px; color: var(--ms-muted); margin: 18px 0 0; }

/* ---------- أزرار Bootstrap ---------- */
.btn { border-radius: 11px; font-weight: 600; }
.btn-lg { border-radius: 13px; padding: 12px 18px; font-size: 16px; }

.btn-primary {
    --bs-btn-bg: var(--ms-primary);
    --bs-btn-border-color: var(--ms-primary);
    --bs-btn-hover-bg: var(--ms-primary-dark);
    --bs-btn-hover-border-color: var(--ms-primary-dark);
    --bs-btn-active-bg: var(--ms-primary-dark);
    --bs-btn-active-border-color: var(--ms-primary-dark);
    --bs-btn-disabled-bg: var(--ms-primary);
    --bs-btn-disabled-border-color: var(--ms-primary);
}

.btn-outline-primary {
    --bs-btn-color: var(--ms-primary);
    --bs-btn-border-color: var(--ms-primary);
    --bs-btn-hover-bg: var(--ms-primary);
    --bs-btn-hover-border-color: var(--ms-primary);
    --bs-btn-active-bg: var(--ms-primary);
    --bs-btn-active-border-color: var(--ms-primary);
}

.btn-outline-secondary {
    --bs-btn-color: var(--ms-muted);
    --bs-btn-border-color: var(--ms-border);
    --bs-btn-hover-bg: var(--ms-surface-2);
    --bs-btn-hover-border-color: var(--ms-border);
    --ms-btn-hover-color: var(--ms-text);
}

[data-bs-theme="dark"] .btn-outline-secondary { --bs-btn-color: var(--ms-text); }

/* ---------- النوافذ المنبثقة ---------- */
.modal-content { border-radius: 18px; border: 0; background: var(--ms-surface); color: var(--ms-text); }
.modal-header, .modal-footer { border-color: var(--ms-border); }
.modal-title { font-weight: 700; }

.ms-confirm-box { font-size: 14px; }
.ms-confirm-row { display: flex; justify-content: space-between; gap: 12px; padding: 8px 0; border-bottom: 1px dashed var(--ms-border); }
.ms-confirm-row span:first-child { color: var(--ms-muted); }
.ms-confirm-list { margin: 10px 0 0; padding: 0; list-style: none; }
.ms-confirm-list li { display: flex; justify-content: space-between; gap: 10px; padding: 7px 0; border-bottom: 1px dashed var(--ms-border); }
.ms-confirm-list li:last-child { border-bottom: 0; }
.ms-confirm-q { margin: 14px 0 0; font-weight: 700; }

/* ============================================================
   إدارة العمليات + كارت الصنف + تقرير الحركة
   ============================================================ */

/* شارة نوع العملية (إدخال / صرف) */
.ms-type {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 12px;
    font-weight: 700;
    padding: 4px 10px;
    border-radius: 999px;
    white-space: nowrap;
}

.ms-type-in  { background: var(--ms-success-soft); color: var(--ms-success); }
.ms-type-out { background: var(--ms-danger-soft);  color: var(--ms-danger); }

/* ترويسة تفاصيل العملية */
.ms-op-hero {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 16px;
    border-radius: 16px;
    background: var(--ms-surface);
    border: 1px solid var(--ms-border);
    margin-bottom: 12px;
}

.ms-op-hero-icon {
    flex: 0 0 auto;
    width: 44px;
    height: 44px;
    border-radius: 13px;
    display: grid;
    place-items: center;
    font-size: 21px;
}

.ms-op-hero-icon.is-in  { background: var(--ms-success-soft); color: var(--ms-success); }
.ms-op-hero-icon.is-out { background: var(--ms-danger-soft);  color: var(--ms-danger); }

.ms-op-hero-body { min-width: 0; flex: 1 1 auto; }
.ms-op-hero-ref  { font-size: 15px; font-weight: 700; overflow-wrap: anywhere; }
.ms-op-hero-meta { font-size: 12.5px; color: var(--ms-muted); margin-top: 4px; display: flex; flex-wrap: wrap; gap: 4px 12px; }

/* قائمة مفتاح/قيمة داخل بطاقة */
.ms-kv { margin: 0; padding: 0; list-style: none; }
.ms-kv li {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
    padding: 9px 0;
    border-bottom: 1px dashed var(--ms-border);
    font-size: 13.5px;
}
.ms-kv li:last-child { border-bottom: 0; }
.ms-kv .ms-kv-key { color: var(--ms-muted); flex: 0 0 auto; }
.ms-kv .ms-kv-val { font-weight: 600; text-align: left; overflow-wrap: anywhere; }

/* جدول الرصيد الجاري */
.ms-balance-cell { font-weight: 700; white-space: nowrap; }
.ms-qty-in  { color: var(--ms-success); font-weight: 700; }
.ms-qty-out { color: var(--ms-danger);  font-weight: 700; }

.ms-ledger-open td {
    background: var(--ms-surface-2);
    font-weight: 700;
    font-size: 13px;
}

/* سجل التعديلات والحذف */
.ms-history { margin: 0; padding: 0; list-style: none; }
.ms-history li {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    padding: 10px 0;
    border-bottom: 1px dashed var(--ms-border);
    font-size: 13px;
}
.ms-history li:last-child { border-bottom: 0; }
.ms-history-icon { flex: 0 0 auto; font-size: 16px; margin-top: 1px; }
.ms-history-text { min-width: 0; }
.ms-history-meta { display: block; color: var(--ms-muted); font-size: 11.5px; margin-top: 2px; }

/* روابط صفوف التقارير */
.ms-row-link { color: inherit; text-decoration: none; display: block; }
.ms-row-link:hover, .ms-row-link:focus { color: inherit; text-decoration: none; }
.ms-op-list .ms-op.is-clickable { cursor: pointer; }
.ms-op-list .ms-op.is-clickable:hover { background: var(--ms-surface-2); }

/* ملخص أرقام تقرير الحركة */
.ms-summary-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
    margin-bottom: 12px;
}
.ms-summary-cell {
    background: var(--ms-surface);
    border: 1px solid var(--ms-border);
    border-radius: 14px;
    padding: 10px 12px;
    text-align: center;
}
.ms-summary-cell .ms-summary-value { display: block; font-size: 17px; font-weight: 700; }
.ms-summary-cell .ms-summary-label { display: block; font-size: 11.5px; color: var(--ms-muted); margin-top: 2px; }
.ms-summary-cell.is-in  .ms-summary-value { color: var(--ms-success); }
.ms-summary-cell.is-out .ms-summary-value { color: var(--ms-danger); }

/* ---------- شاشات أكبر ---------- */
@media (min-width: 576px) {
    .ms-container { padding: 20px 8px 8px; }
}

@media (min-width: 768px) {
    body.ms-body { font-size: 15px; }
    .ms-page-title { font-size: 23px; }
    .ms-row { padding: 14px 18px; }
}

@media (prefers-reduced-motion: reduce) {
    * { transition: none !important; animation: none !important; }
}

/* ---------- روابط العمليات في القوائم ---------- */
.ms-op-ref {
    font-size: 11px;
    font-weight: 700;
    color: var(--ms-primary);
    background: var(--ms-primary-soft);
    border-radius: 6px;
    padding: 1px 6px;
    direction: ltr;
    unicode-bidi: embed;
}

.ms-op-list .ms-op.is-clickable { border-radius: 10px; padding-inline: 6px; }

.ms-op-list .ms-row-link:focus-visible {
    outline: 2px solid var(--ms-primary);
    outline-offset: 2px;
    border-radius: 8px;
}

/* بطاقة كارت الصنف — صف رصيد بداية الصفحة */
.ms-ledger-open td {
    background: var(--ms-surface-2);
    font-size: 12.5px;
    font-weight: 600;
}

/* ---------- الوضع الليلي ---------- */
body.ms-dark .ms-summary-cell { background: var(--ms-surface); }
body.ms-dark .ms-op-ref { background: rgba(37, 99, 235, .22); }

/* ---------- مجموعة روابط داخل ترويسة البطاقة ---------- */
.ms-card-links {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 4px 10px;
    flex: 0 0 auto;
}