/* * Project: [M24SW]
 * Author: [dev]
 * Description: Custom-crafted styles for high performance.
 */
.w-input[disabled]:not(.w-input-disabled), .w-select[disabled]:not(.w-input-disabled), .w-input[readonly], .w-select[readonly], fieldset[disabled]:not(.w-input-disabled) .w-input, fieldset[disabled]:not(.w-input-disabled) .w-select {
  background-color: #ecf1f5 !important;
}

.radio-select-disabled-ui .w-checkbox-input:not(.w--redirected-checked) {
  background-color: #ecf1f5 !important;
}

.radio-select-disabled-ui .w-checkbox-input {
  border-color: #cfd9e3 !important;
  cursor: not-allowed !important;
}


.radio-select-disabled-ui .w-radio-input:not(.w--redirected-checked) {
  background-color: #ecf1f5 !important;
}
.radio-select-disabled-ui .w-radio-input {
  border-color: #cfd9e3 !important;
  cursor: not-allowed !important;
}


.radio-select-disabled-ui,
.radio-select-disabled-ui .w-form-label,
.radio-select-disabled-ui .w-radio-input,
.radio-select-disabled-ui .w-checkbox-input {
  cursor: not-allowed !important;
}


.data-ckdigit {
  font-family: Noto Sans Thai, sans-serif;
  font-size: 14px;
}

/*แอดชั่นปุ่ม*/
a[id^="btn_"] {
  /* display: inline-block; */
  text-decoration: none;
  transition: transform 0.18s ease, box-shadow 0.18s ease, filter 0.18s ease;
}

a[id^="btn_"]:hover {
  transform: translateY(-2px) scale(1.03);
  filter: brightness(1.03);
}

a[id^="btn_"]:active {
  transform: scale(0.96);
}

a[id^="btn_"]:focus-visible {
  outline: 2px solid #333;
  outline-offset: 3px;
}

a:focus,
a.w-button:focus,
a.btn:focus {
  outline: none !important;
  box-shadow: none !important;
}

/*แก้ text-block-error ที่อยู่ใน input-autocomplete */

.input-autocomplete {
  position: relative;
}

.input-autocomplete .text-block-error {
  position: absolute;
  top: 100%;
  left: 0;
  /* margin-top: 6px; */
  background: #ffffff00 !important;
  box-shadow: none !important;
  border: 0 !important;
  z-index: 20;
}
a:focus,
a.w-button:focus,
a.btn:focus,
#btn_home:focus {
}

/*bar ยาว*/
/* 
<div class="mod_loading_wrap">
  <div class="mod_loading_bar"></div>
</div> 
*/
.mod_loading_wrap{
  width: 100%;
  max-width: 150px;
  height: 5px;
  background: #d7f1ff;
  border-radius: 99px;
  overflow: hidden;
}

.mod_loading_bar{
  width: 30%;
  height: 100%;
  background: #0056a2;
  animation: loadingSlide 0.9s infinite linear;
}

@keyframes loadingSlide{
  0%{
    transform: translateX(-120%);
  }
  100%{
    transform: translateX(350%);
  }
}

/*วงกลม*/
/* <div class="mod_loading_circle"></div> */
.mod_loading_circle{
  width: 30px;
  height: 30px;
  border: 5px solid #d7f1ff;
  border-top: 5px solid #0056a2;
  border-radius: 50%;
  animation: loadingSpin 0.8s linear infinite;
}

@keyframes loadingSpin{
  100%{
    transform: rotate(360deg);
  }
}

.icondisable.material-symbols-outlined,
.icondisable .material-symbols-outlined,
.material-symbols-outlined.icondisable {
  /* color: var(--grey) !important; */
  color: #a3a3a3 !important;
}

.icondisable {
  cursor: not-allowed !important;
  /* pointer-events: none; */
}

.w-select[disabled] + .select2 .select2-selection,
.w-select[disabled] + .select2-container .select2-selection,
.select2-disabled-ui .select2-selection {
    background-color: #ecf1f5 !important;
}

.select2-disabled-ui .select2-selection__rendered,
.select2-disabled-ui .select2-selection__arrow {
    opacity: 1 !important;
}

.select2-disabled-ui,
.select2-disabled-ui .select2-selection,
.select2-disabled-ui .select2-selection__rendered,
.select2-disabled-ui .select2-selection__arrow {
    cursor: not-allowed !important;
}

.select2-disabled-ui .select2-selection,
.select2-disabled-ui .select2-selection__rendered,
.select2-disabled-ui .select2-selection__arrow {
    cursor: not-allowed !important;
}

.disabled-btn {
  opacity: 0.45 !important;
  cursor: not-allowed !important;
  pointer-events: none !important;
  filter: grayscale(1);
}

.material-symbols-outlined {
  color: var(--nav-color);
  text-align: left;
  justify-content: center;
  padding-left: 0;
  padding-right: 5px;
  font-family: Material Icons Outlined, sans-serif;
  font-size: 20px;
  font-weight: 400;
  display: block;
}


@media (max-width: 767px) {
  #div_login.login-form-active .popup.simple-popup.login {
    width: min(550px, calc(100vw - 32px));
    max-height: calc(100dvh - 32px);
    overflow: auto;
  }
}

@media (max-width: 991px) {
  #div_login.login-form-active #div_act1 > .set {
    height: auto;
  }
}