﻿/*<meta />*/

/*** Custom styles ***/

/* Wrapper fix for AnchorJS anchors */

div.dt-container
{
	position: unset;
}

/* Add margin to release-notes div */

div#rn-release-notes
{
	margin: var(--margin);
}

/* Remove borders and cell shading */

table.dataTable
{
	border-collapse: collapse;
	border: none;
}

table.dataTable th:not([class*='TableStyle']),
table.dataTable td:not([class*='TableStyle'])
{
	border: none;
	background: none;
	background-color: unset !important;
}

/* Remove list customizations for tables */

table.dataTable td:not([class*='TableStyle']) > ul,
table.dataTable td:not([class*='TableStyle']) > ol
{
	padding-left: revert;
	list-style-position: initial;
}

/* Remove extra space from cells as list items */

table.dataTable > tbody > tr > td:not([class*='TableStyle'])
{
    padding-top: unset;
	padding-bottom: var(--list-margin);
}

table.dataTable > tbody > tr > td:not([class*='TableStyle']) > ul > li
{
	margin: unset !important;
}

/* Groups */

table.dataTable tr.dtrg-group.dtrg-start th
{
	text-align: left;
}

/* Column headers as h2, h3, h4 */

table.dataTable tr.dtrg-level-0 th,
table.dataTable tr.dtrg-level-1 th,
table.dataTable tr.dtrg-level-2 th
{
	color: var(--navy);
}

table.dataTable tr.dtrg-level-0 th
{
	font-size: var(--text-h4) !important;
	line-height: var(--line-height-h4);
	font-weight: 700 !important;
	padding-left: unset !important;
}

table.dataTable tr.dtrg-level-1 th
{
	font-size: var(--text-h5) !important;
	line-height: var(--line-height-h5);
	font-weight: 700 !important;
	padding-left: 0.5em !important;
}

table.dataTable tr.dtrg-level-2 th
{
	font-size:  var(--text-h6) !important;
	line-height: var(--line-height-h6);
	font-weight: normal !important;
	padding-left: 1em !important;
}

/* Search box */

div.dt-container .dt-search input
{
	border-width: 0 0 1px 0;
	border-color: var(--grey);
	border-radius: unset;
}
div.dt-container .dt-search input:focus
{
	outline: 1.5px solid var(--lime);
	border-radius: var(--radius-xs);
	border: unset;
}

/* Buttons as Material UI swithes*/

div.dt-buttons
{
	display: flex;
	justify-content: flex-end;
	gap: 0.3em;
	align-items: center;
}

div.dt-buttons .dt-button,
div.dt-buttons div.dt-button-split .dt-button,
div.dt-buttons .dt-button:hover,
div.dt-buttons div.dt-button-split .dt-button:hover,
div.dt-buttons .dt-button:hover:not(.disabled),
div.dt-buttons div.dt-button-split .dt-button:hover:not(.disabled)
{
	font-size: inherit;
	position: relative;
	display: inline-flex;
	/* Use flex to handle text and switch */
	align-items: center;
	/* Vertically align content */
	justify-content: center;
	height: 1.25em;
    width: 2.7em;
    padding: 0.375em;
	background: var(--light-cloud);
	border-radius: var(--radius-xl);
	border: 1px solid var(--grey);
	/* Remove default button border */
	margin: unset;
	/* Remove default margin */
	cursor: pointer;
	transition: background-color 0.4s;
}

div.dt-buttons .dt-button::before,
div.dt-buttons div.dt-button-split .dt-button::before,
div.dt-buttons .dt-button:hover::before,
div.dt-buttons div.dt-button-split .dt-button:hover::before,
div.dt-buttons .dt-button:hover:not(.disabled)::before,
div.dt-buttons div.dt-button-split .dt-button:hover:not(.disabled)::before
{
	content: '';
    position: absolute;
    height: 0.8em;
    width: 0.8em;
    left: 0.25em;
    background-color: var(--grey-999);
    border-radius: var(--radius-xl);
    transition: transform 0.4s;
}

div.dt-buttons .dt-button.dt-button-active:not(.disabled),
div.dt-buttons div.dt-button-split .dt-button.dt-button-active:not(.disabled),
div.dt-buttons .dt-button.dt-button-active:hover:not(.disabled),
div.dt-buttons div.dt-button-split .dt-button.dt-button-active:hover:not(.disabled),
div.dt-buttons .dt-button.dt-button-active:not(.disabled):hover:not(.disabled),
div.dt-buttons div.dt-button-split .dt-button.dt-button-active:not(.disabled):hover:not(.disabled)
{
	background: var(--light-cloud);
	border-color: var(--lime);
	/* Active switch color */
	box-shadow: unset;
	/* Replace default shadow */
	box-shadow: 0px 0px 8px rgba(114, 191, 0, 0.5);
}

div.dt-buttons .dt-button.dt-button-active:not(.disabled)::before,
div.dt-buttons div.dt-button-split .dt-button.dt-button-active:not(.disabled)::before,
div.dt-buttons .dt-button.dt-button-active:hover:not(.disabled)::before,
div.dt-buttons div.dt-button-split .dt-button.dt-button-active:hover:not(.disabled)::before,
div.dt-buttons .dt-button.dt-button-active:not(.disabled):hover:not(.disabled)::before,
div.dt-buttons div.dt-button-split .dt-button.dt-button-active:not(.disabled):hover:not(.disabled)::before
{
	transform: translateX(calc(1.45em - 2px));
	background-color: var(--lime);
}

div.dt-buttons .dt-button:focus:not(.disabled),
div.dt-buttons div.dt-button-split .dt-button:focus:not(.disabled)
{
	outline: none;
}

div.dt-buttons .dt-button,
div.dt-buttons div.dt-button-split .dt-button
{
	overflow: visible;
}

div.dt-buttons span
{
	white-space: nowrap;
	/* Ensure text stays on one line */
}

div.dt-buttons span:not(:last-child)
{
	margin-right: 0.3em;
	/* Adjust the spacing between the span and the next button */
}

/* Colored chips */

.chip
{
	margin: 0 0.25em;
    border-radius: var(--radius-s);
    font-size: 0.9em;
    padding: 0.125em 0.5em;
    color: var(--navy);
}

.chip.ui.latest
{
	background-color: #99AABF;
}

.chip.ui.classic
{
	background-color: #98C8BF;
}

.chip.beta
{
	background-color: #FBCFA4;
}

.chip.platform.cloud
{
	background-color: #9AEBE3;
}

.chip.platform.cpsh
{
	background-color: #E2EFED;
}

.chip.certified
{
	background-color: #99C5E7;
}