/*
 * school-theme.css
 * ملف التصميم العام لنظام المدارس.
 * غيّر القيم داخل :root فقط لتتغير ألوان أغلب شاشات النظام.
 */

:root {
  color-scheme: light;

  /* الخلفيات */
  --ui-page-bg: #f8fafc;
  --ui-page-bg-2: #eef2ff;
  --ui-shell-bg: rgba(255, 255, 255, .78);
  --ui-card-bg: rgba(255, 255, 255, .90);
  --ui-field-bg: #ffffff;
  --ui-header-bg: #616161;
  --ui-header-text: #ffffff;

  /* النصوص والحدود */
  --ui-text: #0f172a;
  --ui-muted: #475569;
  --ui-border: rgba(148, 163, 184, .35);

  /* الأزرار */
  --ui-primary-1: #2563eb;
  --ui-primary-2: #4f46e5;
  --ui-success-1: #16a34a;
  --ui-success-2: #059669;
  --ui-purple-1: #7c3aed;
  --ui-purple-2: #a855f7;
  --ui-edit-bg: #ffffff;
  --ui-edit-text: #0f172a;
  --ui-danger-bg: #fff1f2;
  --ui-danger-text: #b91c1c;
  --ui-danger-border: #fca5a5;
  --ui-neutral-bg: rgba(255, 255, 255, .82);
  --ui-neutral-text: #0f172a;

  /* الحقول */
  --ui-field-border: #cbd5e1;
  --ui-focus-color: #2563eb;
  --ui-required-color: #ef4444;

  /* Toast */
  --ui-toast-bg: #172033;
  --ui-toast-text: #ffffff;
  --ui-toast-success: #22c55e;
  --ui-toast-error: #ef4444;
  --ui-toast-warning: #facc15;
  --ui-toast-info: #3b82f6;

  /* الخطوط */
  --ui-font-family: "Tajawal", Arial, sans-serif;
  --ui-font-size: 14px;

  /* الشكل العام */
  --ui-radius: 14px;
  --ui-header-shape: all;
  --ui-header-radius-size: 8px;
  --ui-header-radius: 8px;
  --ui-shadow: 0 16px 40px rgba(15, 23, 42, .10);
}

/* ===== الخلفية والخط العام ===== */
html,
body {
  font-family: var(--ui-font-family) !important;
  color: var(--ui-text) !important;
}

body {
  background:
    linear-gradient(
      180deg,
      var(--ui-page-bg) 0%,
      var(--ui-page-bg-2) 100%
    ) !important;
}

/* ===== حاويات النظام ===== */
body .contentCard,
body .sidebar,
body .page,
body .screenPage,
body .panel,
body .formPanel {
  background-color: var(--ui-shell-bg) !important;
  border-color: var(--ui-border) !important;
}

body .card,
body .box,
body .sectionCard,
body .tableWrap,
body .gridBox {
  border-color: var(--ui-border) !important;
}

/* لا نفرض خلفية شفافة على الحاويات التي صممت كغلاف خارجي */
body .card:not([style*="background:transparent"]),
body .box,
body .sectionCard {
  background-color: var(--ui-card-bg);
}

/* ===== هيدر البطاقات والشاشات ===== */
body .cardHead,
body .sectionHead,
body .panelHead,
body .boxHead,
body .boxH,
body .movementHead,
body .formSectionTitle,
body .ch {
  background: var(--ui-header-bg) !important;
  color: var(--ui-header-text) !important;
  border-color: transparent !important;
  border-radius: var(--ui-header-radius) !important;
}

/* ربط مباشر بالشاشات التي تستخدم محددات أكثر دقة أو !important داخلياً. */
html body #employeeFileRoot .cardHead,
html body #studentFileRoot .cardHead,
html body #employeeFileRoot .boxH,
html body #studentFileRoot .boxH,
html body #employeeFileRoot .ch,
html body #studentFileRoot .ch {
  border-radius: var(--ui-header-radius) !important;
}

body .cardHead *,
body .sectionHead *,
body .panelHead *,
body .boxHead *,
body .boxH *,
body .movementHead *,
body .formSectionTitle *,
body .ch * {
  color: var(--ui-header-text) !important;
}

/* ===== الحقول ===== */
body input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
body select,
body textarea,
body .datePickerTrigger {
  font-family: var(--ui-font-family) !important;
  font-size: var(--ui-font-size) !important;
  font-weight: 900 !important;
  color: var(--ui-text) !important;
  background: var(--ui-field-bg) !important;
  border-color: var(--ui-field-border) !important;
}

body input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):focus,
body select:focus,
body textarea:focus,
body .datePickerTrigger:focus,
body .ui-field-focus {
  outline: none !important;
  border-color: var(--ui-focus-color) !important;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, .15) !important;
}

/* الحقل الإلزامي الناقص */
body .ui-required-focus,
body .invalidField,
body .required-error {
  outline: none !important;
  border-color: var(--ui-required-color) !important;
  box-shadow: 0 0 0 3px rgba(239, 68, 68, .16) !important;
}

/* ===== الأزرار العامة ===== */
body button,
body .btn,
body .btnR {
  font-family: var(--ui-font-family) !important;
  font-weight: 950 !important;
}

/* إضافة */
body #btnAdd,
body .btn.success,
body .btn.add,
body [data-ui-action="add"] {
  background: linear-gradient(
    135deg,
    var(--ui-success-1),
    var(--ui-success-2)
  ) !important;
  border-color: transparent !important;
  color: #ffffff !important;
}

