:root{
	--w: 250px;
	--syz: 30px;
	--syz_2: 60px;
	--light-gray: #f3f3f3;
}
.upbtn{
	opacity: 0;
	pointer-events: none;
}
input[type="radio"]:checked{
	scale: 1.5;
}
tr:has(input[type="radio"]:checked),tr:has(input[type="radio"]:checked):hover{
	background: var(--lightcolor2);
}

/* loader */
	.loader {
		width: 50px;
		aspect-ratio: 1;
		display: grid;
		border: 4px solid #0000;
		border-radius: 50%;
		border-right-color: var(--themecolor);
		animation: l15 1s infinite linear;
	}
	.loader::before,
	.loader::after {
		content: "";
		grid-area: 1/1;
		margin: 2px;
		border: inherit;
		border-radius: 50%;
		animation: l15 2s infinite ease-out;
	}
	.loader::after {
		margin: 8px;
		animation-duration: 3s;
	}
	@keyframes l15{
		100%{transform: rotate(1turn)}
	}

	.pageloader_waiter {
		opacity: 0;
	    position: fixed;
	    bottom: 20px;
	    right: 0;
	    z-index: 200;
	    width: 100%;
	    /*animation-fill-mode: forwards;*/
	    animation-duration: 300ms;
	}
	.pageloader_waiter>div {
	    padding: 8px 16px;
	    background: black;
	    color: #fff;
		min-width: 200px;
		border-radius: var(--roundness);
	}

/* Sidebar */
	body.modal-open .menubar{
		translate: -20px 0;
		opacity: 0;
		pointer-events: none;
	}
	.menubar {
		position: fixed;
		left: 0;
		top: 0;
		height: 100vh;
		width: var(--w);
		background: var(--clr-text);
		z-index: 1000;
		transition: all 0.3s ease;
		/*box-shadow: 4px 0 10px rgba(0,0,0,0.1);*/
		overflow: auto;
	}
	.menubar:not(.squish){
		overflow-x: hidden;
	}
	.menubar.unavailable{
		opacity: 0.3;
		pointer-events: none;
		/*position: relative;*/
	}
	.menubar.unavailable::before{
		content: '';
		position: absolute;
		top: 0;
		left: 0;
		height: 100%;
		width: 100%;
		background: var(--themecolor);
	}
	.menubar.squish, .menubar.squish + main{
		--w: 45px;
		overflow-x: visible;
	}
	.menubar.squish a::after{
		opacity: 0 !important;
	}
	.menubar .menubar-header {
		padding: 19px;
		text-align: center;
		border-bottom: 1px solid var(--themecolor);
		width: var(--w);
	}
	.menubar .menubar-brand {
		color: white;
		font-size: 1.1rem;
		font-weight: 800;
		text-decoration: none;
		display: flex;
		align-items: center;
		justify-content: flex-start;
		gap: 10px;
	}
	.menubar .menubar-menu {
		padding: 20px 0;
		overflow-x: hidden;
	}
	.menubar .menubar-menu a.menulink {
		display: flex;
		align-items: center;
		padding: 8px 16px;
		color: rgba(255,255,255,0.8);
		text-decoration: none;
		transition: all 0.3s ease;
		font-weight: 500;
		border-right: 1px solid transparent;
		position: relative;
		width: var(--w);
		--c: var(--clr-alttext);
	}
	.menubar .menubar-menu a.menulink::after{
		position: absolute;
		content: '';
		top: 0;
		right: 0;
		width: 7px;
		height: 100%;
		background: linear-gradient(-90deg, var(--c), transparent);
		opacity: 0;
		transition: 0.4s ease-out;
		z-index: 1;
	}
	.menubar .menubar-menu a.menulink:hover, .menubar-menu a.menulink.active {
		/*background: var(--clr-bgglass);*/
		background: var(--darkcolor);
		color: white;
		border-right: 7px solid var(--c);
	}
	.menubar-menu a.menulink.active::after{
		opacity: 1;
		width: 30px;
	}
	.menubar .menubar-menu i {
		width: 25px;
		margin-right: 10px;
		font-size: 16px;
	}
	.menubar.squish .menubar-menu{
		overflow: visible;
	}
	.menubar.squish a.menulink{
		/*width: var(--w);*/
	}
	.menubar.squish .menubar-brand{
		display: none;
	}
	.menubar.squish a.menulink>span{
		display: none;
	}

