/* -- Desktop specific styles -- */
@media only screen and (min-width: 1200px) {
	/* -- Override for the general .ui.container -- */
	body .ui.container {
		width: 1427px !important;
	}
	/* -- Override for .ui.grid.container -- */
	body .ui.grid.container {
		width: calc(1427px + 2rem) !important;
	}
	/* -- Override for .ui.relaxed.grid.container -- */
	body .ui.relaxed.grid.container {
		width: calc(1427px + 3rem) !important;
	}
	/* -- Override for .ui.very.relaxed.grid.container -- */
	body .ui.very.relaxed.grid.container {
		width: calc(1427px + 5rem) !important;
	}
	body .form_margin {
		margin-top: 1rem !important;
	}
}
/* -- Tablet specific styles (Portrait Samsung S9+, iPads, etc.) -- */
@media only screen and (min-width: 768px) and (max-width: 991px) {
	/* -- Force 'three fields' to stack vertically -- */
	body .ui.form .three.fields {
		display: block !important;
	}
	/* -- Make each field container 100% wide -- */
	body .ui.form .three.fields > .field {
		width: 100% !important;
		margin: 0 0 15px 0 !important; /* Add spacing between stacked fields */
	}
	/* -- Force 'two fields' to stack vertically -- */
	body .ui.form .two.fields {
		display: block !important;
	}
	/* -- Make each field container 100% wide -- */
	body .ui.form .two.fields > .field {
		width: 100% !important;
		margin: 0 0 15px 0 !important; /* Add spacing between stacked fields */
	}
	/* -- Ensure the inputs themselves fill the container -- */
	body .ui.form .field .ui.input,
	body .ui.form .field .ui.dropdown,
	body .ui.form .field .ui.calendar {
		width: 100% !important;
	}
	/* -- Target the menu that HAS the datatable length container -- */
	body .ui.container.menu:has(#dt-length-container) {
		flex-direction: column !important;
		height: auto !important;
		gap: 5px;
		padding: .92857143em 1.14285714em;
		margin-bottom: 20px;
    }
	/* -- Split the Row 1 (Length) and Row 2/3 (Right menu) -- */
	body .ui.container.menu:has(#dt-length-container) .left.menu,
	body .ui.container.menu:has(#dt-length-container) .right.menu {
		width: 100% !important;
		gap: 5px;
	}
	body .ui.container.menu:has(#dt-length-container) .left.menu .item:nth-of-type(1) {
		padding-left: 0;
	}
	/* -- Force the Right Menu to wrap for the search box -- */
	body .ui.container.menu:has(#dt-length-container) .right.menu {
		flex-wrap: wrap !important;
		justify-content: flex-start !important;
		gap: 10px 0;
	}
    body .ui.container.menu:has(#dt-length-container) .right.menu .item.last_item {
		flex-grow: 1 !important;
		padding-right: 0 !important;
	}
	/* -- Clean up the vertical lines (::before) for this specific menu -- */
	body .ui.container.menu:has(#dt-length-container) .item::before {
		display: none !important;
	}	
	/* -- The Base Stacking Logic -- */
	body #myTable,
	body #myTable thead,
	body #myTable tbody,
	body #myTable th,
	body #myTable td,
	body #myTable tr {
		display: block;
	}
	/* -- Remove default table borders that might interfere -- */
	body #myTable {
		border: none !important;
		background: transparent !important;
	}
	/* -- Hide the table header completely -- */
	body #myTable thead tr {
		position: absolute;
		top: -9999px;
		left: -9999px;
	}
	/* -- Style each table ROW as a "Card" -- */
	body #myTable tbody tr {
		margin-bottom: 20px;
		padding: 15px;
		background: #ffffff;
		border: 1px solid rgba(34, 36, 38, 0.15);
		border-radius: 0.2857rem;
		box-shadow: 0 1px 3px rgba(0,0,0,0.1);
	}
	/* -- Style the table CELLS to stack vertically -- */
	body #myTable td {
		border: none;
		position: relative;
		padding: 10px 0 10px 45% !important;
		text-align: left;
		font-size: 13.6px;
		line-height: 1.4;
	}
	/* -- Generate "Labels" for the cells from HTML data-label -- */
	body #myTable td:before {
		content: attr(data-label);
		position: absolute;
		top: 10px;
		left: 0;
		width: 40%;
		padding-right: 10px;
		white-space: nowrap;
		font-weight: 500;
		color: #585858;
	}
	body #myTable td span.ui.text {
		white-space: normal !important;
		display: inline-block;
		max-width: 100%; /* Ensures it never pushes past the TD boundary */
		line-height: 1.4;
	}
	body .dataTables_wrapper .dataTables_length,
	body .dataTables_wrapper .dataTables_filter {
		text-align: left !important;
		margin-bottom: 15px;
		display: block;
		width: 100%;
	}
	body .dataTables_wrapper .dataTables_filter input {
		width: 100% !important;
		margin-left: 0 !important;
		margin-top: 5px;
	}
	body #myTable td.body_controls {
		display: block !important;
		width: 100% !important;
		padding: 15px !important;
		text-align: right !important;
		border-top: 1px solid rgba(34, 36, 38, 0.1) !important;
		margin-top: 10px !important;
	}
	/* -- Remove the '#' or label from the button row if it exists -- */
	body #myTable td.body_controls::before {
		display: none !important;
	}
	/* -- Style the Edit and Delete buttons -- */
	body #myTable td.body_controls .edit_content,
	body #myTable td.body_controls .delete_content {
		min-width: 40px;
		padding: 9px 10px;
	}
	body #myTable td.body_controls .edit_content i,
	body #myTable td.body_controls .delete_content i {
		font-size: 1.1em;
		line-height: 1.2;
	}
	/* -- Style the pagination text and buttons -- */
	body .dataTables_wrapper .dataTables_info {
		float: none !important;
		display: flex !important;
		justify-content: center;
		margin: 15px auto 0;
	}
	body .dataTables_wrapper .dataTables_paginate {
		float: none !important;
		display: flex !important;
		justify-content: center !important;
		margin: 15px auto !important;
		width: fit-content; /* Ensures the background only wraps the buttons */
	}
	body.status .ui.container.menu.info_bar .right.menu {
		display: flex;
		align-items: center;
		margin-left: unset !important;
		padding: .92857143em 1.14285714em;
		flex: 1;
	}
	body.status .ui.container.menu.info_bar .right.menu .item.last_item {
		flex-grow: 1 !important;
		padding: 0 !important;
	}
	body.status #myTable tr.no_data_bg td {
		padding: 0 !important;
	}
	body.equipment-add .sub-machine-section #selected_machines_table .ui.selection.dropdown>.dropdown.icon,
	body.equipment-edit .sub-machine-section #selected_machines_table .ui.selection.dropdown>.dropdown.icon {
		right: 1.5em !important;
	}
	body.view-equipment .ui.grid.equipment-top-section > .column {
		width: 100% !important;
		padding-bottom: 10px;
	}
	/* -- The Base Stacking Logic -- */
	body.view-equipment .equipment-middle-section #equipment_machines_table,
	body.view-equipment .equipment-middle-section #equipment_machines_table thead,
	body.view-equipment .equipment-middle-section #equipment_machines_table tbody,
	body.view-equipment .equipment-middle-section #equipment_machines_table th,
	body.view-equipment .equipment-middle-section #equipment_machines_table td,
	body.view-equipment .equipment-middle-section #equipment_machines_table tr {
		display: block;
	}
	/* -- Remove default table borders that might interfere -- */
	body.view-equipment .equipment-middle-section #equipment_machines_table {
		border: none !important;
		background: transparent !important;
	}
	/* -- Hide the table header completely -- */
	body.view-equipment .equipment-middle-section #equipment_machines_table thead tr {
		position: absolute;
		top: -9999px;
		left: -9999px;
	}
	/* -- Style each table ROW as a "Card" -- */
	body.view-equipment .equipment-middle-section #equipment_machines_table tbody tr {
		margin-bottom: 20px;
		padding: 15px;
		background: #ffffff;
		border: 1px solid rgba(34, 36, 38, 0.15);
		border-radius: 0.2857rem;
		box-shadow: 0 1px 3px rgba(0,0,0,0.1);
	}
	/* -- Style the table CELLS to stack vertically -- */
	body.view-equipment .equipment-middle-section #equipment_machines_table td {
		border: none;
		position: relative;
		padding: 10px 0 10px 45% !important;
		text-align: left;
		font-size: 13.6px;
		line-height: 1.4;
		white-space: normal !important;
	}
	/* -- Generate "Labels" for the cells from HTML data-label -- */
	body.view-equipment .equipment-middle-section #equipment_machines_table td:before {
		content: attr(data-label);
		position: absolute;
		top: 10px;
		left: 0;
		width: 40%;
		padding-right: 10px;
		white-space: nowrap;
		font-weight: 500;
		color: #585858;
	}
	/* -- Style the font-weight for the machine title column -- */
	body.view-equipment .equipment-middle-section #equipment_machines_table td:first-of-type {
		font-weight: 500;
	}
	/* -- Style machine buttons controls -- */
	body.view-equipment .equipment-middle-section #equipment_machines_table .btn-controls {
		border-top: 1px solid rgba(34, 36, 38, 0.1) !important;
		margin-top: 10px !important;
		padding-right: 15px !important;
		text-align: right;
		padding-bottom: 0 !important;
	}
	body.view-equipment .equipment-middle-section #equipment_machines_table .btn-controls a {
		margin-top: 8px;
		margin-bottom: 4px;
	}
	body.view-equipment .equipment-middle-section #equipment_machines_table .btn-controls .ui.medium.label {
		font-size: 13px;
		padding: .78571429em 1.5em .78571429em;
	}
	/* -- Make the main menu container stack items vertically -- */
	body.registry-list .ui.container.menu.top_section {
		display: block !important;
		height: auto !important;
		border: none !important;
		box-shadow: none !important;
		padding: 0 !important;
	}
	/* -- Force left sub-menus to take full width -- */
	body.registry-list .ui.container.menu.top_section .left.menu {
		display: block;
		width: 100% !important;
		padding-top: 10px;
	}
	/* -- Force right sub-menus to take full width -- */
	body.registry-list .ui.container.menu.top_section .right.menu {
		display: block !important;
		width: 100% !important;
		padding-bottom: 10px;
		margin-bottom: 20px;
	}
	/* -- Add padding to left and right item -- */
	body.registry-list .ui.container.menu.top_section .left .item,
	body.registry-list .ui.container.menu.top_section .right .item {
		padding: .72857143em 1.14285714em !important;
		margin-bottom: 5px;
	}
	/* -- Make every button (a, button) 100% wide with spacing -- */
	body.registry-list .ui.container.menu.top_section .item a,
	body.registry-list .ui.container.menu.top_section .item button {
		width: 100% !important;
		display: block !important;
		text-align: center !important;
	}
	/* -- Remove margin from the very last button -- */
	body.registry-list .ui.container.menu.top_section .right.menu .item:last-child {
		margin-bottom: 0 !important;
	}
	/* -- Remove right margin from the very last button -- */
	body.registry-list .ui.container.menu.top_section .right.menu .item a:last-child {
		margin-right: 0 !important;
	}
}
/* -- Mobile specific styles -- */
@media only screen and (max-width: 767px) {
	body.dashboard .ui.stackable.grid>.column:not(.row) {
		padding: 1rem 0 !important;
	}
	/* -- Align table head and body controls -- */
	body .ui.table thead th.head_controls,
	body .ui.table tbody td.body_controls {
		text-align: left;
	}
	/* -- Make the main menu container stack items vertically -- */
	body .ui.container.menu {
		display: block !important;
		height: auto !important;
		border: none !important;
		box-shadow: none !important;
		padding: 0 !important;
	}
	/* -- Force left sub-menus to take full width -- */
	body .ui.container.menu .left.menu {
		display: block;
		width: 100% !important;
		padding-top: 10px;
	}
	/* -- Force right sub-menus to take full width -- */
	body .ui.container.menu .right.menu {
		display: block !important;
		width: 100% !important;
		padding-bottom: 10px;
		margin-bottom: 20px;
	}
	/* -- Add padding to left and right item -- */
	body .ui.container.menu .left .item,
	body .ui.container.menu .right .item {
		padding: .72857143em 1.14285714em !important;
		margin-bottom: 5px;
	}
	/* -- Make every button (a, button) 100% wide with spacing -- */
	body .ui.container.menu .item a,
	body .ui.container.menu .item button {
		width: 100% !important;
		display: block !important;
		text-align: center !important;
	}
	/* -- Remove margin from the very last button -- */
	body .ui.container.menu .right.menu .item:last-child {
		margin-bottom: 0 !important;
	}
	/* -- Remove right margin from the very last button -- */
	body .ui.container.menu .right.menu .item a:last-child {
		margin-right: 0 !important;
	}
	/* -- Force left sub-menus to take full width on import pages -- */
	body.label-import .ui.container.menu .left.menu,
	body.course-import .ui.container.menu .left.menu,
	body.machine-import .ui.container.menu .left.menu,
	body.company-import .ui.container.menu .left.menu,
	body.client-import .ui.container.menu .left.menu,
	body.equipment-import .ui.container.menu .left.menu,
	body.registry-import .ui.container.menu .left.menu,
	body.furs-import .ui.container.menu .left.menu {
		padding-bottom: 5px;
		margin-bottom: 20px;
	}
	/* -- Hide the text inside the labeled button on small screens -- */
    body.label-import .ui.action.input .ui.labeled.icon.button,
	body.course-import .ui.action.input .ui.labeled.icon.button,
	body.machine-import .ui.action.input .ui.labeled.icon.button,
	body.company-import .ui.action.input .ui.labeled.icon.button,
	body.client-import .ui.action.input .ui.labeled.icon.button,
	body.equipment-import .ui.action.input .ui.labeled.icon.button,
	body.registry-import .ui.action.input .ui.labeled.icon.button,
	body.furs-import .ui.action.input .ui.labeled.icon.button {
		width: auto;
		padding-left: 0 !important;
		padding-right: 0 !important;
	}
	/* -- Hide the actual text string but keep the icon -- */
    body.label-import .ui.action.input .ui.labeled.icon.button,
	body.course-import .ui.action.input .ui.labeled.icon.button,
	body.machine-import .ui.action.input .ui.labeled.icon.button,
	body.company-import .ui.action.input .ui.labeled.icon.button,
	body.client-import .ui.action.input .ui.labeled.icon.button,
	body.equipment-import .ui.action.input .ui.labeled.icon.button,
	body.registry-import .ui.action.input .ui.labeled.icon.button,
	body.furs-import .ui.action.input .ui.labeled.icon.button {
		text-indent: -9999px;
		white-space: nowrap;
		overflow: hidden;
		width: 45px;
	}
	/* -- Reset the icon to be visible and centered -- */
	body.label-import .ui.action.input .ui.labeled.icon.button > .icon,
	body.course-import .ui.action.input .ui.labeled.icon.button > .icon,
	body.machine-import .ui.action.input .ui.labeled.icon.button > .icon,
	body.company-import .ui.action.input .ui.labeled.icon.button > .icon,
	body.client-import .ui.action.input .ui.labeled.icon.button > .icon,
	body.equipment-import .ui.action.input .ui.labeled.icon.button > .icon,
	body.registry-import .ui.action.input .ui.labeled.icon.button > .icon,
	body.furs-import .ui.action.input .ui.labeled.icon.button > .icon {
		text-indent: 0;
		width: 100% !important;
		background-color: transparent !important;
	}
	/* -- The Base Stacking Logic -- */
	body #myTable,
	body #myTable thead,
	body #myTable tbody,
	body #myTable th,
	body #myTable td,
	body #myTable tr {
		display: block;
	}
	/* -- Remove default table borders that might interfere -- */
	body #myTable {
		border: none !important;
		background: transparent !important;
	}
	/* -- Hide the table header completely -- */
	body #myTable thead tr {
		position: absolute;
		top: -9999px;
		left: -9999px;
	}
	/* -- Style each table ROW as a "Card" -- */
	body #myTable tbody tr {
		margin-bottom: 20px;
		padding: 15px;
		background: #ffffff;
		border: 1px solid rgba(34, 36, 38, 0.15);
		border-radius: 0.2857rem;
		box-shadow: 0 1px 3px rgba(0,0,0,0.1);
	}
	/* -- Style the table CELLS to stack vertically -- */
	body #myTable td {
		border: none;
		position: relative;
		padding: 10px 0 10px 45% !important;
		text-align: left;
		font-size: 13.6px;
		line-height: 1.4;
	}
	/* -- Generate "Labels" for the cells from HTML data-label -- */
	body #myTable td:before {
		content: attr(data-label);
		position: absolute;
		top: 10px;
		left: 0;
		width: 40%;
		padding-right: 10px;
		white-space: nowrap;
		font-weight: 500;
		color: #585858;
	}
	body #myTable td span.ui.text {
		white-space: normal !important;
		display: inline-block;
		max-width: 100%; /* Ensures it never pushes past the TD boundary */
		line-height: 1.4;
	}
	body .dataTables_wrapper .dataTables_length,
	body .dataTables_wrapper .dataTables_filter {
		text-align: left !important;
		margin-bottom: 15px;
		display: block;
		width: 100%;
	}
	body .dataTables_wrapper .dataTables_filter input {
		width: 100% !important;
		margin-left: 0 !important;
		margin-top: 5px;
	}
	body #myTable td.body_controls {
		display: block !important;
		width: 100% !important;
		padding: 15px !important;
		text-align: right !important;
		border-top: 1px solid rgba(34, 36, 38, 0.1) !important;
		margin-top: 10px !important;
	}
	/* -- Remove the '#' or label from the button row if it exists -- */
	body #myTable td.body_controls::before {
		display: none !important;
	}
	/* -- Style the Edit and Delete buttons -- */
	body #myTable td.body_controls .edit_content,
	body #myTable td.body_controls .delete_content {
		min-width: 40px;
		padding: 9px 10px;
	}
	body #myTable td.body_controls .edit_content i,
	body #myTable td.body_controls .delete_content i {
		font-size: 1.1em;
		line-height: 1.2;
	}
	/* -- Style the pagination text and buttons -- */
	body .dataTables_wrapper .dataTables_info {
		float: none !important;
		display: flex !important;
		justify-content: center;
		margin: 15px auto 0;
	}
	body .dataTables_wrapper .dataTables_paginate {
		float: none !important;
		display: flex !important;
		justify-content: center !important;
		margin: 15px auto !important;
		width: fit-content; /* Ensures the background only wraps the buttons */
	}
	body.status .ui.container.menu.info_bar .right.menu {
		padding-top: 10px;
	}
	/* -- View Client Data -- */
	body.view-client .ui.stackable.grid>.column:not(.row) {
		padding: 1rem 0 !important;
	}
	/* -- View Company Details Data -- */
	body.view-company-details .ui.stackable.grid>.column:not(.row) {
		padding: 1rem 0 !important;
	}
	/* -- Add Bottom Padding -- */
	body.view-status .ui.container.menu .left.menu,
	body.view-client-company .ui.container.menu .left.menu,
	body.view-equipment-company .ui.container.menu .left.menu,
	body.view-company-details .ui.container.menu .left.menu {
		padding-bottom: 5px;
	}
	/* -- Add / Edit Equipment Data -- */
	body.equipment-add .fields .sub-left-section,
	body.equipment-add .fields .sub-right-section,
	body.equipment-edit .fields .sub-left-section,
	body.equipment-edit .fields .sub-right-section {
		margin-bottom: 0 !important;
	}
	body.equipment-add .sub-machine-section,
	body.equipment-edit .sub-machine-section {
		margin-top: 10px !important;
	}
	/* -- The Base Stacking Logic -- */
	body.equipment-add .sub-machine-section #selected_machines_table,
	body.equipment-add .sub-machine-section #selected_machines_table thead,
	body.equipment-add .sub-machine-section #selected_machines_table tbody,
	body.equipment-add .sub-machine-section #selected_machines_table th,
	body.equipment-add .sub-machine-section #selected_machines_table td,
	body.equipment-add .sub-machine-section #selected_machines_table tr,
	body.equipment-edit .sub-machine-section #selected_machines_table,
	body.equipment-edit .sub-machine-section #selected_machines_table thead,
	body.equipment-edit .sub-machine-section #selected_machines_table tbody,
	body.equipment-edit .sub-machine-section #selected_machines_table th,
	body.equipment-edit .sub-machine-section #selected_machines_table td,
	body.equipment-edit .sub-machine-section #selected_machines_table tr{
		display: block;
	}
	/* -- Remove default table borders that might interfere -- */
	body.equipment-add .sub-machine-section #selected_machines_table,
	body.equipment-edit .sub-machine-section #selected_machines_table {
		border: none !important;
		background: transparent !important;
	}
	/* -- Hide the table header completely -- */
	body.equipment-add .sub-machine-section #selected_machines_table thead tr,
	body.equipment-edit .sub-machine-section #selected_machines_table thead tr {
		position: absolute;
		top: -9999px;
		left: -9999px;
	}
	/* -- Style each table ROW as a "Card" -- */
	body.equipment-add .sub-machine-section #selected_machines_table tbody tr,
	body.equipment-edit .sub-machine-section #selected_machines_table tbody tr {
		margin-bottom: 20px;
		padding: 15px;
		background: #ffffff;
		border: 1px solid rgba(34, 36, 38, 0.15);
		border-radius: 0.2857rem;
		box-shadow: 0 1px 3px rgba(0,0,0,0.1);
	}
	/* -- Style the table CELLS to stack vertically -- */
	body.equipment-add .sub-machine-section #selected_machines_table td,
	body.equipment-edit .sub-machine-section #selected_machines_table td {
		border: none;
		position: relative;
		padding: 10px 0 10px 45% !important;
		text-align: left;
		font-size: 13.6px;
		line-height: 1.4;
		white-space: normal !important;
	}
	/* -- Generate "Labels" for the cells from HTML data-label -- */
	body.equipment-add .sub-machine-section #selected_machines_table td:before,
	body.equipment-edit .sub-machine-section #selected_machines_table td:before {
		content: attr(data-label);
		position: absolute;
		top: 10px;
		left: 0;
		width: 40%;
		padding-right: 10px;
		white-space: nowrap;
		font-weight: 500;
		color: #585858;
	}
	/* -- Style the font-weight for the machine title column -- */
	body.equipment-add .sub-machine-section #selected_machines_table td:first-of-type,
	body.equipment-edit .sub-machine-section #selected_machines_table td:first-of-type {
		font-weight: 500;
	}
	/* -- Set min-width for select field -- */
	body.equipment-add .sub-machine-section #selected_machines_table .ui.selection.dropdown,
	body.equipment-edit .sub-machine-section #selected_machines_table .ui.selection.dropdown {
		min-width: 12em !important;
	}
	/* -- Set right position for select dropdown icon -- */
	body.equipment-add .sub-machine-section #selected_machines_table .ui.selection.dropdown>.dropdown.icon,
	body.equipment-edit .sub-machine-section #selected_machines_table .ui.selection.dropdown>.dropdown.icon {
		right: 1.3em !important;
	}
	/* -- Style machine buttons controls -- */
	body.equipment-add .sub-machine-section #selected_machines_table .btn-controls,
	body.equipment-edit .sub-machine-section #selected_machines_table .btn-controls {
		border-top: 1px solid rgba(34, 36, 38, 0.1) !important;
		margin-top: 10px !important;
		padding-right: 15px !important;
		text-align: right;
	}
	/* -- Add top margin to remove machine buttons -- */
	body.equipment-add .sub-machine-section #selected_machines_table .btn-controls .button,
	body.equipment-edit .sub-machine-section #selected_machines_table .btn-controls .button {
		margin-top: 5px;
	}
	/* -- View Equipment Data -- */
	body.view-equipment .ui.stackable.grid>.column:not(.row) {
		padding: 1rem 0 !important;
	}
	/* -- The Base Stacking Logic -- */
	body.view-equipment .equipment-middle-section #equipment_machines_table,
	body.view-equipment .equipment-middle-section #equipment_machines_table thead,
	body.view-equipment .equipment-middle-section #equipment_machines_table tbody,
	body.view-equipment .equipment-middle-section #equipment_machines_table th,
	body.view-equipment .equipment-middle-section #equipment_machines_table td,
	body.view-equipment .equipment-middle-section #equipment_machines_table tr {
		display: block;
	}
	/* -- Remove default table borders that might interfere -- */
	body.view-equipment .equipment-middle-section #equipment_machines_table {
		border: none !important;
		background: transparent !important;
	}
	/* -- Hide the table header completely -- */
	body.view-equipment .equipment-middle-section #equipment_machines_table thead tr {
		position: absolute;
		top: -9999px;
		left: -9999px;
	}
	/* -- Style each table ROW as a "Card" -- */
	body.view-equipment .equipment-middle-section #equipment_machines_table tbody tr {
		margin-bottom: 20px;
		padding: 15px;
		background: #ffffff;
		border: 1px solid rgba(34, 36, 38, 0.15);
		border-radius: 0.2857rem;
		box-shadow: 0 1px 3px rgba(0,0,0,0.1);
	}
	/* -- Style the table CELLS to stack vertically -- */
	body.view-equipment .equipment-middle-section #equipment_machines_table td {
		border: none;
		position: relative;
		padding: 10px 0 10px 45% !important;
		text-align: left;
		font-size: 13.6px;
		line-height: 1.4;
		white-space: normal !important;
	}
	/* -- Generate "Labels" for the cells from HTML data-label -- */
	body.view-equipment .equipment-middle-section #equipment_machines_table td:before {
		content: attr(data-label);
		position: absolute;
		top: 10px;
		left: 0;
		width: 40%;
		padding-right: 10px;
		white-space: nowrap;
		font-weight: 500;
		color: #585858;
	}
	/* -- Style the font-weight for the machine title column -- */
	body.view-equipment .equipment-middle-section #equipment_machines_table td:first-of-type {
		font-weight: 500;
	}
	/* -- Style machine buttons controls -- */
	body.view-equipment .equipment-middle-section #equipment_machines_table .btn-controls {
		border-top: 1px solid rgba(34, 36, 38, 0.1) !important;
		margin-top: 10px !important;
		padding-right: 15px !important;
		text-align: right;
		padding-bottom: 0 !important;
	}
	body.view-equipment .equipment-middle-section #equipment_machines_table .btn-controls .ui.button {
		margin-top: 4px;
		margin-bottom: 4px;
		padding: 10px 12px !important;
		min-width: 40px;
	}
	body.view-equipment .equipment-middle-section #equipment_machines_table .btn-controls .ui.button span {
		display: none !important;
	}
	body.view-equipment .equipment-middle-section #equipment_machines_table .btn-controls .ui.button > .icon {
		margin: 0 !important;
		font-size: 1.1em !important;
		line-height: 1.2 !important;
	}
	body.view-equipment .equipment-middle-section #equipment_machines_table .btn-controls .ui.button:last-of-type {
		margin-right: 0;
	}
	body.view-equipment .equipment-middle-section #equipment_machines_table .ui.medium.label {
		line-height: 1.2;
	}
	body.view-equipment .equipment-middle-section #equipment_machines_table .btn-controls .ui.medium.label {
		padding: .68571429em 1.2em .68571429em;
	}
}