/* ========== ثيم Tailwind + عصري ========== */
.tw-content {
    font-family: "Plus Jakarta Sans", "Tajawal", "Inter", system-ui, sans-serif;
}

/* بطاقة صفحة - استخدم Class="tw-page-card" على MudPaper/البطاقات */
.tw-page-card {
    border-radius: 16px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: #fff;
    padding: 1rem 1.5rem;
    box-shadow: 0 2px 8px -2px rgba(0,0,0,0.06), 0 4px 12px -4px rgba(0,0,0,0.04);
}
@media (min-width: 640px) {
    .tw-page-card { padding: 1.5rem 2rem; }
}

.tw-page-title {
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--ynex-primary);
    margin-bottom: 0.25rem;
}

.tw-page-description {
    font-size: 0.875rem;
    color: #64748b;
}

/* تطبيق ثيم Tailwind على كل المكونات داخل المحتوى */
.tw-content .mud-paper,
.tw-content .mud-card {
    border-radius: var(--ynex-radius-lg);
    border: 1px solid rgba(15, 23, 42, 0.06);
    box-shadow: var(--ynex-shadow);
}
.tw-content .mud-table-container {
    border-radius: var(--ynex-radius);
    overflow: hidden;
}
.tw-content .mud-expansion-panels .mud-paper {
    border-radius: var(--ynex-radius);
}
.tw-content .mud-button-root {
    border-radius: var(--ynex-radius-sm);
    font-weight: 600;
}

:root {
    --ynex-appbar-bg: #ffffff;
    --ynex-appbar-border: rgba(15, 23, 42, 0.06);
    --ynex-content-bg: #f1f5f9;
    --ynex-drawer-bg: #ffffff;
    --ynex-drawer-border: rgba(15, 23, 42, 0.06);
    --ynex-primary: #5B21B6;
    --ynex-primary-rgb: 91, 33, 182;
    --ynex-secondary-rgb: 8, 145, 178;
    --ynex-radius: 12px;
    --ynex-radius-sm: 10px;
    --ynex-radius-lg: 16px;
    --ynex-shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.04);
    --ynex-shadow: 0 2px 8px -2px rgba(0, 0, 0, 0.06), 0 4px 12px -4px rgba(0, 0, 0, 0.04);
    --ynex-shadow-md: 0 4px 12px -2px rgba(0, 0, 0, 0.06), 0 8px 24px -4px rgba(0, 0, 0, 0.04);
}

/* ========== الظلال الناعمة للمكونات (بدل إزالتها بالكامل) ========== */
.mud-elevation-1 { box-shadow: var(--ynex-shadow-sm) !important; }
.mud-elevation-2 { box-shadow: var(--ynex-shadow) !important; }
.mud-elevation-3, .mud-elevation-4 { box-shadow: var(--ynex-shadow-md) !important; }
.mud-elevation-5, .mud-elevation-6, .mud-elevation-7, .mud-elevation-8, .mud-elevation-9, .mud-elevation-10,
.mud-elevation-11, .mud-elevation-12, .mud-elevation-13, .mud-elevation-14, .mud-elevation-15,
.mud-elevation-16, .mud-elevation-17, .mud-elevation-18, .mud-elevation-19, .mud-elevation-20,
.mud-elevation-21, .mud-elevation-22, .mud-elevation-23, .mud-elevation-24, .mud-elevation-25 {
    box-shadow: var(--ynex-shadow-md) !important;
}

.ynex-layout .mud-main-content {
    background-color: var(--ynex-content-bg);
}

/* ========== الشريط العلوي ========== */
.ynex-appbar {
    height: 64px;
    background-color: var(--ynex-appbar-bg) !important;
    border-bottom: 1px solid var(--ynex-appbar-border);
    backdrop-filter: blur(8px);
}

.ynex-appbar .mud-toolbar {
    min-height: 64px;
    padding: 0 20px;
    gap: 10px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    direction: inherit;
}

.ynex-layout.rtl .ynex-appbar .mud-toolbar {
    flex-direction: row-reverse;
    justify-content: flex-end;
    direction: rtl;
}

.ynex-layout.ltr .ynex-appbar .mud-toolbar {
    flex-direction: row;
    justify-content: flex-end;
    direction: ltr;
}

.ynex-appbar-menu {
    margin-inline-end: 6px;
}

.ynex-brand-title {
    font-weight: 600;
    letter-spacing: -0.01em;
}

.ynex-appbar-left,
.ynex-appbar-right {
    display: flex;
    align-items: center;
    gap: 10px;
}