/* Main content */
	main {
		margin-left: var(--w);
		width: calc(100vw - var(--w));
		padding: 20px;
		min-height: 100vh;
	}

/* topnav */
	.topnav {
		background: var(--clr-panelbg);
		padding: 2px 16px;
		border-radius: var(--roundness);
		box-shadow: var(--clr-shadow);
		margin-bottom: 25px;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
	.topnav .title {
		font-weight: 700;
		font-size: 1.2rem;
		display: inline-block;
		margin: 7px 0;
	}
	.topnav .navops {
		display: flex;
		align-items: center;
		gap: 20px;
	}
	.topnav .logo_part img{
		height: 32px;
	}
	.navops .nav-icon {
		position: relative;
		width: var(--syz);
		height: var(--syz);
		border-radius: 50%;
		background: var(--clr-border);
		display: flex;
		align-items: center;
		justify-content: center;
		border: none;
		color: var(--clr-alttext);
		cursor: pointer;
		transition: all 0.3s;
	}
	.navops .nav-icon:hover {
		background: var(--themecolor);
		scale: 1.1;
	}
	[data-notifications]{
		--w: 24px;
		position: relative;
	}
	[data-notifications]:not([data-notifications="0"])::before {
		content: attr(data-notifications);
		position: absolute;
		top: -2px;
		right: -2px;
		background: var(--danger);
		color: white;
		font-size: 0.97rem;
		width: var(--w);
		height: var(--w);
		border-radius: 50%;
		display: flex;
		align-items: center;
		justify-content: center;
		font-weight: 900;
	}

/* user profile widget */
	.user-profile {
		display: flex;
		align-items: center;
		gap: 10px;
		cursor: pointer;
	}
	.user-profile img, .user-profile .imgstandin {
		width: var(--syz);
		height: var(--syz);
		border-radius: 50%;
		object-fit: cover;
		border: 2px solid var(--primary-purple);
		background-image: linear-gradient(80deg,var(--seccolor),var(--themecolor));
		display: inline-flex;
		justify-content: center;
		align-items: center;
		color: #fff;
	}

/* non reusable popups */
	.menubar.squish [data-sidenote]{
		position: relative;
	}
	.menubar.squish [data-sidenote]::before{
		content: attr(data-sidenote);
		overflow: hidden;
		position: fixed;
		box-sizing: border-box;
		z-index: 3;
		opacity: 0;
		left: 45px;
		background: var(--c);
		color: var(--clr-text);
		padding: 6px 16px 6px 4px;
		translate: 0 12px;
		pointer-events: none;
		/*border-radius: 0 var(--roundness) var(--roundness) 0;*/
		box-shadow: 8px 0 10px var(--clr-shadow);
		/* width: 0px; */
		transition: 0.4s ease-out;
		width: 180px;
	}
	.menubar.squish [data-sidenote].active:hover::before{
		background-color: var(--themecolor);
		color: #fff;
	}
	.menubar.squish [data-sidenote]:hover::before{
		opacity: 1;
		/* width: 90px; */
		pointer-events: all;
		translate: 0 0;
	}

/* Forms */
	.form-group {
		margin-bottom: 20px;
	}
	.form-label {
		display: block;
		font-size: 13px;
		font-weight: 700;
		color: var(--clr-text-muted);
		margin-bottom: 8px;
	}
	.form-control-custom {
		width: 100%;
		padding: 8px 16px;
		border: 1px solid var(--clr-border);
		border-radius: var(--roundness);
		font-size: 14px;
		transition: all 0.3s;
	}
	.form-control-custom:focus {
		outline: none;
		border-color: var(--primary);
		box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.1);
	}
	.form-control-custom[readonly="true"],.form-control-custom[readonly="true"] label{
		opacity: 0.3;
	}

