*,html,body,h1,h2,h3,h4,h5,h6,a {font-family: Arial,Verdana}
legend{
		font-weight:600;
		font-size:12px;
	}
.step {display: none;}.step.active {display: block;}
	
.k8-custom:not(button):not(input){
	color: #ffffff !important;
  background: rgb(2,0,36);
  background: linear-gradient(90deg, rgba(2,0,36,1) 0%, rgba(255,0,0,1) 0%, rgba(0,51,102,1) 72%) !important;
}
.k8-select option{
	font-size:16px;
}	
th,td {
    white-space: nowrap !important;
}	
.xtb td, .xtb th {
  padding: 2px 4px;
}
.xtb td:nth-child(1), .xtb th:nth-child(1) {
 width:256px;
}
.xtb td:nth-child(2), .xtb th:nth-child(2) {
 width:150px;
}
.xtb td:nth-child(3), .xtb th:nth-child(3) {
 width:150px;
}
.xtb i{
  cursor:pointer;
}
@media screen and (max-width: 600px) {
.wmaxm{
	width:100% !important;
	max-width:100%;
	margin-top:8px;
}	
.k8-select option{
	font-size:13px;
}	
.xtb td:nth-child(1), .xtb th:nth-child(1) {
 width:150px;
}
.xtb td:nth-child(2), .xtb th:nth-child(2) {
 width:128px !important;
}
.xtb td:nth-child(3), .xtb th:nth-child(3) {
 width:128px !important;
}	
}

th:last-child,td:last-child {
    white-space: nowrap !important;
}	
.k8-margin-topx{
	margin-top:8px !important;
}
.k8-bar-block .k8-bar-item {
	padding:4px 8px !important;
}
#loader{
	width: 100%;
  z-index: 5000;
  height: 100%;
  position: fixed;
  background-color: #fff;
  top: 0;
}
#loader .pos{
	position:absolute;
	top:50%;
	left:50%;
	transform: translate(-50%,-50%);
}
.loader {
	
  width: 64px;
  padding: 8px;
  aspect-ratio: 1;
  border-radius: 50%;
  background: #f4511e;
  --_m: 
    conic-gradient(#0000 10%,#000),
    linear-gradient(#000 0 0) content-box;
  -webkit-mask: var(--_m);
          mask: var(--_m);
  -webkit-mask-composite: source-out;
          mask-composite: subtract;
  animation: l3 1s infinite linear;
}
@keyframes l3 {to{transform: rotate(1turn)}}
.tnot{
	display:none;
	z-index:150;
}
.k8-bar-item i{
width:16px;
height:auto;
aspect-ratio: 1 / 1 ;	
}
.k8-popup .title:before{
	content: "\f26c";
	font-family: "Font Awesome 6 Free";
	font-weight: 900; /* Required for solid icons */
	margin-right: 6px;
}

.xloader {
  display: inline-block;
  font-size: 48px;
  font-family: Arial, Helvetica, sans-serif;
  font-weight: bold;
  color: #000;
  position: relative;
}
.xloader::before {
  content: '';  
  position: absolute;
  left: 34px;
  bottom: 16px;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  border: 5px solid #000;
  border-bottom-color: #FF3D00;
  box-sizing: border-box;
  animation: rotation 0.6s linear infinite;
}

@keyframes rotation {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
} 
.k8-table td.header-cell {
  max-width: 256px;
  width: 128px;
}
.k8-bar-block .k8-bar-item {
	font-size: 1.18rem;
}
@media screen and (max-width: 600px) {
   	.k8-frm td:nth-child(2) {
  min-width: 300px;
}
.k8-bar-block .k8-bar-item {
  padding: 6px 12px !important;
}

}
.k8-hoverable tbody tr:hover,
.k8-ul.k8-hoverable li:hover {
  background-color: #faf9de;
  transition: background-color 0.2s;
}

/* When focused (after touch/click) */
.k8-hoverable tbody tr:focus-within,
.k8-hoverable tbody tr:focus,
.k8-ul.k8-hoverable li:focus-within,
.k8-ul.k8-hoverable li:focus {
  background-color: #faf9de;
  outline: none; /* optional, remove focus border */
}

/* Touch fallback for active press */
@media (hover: none) and (pointer: coarse) {
  .k8-hoverable tbody tr:active,
  .k8-ul.k8-hoverable li:active {
    background-color: #faf9de;
  }
}

select option:disabled {
    color: #888 !important;               /* Grey text */
    background-color: #f0f0f0 !important; /* Light grey background */
    cursor: not-allowed;       /* Not-allowed cursor */
}

/* 2. Readonly-looking options (selectable, greyed out) */
select option.readonly {
    color: #999 !important;               /* Lighter grey text */
    background-color: #f9f9f9 !important; /* Light background to indicate readonly */
    font-style: italic;         /* Optional: italic to distinguish */
}
.k8-light-red, .k8-hover-light-red:hover {
  color: #000 !important;
  background-color: #f9c9cd !important;
}
.dl-dropdown {
    position: absolute;
    border: 1px solid #ccc;
    background: white;
    max-height: 180px;
    overflow-y: auto;
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
    border-radius: 6px;
    z-index: 9999;
    width: 100%;
}

.dl-option {
    padding: 8px 10px;
    cursor: pointer;
}

.dl-option:hover {
    background: #f0f4ff;
}