/*
  Curriculum module theme
  ------------------------
  این فایل مستقیماً از بخش <style> فایل curriculum.html استخراج شده تا ظاهر
  ماژول کاملاً منطبق با نسخه‌ی HTML باقی بماند. متغیرهای ریشه (:root) و حالت
  تاریک (data-theme="dark") سراسری هستند و بهتر است در سطح کل اپلیکیشن
  Faradanesh (نه فقط این ماژول) لینک شوند تا وقتی صفحات دیگر هم به Blazor
  تبدیل شدند، همه از یک پالت رنگی مشترک استفاده کنند.

  نحوه‌ی اتصال:
  در wwwroot/index.html (Blazor WASM) یا Pages/_Host.cshtml/_Layout.cshtml
  (Blazor Server) این خط را داخل <head> اضافه کنید:
  <link rel="stylesheet" href="_content/Faradanesh/css/curriculum-theme.css" />
  (در صورت قرار گرفتن ماژول به‌عنوان RCL جدا؛ اگر داخل همان پروژه‌ی اصلی است
  مسیر را به css/curriculum-theme.css در wwwroot اصلی کپی/لینک کنید.)
*/

:root {
  --c-bg: #f5f5f3;
  --c-surface: #ffffff;
  --c-surface-2: #fafaf8;
  --c-border: rgba(0,0,0,0.08);
  --c-border-strong: rgba(0,0,0,0.14);
  --c-text: #1a1a18;
  --c-text-2: #5a5a56;
  --c-text-3: #9a9994;
  --c-accent: #2563eb;
  --c-accent-bg: #eff6ff;
  --c-accent-text: #1d4ed8;
  --c-accent-border: #bfdbfe;
  --c-success: #16a34a;
  --c-success-bg: #f0fdf4;
  --c-success-text: #15803d;
  --c-success-border: #bbf7d0;
  --c-warning: #d97706;
  --c-warning-bg: #fffbeb;
  --c-warning-text: #b45309;
  --c-warning-border: #fde68a;
  --c-danger: #dc2626;
  --c-danger-bg: #fef2f2;
  --c-danger-text: #b91c1c;
  --c-danger-border: #fecaca;
  --c-purple: #7c3aed;
  --c-purple-bg: #f5f3ff;
  --c-purple-text: #6d28d9;
  --radius-sm: 6px;
  --radius: 10px;
  --radius-lg: 14px;
  --transition: 0.15s ease;
}

[data-theme="dark"] {
  --c-bg: #15161a;
  --c-surface: #1c1d22;
  --c-surface-2: #202127;
  --c-border: rgba(255,255,255,0.08);
  --c-border-strong: rgba(255,255,255,0.14);
  --c-text: #f1f1ef;
  --c-text-2: #b3b3ad;
  --c-text-3: #76766f;
  --c-accent-bg: rgba(37,99,235,0.14);
  --c-success-bg: rgba(22,163,74,0.14);
  --c-warning-bg: rgba(217,119,6,0.14);
  --c-danger-bg: rgba(220,38,38,0.14);
  --c-purple-bg: rgba(124,58,237,0.16);
}

.curriculum-module { font-family: 'Vazirmatn', system-ui, sans-serif; font-size: 13px; color: var(--c-text); }
.curriculum-module * { box-sizing: border-box; }

/* Buttons */
.curriculum-module .btn {
  display: inline-flex; align-items: center; gap: 6px;
  height: 34px; padding: 0 14px;
  border: 1px solid var(--c-border-strong);
  border-radius: var(--radius-sm);
  background: var(--c-surface);
  color: var(--c-text);
  font-size: 12.5px; font-family: inherit; cursor: pointer;
  transition: background var(--transition);
}
.curriculum-module .btn:hover { background: var(--c-bg); }
.curriculum-module .btn i { font-size: 14px; }
.curriculum-module .btn-primary { background: var(--c-accent); border-color: var(--c-accent); color: #fff; }
.curriculum-module .btn-primary:hover { background: #1d4ed8; border-color: #1d4ed8; }

/* Page header */
.curriculum-module .page-title { font-size: 20px; font-weight: 600; letter-spacing: -0.02em; }
.curriculum-module .page-desc { font-size: 13px; color: var(--c-text-3); margin-top: 3px; }

/* Card */
.curriculum-module .card { background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius-lg); overflow: hidden; }
.curriculum-module .card-head { display: flex; align-items: center; justify-content: space-between; padding: 14px 16px; border-bottom: 1px solid var(--c-border); }
.curriculum-module .card-title { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 600; }
.curriculum-module .card-title i { font-size: 15px; color: var(--c-accent); }
.curriculum-module .card-body { padding: 20px; }

.curriculum-module .grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 16px; }