/* dash styles */
	.stats-row {
		margin-bottom: 25px;
		display: flex;
		align-items: stretch;
		justify-content: flex-start;
		flex-wrap: wrap;
		width: 100%;
		gap: 20px;
	}

	.stat-card:hover {
		box-shadow: 0 0 20px var(--lightcolor) !important;
		border: 1px solid transparent;
	}
	.stat-card .stats{
		display: flex;
		flex-direction: column;
		justify-content: center;
		gap: 5px;
	}
	.stat-card .stats h3{
		margin: 0;
		padding: 0;
		font-weight: 700;
	}
	.stat-card .icon {
		/*--c: black;*/
		width: var(--syz_2);
		height: var(--syz_2);
		border-radius: calc(var(--roundness) / 2);
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 24px;
		position: relative;
		overflow: hidden;
		--c: slateblue;
	}
	.stat-card .icon::before {
		content: '';
		position: absolute;
		z-index: 1;
		background: var(--c);
		width: 100%;
		height: 100%;
		opacity: 0.3;
		top: 0;
		left: 0;
		mix-blend-mode: hard-light;
	}

	.stat-card .icon.primary{--c: var(--themecolor); }
	.stat-card .icon.urgent{--c: green;}

	.stat-info h3 {
		font-size: 28px;
		font-weight: 700;
		color: var(--text-dark);
		margin: 0;
	}
	.stat-info p {
		color: var(--text-muted);
		margin: 0;
		font-size: 14px;
	}

/* datatables setup */
	.data-container {
		background: white;
		border-radius: var(--roundness);
		box-shadow: var(--clr-shadow);
		/*border: 1px solid var(--clr-border);*/
		overflow: hidden;
	}
	.data-container .data-header {
		padding: 20px;
		border-bottom: 1px solid var(--border);
		display: flex;
		justify-content: space-between;
		align-items: center;
		flex-wrap: wrap;
		gap: 15px;
	}

	.data-container .data-title {
		font-size: 16px;
		font-weight: 600;
		color: var(--dark);
	}

	.data-container .data-actions {
		display: flex;
		gap: 10px;
		align-items: center;
	}

	.data-container .search-table {
		position: relative;
	}

	.data-container .search-table input {
		padding: 8px 35px 8px 15px;
		border: 1px solid var(--clr-border);
		border-radius: 20px;
		font-size: 13px;
		width: 250px;
	}

	.data-container .search-table i {
		position: absolute;
		right: 12px;
		top: 50%;
		transform: translateY(-50%);
		color: var(--gray);
		font-size: 13px;
	}

	.table-modern {
		width: 100%;
		border-collapse: separate;
		border-spacing: 0;

		--w_sm: 48px;
		--w: 125px;
		--w_m: calc(var(--w) * 2);
	}
	.table-modern thead th {
		background: var(--light-gray);
		padding: 14px 20px;
		font-size: 12px;
		font-weight: 600;
		color: var(--gray);
		text-transform: uppercase;
		letter-spacing: 0.5px;
		border-bottom: 1px solid var(--clr-border);
		white-space: nowrap;
		cursor: pointer;
		user-select: none;
		transition: background 0.3s;
	}
	.table-modern thead th:hover {
		background: #e2e8f0;
	}
	.table-modern thead th i {
		margin-left: 5px;
		font-size: 10px;
	}
	.table-modern tbody tr {
		transition: all 0.3s;
	}
	.table-modern tbody tr:hover {
		background: #f8fafc;
	}
	.table-modern tbody td {
		padding: 16px 20px;
		border-bottom: 1px solid var(--clr-border);
		font-size: 14px;
		vertical-align: middle;
	}
	.table-modern tbody tr:last-child td {
		border-bottom: none;
	}
	.checkbox-custom {
		width: 18px;
		height: 18px;
		border: 2px solid var(--border);
		border-radius: 4px;
		cursor: pointer;
		transition: all 0.3s;
		appearance: none;
		position: relative;
	}
	.checkbox-custom:checked {
		background: var(--primary);
		border-color: var(--primary);
	}
	.checkbox-custom:checked::after {
		content: '\f00c';
		font-family: 'Font Awesome 5 Free';
		font-weight: 900;
		color: white;
		font-size: 10px;
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
	}

/* content modals */
	.sample-info-card {
		background: white;
		border: 1px solid var(--themecolor);
		border-radius: 8px;
		padding: 20px;
		margin-bottom: 20px;
		box-shadow: 0 2px 4px rgba(0,0,0,0.05);
	}
	.sample-info-card h5 {
		color: var(--themecolor);
		font-weight: 600;
		margin-bottom: 16px;
		border-bottom: 1px solid var(--themecolor);
		padding-bottom: 8px;
	}

