/* ม่วง */
.ct-110 {color: #270089e6;}

.ct-100 {color: #3001a6e6}
.ct-90 {color: #4661AC;} 
.ct-80 {color: #5A6CB3;} 
.ct-70 {color: #6C79BA;} 
.ct-60 {color: #7D87C2;} 
.ct-50 {color: #8F96CB;} 
.ct-40 {color: #A2A8D4;} 
.ct-30 {color: #B6BBDE;} 
.ct-20 {color: #CCCFE8;} 
.ct-10 {color: #E3E4F3;} 
.ct-5 {color: #EFF0F8;} 

.bg-110 {background: #270089e6;}
.bg-100 {background: #3001a6e6;}
.bg-90 {background: #4661AC;} 
.bg-80 {background: #5A6CB3;} 
.bg-70 {background: #6C79BA;} 
.bg-60 {background: #7D87C2;} 
.bg-50 {background: #8F96CB;} 
.bg-40 {background: #A2A8D4;} 
.bg-30 {background: #B6BBDE;} 
.bg-20 {background: #CCCFE8;} 
.bg-10 {background: #E3E4F3;} 
.bg-5 {background: #EFF0F8;} 


/* ทอง */
.color-gold-1 {color: #AA771C;} /* ทองเข้ม */
.color-gold-2 {color: #B38728;}
.color-gold-3 {color: #BF953F;}
.color-gold-4 {color: #FCF6BA;} /* ทองอ่อน */
.bg-gold-1 {background: #AA771C;} /* ทองเข้ม */
.bg-gold-2 {background: #B38728;}
.bg-gold-3 {background: #BF953F;}
.bg-gold-4 {background: #FCF6BA;} /* ทองอ่อน */

.bg-gd-gold {background: linear-gradient(to right, #BF953F, #FCF6BA, #B38728, #FBF5B7, #AA771C);}

.color-white {color: white;}
.color-black {color: black;}

/*--- Font ---*/
h1 {
  background-image: linear-gradient(135deg, rgba(0,223,255,1) 0%, rgba(85,148,255,1) 18%, rgba(83,63,255,1) 38%, rgba(123,0,255,1) 61%, rgba(173,0,225,1) 83%, rgba(61,0,175,1) 100%); 
  -webkit-background-clip: text; 
  -webkit-text-fill-color: transparent;}

a {color: #5100BA;}
a:hover {color: #8900ff;}
a.secondary {color: #4b3737; text-decoration: none;}
a.secondary:hover {color: #5100BA;}

img {transition: filter 0.8s cubic-bezier(0.25, 0.1, 0.25, 1);}
img:hover {filter: brightness(1.05); /* ปรับให้ภาพสว่างขึ้น */}
.no-hover img:hover {transition: none !important;filter: none !important;}

/* Button */
/*.btn-primary {background-color: #0d6efd!important; background-image: var(--bs-gradient)!important;}*/
.btn-check:checked+.btn, .btn.active, .btn.show, .btn:first-child:active, :not(.btn-check)+.btn:active {background: #3001a6e6;}

.btn-primary {border: 1px solid #dee2e6; border-radius: 0.25rem; color: #000; background: #fff;
  -webkit-transition: background-color 0.3s linear, color 0.3s linear;
  transition: background-color 0.3s linear, color 0.3s linear;
}
.btn-primary:hover {border: 1px solid #dee2e6; color: #ffffff;background: #3001a6e6;}

.btn-secondary {border: 1px solid #dee2e6; border-radius: 0.25rem; color: #dddddd; background: #3001a6e6;
  -webkit-transition: background-color 0.3s linear, color 0.3s linear;
  transition: background-color 0.3s linear, color 0.3s linear;
}
.btn-secondary:hover {border: 1px solid #dee2e6; background: #270088e6;}

.btn-search {border: 0; border-radius: 0.25rem; color: #000; background: transparent;
  -webkit-transition: background-color 0.3s linear, color 0.3s linear;
  transition: background-color 0.3s linear, color 0.3s linear;
}
.btn-search:hover, .btn-search:active, .btn-search.btn.show {color: #ffffff; background: #3001a6e6;}





.opacity {
    -webkit-transition: background-color 0.3s linear, color 0.3s linear;
    transition: background-color 0.3s linear, color 0.3s linear;
  }
  .opacity:hover {color: #ffffff;background: #3001a6e6;}

.radius-top {border-radius: .25rem .25rem 0 0;}


/* card */
.card {border: none;}
.card a {text-decoration: none;}
.shadow-sm {box-shadow: 0 0rem .3rem rgba(0,0,0,.075)!important;}

.box-shadow {box-shadow: rgba(155,190,255,.6) 0 0 8px; border: 0 solid #fff;}
.box-shadow:hover {
  box-shadow: #9bbeff 0 0 12px;
  transition: all .8s cubic-bezier(0,0,.2,1);
  filter: brightness(1.07);
}