.ynex-appbar-right,
.ynex-appbar-left {
    order: 0;
}

.ynex-user-menu .mud-avatar {
    border: 2px solid rgba(var(--ynex-primary-rgb), 0.15);
}

/* ========== القائمة الجانبية ========== */
.ynex-drawer {
    background-color: var(--ynex-drawer-bg);
    border-inline-start: 1px solid var(--ynex-drawer-border);
}

.ynex-nav {
    padding: 16px 0 24px;
}

.ynex-nav-menu .mud-nav-link {
    border-radius: var(--ynex-radius-sm);
    margin: 4px 12px;
    min-height: 44px;
    padding-inline: 14px;
    transition: background-color 0.2s ease, color 0.2s ease;
}

.ynex-nav-menu .mud-nav-link .mud-nav-link-text {
    font-weight: 500;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ynex-nav-menu .mud-nav-link:hover:not(.mud-nav-link-disabled) {
    color: var(--ynex-primary);
    background-color: rgba(var(--ynex-primary-rgb), 0.08);
}

.ynex-nav-menu .mud-nav-link.active:not(.mud-nav-link-disabled) {
    color: var(--ynex-primary);
    background-color: rgba(var(--ynex-primary-rgb), 0.12);
    font-weight: 600;
}

.ynex-nav-menu .mud-nav-group > .mud-nav-link > .mud-nav-link-text {
    letter-spacing: 0.02em;
    font-weight: 600;
}

/* ========== المحتوى والعناوين ========== */
.ynex-main {
    padding-top: clamp(64px, 6vh, 88px);
}

.ynex-content-container {
    padding: 20px 24px 32px;
    max-width: 100%;
    box-sizing: border-box;
}

@media (min-width: 960px) {
    .ynex-content-container {
        padding: 24px 28px 40px;
    }
}

.hero-title-block {
    width: 100%;
    margin-bottom: 1.5rem;
}

.hero-title-text {
    display: block;
    font-weight: 600;
    line-height: 1.3;
}

.hero-title-block .mud-text:last-child {
    margin-bottom: 0;
}

.ynex-layout.ltr .hero-title-block {
    text-align: left;
}

.ynex-layout.rtl .hero-title-block {
    text-align: right;
}

/* ========== البطاقات والأوراق والنوافذ ========== */
.mud-paper,
.mud-dialog,
.mud-card {
    border-radius: var(--ynex-radius-lg);
    border: 1px solid rgba(15, 23, 42, 0.06);
    transition: box-shadow 0.2s ease, border-color 0.2s ease;
}

.mud-paper:hover,
.mud-card:hover {
    border-color: rgba(var(--ynex-primary-rgb), 0.12);
}

.mud-dialog {
    padding: 6px;
    border-radius: var(--ynex-radius-lg);
}

.mud-card-header {
    padding-bottom: 0;
}

/* ========== الجداول ========== */
.mud-table {
    border-radius: var(--ynex-radius);
    overflow: hidden;
    border: 1px solid rgba(var(--ynex-primary-rgb), 0.08);
}

.mud-table thead th {
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    padding: 14px 18px;
    white-space: nowrap;
    background-color: rgba(var(--ynex-primary-rgb), 0.05);
    color: rgba(15, 23, 42, 0.7);
}

.mud-table tbody td {
    font-size: 0.9375rem;
    padding: 14px 18px;
    vertical-align: middle;
}

.mud-table tbody tr {
    transition: background-color 0.15s ease;
}

.mud-table tbody tr:hover {
    background-color: rgba(var(--ynex-primary-rgb), 0.04);
}

.ynex-layout.rtl .mud-table thead th,
.ynex-layout.rtl .mud-table tbody td {
    text-align: right;
}

.ynex-layout.rtl .mud-table thead th:first-child,
.ynex-layout.rtl .mud-table tbody td:first-child {
    text-align: right;
}

.ynex-layout.ltr .mud-table thead th,
.ynex-layout.ltr .mud-table tbody td {
    text-align: left;
}

/* ========== الحقول والنماذج ========== */
.mud-input-control,
.mud-select,
.mud-text-field {
    border-radius: var(--ynex-radius-sm);
    background-color: var(--mud-palette-surface);
}

.mud-input.mud-input-outlined .mud-input-outlined-border {
    border-width: 1px;
    border-radius: var(--ynex-radius-sm);
    border-color: rgba(15, 23, 42, 0.12);
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.mud-input.mud-input-outlined:hover .mud-input-outlined-border {
    border-color: rgba(var(--ynex-primary-rgb), 0.25);
}

.mud-input.mud-input-outlined.mud-input-focused .mud-input-outlined-border {
    border-width: 2px;
    border-color: var(--mud-palette-primary);
    box-shadow: 0 0 0 3px rgba(var(--ynex-primary-rgb), 0.12);
}

/* ========== الأزرار ========== */
.mud-button-root {
    border-radius: var(--ynex-radius-sm);
    text-transform: none;
    font-weight: 600;
    letter-spacing: 0.02em;
    transition: background-color 0.2s ease, border-color 0.2s ease, transform 0.15s ease;
}

.mud-button-root:active {
    transform: scale(0.98);
}

.mud-button-outlined {
    border-width: 1.5px;
}

.mud-button-filled-primary,
.mud-button-filled-secondary,
.mud-button-filled-info {
    box-shadow: var(--ynex-shadow-sm);
}

.mud-button-filled-primary:hover,
.mud-button-filled-secondary:hover,
.mud-button-filled-info:hover {
    box-shadow: var(--ynex-shadow);
}

/* ========== الثيم الداكن ========== */
.mud-theme-dark {
    --ynex-content-bg: #0f172a;
    --ynex-appbar-bg: #0f172a;
    --ynex-appbar-border: rgba(226, 232, 240, 0.08);
    --ynex-drawer-bg: #0f172a;
    --ynex-drawer-border: rgba(226, 232, 240, 0.08);
    --ynex-shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.2);
    --ynex-shadow: 0 2px 8px -2px rgba(0, 0, 0, 0.25);
    --ynex-shadow-md: 0 4px 12px -2px rgba(0, 0, 0, 0.3);
}

.mud-theme-dark .mud-paper,
.mud-theme-dark .mud-card {
    border-color: rgba(226, 232, 240, 0.08);
}

.mud-theme-dark .mud-table thead th {
    background-color: rgba(167, 139, 250, 0.08);
    color: rgba(226, 232, 240, 0.8);
}

/* ========== التبويبات ========== */
.mud-tabs-toolbar {
    border-radius: var(--ynex-radius);
    padding: 6px;
    background-color: rgba(var(--ynex-primary-rgb), 0.04);
    border: 1px solid rgba(var(--ynex-primary-rgb), 0.08);
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.mud-tabs-toolbar .mud-tabs-toolbar-content {
    flex-wrap: nowrap;
    justify-content: flex-start;
    padding-inline: 16px;
    box-sizing: border-box;
}

.mud-tab {
    max-width: none;
    min-width: max-content;
    border-radius: 10px;
    padding-inline: 12px;
    flex-shrink: 0;
}

.mud-tab .mud-tab-label {
    white-space: nowrap;
    text-overflow: unset;
    overflow: visible;
    font-weight: 500;
}

.ynex-layout.rtl .mud-tabs-toolbar {
    direction: rtl;
}

.ynex-layout.ltr .mud-tabs-toolbar {
    direction: ltr;
}

/* تبويبات الصلاحيات: مساحة كافية للعنوان والشارة (Badge) */
.role-permissions-tab.mud-tab {
    padding-inline-end: 48px;
}

/* ========== الرقائق (Chips) ========== */
.mud-chip {
    border-radius: 999px;
    background-color: rgba(var(--ynex-secondary-rgb), 0.1);
    color: var(--mud-palette-text-primary);
    font-weight: 500;
    border: 1px solid rgba(var(--ynex-secondary-rgb), 0.2);
}

/* ========== الإشعارات (Snackbar) ========== */
.mud-snackbar {
    border-radius: var(--ynex-radius);
    box-shadow: var(--ynex-shadow-md);
}

/* ========== القوائم والمنيو ========== */
.mud-menu .mud-paper {
    border-radius: var(--ynex-radius-sm);
    box-shadow: var(--ynex-shadow-md);
}

.mud-list-item {
    border-radius: 8px;
    margin: 2px 6px;
}

.mud-list-item:hover {
    background-color: rgba(var(--ynex-primary-rgb), 0.06);
}

/* ========== أزرار الإجراءات في النماذج ========== */
.add-edit-actions {
    position: sticky;
    bottom: 0;
    background-color: var(--mud-palette-surface);
    padding: 14px 12px;
    border-top: 1px solid rgba(15, 23, 42, 0.06);
    z-index: 5;
    border-radius: 0 0 var(--ynex-radius-lg) var(--ynex-radius-lg);
}