/* content cards */
	.content-card {
		background: white;
		border-radius: var(--roundness);
		padding: 25px;
		box-shadow: 0 2px 10px rgba(0,0,0,0.05);
		margin-bottom: 25px;
		height: 100%;
		border: 1px solid var(--border);
	}
	.card-header-custom {
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin-bottom: 20px;
	}
	.card-title {
		font-size: 18px;
		font-weight: 800;
		/*color: var(--text-dark);*/
		margin: 0;
	}

/* activities area */
	.activity-item {
		padding: 15px 0;
		border-bottom: 1px solid #f0f0f0;
	}

	.activity-item:last-child {
		border-bottom: none;
	}

	.activity-venue {
		font-weight: 800;
		color: var(--clr-text);
		font-size: 14px;
		margin-bottom: 5px;
	}

	.activity-date {
		color: var(--themecolor);
		font-size: 12px;
		/*opacity: 0.8;*/
		margin-bottom: 5px;
	}

	.activity-desc {
		color: var(--text-muted);
		font-size: 13px;
		line-height: 1.5;
	}

/* calendar */
	.calendar-header {
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin-bottom: 15px;
	}
	.calendar-nav {
		display: flex;
		gap: 10px;
	}
	.calendar-nav button {
		background: var(--gray);
		border: none;
		width: 30px;
		height: 30px;
		border-radius: 50%;
		color: var(--clr-alttext);
		cursor: pointer;
		transition: all 0.3s;
	}
	.calendar-nav button:hover {
		background: var(--themecolor);
		color: white;
	}
	.calendar-grid {
		display: grid;
		grid-template-columns: repeat(7, 1fr);
		gap: 5px;
		text-align: center;
	}
	.calendar-grid .calendar-day-header {
		font-weight: 600;
		color: var(--text-muted);
		font-size: 12px;
		padding: 10px 0;
	}

	.calendar-grid .calendar-day {
		aspect-ratio: 1;
		display: flex;
		align-items: center;
		justify-content: center;
		border-radius: 50%;
		font-size: 14px;
		cursor: pointer;
		transition: all 0.3s;
		position: relative;
	}
	.calendar-grid .calendar-day:hover {
		background: var(--darkcolor);
		color: var(--clr-alttext);
	}
	.calendar-grid .calendar-day.active {
		background: var(--success);
		color: white;
	}
	.calendar-grid .calendar-day.today {
		background: var(--themecolor);
		color: white;
	}
	.calendar-grid .calendar-day.event::after {
		content: '';
		position: absolute;
		bottom: 2px;
		width: 4px;
		height: 4px;
		background: var(--danger);
		border-radius: 50%;
	}
	.calendar-grid .calendar-day.other-month {
		color: #ccc;
	}

/* chart styles */
	.chart-container {
		position: relative;
		height: 250px;
		margin-top: 20px;
	}

	.chart-legend {
		display: flex;
		gap: 20px;
		margin-bottom: 15px;
		flex-wrap: wrap;
	}

	.legend-item {
		display: flex;
		align-items: center;
		gap: 8px;
		font-size: 13px;
		color: var(--text-muted);
	}

	.legend-dot {
		width: 10px;
		height: 10px;
		border-radius: 50%;
	}

/* viewer styles */
	.page-header {
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin-bottom: 25px;
		flex-wrap: wrap;
		gap: 15px;
		background: var(--clr-panelbg);
		padding: 20px;
		border-radius: var(--roundness);
		/*box-shadow: var(--shadow-sm);*/
	}
	.page-header .page-title h2 {
		/*font-size: 28px;*/
		font-weight: 700;
		color: var(--dark);
		margin: 0;
	}

	.page-title p {
		color: var(--gray);
		margin: 5px 0 0 0;
		font-size: 14px;
	}

	.header-actions {
		display: flex;
		gap: 12px;
		align-items: center;
	}

	.breadcrumb-custom {
		display: flex;
		align-items: center;
		gap: 8px;
		font-size: 14px;
		color: var(--gray);
	}

	.breadcrumb-custom a {
		color: var(--primary);
		text-decoration: none;
	}

	.breadcrumb-custom a:hover {
		text-decoration: underline;
	}

