/* ============================================================
   Zorem UI — DataTables skin
   ------------------------------------------------------------
   Skins a jQuery DataTables instance to match ZUI when the table
   itself carries .zui-table. Only the footer controls (info +
   paginate) are restyled — consumers typically disable search +
   length, so those are the only generated controls. Scoped to
   .zui-scope so it never leaks to other DataTables on the site.

   Markup: <table class="zui-table" id="...">…</table> initialised
   with `$table.DataTable({ searching:false, lengthChange:false })`.

   Phase: 1 (added v1.1.0)
   ============================================================ */

/* Kill DataTables' default row striping — ZUI tables are flat. */
.zui-scope table.dataTable tbody tr {
	background: transparent;
}

/* Footer: info (left) + paginate (right), DataTables floats them. */
.zui-scope .dataTables_wrapper .dataTables_info {
	padding: 16px 20px;
	font-size: 12px;
	color: var(--zui-text-muted);
	border-block-start: 1px solid var(--zui-divider);
}

.zui-scope .dataTables_wrapper .dataTables_paginate {
	padding: 12px 20px;
	border-block-start: 1px solid var(--zui-divider);
}

.zui-scope .dataTables_wrapper .dataTables_paginate .paginate_button {
	box-sizing: border-box;
	min-width: 30px;
	height: 30px;
	margin: 0 2px;
	padding: 0 10px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: 1px solid var(--zui-border) !important;
	border-radius: var(--zui-radius-md);
	background: var(--zui-surface) !important;
	color: var(--zui-text-muted) !important;
	font-size: 12px;
	font-weight: 600;
	cursor: pointer;
}

.zui-scope .dataTables_wrapper .dataTables_paginate .paginate_button:hover {
	border-color: var(--zui-primary) !important;
	color: var(--zui-primary) !important;
}

.zui-scope .dataTables_wrapper .dataTables_paginate .paginate_button.current,
.zui-scope .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
	background: var(--zui-primary) !important;
	border-color: var(--zui-primary) !important;
	color: #fff !important;
}

.zui-scope .dataTables_wrapper .dataTables_paginate .paginate_button.disabled,
.zui-scope .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover {
	opacity: 0.4;
	cursor: not-allowed;
	background: var(--zui-surface) !important;
	border-color: var(--zui-border) !important;
	color: var(--zui-text-muted) !important;
}