/* Tree */
.curriculum-module .tree { font-size: 13px; }
.curriculum-module .tree-node {
  display: flex; align-items: center; gap: 8px;
  padding: 7px 8px; border-radius: var(--radius-sm); cursor: pointer;
}
.curriculum-module .tree-node:hover { background: var(--c-bg); }
.curriculum-module .tree-node i { font-size: 14px; color: var(--c-text-3); flex-shrink: 0; }
.curriculum-module .tree-node.root { font-weight: 500; color: var(--c-text); }
.curriculum-module .tree-node.child { padding-right: 28px; color: var(--c-text-2); }
.curriculum-module .tree-node.grandchild { padding-right: 46px; color: var(--c-text-3); }
.curriculum-module .tree-node .node-count { margin-right: auto; font-size: 11px; color: var(--c-text-3); background: var(--c-bg); padding: 1px 6px; border-radius: 10px; border: 1px solid var(--c-border); }

/* Form section */
.curriculum-module .form-section { background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius-lg); overflow: hidden; }
.curriculum-module .form-head { display: flex; align-items: center; gap: 8px; padding: 13px 16px; border-bottom: 1px solid var(--c-border); }
.curriculum-module .form-head i { font-size: 15px; color: var(--c-accent); }
.curriculum-module .form-head-title { font-size: 13px; font-weight: 600; }
.curriculum-module .form-body { padding: 20px; }
.curriculum-module .form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.curriculum-module .field { display: flex; flex-direction: column; gap: 5px; margin-bottom: 12px; }
.curriculum-module .field label { font-size: 11px; font-weight: 600; color: var(--c-text-2); letter-spacing: 0.02em; }
.curriculum-module .field input, .curriculum-module .field select, .curriculum-module .field textarea {
  height: 36px; padding: 0 11px; border: 1px solid var(--c-border-strong); border-radius: var(--radius-sm);
  background: var(--c-surface); color: var(--c-text); font-family: inherit; font-size: 13px;
}
.curriculum-module .field textarea { height: 80px; padding: 10px 11px; resize: none; }
.curriculum-module .field input:focus, .curriculum-module .field select:focus, .curriculum-module .field textarea:focus {
  outline: none; border-color: var(--c-accent); box-shadow: 0 0 0 3px rgba(37,99,235,0.1);
}
.curriculum-module .form-actions { display: flex; align-items: center; gap: 8px; margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--c-border); }
.curriculum-module .validation-message { color: var(--c-danger); font-size: 11px; margin-top: 2px; }
/* 🔴 اضافه‌شده (۷ سپتامبر ۲۰۲۶) — `validation-errors` کلاسِ پیش‌فرضِ خودِ Blazor برایِ
   `<ValidationSummary />` است (نه «validation-summary»!)؛ در کلِ این پروژه هیچ‌جا برایش
   استایلی تعریف نشده بود — طبقِ گزارشِ کاربر («ذخیره هیچ خطایی هم نشان نمی‌دهد»)، این می‌توانست
   یکی از دلایلِ نامرئی‌ماندنِ پیامِ خطا باشد (حتی اگر به‌طورِ فنی رندر می‌شد). */