/* permissions display */
	.permissions {
		background: transparent;
		padding: 16px;
		border-radius: calc(var(--roundness) * 0.6);
		border: 1px solid color-mix(in srgb, var(--clr-text) 5%, transparent);
	}
	.permissions > i {
		display: block;
		font-size: 0.75rem;
		font-weight: 600;
		text-transform: uppercase;
		letter-spacing: 0.05em;
		opacity: 0.7;
		margin-bottom: 12px;
		font-style: normal;
	}
	.permissions ul {
		list-style: none;
		padding: 0;
		margin: 0;
		display: flex;
		flex-wrap: wrap;
		gap: 8px;
	}
	.permissions li {
		font-size: 0.85rem;
		font-weight: 500;
		padding: 6px 12px;
		background: color-mix(in srgb, var(--clr-panelbg) 60%, var(--clr-text) 5%);
		border-radius: calc(var(--roundness) * 0.4);
		border: 1px solid color-mix(in srgb, var(--clr-text) 8%, transparent);
		font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
		font-size: 0.8rem;
	}

/* buttons */
	.mybtn {
		border: none;
		padding: 10px 20px;
		border-radius: var(--roundness);
		font-weight: 500;
		display: inline-flex;
		justify-content: center;
		align-items: center;
		gap: 8px;
		transition: all 0.3s;
		cursor: pointer;
	}
	.mybtn:hover{scale: 1.03;}
	.mybtn.primary{
		background: var(--themecolor);
		color: white;
	}
	.mybtn.primary:hover{
		background: var(--darkcolor);
		color: white;
		box-shadow: var(--themeshadow);
		text-decoration: none;
	}
	.mybtn.trans{
		background: none;
		color: white;
	}
	.mybtn.sm {
		padding: 8px 16px;
	}
	.mybtn.secondary,.mybtn.outline{
		border: 1px solid var(--themecolor);
		color: var(--themecolor);
		background: var(--clr-alttext);
	}
	.mybtn.secondary:hover,.mybtn.outline:hover{
		background: var(--themecolor);
		border: 1px solid var(--themecolor);
		color: white;
		box-shadow: var(--themeshadow);
		text-decoration: none;
	}
	.mybtn.danger{
		color: #fff;
		background: var(--danger);
	}
	.mybtn.danger:hover{
		background: var(--red);
		color: white;
		/*box-shadow: var(--themeshadow);*/
		text-decoration: none;
	}
	.backbtn {
		padding: 8px 12px;
		display: inline-block;
		background: var(--themecolor);
		color: #fff;
		border-radius: var(--roundness);
		margin: 12px 0;
	}
	.backbtn:hover {
		text-decoration: none;
		color: #fff;
		background-color: var(--darkcolor);
	}

/* panels */
	.data-panel .data-header{
		padding: 12px;
		border-bottom: 1px solid var(--clr-border);
		display: flex;
		justify-content: space-between;
		align-items: center;
		flex-wrap: wrap;
		gap: 15px;
	}

/* view info UIs */
	.profile_card{
		gap: var(--size-sm);
		background: var(--clr-panelbg);
		border-radius: var(--roundness);
		max-width: 900px;
		margin: 0 auto;

		--width: 400px;
	}
	.profile_card .card-header{
		padding: var(--size-sm);
		position: relative;
		width: 100%;
		border-radius: var(--roundness) var(--roundness) 0 0;
		color: #fff;
	}

	.profile_card .media{
		display: flex;
		flex-wrap: nowrap;
		flex-direction: row;
		width: 100%;
		padding: 12px 0;
		flex: 1 1 calc(var(--width) * 0.7);
	}
	.profile_card .avatar-circle {
		--w: 48px;
		width: var(--w);
		height: var(--w);
		border-radius: 50%;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 1.75rem;
		font-weight: 700;
		box-shadow: 0 4px 15px rgba(0,0,0,0.15);
		border: 3px solid rgba(255,255,255,0.3);
	}
	.profile_card .stats .stat{
		--myw: 175px;
		flex: 1 0 var(--myw);
		padding: 12px 0;
	}

	.profile_card .icon-circle {
		--w: 48px;
		width: var(--w);
		height: var(--w);
		border-radius: 50%;
		color: var(--themecolor);
		background-color: #eef;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 1rem;
	}

	.action-card {
		transition: all 0.3s ease;
		cursor: pointer;
		border: 2px solid #fefefe;
	}
	.action-card:hover {
		transform: translateY(-2px);
		box-shadow: 0 4px 12px rgba(0,0,0,0.1);
		border-color: var(--themecolor);
	}
	.action-card .action-icon {
		width: 56px;
		height: 56px;
		border-radius: 50%;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 1.5rem;
		margin-bottom: 12px;
	}

