/*
This is a sample custom theme 

1. New box shadow for the domain and admin setup cards.
2. Uses bold text to identify highlighted category
3. Slightly different visual appearance for data tables
4. Allow text copy in data tables
5. Slightly different visual appearance for lists with icons

----------------------------

Create custom themes by creating a folder inside

lib/layouts/colors/light/themes/

and 

lib/layouts/colors/dark/themes/

folders. The folder name is the name of the theme. A single file named styles.css inside the
folder defines the additional CSS.

Do not remove any of the default folders or files inside the /themes/ folder.

Use the 'UI settings' panel to select the theme.

*/

#domain-cards-list > li, #adminsettings > li {
	box-shadow: rgba(9, 30, 66, 0.25) 0px 4px 8px -2px, rgba(9, 30, 66, 0.08) 0px 0px 0px 1px;
}

.highlighted-category  > div:first-child {
	font-weight: 800;
}

.datatable {
	border-collapse: separate;
	border-spacing: 10px 5px;
	user-select: text;
	margin: -5px -10px -5px -10px;
}

.datatable th, .datatable td {
	border-radius: 1px;
	border: none;
}

.datatable th, .datatable td {
	box-shadow: var(--subtle-box-shadow);
}

.datatable th:not(:last-child), .datatable td:not(:last-child) {
    border-right: 0px solid var(--table-row-vertical-border-color);
	border-bottom: 0px solid var(--table-row-vertical-border-color);
}

.datatable th:not(:first-child), .datatable td:not(:first-child) {
    border-left: 0px solid var(--table-row-vertical-border-color);
	border-top: 0px solid var(--table-row-vertical-border-color);
}

ul.list-with-icons > li {
	margin: 2px 0;
}