.curriculum-module .validation-errors {
    background: var(--c-danger-light, #fef2f2);
    border: 1px solid var(--c-danger, #dc2626);
    color: var(--c-danger, #dc2626);
    border-radius: 8px;
    padding: 10px 14px;
    font-size: 12px;
    margin-bottom: 12px;
    list-style-position: inside;
}

/* Badges */
.curriculum-module .badge { display: inline-flex; align-items: center; gap: 4px; padding: 3px 8px; border-radius: 999px; border: 1px solid; font-size: 11px; }
.curriculum-module .b-success { background: var(--c-success-bg); color: var(--c-success-text); border-color: var(--c-success-border); }
.curriculum-module .b-danger  { background: var(--c-danger-bg);  color: var(--c-danger-text);  border-color: var(--c-danger-border); }

/* Modal */
.curriculum-module .modal-backdrop, body > .modal-backdrop {
  position: fixed; inset: 0; background: rgba(0,0,0,0.45);
  display: none; align-items: center; justify-content: center; z-index: 10000;
}
.modal-backdrop.open { display: flex; }
.modal-box { width: 100%; max-height: 88vh; display: flex; flex-direction: column; background: var(--c-surface); border-radius: var(--radius-lg); overflow: hidden; }
.modal-head { display: flex; align-items: center; justify-content: space-between; padding: 14px 18px; border-bottom: 1px solid var(--c-border); }
.modal-title { font-size: 14px; font-weight: 600; display: flex; align-items: center; gap: 8px; }
.modal-close { width: 28px; height: 28px; border: none; background: transparent; border-radius: var(--radius-sm); cursor: pointer; color: var(--c-text-2); }
.modal-close:hover { background: var(--c-border); color: var(--c-text); }
.modal-body { padding: 20px; overflow-y: auto; }
.modal-actions { display: flex; gap: 8px; margin-top: 20px; }
.modal-actions .btn { flex: 1; justify-content: center; }

.confirm-icon { width: 52px; height: 52px; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 12px; }
.confirm-icon i { font-size: 26px; }
.confirm-text { text-align: center; font-size: 13px; color: var(--c-text-2); line-height: 1.7; }

.view-list { display: flex; flex-direction: column; }
.view-row { display: flex; justify-content: space-between; gap: 14px; padding: 11px 0; border-bottom: 1px solid var(--c-border); font-size: 13px; }
.view-row:last-child { border-bottom: none; }
.view-row .vk { color: var(--c-text-3); flex-shrink: 0; }
.view-row .vv { color: var(--c-text); font-weight: 500; text-align: left; }

/* Toast */
.toast-wrap { position: fixed; bottom: 24px; left: 24px; z-index: 1000; display: flex; flex-direction: column; gap: 8px; }
.toast { display: flex; align-items: center; gap: 8px; background: var(--c-surface); border: 1px solid var(--c-border-strong); border-radius: var(--radius); padding: 10px 14px; font-size: 12.5px; box-shadow: 0 6px 20px rgba(0,0,0,0.12); }
.toast i { font-size: 16px; color: var(--c-success); }
.toast.toast-error i { color: var(--c-danger); }
.toast.toast-warning i { color: var(--c-warning); }

/* Upload zone (Excel import) */
.upload-zone {
  position: relative; border: 1.5px dashed var(--c-border-strong); border-radius: var(--radius); padding: 28px 16px;
  text-align: center; color: var(--c-text-2); font-size: 12.5px; cursor: pointer;
}
.upload-zone:hover { border-color: var(--c-accent); background: var(--c-accent-bg); color: var(--c-accent-text); }
.upload-zone i { font-size: 30px; display: block; margin-bottom: 10px; }
.upload-zone .uz-sub { font-size: 11px; margin-top: 4px; }
.upload-zone input[type="file"] { position: absolute; inset: 0; opacity: 0; cursor: pointer; }

/* Empty state */
.empty { text-align: center; padding: 40px 16px; color: var(--c-text-3); }
.empty i { font-size: 36px; margin-bottom: 10px; display: block; opacity: 0.4; }
.empty p { font-size: 13px; }

/* Responsive: grid-2 -> single column, matches curriculum.html @media(max-width:1024px) */
@media (max-width: 1024px) {
  .curriculum-module .grid-2 { grid-template-columns: 1fr; }
  .curriculum-module .form-grid { grid-template-columns: 1fr; }
}

/* ── جست‌وجوی درخت فصل‌ها/مباحث (ایتم ۳ از لیست کارهای کاربر — مشابه GeoToolbar) ── */
.curr-search-box { position: relative; margin-bottom: 6px; }
.curr-search-box input {
  width: 100%; height: 30px; border-radius: var(--radius-sm); border: 1px solid var(--c-border-strong);
  background: var(--c-bg); padding: 0 30px 0 8px; font-family: inherit; font-size: 12px; color: var(--c-text);
}
.curr-search-box input:focus { outline: none; border-color: var(--c-accent); background: var(--c-surface); }
.curr-search-box .ti-search { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); color: var(--c-text-3); font-size: 12px; pointer-events: none; }

/* ── تصویر/آیکون کوچیک کنار عنوان فصل/مبحث در درخت (۲۱ اوت ۲۰۲۶) ── */
.curr-node-thumb { width: 18px; height: 18px; border-radius: 4px; object-fit: cover; display: inline-block; vertical-align: middle; margin-inline-end: 4px; }

/* ── Combobox جست‌وجوی کتاب (۲۱ اوت ۲۰۲۶) ── */
.curr-book-picker { position: relative; }
.curr-book-picker-btn {
  height: 28px; font-size: 11px; border: 1px solid var(--c-border); border-radius: var(--radius-sm);
  padding: 0 8px; background: var(--c-surface); font-family: inherit; color: var(--c-text);
  display: flex; align-items: center; gap: 6px; cursor: pointer; min-width: 140px; max-width: 220px;
}
.curr-book-picker-btn span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex: 1; text-align: right; }
.curr-book-picker-btn:hover { border-color: var(--c-accent); }
.curr-book-picker-overlay { position: fixed; inset: 0; z-index: 40; background: transparent; }
.curr-book-picker-panel {
  position: absolute; top: calc(100% + 4px); left: 0; width: 300px; z-index: 50;
  background: var(--c-surface); border: 1px solid var(--c-border-strong); border-radius: var(--radius);
  box-shadow: 0 10px 30px rgba(0,0,0,0.15); padding: 8px;
}
.curr-book-picker-search { position: relative; margin-bottom: 6px; }
.curr-book-picker-search input {
  width: 100%; height: 30px; border-radius: 6px; border: 1px solid var(--c-border-strong);
  background: var(--c-bg); padding: 0 28px 0 8px; font-family: inherit; font-size: 12px; color: var(--c-text);
}
.curr-book-picker-search input:focus { outline: none; border-color: var(--c-accent); }
.curr-book-picker-search .ti-search { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); color: var(--c-text-3); font-size: 12px; }
.curr-book-picker-list { max-height: 220px; overflow-y: auto; display: flex; flex-direction: column; gap: 2px; }
.curr-book-picker-item {
    padding: 7px 8px; border-radius: 6px; cursor: pointer; font-size: 12px; color: var(--c-text);
    display: flex; align-items: center; justify-content: space-between; gap: 8px;
}
.curr-book-picker-item:hover { background: var(--c-bg); }
.curr-book-picker-item.active { background: var(--c-accent); color: #fff; }
.curr-book-picker-item-meta { font-size: 10px; color: var(--c-text-3); flex-shrink: 0; }
.curr-book-picker-item.active .curr-book-picker-item-meta { color: rgba(255,255,255,0.8); }
.curr-book-picker-empty { padding: 12px 8px; text-align: center; color: var(--c-text-3); font-size: 11.5px; }

/* 🆕 اضافه‌شده (۶ سپتامبر ۲۰۲۶، طبق درخواست صریح کاربر: «امکان کامل برای فیلتر کتاب‌ها بر
   اساس پایه و رشته»). فیلترهای مقطع/پایه/رشته، بالای باکس جست‌وجو در همان پنل انتخاب کتاب. */
.curr-book-picker-filters { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 8px; }
.curr-filter-select {
    flex: 1; min-width: 90px; font-size: 11px; padding: 6px 8px; border-radius: 6px;
    border: 1px solid var(--c-border); background: var(--c-surface); color: var(--c-text);
}
.curr-filter-select:disabled { opacity: 0.5; cursor: not-allowed; }
.curr-filter-clear {
    display: flex; align-items: center; gap: 4px; font-size: 10.5px; color: var(--c-text-3);
    background: none; border: 1px dashed var(--c-border); border-radius: 6px; padding: 6px 8px; cursor: pointer; white-space: nowrap;
}
.curr-filter-clear:hover { color: var(--c-danger, #dc2626); border-color: var(--c-danger, #dc2626); }

/* ── نشان پیش‌فرض برای فصل/مبحث/زیرمبحث بدون تصویر/آیکون سفارشی (۲۲ اوت ۲۰۲۶) ── */
.curr-node-thumb-default {
  display: inline-flex; align-items: center; justify-content: center;
  width: 18px; height: 18px; border-radius: 4px; margin-inline-end: 4px;
  flex-shrink: 0; font-size: 11px;
}
.curr-node-thumb-default.type-chapter { background: var(--c-accent-bg); color: var(--c-accent-text); }
.curr-node-thumb-default.type-topic { background: var(--c-success-bg); color: var(--c-success-text); }
.curr-node-thumb-default.type-subtopic { background: var(--c-warning-bg); color: var(--c-warning-text); }
