/* CSS cho Nganluong.vn */
ul.bankList {
    clear: both;
    height: 202px;
    width: 636px;
}
ul.bankList li {
    list-style-position: outside;
    list-style-type: none;
    cursor: pointer;
    float: left;
    margin-right: 0;
    padding: 5px 2px;
    text-align: center;
    width: 90px;
}
.list-content li {
    list-style: none outside none;
    margin: 0 0 10px;
}
.list-content li .boxContent {
    display: none;
    /* width: 636px; */
    /* border:1px solid #cccccc; */
    /* padding:10px;  */
}
.list-content li.active .boxContent {
    display: block;
}
.list-content li .boxContent ul {
    /* height:280px; */
}

i.VISA,
i.MASTE,
i.AMREX,
i.JCB,
i.VCB,
i.TCB,
i.MB,
i.VIB,
i.ICB,
i.EXB,
i.ACB,
i.HDB,
i.MSB,
i.NVB,
i.DAB,
i.SHB,
i.OJB,
i.SEA,
i.TPB,
i.PGB,
i.BIDV,
i.AGB,
i.SCB,
i.VPB,
i.VAB,
i.GPB,
i.SGB,
i.NAB,
i.BAB {
    width: 80px;
    height: 30px;
    display: block;
    background: url(https://www.nganluong.vn/webskins/skins/nganluong/checkout/version3/images/bank_logo.png)
        no-repeat;
}
i.MASTE {
    background-position: 0px -31px;
}
i.AMREX {
    background-position: 0px -62px;
}
i.JCB {
    background-position: 0px -93px;
}
i.VCB {
    background-position: 0px -124px;
}
i.TCB {
    background-position: 0px -155px;
}
i.MB {
    background-position: 0px -186px;
}
i.VIB {
    background-position: 0px -217px;
}
i.ICB {
    background-position: 0px -248px;
}
i.EXB {
    background-position: 0px -279px;
}
i.ACB {
    background-position: 0px -310px;
}
i.HDB {
    background-position: 0px -341px;
}
i.MSB {
    background-position: 0px -372px;
}
i.NVB {
    background-position: 0px -403px;
}
i.DAB {
    background-position: 0px -434px;
}
i.SHB {
    background-position: 0px -465px;
}
i.OJB {
    background-position: 0px -496px;
}
i.SEA {
    background-position: 0px -527px;
}
i.TPB {
    background-position: 0px -558px;
}
i.PGB {
    background-position: 0px -589px;
}
i.BIDV {
    background-position: 0px -620px;
}
i.AGB {
    background-position: 0px -651px;
}
i.SCB {
    background-position: 0px -682px;
}
i.VPB {
    background-position: 0px -713px;
}
i.VAB {
    background-position: 0px -744px;
}
i.GPB {
    background-position: 0px -775px;
}
i.SGB {
    background-position: 0px -806px;
}
i.NAB {
    background-position: 0px -837px;
}
i.BAB {
    background-position: 0px -868px;
}

ul.cardList li {
    cursor: pointer;
    float: left;
    margin-right: 0;
    padding: 5px 4px;
    text-align: center;
    width: 90px;
}

.form-check-input:checked + .form-check-label {
    border: 2px solid #666cff;
    border-radius: 10px;
    box-shadow: 0 0 10px rgba(0, 123, 255, 0.5);
    transition: all 0.3s ease;
}
.form-check-label:hover {
   border: 2px solid #666cff;
  border-radius: 10px;
  transform: scale(1.05);
}

.dt-layout-cell.dt-layout-start {
  margin-left: 10px;
}

.dt-layout-cell.dt-layout-end {
  margin-right: 10px;
}

.dt-length label {
  margin-left: 10px;
}


.card-list-game:hover {
  border: 2px solid #666cff;
  box-shadow: 0 0 15px rgba(17, 1, 243, 0.5);
}

.dt-buttons {
  margin-left: 10px;
}

.dataTables_filter {
  margin-right: 10px;
}

.dataTables_info {
  margin-left: 10px;
}

.dataTables_paginate {
  margin: 10px;
}

.dt-button.buttons-excel.buttons-html5 {
  color: #f1f1f1;
  background: #666cff;
  border: #666cff;
}

.dt-button.buttons-excel.buttons-html5:hover {
  color: #ffffff !important;
  background: #4a4ff1 !important;
  border: #4a4ff1 !important;
}


/* Áp dụng riêng cho bảng DataTable */
.dataTables_wrapper {
    scrollbar-color: #666cff #f1f1f1;
}

.main-chat-msg img {
  max-width: 100%;
  height: auto;
  border-radius: 8px;
  cursor: zoom-in;
  transition: transform 0.2s ease;
}

/* Modal nền đen */
.image-modal {
  display: none;
  position: fixed;
  z-index: 9999;
  top: 0; left: 0;
  width: 100%; height: 100%;
  background: rgba(0,0,0,0.9);
  overflow: auto; /* ⚡ Cho phép cuộn nếu ảnh quá lớn */
  text-align: center;
}

/* Ảnh bên trong modal */
.image-modal img {
  display: block;
  margin: 40px auto;
  max-width: 80%;
  max-height: none; /* ⚡ Không giới hạn chiều cao để tránh crop */
  height: auto;
  border-radius: 8px;
}

/* Hiệu ứng fade-in nhẹ */
.image-modal.fade-in {
  animation: fadeIn 0.3s ease;
}
@keyframes fadeIn {
  from {opacity: 0;}
  to {opacity: 1;}
}