/* ==============================================================
   SLICK CORE
   (giữ nguyên như bạn đã có)
   ============================================================== */

/* Slider */
.slick-slider{
  position:relative;
  display:block;
  box-sizing:border-box;
  -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none;
  -webkit-touch-callout:none; -khtml-user-select:none;
  -ms-touch-action:pan-y; touch-action:pan-y;
  -webkit-tap-highlight-color:transparent;
}
.slick-list{
  position:relative;
  display:block;
  overflow:hidden;
  margin:0; padding:0;
}
.slick-list:focus{ outline:none; }
.slick-list.dragging{ cursor:pointer; cursor:hand; }

.slick-slider .slick-track,
.slick-slider .slick-list{
  -webkit-transform:translate3d(0,0,0);
  -moz-transform:translate3d(0,0,0);
  -ms-transform:translate3d(0,0,0);
  -o-transform:translate3d(0,0,0);
  transform:translate3d(0,0,0);
}
.slick-track{
  position:relative;
  top:0; left:0;
  display:block;
  margin-left:auto; margin-right:auto;
}
.slick-track:before,
.slick-track:after{ display:table; content:''; }
.slick-track:after{ clear:both; }
.slick-loading .slick-track{ visibility:hidden; }

.slick-slide{
  display:none;
  float:left;
  height:100%; min-height:1px;
}
[dir='rtl'] .slick-slide{ float:right; }
.slick-slide img{ display:block; }
.slick-slide.slick-loading img{ display:none; }
.slick-slide.dragging img{ pointer-events:none; }
.slick-initialized .slick-slide{ display:block; }
.slick-loading .slick-slide{ visibility:hidden; }
.slick-vertical .slick-slide{
  display:block;
  height:auto;
  border:1px solid transparent;
}
.slick-arrow.slick-hidden{ display:none; }

/* ==============================================================
   EXTENSIONS – DOTS & ARROWS (không dùng icon library)
   ============================================================== */

/* ---------- DOTS ---------- */
.slick-dots{
  position:absolute;
  bottom:-15px;          /* khoảng cách dưới slider */
  left:0; right:0;
  display:flex !important;
  justify-content:center;
  padding:0; margin:0;
  list-style:none;
}
.slick-dots li{ margin:0 6px; }
.slick-dots button{
  font-size:0; line-height:0;
  width:12px; height:12px;
  padding:5px;
  border:0; border-radius:50%;
  background:#cfcfcf;
  cursor:pointer;
}
.slick-dots li.slick-active button{ background:#ffca10; }

/* ---------- ARROWS ---------- */
.slick-prev,
.slick-next{
  position:absolute;
  top:50%; transform:translateY(-50%);
  z-index:10;
  width:38px; height:38px;
  border:none; border-radius:50%;
  background:rgba(0,0,0,.35);
  color:#fff;                        /* màu mũi tên */
  cursor:pointer;
  display:flex !important;
  align-items:center;
  justify-content:center;
  padding:0;
}

/* Ẩn text “Previous/Next” gốc */
.slick-prev::after,
.slick-next::after{
  content:"";
  position:absolute;
  inset:0;
  font-size:0;
}

/* Mũi tên bằng Unicode – không cần FontAwesome */
.slick-prev::before,
.slick-next::before{
  font-size:20px;
  line-height:1;
}
.slick-prev::before{ content:"\2039"; }   /* ‹ */
.slick-next::before{ content:"\203A"; }   /* › */

/* Hover */
.slick-prev:hover,
.slick-next:hover{ background:#ffca10; }

/* Vị trí – đẩy ra ngoài nếu muốn */
.slick-prev{ left:-18px; }
.slick-next{ right:-18px; }

/* Ẩn mũi tên trên mobile (tùy chọn) */
/* Ẩn nội dung mặc định (Next/Prev text nếu có) */
.slick-prev,
.slick-next {
  font-size: 0 !important;
  color: transparent;
  overflow: hidden;
  text-indent: -9999px;
  white-space: nowrap;
}

/* Đặt lại mũi tên bằng Unicode – KHÔNG cần FontAwesome */
.slick-prev::before,
.slick-next::before {
  font-size: 20px;
  line-height: 1;
  color: #fff;
  text-indent: 0;
  display: inline-block;
}

.slick-prev::before {
  content: "‹"; /* Unicode mũi tên trái */
}
.slick-next::before {

  content: "›"; /* Unicode mũi tên phải */
}

@media (max-width:767px){
  .slick-prev,
  .slick-next{ display:none !important; }
}