/* حفظ / زر أساسي */
body #btnUpdate,
body #btnSave,
body .btn.save,
body .btn.primary:not([data-act="view"]),
body [data-ui-action="save"] {
  background: linear-gradient(
    135deg,
    var(--ui-primary-1),
    var(--ui-primary-2)
  ) !important;
  border-color: transparent !important;
  color: #ffffff !important;
}

/* عرض */
body [data-act="view"],
body .btn.view,
body [data-ui-action="view"] {
  background: linear-gradient(
    135deg,
    var(--ui-primary-1),
    var(--ui-primary-2)
  ) !important;
  border-color: transparent !important;
  color: #ffffff !important;
}

/* تعديل */
body [data-act="edit"],
body .btn.edit,
body [data-ui-action="edit"] {
  background: var(--ui-edit-bg) !important;
  border-color: var(--ui-border) !important;
  color: var(--ui-edit-text) !important;
}

/* طباعة */
body [data-act="print"],
body .btn.print,
body .btn.purple,
body [data-ui-action="print"] {
  background: linear-gradient(
    135deg,
    var(--ui-purple-1),
    var(--ui-purple-2)
  ) !important;
  border-color: transparent !important;
  color: #ffffff !important;
}

/* حذف وخروج */
body [data-act="del"],
body [data-act="delete"],
body .btn.danger,
body .btn.del,
body .btn.delete,
body .btn.exit,
body [data-ui-action="delete"] {
  background: var(--ui-danger-bg) !important;
  border-color: var(--ui-danger-border) !important;
  color: var(--ui-danger-text) !important;
}

/* الأيقونة والنص يرثان لون الزر */
body .btn i,
body .btn span,
body .btnR i,
body .btnR span,
body [data-act] i,
body [data-act] span {
  color: inherit !important;
}

/* ===== الجدول ===== */
body table {
  font-family: var(--ui-font-family) !important;
}

body .tbl th,
body .tbl td,
body table th,
body table td {
  font-weight: 900;
}

body .tbl thead th,
body table thead th {
  color: #1e40af;
}

/* ===== Toast عام ===== */
#school-global-toast-container {
  position: fixed !important;
  top: 10px !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  z-index: 2147483647 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 8px !important;
  width: max-content !important;
  max-width: calc(100vw - 24px) !important;
  pointer-events: none !important;
  direction: rtl !important;
}

.school-global-toast {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  direction: rtl !important;
  width: max-content !important;
  max-width: min(680px, calc(100vw - 24px)) !important;
  padding: 12px 18px !important;
  border: 0 !important;
  border-radius: 12px !important;
  background: var(--ui-toast-bg) !important;
  color: var(--ui-toast-text) !important;
  font-family: var(--ui-font-family) !important;
  font-size: 14px !important;
  font-weight: 950 !important;
  line-height: 1.6 !important;
  text-align: right !important;
  box-shadow: 0 16px 40px rgba(15, 23, 42, .30) !important;
  pointer-events: auto !important;
}

.school-global-toast__icon {
  flex: 0 0 auto !important;
  font-size: 18px !important;
}

.school-global-toast[data-type="success"] .school-global-toast__icon {
  color: var(--ui-toast-success) !important;
}

.school-global-toast[data-type="error"] .school-global-toast__icon {
  color: var(--ui-toast-error) !important;
}

.school-global-toast[data-type="warning"] .school-global-toast__icon {
  color: var(--ui-toast-warning) !important;
}

.school-global-toast[data-type="info"] .school-global-toast__icon {
  color: var(--ui-toast-info) !important;
}

/* توحيد رسائل Toast القديمة الموجودة داخل الشاشات */
body .toast:not(.school-global-toast),
body #toast:not(.school-global-toast),
body [data-school-legacy-toast="1"] {
  position: fixed !important;
  top: 10px !important;
  right: auto !important;
  bottom: auto !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  z-index: 2147483646 !important;
  width: max-content !important;
  max-width: min(680px, calc(100vw - 24px)) !important;
  padding: 12px 18px !important;
  border: 0 !important;
  border-radius: 12px !important;
  background: var(--ui-toast-bg) !important;
  color: var(--ui-toast-text) !important;
  font-family: var(--ui-font-family) !important;
  font-size: 14px !important;
  font-weight: 950 !important;
  line-height: 1.6 !important;
  text-align: center !important;
  box-shadow: 0 16px 40px rgba(15, 23, 42, .30) !important;
}

/* أيقونة للرسائل القديمة دون تغيير محتواها */
body [data-school-legacy-toast="1"]::before {
  content: "●";
  display: inline-block;
  margin-inline-end: 9px;
  font-size: 17px;
  line-height: 1;
  vertical-align: middle;
  color: var(--ui-toast-info);
}

body [data-school-legacy-toast="1"][data-toast-type="success"]::before {
  content: "✓";
  color: var(--ui-toast-success);
}

body [data-school-legacy-toast="1"][data-toast-type="error"]::before {
  content: "✕";
  color: var(--ui-toast-error);
}

body [data-school-legacy-toast="1"][data-toast-type="warning"]::before {
  content: "▲";
  color: var(--ui-toast-warning);
}

body [data-school-legacy-toast="1"][data-toast-type="info"]::before {
  content: "●";
  color: var(--ui-toast-info);
}