:root{
    --primary-700:#2a5298; --primary-800:#1e3c72; --primary-900:#0f2b5a;
    --surface:#ffffff; --text:#1f2937; --muted:#6b7280;
    --ring: rgba(42,82,152,0.35); --shadow: 0 10px 25px rgba(0,0,0,0.15);
}

/* پس‌زمینه و پایه‌ها */
body{ background: linear-gradient(135deg, var(--primary-800), var(--primary-700));
    font-family:"IRANSans",sans-serif; direction:rtl; }

/* ظرف استاندارد صفحات */
.app-wrapper, .users-wrapper, .courses-wrapper, .classes-wrapper, .modules-wrapper{
    max-width:1100px; margin:32px auto; padding:12px;
}

/* هدر صفحه (با لوگو و عنوان) */
.page-header{
    background:var(--surface); border-radius:20px; box-shadow:var(--shadow);
    padding:22px; margin-bottom:16px; display:flex; align-items:center; gap:16px; flex-wrap:wrap;
}
.page-header .brand{ display:flex; align-items:center; gap:14px; }
.page-header .brand img{ width:64px; height:64px; border-radius:50%; box-shadow:0 6px 16px rgba(0,0,0,0.15); }
.page-header .titles h1{ font-size:20px; color:var(--primary-900); margin:0 0 4px; }
.page-header .titles p{ margin:0; color:var(--muted); font-size:13px; }
.stats{ margin-right:auto; }
.stat-pill{ display:inline-block; background:#f1f5f9; color:#334155; padding:8px 12px; border-radius:999px; font-size:12px; border:1px solid #e5e7eb; }

/* جستجو و فیلتر */
.tools, .tools-bar{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin:12px 0 18px; }
.tools-form{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-left:auto; }
.search-box{ position:relative; min-width:240px; }
.search-box input{
    width:100%; background:#f8fafc; border:1px solid #e5e7eb; border-radius:12px;
    padding:10px 40px 10px 12px; outline:none; transition: box-shadow .25s, border-color .25s;
}
.search-box input:focus{ border-color:var(--primary-700); box-shadow:0 0 0 4px var(--ring); }
.search-box i{ position:absolute; right:12px; top:50%; transform:translateY(-50%); color:#94a3b8; }
.filter{
    display:flex; align-items:center; gap:8px; background:#f8fafc; border:1px solid #e5e7eb;
    border-radius:12px; padding:6px 10px;
}
.filter label{ color:#334155; font-size:12px; }
.filter select{ background:transparent; border:none; outline:none; color:#334155; font-size:13px; }

/* دکمه‌های یکدست */
.btnx{
    display:inline-flex; align-items:center; gap:8px; padding:10px 14px; border-radius:12px;
    text-decoration:none; font-size:14px; border:1px solid transparent; box-shadow:var(--shadow);
    transition: transform .2s, box-shadow .2s, background .2s, border-color .2s;
    color:#fff; cursor:pointer;
}
.btnx i{ font-size:14px; }
.btnx:hover{ transform: translateY(-2px); box-shadow:0 16px 28px rgba(0,0,0,0.22); }
.btnx:active{ transform: translateY(0); }
.btnx-sm{ padding:8px 10px; border-radius:10px; font-size:12px; }
.btnx.outline{ background:#fff; color:#475569; border-color:#e5e7eb; }
.btnx.outline:hover{ background:#f8fafc; }
.btnx-primary{ background:var(--primary-700); } .btnx-primary:hover{ background:var(--primary-800); }
.btnx-success{ background:#16a34a; } .btnx-success:hover{ background:#15803d; }
.btnx-info{ background:#0ea5e9; } .btnx-info:hover{ background:#0284c7; }
.btnx-warning{ background:#f59e0b; } .btnx-warning:hover{ background:#d97706; }
.btnx-danger{ background:#ef4444; } .btnx-danger:hover{ background:#dc2626; }
.btnx-secondary{ background:#9ca3af; } .btnx-secondary:hover{ background:#6b7280; }

/* کارت + جدول استاندارد */
.table-card{
    background:var(--surface); border-radius:20px; box-shadow:var(--shadow);
    border:1px solid #e5e7eb; overflow:hidden;
}
.table-responsive{ width:100%; overflow-x:auto; }
.tbl{ width:100%; border-collapse:separate; border-spacing:0; }
.tbl thead th{
    background:#f1f5f9; color:#334155; font-weight:700; text-align:right;
    padding:14px 16px; border-bottom:1px solid #e5e7eb; font-size:13px;
}
.tbl tbody td{
    background:#fff; padding:14px 16px; border-bottom:1px solid #f1f5f9; vertical-align:middle; font-size:14px;
}
.tbl tbody tr:hover td{ background:#f8fafc; }
.th-actions{ width:360px; }
.actions-cell{ display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
.pagination-wrap{ padding:12px 16px; background:#fff; border-top:1px solid #e5e7eb; }

/* اجزای مشترک کوچک */
.title-cell{ display:flex; align-items:center; gap:10px; }
.title-icon{
    font-size:18px; background:linear-gradient(135deg,#0051ff,#000c4d);
    -webkit-background-clip:text; -webkit-text-fill-color:transparent;
}
.title{ font-weight:700; color:#1f2937; }
.subtitle{ font-size:11px; color:#94a3b8; }
.code{ background:#f8fafc; padding:2px 6px; border-radius:6px; border:1px solid #e5e7eb; }

.badge{
    display:inline-flex; align-items:center; gap:6px; font-size:11px; padding:4px 8px; border-radius:999px;
    border:1px solid #e5e7eb; color:#475569; background:#f8fafc;
}
.badge-success{ color:#065f46; background:#ecfdf5; border-color:#a7f3d0; }
.badge-muted{ color:#6b7280; background:#f3f4f6; border-color:#e5e7eb; }

.chip{
    display:inline-flex; align-items:center; gap:6px; font-size:11px; padding:4px 8px;
    border-radius:999px; border:1px solid transparent;
}
.chip-info{ background:#e0f2fe; color:#075985; border-color:#bae6fd; }
.chip-warning{ background:#fff7ed; color:#9a3412; border-color:#fed7aa; }
.chip-muted{ background:#f1f5f9; color:#475569; border-color:#e5e7eb; }

/* حالت خالی استاندارد */
.empty-state{
    background:var(--surface); border-radius:20px; box-shadow:var(--shadow);
    padding:40px 24px; text-align:center; color:#334155;
}
.empty-state .emoji{ font-size:44px; margin-bottom:10px; }
.empty-state h3{ margin:8px 0; }
.empty-state p{ color:#64748b; margin:0 0 14px; }
.empty-actions{ display:flex; gap:8px; justify-content:center; flex-wrap:wrap; }

/* صفحه ماژول‌ها */
.ModuleTitle{ display:flex !important; align-items:center; gap:.75rem; margin-top:18px; margin-bottom:10px; }
.ModuleTitle > hr{ flex-grow:1; border:none; height:1px; background:linear-gradient(90deg,rgba(255,255,255,.0),rgba(255,255,255,.45)); }
.category-title{
    background:var(--surface); border-radius:12px; padding:8px 12px; color:#64748b; font-size:13px; box-shadow:var(--shadow);
}
.module-grid{ display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:14px; }
@media (max-width:1200px){ .module-grid{ grid-template-columns:repeat(5,1fr);} }
@media (max-width:992px){ .module-grid{ grid-template-columns:repeat(4,1fr);} }
@media (max-width:768px){ .module-grid{ grid-template-columns:repeat(3,1fr);} }
@media (max-width:520px){ .module-grid{ grid-template-columns:repeat(2,1fr);} }

.module-item{
    background:var(--surface); border-radius:16px; box-shadow:var(--shadow); border:1px solid #e5e7eb;
    text-decoration:none; color:var(--text); min-height:120px;
    display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px;
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
    position:relative; overflow:hidden;
}
.module-item:hover{ transform:translateY(-6px); box-shadow:0 18px 35px rgba(0,0,0,0.25); border-color:#d1d5db; }
.module-item.active{ border-color:var(--primary-700); box-shadow:0 0 0 4px var(--ring), var(--shadow); }
.module-icon{ padding-top:4px; }
.icon-purple-blue{
    background:linear-gradient(135deg,#0051ff,#000c4d);
    -webkit-background-clip:text; -webkit-text-fill-color:transparent;
    font-size:32px;
}
.module-name{ font-size:12px; color:#374151; text-align:center; padding:0 8px; line-height:1.6; }
.module-item .chip{ position:absolute; left:8px; bottom:8px; background:#f1f5f9; color:#475569; font-size:10px; }
/* Pagination */
.pagination-wrap{ overflow-x:auto; padding:6px 0; }
.pagination{
    display:flex; gap:6px; align-items:center; justify-content:center; flex-wrap:wrap;
    padding:6px;
}
.page-link{
    border:1px solid #e5e7eb; background:#fff; border-radius:10px;
    padding:8px 12px; color:#334155; box-shadow:var(--shadow);
    transition:transform .15s, box-shadow .15s, background .15s, border-color .15s;
}
.page-link:hover{ transform:translateY(-1px); box-shadow:0 10px 20px rgba(0,0,0,.18); text-decoration:none; }
.page-item.active .page-link{
    background:var(--primary-700); color:#fff; border-color:var(--primary-700);
    box-shadow:0 0 0 4px var(--ring), var(--shadow);
}
.page-item.disabled .page-link{ background:#f8fafc; color:#94a3b8; opacity:.8; }
/* Forms */
.formx{ padding:20px; }
.formx-grid{
    display:grid; gap:14px;
    grid-template-columns: repeat(2, minmax(0,1fr));
}
.formx-field{ display:flex; flex-direction:column; gap:6px; }
.formx-span-2{ grid-column: span 2 / span 2; }
.labelx{ font-size:13px; color:#334155; }
.inputx, .selectx, .textareax{
    background:#f8fafc; border:1px solid #e5e7eb; border-radius:12px; padding:10px 12px; font-size:14px;
    outline:none; transition: box-shadow .25s, border-color .25s;
}
.inputx:focus, .selectx:focus, .textareax:focus{ border-color:var(--primary-700); box-shadow:0 0 0 4px var(--ring); }
.inputx.ltr{ direction:ltr; text-align:left; }
.invalid-msg{ color:#dc2626; font-size:12px; }
.formx-actions{ display:flex; justify-content:flex-end; gap:8px; padding:12px 0 4px; }

@media (max-width: 640px){
    .formx-grid{ grid-template-columns: 1fr; }
    .formx-span-2{ grid-column: auto; }
}
.row-live td{ border:2px solid #85ffb0; }
/* شبکه و فاصله‌ها */
.grid-2{ display:grid; grid-template-columns: 1fr 1fr; gap:16px; }
.gap-16{ gap:16px; }
@media (max-width: 900px){ .grid-2{ grid-template-columns: 1fr; } }

/* کارت داخلی */
.card-pad{ padding:16px; }

/* تیترهای کوچک */
.h6{ font-size:16px; color:#1f2937; }
.h6.tight{ margin:0; }

/* پروفایل */
.profile-row{ display:grid; grid-template-columns: 120px 1fr; gap:16px; align-items:start; }
.avatar-wrap{ display:flex; align-items:center; justify-content:center; }
.avatar-lg{ width:96px; height:96px; border-radius:50%; object-fit:cover; box-shadow:0 8px 18px rgba(0,0,0,.18); }
.avatar-fallback{ width:96px; height:96px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:28px; font-weight:700; color:#fff;
    background:linear-gradient(135deg,#0051ff,#000c4d); box-shadow:0 8px 18px rgba(0,0,0,.18); }
.info-wrap{ display:flex; flex-direction:column; gap:10px; }

/* لیست مشخصات */
.dl{ margin:0; }
.dl-row{ display:grid; grid-template-columns: 140px 1fr; align-items:center; padding:8px 0; border-bottom:1px dashed #e5e7eb; }
.dl-row:last-child{ border-bottom:none; }
.dl-row dt{ color:#64748b; font-size:13px; }
.dl-row dd{ margin:0; color:#111827; display:flex; align-items:center; gap:8px; }
.ltr{ direction:ltr; text-align:left; }

/* دکمه‌ها کنار هم */
.btn-row{ display:flex; gap:8px; flex-wrap:wrap; }

/* نقش‌ها */
.roles{ margin-top:12px; }
.chips{ display:flex; flex-wrap:wrap; gap:8px; }
.current-pill{ background:#fff; color:#0369a1; border:1px solid #bae6fd; padding:1px 6px; border-radius:999px; margin-right:6px; }

/* فرم جمع‌وجور */
.formx.compact .formx-grid.one{ display:grid; grid-template-columns: 1fr; gap:12px; }
.formx-actions.end{ display:flex; justify-content:flex-end; }

/* پیام‌ها */
.alertx{ display:flex; align-items:center; gap:8px; background:#f8fafc; border:1px solid #e5e7eb; color:#334155; padding:10px 12px; border-radius:12px; margin-bottom:12px; box-shadow:var(--shadow); }
.alertx-success{ background:#ecfdf5; border-color:#a7f3d0; color:#065f46; }
.alertx-danger{ background:#fef2f2; border-color:#fecaca; color:#991b1b; }

/* ریسپانسیو موبایل */
@media (max-width: 640px){
    .profile-row{ grid-template-columns: 1fr; }
    .avatar-wrap{ justify-content:center; }
    .dl-row{ grid-template-columns: 1fr; gap:6px; }
}
/* ورودی با دکمهٔ نمایش/مخفی‌سازی */
.inputx-wrap{ position:relative; }
.inputx-wrap .peek{
    position:absolute; left:8px; top:50%; transform:translateY(-50%);
    border:none; background:transparent; cursor:pointer; color:#94a3b8; padding:4px;
}
.inputx-wrap .peek:hover{ color:#64748b; }

/* نوار قدرت رمز */
.pw-meter{ margin-top:8px; background:#f1f5f9; border:1px solid #e5e7eb; border-radius:10px; height:10px; position:relative; }
.pw-bar{ height:100%; width:0%; border-radius:10px; transition: width .25s; }
.pw-bar.s1{ background:#ef4444; }
.pw-bar.s2{ background:#f59e0b; }
.pw-bar.s3{ background:#eab308; }
.pw-bar.s4{ background:#10b981; }
.pw-bar.s5{ background:#22c55e; }
.pw-label{ display:inline-block; margin-top:6px; font-size:12px; color:#64748b; }
/* Option rows in forms */
.formx-stack{ display:flex; flex-direction:column; gap:10px; }
.option-row{ display:flex; gap:8px; align-items:center; }
.option-row .inputx{ flex:1; }
/* Poll results */
.poll-results{ padding:16px; display:flex; flex-direction:column; gap:14px; }
.result-row{
    background:#fff; border:1px solid #e5e7eb; border-radius:14px;
    padding:12px; box-shadow:var(--shadow);
}
.result-row.result-note{ background:#f8fafc; }
.result-top{ display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:8px; }
.result-title{ color:#1f2937; font-weight:700; }
.result-meta{ color:#64748b; font-size:12px; display:flex; align-items:center; gap:8px; }
.result-meta .sep{ opacity:.6; }

/* Progress bar */
.progressx{
    width:100%; height:10px; border-radius:999px; background:#f1f5f9;
    border:1px solid #e5e7eb; overflow:hidden;
}
.progressx-bar{
    height:100%; width:0%;
    background: linear-gradient(135deg, var(--primary-700), var(--primary-900));
    transition: width .5s ease;
}
/* Chat */
.chat-card{ display:flex; flex-direction:column; }
.chat-box{
    height: 420px; overflow-y:auto; padding: 16px;
    background: #f8fafc;
    border-bottom: 1px solid #e5e7eb;
}
.msg{ max-width: 78%; margin: 8px 0; display:flex; flex-direction:column; gap:6px; }
.msg .meta{ font-size: 11px; color:#64748b; padding: 0 6px; }
.msg .bubble{
    background:#fff; border:1px solid #e5e7eb; border-radius:16px; padding:10px 12px;
    box-shadow: var(--shadow);
}
.msg.me{ margin-left:auto; align-items:flex-end; }
.msg.me .bubble{
    background: linear-gradient(135deg, var(--primary-700), var(--primary-800));
    color:#fff; border-color: transparent;
}
.msg .bubble-image img{ max-width:220px; max-height:220px; border-radius:12px; display:block; }
.msg .bubble-file{ margin-top:8px; }
.msg .bubble-text{ white-space: pre-wrap; line-height:1.8; }
.msg .msg-actions{ display:flex; gap:6px; margin-top:6px; }
.audio-message{ color:#1d4ed8; cursor:pointer; text-decoration:underline; }

.chat-composer{ padding: 12px; background:#fff; }
.composer-form{ display:flex; flex-direction:column; gap:10px; }
.chat-input{ min-height: 72px; resize: vertical; }
.composer-actions{ display:flex; gap:8px; flex-wrap:wrap; align-items:center; }
.file-btn{ position:relative; overflow:hidden; }
