/* =====================================================
   Desert Crown Studio — DCSO
   جدول موحد احترافي 100%
   يدعم التمدد – يدعم Dark/Light Mode
   ===================================================== */

/* Light theme (default) */
:root {
  --bg-page: #f3f4f6;
  --text-color: #0f172a;

  --header-bg: rgba(55,65,81,0.98);
  --header-color: #e3eaf2;

  --cell-bg: rgba(8,14,20,0.06);
  --cell-color: #111827;

  --border-strong: rgba(0,0,0,0.12);
  --border-weak: rgba(0,0,0,0.06);

  --btn-primary-bg: #2563eb;
  --btn-primary-bg-hover: #1e40af;

  --btn-warning-bg: #f59e0b;
  --btn-warning-bg-hover: #d97706;

  --btn-danger-bg: #e11d48;
  --btn-danger-bg-hover: #be123c;

  --muted-bg: #6b7280;
}

/* Dark theme */
html.dark {
  --bg-page: #0b1220;
  --text-color: #e6eef6;

  --header-bg: rgba(55,65,81,0.98);
  --header-color: #e3eaf2;

  --cell-bg: rgba(8,14,20,0.18);
  --cell-color: #d4dde5;

  --border-strong: rgba(255,255,255,0.08);
  --border-weak: rgba(255,255,255,0.04);

  --btn-primary-bg: #2563eb;
  --btn-primary-bg-hover: #1e40af;

  --btn-warning-bg: #f59e0b;
  --btn-warning-bg-hover: #d97706;

  --btn-danger-bg: #e11d48;
  --btn-danger-bg-hover: #be123c;

  --muted-bg: #4b5563;
}

/* الصفحة */
body {
  background: var(--bg-page);
  color: var(--text-color);
  font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
}

/* =====================================================
   جدول موحّد احترافي يدعم التمدّد
   ===================================================== */

.table-fixed-headers {
  width: 100%;
  border-collapse: collapse !important;
  border-spacing: 0 !important;
  table-layout: auto;
  background: transparent;
  direction: rtl;
}

.table-fixed-headers thead th {
  background: var(--header-bg);
  color: var(--header-color);
  padding: 14px;
  border: 1px solid var(--border-strong);
  font-weight: 600;
  text-align: center;
  white-space: nowrap;
  background-clip: padding-box;
}

.table-fixed-headers tbody td {
  background: var(--cell-bg);
  color: var(--cell-color);
  padding: 12px;
  border: 1px solid var(--border-weak) !important;
  text-align: center;
  vertical-align: middle;
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: unset !important;
  word-break: break-word !important;
  background-clip: padding-box;
}

/* منع الهوامش داخل الخلايا */
.table-fixed-headers td > * {
  margin: 0 !important;
  display: inline-block;
  vertical-align: middle;
}

/* الحدود النهائية لمنع ظهور خطوط بيضاء */
.table-fixed-headers td:first-child,
.table-fixed-headers th:first-child {
  border-left: 1px solid var(--border-weak);
}
.table-fixed-headers td:last-child,
.table-fixed-headers th:last-child {
  border-right: 1px solid var(--border-weak);
}

/* Hover */
.table-fixed-headers tbody tr:hover td {
  background: rgba(255,255,255,0.03);
}

/* =====================================================
   أزرار موحدة 100%
   ===================================================== */
.btn-primary {
  background: var(--btn-primary-bg);
  padding: 6px 12px;
  border-radius: 6px;
  color: #fff;
  font-size: 13px;
  display: inline-block;
  text-decoration: none;
}
.btn-primary:hover { background: var(--btn-primary-bg-hover); }

/* زر أصفر */
.btn-warning {
  background: var(--btn-warning-bg);
  padding: 6px 12px;
  border-radius: 6px;
  color: #fff;
  font-size: 13px;
  text-decoration: none;
}
.btn-warning:hover { background: var(--btn-warning-bg-hover); }

.btn-danger {
  background: var(--btn-danger-bg);
  padding: 6px 12px;
  border-radius: 6px;
  color: #fff;
  font-size: 13px;
  text-decoration: none;
}
.btn-danger:hover { background: var(--btn-danger-bg-hover); }

.btn-edit {
  background: #3b82f6;
  padding: 6px 12px;
  border-radius: 6px;
  color: #fff;
  font-size: 13px;
  text-decoration: none;
}
.btn-edit:hover { background: #2563eb; }

.btn-small {
  padding: 4px 8px;
  font-size: 12px;
  border-radius: 6px;
  display: inline-block;
}

/* زر رمادي */
.token-btn {
  background: var(--muted-bg);
  padding: 5px 8px;
  color: #fff;
  font-size: 12px;
  border-radius: 4px;
  cursor: pointer;
}

/* إدخال داخل الجدول */
.input-inline {
  padding: 6px 8px;
  border-radius: 6px;
  border: 1px solid var(--border-weak);
  background: rgba(255,255,255,0.04);
  color: var(--cell-color);
}

/* Responsive */
@media (max-width: 900px) {
  .table-fixed-headers thead th,
  .table-fixed-headers tbody td {
    padding: 10px;
    font-size: 13px;
  }
}