/**
 * DGA Unified Design System – Table (Data Display)
 * Reference: https://design.dga.gov.sa/guidelines/components/data-display/table
 * Aligns with Platform Code / National Design System for consistent data tables.
 * RTL/LTR: uses logical properties (padding-inline, text-align, etc.).
 */

:root {
  --dga-table-border-color: #e6edef;
  --dga-table-header-bg: #f3f4f6;
  --dga-table-header-text: #1f2937;
  --dga-table-header-font-weight: 600;
  --dga-table-cell-padding-x: 16px;
  --dga-table-cell-padding-y: 12px;
  --dga-table-stripe-bg: #f9fafb;
  --dga-table-hover-bg: #f0fdf4;
  --dga-table-radius: 8px;
  --dga-table-focus-ring: 0 0 0 2px #fff, 0 0 0 4px #01527a;
}

/* Base table – semantic table with DGA styling */
.dga-table {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
  font-size: 1rem;
  line-height: 1.5;
  color: var(--dga-table-header-text);
  background-color: #fff;
}

.dga-table thead {
  background-color: var(--dga-table-header-bg);
}

.dga-table th {
  padding: var(--dga-table-cell-padding-y) var(--dga-table-cell-padding-x);
  text-align: start;
  font-weight: var(--dga-table-header-font-weight);
  color: var(--dga-table-header-text);
  border-bottom: 2px solid var(--dga-table-border-color);
}

.dga-table td {
  padding: var(--dga-table-cell-padding-y) var(--dga-table-cell-padding-x);
  border-bottom: 1px solid var(--dga-table-border-color);
  color: #000;
}

.dga-table tbody tr:hover {
  background-color: #fff;
}

.dga-table tbody tr:nth-of-type(even):hover {
  background-color: var(--dga-table-stripe-bg);
}

/* Striped rows: default for all DGA tables */
.dga-table tbody tr:nth-of-type(even) {
  background-color: var(--dga-table-stripe-bg);
}

/* Optional: disable stripes by adding .dga-table--no-stripe */
.dga-table.dga-table--no-stripe tbody tr:nth-of-type(even) {
  background-color: inherit;
}

/* Responsive wrapper */
.dga-table-wrapper {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.dga-table-wrapper .dga-table {
  min-width: 100%;
}

/* Empty state */
.dga-table-empty {
  padding: 2rem var(--dga-table-cell-padding-x);
  text-align: center;
  color: #6b7280;
}

/* Loading state (skeleton or spinner – use with your loading component) */
.dga-table-loading {
  padding: 2rem;
  text-align: center;
}

/* RTL: ensure alignment follows direction */
[dir="rtl"] .dga-table th,
[dir="rtl"] .dga-table td {
  text-align: start;
}

/* Focus visible for keyboard users */
.dga-table tbody tr:focus-visible,
.dga-table th:focus-visible,
.dga-table td:focus-visible {
  outline: none;
  box-shadow: var(--dga-table-focus-ring);
}

/* Comparison / wide tables (e.g. modals) */
.dga-table.dga-table--comparison th,
.dga-table.dga-table--comparison td {
  vertical-align: top;
}

/* ---- Bridge: Ant Design Table styled as DGA ---- */
/* Apply .dga-table-ant when using Ant Design Table for consistent look */
.ant-table-wrapper .ant-table,
.table-container .ant-table {
  font-size: 1rem;
}

.ant-table-wrapper .ant-table-thead > tr > th,
.table-container .ant-table-thead > tr > th {
  background: var(--dga-table-header-bg) !important;
  color: var(--dga-table-header-text);
  font-weight: var(--dga-table-header-font-weight);
  border-bottom: 2px solid var(--dga-table-border-color);
  padding: var(--dga-table-cell-padding-y) var(--dga-table-cell-padding-x);
}

.ant-table-wrapper .ant-table-tbody > tr > td,
.table-container .ant-table-tbody > tr > td {
  border-bottom: 1px solid var(--dga-table-border-color);
  padding: var(--dga-table-cell-padding-y) var(--dga-table-cell-padding-x);
  color: #000;
}

.ant-table-wrapper .ant-table-tbody > tr:hover > td,
.table-container .ant-table-tbody > tr:hover > td {
  background: #fff !important;
}

.ant-table-wrapper .ant-table-tbody > tr.ant-table-row:nth-child(even):hover > td,
.table-container .ant-table-tbody > tr.ant-table-row:nth-child(even):hover > td {
  background: var(--dga-table-stripe-bg) !important;
}

/* Striped rows for Ant Design tables */
.ant-table-wrapper .ant-table-tbody > tr.ant-table-row:nth-child(even) > td,
.table-container .ant-table-tbody > tr.ant-table-row:nth-child(even) > td {
  background: var(--dga-table-stripe-bg) !important;
}


/* DGA Design System - Loading component
   https://design.dga.gov.sa/guidelines/components/loading-and-status/loading
   Circular spinner, light green/teal, centered in viewport. No text. */

.dga-loading-overlay {
  position: fixed;
  inset: 0;
  z-index: 999999;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.7);
  pointer-events: auto;
}

[dir="rtl"] .dga-loading-overlay {
  /* RTL: same centering behavior */
}

.dga-loading-spinner {
  width: 40px;
  height: 40px;
  border: 3px solid rgba(0, 166, 81, 0.2);
  border-top-color: #00a651;
  border-radius: 50%;
  animation: dga-loading-spin 0.8s linear infinite;
}

/* DGA primary green used for spinner; supports size variants */
.dga-loading-spinner--small {
  width: 24px;
  height: 24px;
  border-width: 2px;
}

.dga-loading-spinner--large {
  width: 48px;
  height: 48px;
  border-width: 4px;
}

@keyframes dga-loading-spin {
  to {
    transform: rotate(360deg);
  }
}


/* No records empty state – table with skeleton + empty message */
.dga-no-records {
    width: 100%;
    margin: 0;
    padding: 0;
}
.dga-no-records .dga-table-wrapper {
    margin: 0;
}
.dga-no-records-table {
    table-layout: fixed;
}
/* Skeleton bars in header (static – no loading animation) */
.dga-no-records-skeleton {
    display: block;
    height: 14px;
    background: #e5e7eb;
    border-radius: 4px;
}
.dga-no-records-skeleton--header {
    width: 60%;
    max-width: 120px;
}
/* Body cell: skeleton + message */
.dga-no-records__cell {
    vertical-align: top;
    padding: 1rem var(--dga-table-cell-padding-x) 1.5rem !important;
}
.dga-no-records__cell .ant-skeleton {
    margin-bottom: 1rem;
}
.dga-no-records__message {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    text-align: center;
    padding: 0.5rem 0;
}
.dga-no-records__icon {
    display: inline-flex;
    font-size: 2rem;
    line-height: 1;
    color: #9ca3af;
}
.dga-no-records__text {
    color: #6b7280;
}
[dir="rtl"] .dga-no-records__message {
    text-align: center;
}
.dga-table-empty .dga-no-records {
    padding: 0;
}

/* Ant Design Table empty: hide default Empty illustration so only text shows */
.ant-table-placeholder .ant-empty-image,
.ant-empty .ant-empty-image {
    display: none;
}

/* Overlay is removed from DOM when not visible - no body classes or scroll lock */