/* Progress Indicator */
	.progress-indicator {
		border-radius: 15px;
		padding: 20px 30px;
		position: sticky;
		top: 8px;
	}
	.progress-indicator .progress-steps {
		display: flex;
		justify-content: space-between;
		position: relative;
		--l: 65px;
	}
	.progress-indicator .progress-steps::before {
		content: '';
		position: absolute;
		width: calc(96% - var(--l));
		top: 20px;
		left: var(--l);
		right: 0;
		height: 2px;
		background-color: var(--clr-border);
		opacity: 0.3;
		z-index: 0;
	}
	.progress-indicator .progress-line {
		position: absolute;
		width: calc(96% - var(--l));
		top: 20px;
		left: var(--l);
		height: 2px;
		/*background: var(--themecolor);*/
		z-index: 1;
		transition: width 0.3s ease;
	}

	.progress-indicator .step {
		display: flex;
		flex-direction: column;
		align-items: center;
		z-index: 2;
		/*background-color: var(--clr-text-muted);*/
		padding: 0 10px;
		cursor: pointer;
	}
	.progress-indicator .step-circle {
		width: 40px;
		height: 40px;
		border-radius: 50%;
		background-color: var(--clr-fade);
		display: flex;
		align-items: center;
		justify-content: center;
		margin-bottom: 8px;
		transition: all 0.3s ease;
	}
	.progress-indicator .step.active .step-circle {
		background: var(--themecolor);
		color: #fff;
		scale: 1.4;
	}
	.progress-indicator .step.completed .step-circle {
		background: var(--success);
		color: #fff;
	}
	.progress-indicator .step.completed .step-label {
		color: var(--success);
	}
	.progress-indicator .step-label {
		font-size: 13px;
		color: var(--clr-text-muted);
		font-weight: 500;
	}
	.progress-indicator .step.active .step-label {
		color: var(--themecolor);
	}

/* report_setup */
	[data-role="report_setup"] {
		padding: 64px 48px;
		background: #fff;
		--r_border: #000;
		--w: 824px;
		width: var(--w);
		min-height: 1056px;
		font-size: 0.9rem;
		color: #000;
	}
	[data-role="report_setup"]>div{
	}
	[data-role="report_setup"] .page-section{
		margin-bottom: 16px;
		position: relative;
		/*background: red;*/
	}
	[data-role="report_setup"] .page-section.header{
		border: 1px solid var(--r_border);
		padding: 12px 0;
	}
	[data-role="report_setup"] .heading {
		color: var(--darkcolor);
		font-weight: 700;
		margin: 0px;
		transform: translateY(-7px);
		padding: 0;
	}
	[data-role="report_setup"] .thelogo{
		padding: 0 16px;
	}
	[data-role="report_setup"] .thelogo img{
		width: 105px;
		aspect-ratio: 1;
		/*object-fit: cover;*/
	}
	[data-role="report_setup"] .thelogo + div{
		width: 100%;
	}

/* table styles */
	.mytable{
		width: 100%;
		--r_border: #000;
	}
	.mytable td,.mytable th{
		padding: 1px 3px;
	}
	.mytable tr th,.mytable tr td{
		border-top: 1px solid var(--r_border);
		border-left: 1px solid var(--r_border);
	}
	.mytable tr th:last-child,.mytable tr td:last-child{
		border-right: 1px solid var(--r_border);
	}
	.mytable tbody tr:last-child td{
		border-bottom: 1px solid var(--r_border);
	}
	.mytable.last td,.mytable.last th{
		/*border: none;*/
		/*padding: 0;*/
	}
	.mytable tr td>*,.mytable tr th>*,.rendercorrect>*{transform: translateY(-7px);}

/* sample price holders */
	.samples_holder{
		display: flex;
		flex-wrap: wrap;
		gap: 12px;
		flex-direction: row;
		padding: 12px;
		align-items: center;
		justify-content: flex-start;
	}
	.samples_holder .samplebox{
		flex: 1 0 235px;
		max-width: 300px;
		/*display: flex;*/
		/*box-shadow: 0 0 12px rgba(122, 122, 122, 0.3);*/
		border-radius: var(--roundness);
		padding: 12px;
		position: relative;
	}
	.samples_holder .samplebox b{
		font-size: 1.6rem;
		display: block;
		color: var(--themecolor);
	}
	.samples_holder .samplebox span{
		font-size: 1.8rem;
	}
	.samples_holder .samplebox .info{
		padding: 8px 0;
	}
	.samples_holder .samplebox .actions{
		padding: 8px 0;
	}

/* sample type badges */
	.sample-type-badge {
		display: inline-block;
		padding: 4px 10px;
		border-radius: 4px;
		font-size: 12px;
		font-weight: 600;
		text-transform: uppercase;
	}

	.type-solution, .type-Solution {
		background-color: #e3f2fd;
		color: #1976d2;
	}
	.type-soil, .type-Soil {
		background-color: #fff3e0;
		color: #f57c00;
	}
	.type-carbon, .type-Carbon {
		background-color: #f3e5f5;
		color: #7b1fa2;
	}
	.type-carbon.activity, .type-Carbon.activity {
	    background-color: #f18ed13d;
	    color: #e3004b;
	}
	.type-rock, .type-Rock {
		background: grey;
		color: #fff;
	}

/* reusables */
	/* collapse */
		.collapser{--opac:1;}
		.collapser:has(.collapse.show){--opac:0;}
		.collapser .myicon{opacity: var(--opac);}

		.info-row{
			display: flex;
			padding: 12px 0;
			gap: 12px;
			border-bottom: 1px solid #f3f3f3;
		}
		.info-row .info-label{
			font-weight: 700;
			width: 120px;
		}

	/* badges */
		.mybadge {
			display: inline-flex;
			align-items: center;
			padding: 4px 12px;
			border-radius: var(--roundness);
			font-size: 0.75rem;
			font-weight: 600;
		}
		.mybadge i {
			margin-right: 6px;
		}
	/* profile compo */
		.profile-card{
			display: flex;
			align-items: center;
			justify-content: flex-start;
			flex-wrap: wrap;
		}
		.profile-card img{
			height: calc(var(--syz_2) * 0.5);
			width: calc(var(--syz_2) * 0.5);
			display: inline-block;
			background: #e5ffaa;
			border-radius: 50%;
			/*display: none;*/
		}
		.profile-card .info{
			display: flex;
			flex-direction: column;
			justify-content: center;
			gap: 3px;
		}
		.profile-card .info .main{
			font-size: 1.2rem;
			font-weight: 500;
		}
	/* search box */
		.search-box {
			position: relative;
			width: 300px;
		}
		.search-box input {
			width: 100%;
			padding: 8px 36px 8px 20px;
			border: 2px solid var(--clr-border);
			border-radius: 25px;
			transition: all 0.3s;
			font-size: 14px;
		}
		.search-box input:focus {
			outline: none;
			border-color: var(--primary);
			box-shadow: 0 0 0 3px rgba(107, 91, 149, 0.1);
		}
		.search-box input:focus + button{
			opacity: 1;
			translate: 0 -50%;
		}
		.search-box button {
			position: absolute;
			right: 7px;
			top: 50%;
			translate: -70% -50%;
			/*background: var(--themecolor);*/
			background: transparent;
			border: none;
			/*color: white;*/
			width: calc(var(--syz) - 7px);
			height: calc(var(--syz) - 7px);
			border-radius: 50%;
			cursor: pointer;
			opacity: 0;
			font-size: 0.7rem;
		}
	/* BS4 fixes */
		.modal{
			background-color: #11111155;
			z-index: 1002;
			overflow: auto;
		}
		.modal-header{
			border-bottom: none;
		}
		.modal-backdrop{
			background: transparent;
			display: none;
		}
		.modal-mg{
			--w: 1080px;
			width: min(var(--w),96vw);
			max-width: var(--w);
		}
		.hideicon i{display: none;}

/* end of styles */