:root{
  --kh-primary:#003580;
  --kh-accent:#0071c2;
  --kh-bg:#ffffff;
  --kh-text:#0f172a;
  --kh-muted:#6b7280;
  --kh-soft:#e9f5ff;
  --kh-gold:#bc9c22; 
}

body {
    background: #fff;
    
}
.account-box {
  text-decoration: none;
  transition: background-color .2s;
}
.account-box:hover {
  background-color: #002c73;
}
.account-avatar img {
  object-fit: cover;
}

.kh-navbar {
    background: var(--kh-primary)
}

.kh-navbar .navbar-brand,
.kh-navbar .nav-link,
.kh-navbar .btn {
    color: #fff
}

.kh-navbar .btn-outline-light {
    border-color: rgba(255, 255, 255, .35)
}

.kh-hero {
    background: var(--kh-primary);
    color: #fff;
    padding: 0 0 90px
}

.kh-hero h1 {
    font-weight: 800;
    letter-spacing: .2px
}

.kh-hero p {
    color: #dbeafe
}

/* ===== Category Pills (only 2) ===== */
.kh-cats .btn {
    border-radius: 50rem;
    border: 1px solid rgba(255, 255, 255, .25);
    color: #e8f0ff
}

.kh-cats .btn:hover,
.kh-cats .btn.active {
    background: #fff;
    color: var(--kh-primary)
}

.btn-outline-light.btn-sm:hover {
  background-color: transparent;
  color: #bc9c22;              /* Yazı altın */
  border-color: #bc9c22;       /* Çerçeve altın */
  transition: all 0.3s ease;
}

.btn-light.btn-sm.text-primary:hover {
  background-color: transparent;
  color: #bc9c22 !important;   /* Altın rengi */
  border-color: #bc9c22;
  transition: all 0.3s ease;
}


/* ===== Search Card ===== */
.kh-search {
    margin-top: -60px
}

.kh-search .card {
    border-radius: 14px;
    box-shadow: 0 10px 28px rgba(0, 0, 0, .12)
}

.kh-search .form-control {
    height: 52px
}

.kh-search .btn {
    height: 52px
}

/* ===== Promo tiles ===== */
.kh-tile {
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 8px 20px rgba(0, 0, 0, .08)
}

.kh-tile img {
    height: 200px;
    object-fit: cover
}

/* ===== Mobile Bottom Bar (app vibe) ===== */
.kh-bottombar {
  background: #fff;
  border-top: 1px solid #eceff3;
  box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.06); /* soft shadow */
  height: 62px;
  display: flex;
  align-items: center;
}

.kh-bottombar .nav-link {
  color: #5b6675;
  font-weight: 600;
  font-size: 0.8rem;
  padding: 6px 0 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  transition: color 0.25s ease, background 0.25s ease;
  border-radius: 12px;
}

.kh-bottombar .nav-link i {
  font-size: 22px;
  line-height: 1;
  margin-bottom: 2px;
}

.kh-bottombar .nav-link.active {
  color: var(--kh-accent);
}

.kh-bottombar .nav-link:active {
  background: rgba(0, 0, 0, 0.05);
}

.rounded-12 {
  border-radius: 12px;
}

.kh-offcanvas{
  width: 86vw;               /* mobile-friendly genişlik */
  max-width: fit-content;
  border-left: 1px solid #eef1f5;
}
.kh-offcanvas .offcanvas-header{
  padding: 1rem .75rem 0.5rem .75rem;
}
.kh-profile{
  padding-top: .25rem;
}
.kh-avatar{
  width:42px; height:42px; border-radius:50%; object-fit:cover;
  box-shadow:0 2px 8px rgba(0,0,0,.08);
}
.kh-accordion .accordion-item{
  border: none; border-bottom: 1px solid #f0f2f6;
}
.kh-accordion .accordion-button{
  background:#fff; font-weight:700; color:#222; padding:.85rem .75rem;
  box-shadow:none !important;
}
.kh-accordion .accordion-button::after{
  filter: grayscale(1) opacity(.7);
}
.kh-accordion .accordion-button:not(.collapsed){
  background:#f9fafc;
}
.kh-accordion .accordion-body{
  padding: .5rem .25rem .75rem .25rem;
}
.kh-list{
  margin:0; padding:.25rem .25rem .25rem .25rem;
}
.kh-list li a{
  display:flex; align-items:center; gap:.5rem;
  padding:.5rem .5rem; margin: 0 .25rem;
  border-radius:10px; color:#333; text-decoration:none;
  transition: background .2s ease, color .2s ease;
}
.kh-list li a i{ font-size:1.1rem; color:#6b7280; }
.kh-list li a:hover{
  background:#f2f4f8; color:#111;
}
.kh-offcanvas-footer{
  padding-bottom: .25rem;
}


/* --- Pill search --- */
.kh-pill {
    background: #fff;
    border-radius: 999px;
    padding: .35rem .8rem;
    box-shadow: 0 10px 24px rgba(0, 0, 0, .10);
    border: 1px solid rgba(0, 0, 0, .06);
}

.kh-pill .bx {
    font-size: 1.15rem;
    color: #6b7280
}

.kh-pill .form-control:focus {
    box-shadow: none
}

/* --- Mini categories --- */
.kh-mini-cats .kh-mini {
    position: relative;
    background: transparent;
    border: 0;
    padding: .25rem .5rem;
    min-width: 90px;
}

.kh-mini-ico {
    width: 48px;
    height: 48px;
    display: inline-grid;
    place-items: center;
    background: #f5f7fb;
    border-radius: 12px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, .08) inset;
    color: #374151;
    font-size: 22px;
}

.kh-mini-label {
    display: block;
    margin-top: .35rem;
    font-size: .9rem;
    font-weight: 600;
    color: #fff;
}

.kh-badge {
    position: absolute;
    top: -6px;
    right: -2px;
    background: #3b4758;
    color: #fff;
    font-size: .62rem;
    font-weight: 700;
    padding: .12rem .38rem;
    border-radius: 999px;
    box-shadow: 0 2px 6px rgba(0, 0, 0, .15);
}

.kh-underline {
    display: block;
    width: 0;
    height: 3px;
    margin: .15rem auto 0;
    border-radius: 2px;
    background: #1f2937;
    transition: width .18s ease;
}

.kh-mini.active .kh-underline {
    width: 28px
}

.kh-mini:hover .kh-underline {
    width: 20px
}

/* dropdown shells */
.kh-dropdown {
    position: absolute;
    top: 110%;
    left: 0;
    z-index: 1050;
    border-radius: 12px;
    width: min(420px, 100%);
    display: none;
}

.kh-picker-btn {
    background: #fff;
    cursor: pointer;
}

/* steppers */
.kh-stepper .btn {
    width: 36px;
    height: 36px;
    border-radius: 10px;
    padding: 0;
    line-height: 1;
}

.kh-stepper .btn:focus {
    box-shadow: none;
}

/* Dropdown kabuğu */
.kh-cal {
    position: absolute;
    top: 110%;
    left: 0;
    z-index: 1050;
    width: min(680px, 100%);
    border-radius: 12px;
    overflow: hidden
}

/* Sekmeler */
.kh-cal-tabs {
    display: flex;
    gap: 12px;
    padding: 10px 14px 0
}

.kh-tab-btn {
    background: transparent;
    border: 0;
    padding: 10px 14px;
    font-weight: 600;
    color: #425466;
    border-bottom: 2px solid transparent
}

.kh-tab-btn.active {
    color: #0f172a;
    border-color: #0f172a
}

/* Ay başlık / navigasyon */
.kh-cal-nav {
    display: flex;
    align-items: center;
    padding: 8px 14px 0
}

.kh-monthlabels {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    flex: 1;
    text-align: center;
    font-weight: 700
}

.kh-nav {
    width: 36px;
    height: 36px;
    border: 1px solid #e5e7eb;
    background: #fff;
    border-radius: 10px;
    line-height: 34px;
    text-align: center
}

/* Izgaralar */
.kh-grids {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    padding: 10px 14px 12px
}

.kh-grid {
    border-top: 1px solid #eaecef;
    padding-top: 8px
}

.kh-week {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    place-items: center;
    color: #6b7280;
    font-size: .8rem;
    margin-bottom: 6px
}

.kh-days {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 2px
}

.kh-day {
    height: 38px;
    display: grid;
    place-items: center;
    border-radius: 8px;
    cursor: pointer
}

.kh-day.muted {
    color: #9aa3af;
    cursor: default
}

.kh-day:hover {
    background: #f1f5f9
}

.kh-day.selected-start,
.kh-day.selected-end {
    background: #0ea5e9;
    color: #fff
}

.kh-day.in-range {
    background: #e0f2fe
}

/* Alt butonlar */
.kh-cal-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 14px 14px;
    border-top: 1px solid #eaecef
}


.daterangepicker{
  border:0;
  border-radius:18px;
  background:var(--kh-bg);
  box-shadow:0 24px 60px rgba(0,0,0,.22);
  color:var(--kh-text);
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  padding:10px 10px 0;   /* biraz iç boşluk */
}
.daterangepicker:before,
.daterangepicker:after{ display:none; }  /* üstteki üçgen oku kaldır */

/* iki takvim arası nefes */
.daterangepicker .drp-calendar{
  padding:14px 14px 6px;
  margin:0 4px;
}
.daterangepicker .calendar-table{
  border:0;
  background:transparent;
}
.daterangepicker .calendar-table table{
  width:100%;
}

/* ay/yıl seçiciler – pill */
.daterangepicker .monthselect,
.daterangepicker .yearselect{
  appearance:none; -webkit-appearance:none;
  background:#fff;
  border:1px solid #e6e9ef;
  border-radius:12px;
  padding:8px 12px;
  height:38px;
  font-weight:700;
  margin:0 6px 8px;
  box-shadow:0 2px 8px rgba(0,0,0,.06);
}

/* gezinti okları – daire */
.daterangepicker .calendar-table .prev,
.daterangepicker .calendar-table .next{
  width:38px;height:38px; line-height:36px;
  border:1px solid #e6e9ef; border-radius:999px;
  text-align:center; color:#334155; background:#fff;
}
.daterangepicker .calendar-table .prev:hover,
.daterangepicker .calendar-table .next:hover{
  border-color:#d7dde6; color:#0f172a;
}

/* hafta başlıkları */
.daterangepicker .calendar-table thead tr:nth-child(2) th{
  color:var(--kh-muted);
  font-size:.8rem; font-weight:700;
  padding-bottom:6px;
}

/* gün hücreleri – daha büyük, modern */
.daterangepicker .calendar-table th,
.daterangepicker .calendar-table td{
  border:0;
  width:46px; height:44px;
  border-radius:12px;
  text-align:center;
  font-size:14px;
}
.daterangepicker td.off{ color:#cbd5e1 !important; opacity:.8; }
.daterangepicker td.available:hover{
  background:#f3f6fb;
}

/* seçili aralık */
.daterangepicker td.in-range{
  background:var(--kh-soft);
  color:var(--kh-text);
  border-radius:8px;
}

/* başlangıç/bitiş – dolu pill */
.daterangepicker td.start-date,
.daterangepicker td.end-date,
.daterangepicker td.active{
  background:var(--kh-accent) !important;
  color:#fff !important;
  position:relative; z-index:1;
  box-shadow:0 2px 10px rgba(0,0,0,.15);
}
.daterangepicker td.start-date{ border-top-left-radius:14px; border-bottom-left-radius:14px; }
.daterangepicker td.end-date{   border-top-right-radius:14px; border-bottom-right-radius:14px; }

/* bugün – ince halka */
.daterangepicker td.today:not(.start-date):not(.end-date):not(.in-range){
  box-shadow:inset 0 0 0 2px var(--kh-accent);
  border-radius:12px;
}

/* alt butonlar (autoApply kapalıysa görünür) */
.daterangepicker .drp-buttons{
  border-top:1px solid #eef2f7;
  padding:12px 14px;
}
.daterangepicker .drp-buttons .btn{
  border-radius:10px; font-weight:700;
}
.daterangepicker .drp-buttons .btn-primary{
  background:var(--kh-accent); border-color:var(--kh-accent);
}
.daterangepicker .drp-selected{ color:#64748b; font-size:.9rem; }

.daterangepicker select.monthselect {
    height: inherit;
    padding: 6px 10px;
}
.daterangepicker select.yearselect {
    height: inherit;
    padding: 6px 10px;
}

.kh-owl-cats .kh-cat-card{
  background:#f6f7fb;
  border:1px solid #eef1f6;
  border-radius:16px;
  padding:14px 16px;
  color:#1f2937; font-weight:600;
  box-shadow:0 1px 0 rgba(0,0,0,.02);
  transition:transform .15s ease, box-shadow .15s ease, background .15s ease, border-color .15s ease;
}
.kh-owl-cats .kh-cat-card i{ font-size:22px; color:#374151; }
.kh-owl-cats .kh-cat-card span{
  display:block; max-width:100%;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.kh-owl-cats .kh-cat-card:hover{
  background:#fff; border-color:#e3e8f2; transform:translateY(-1px);
  box-shadow:0 10px 24px rgba(0,0,0,.08);
}
.kh-owl-cats .kh-cat-card.active{
  background:#fff; border-color:#cfe7ff;
  box-shadow:0 10px 28px rgba(0,113,194,.15);
}

.kh-owl-cats{ position:relative; }
.kh-owl-cats .owl-nav{
  position:absolute; inset:0; display:flex; justify-content:space-between; align-items:center;
  pointer-events:none;
}
.kh-owl-cats .owl-nav button{
  pointer-events:auto;
  width:38px; height:38px; border-radius:999px !important;
  background:#fff !important; border:1px solid #e6e9ef !important;
  box-shadow:0 6px 18px rgba(0,0,0,.12); margin:0 2px;
}
.kh-owl-cats .owl-nav i{ font-size:22px; line-height:38px; display:inline-block; }
.kh-owl-cats .owl-dots{ display:none; } 

.kh-owl-cats .owl-stage{ padding:2px 0; }  /* kartlar dikeyde ortalı dursun */

.kh-owl-cats .owl-stage-outer { padding:0 !important; margin:0 !important; }

.kh-owl-cats .kh-cat-card { width:100%; }

.kh-sec-head--lite{
  margin:10px 0 6px;
  text-align:left;
}
.kh-eyebrow{
  display:inline-block;
  font-size:.72rem;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#2b3a55;
  background:#f3f6fb;
  border:1px solid #e5e9f2;
  border-radius:999px;
  padding:4px 10px;
}
.kh-sec-title{
  margin:6px 0 0;
  font-weight:700;                 /* daha hafif */
  letter-spacing:.1px;
  line-height:1.2;
  font-size:clamp(18px,2.2vw,26px);
  position:relative;
  display:inline-block;
}
.kh-sec-title::after{
  content:"";
  display:block;
  height:3px;
  width:56px;                      /* istersen kısalt/uzat */
  border-radius:3px;
  background:var(--kh-gold);       /* #bc9c22 */
  margin-top:8px;
}
.kh-sec-sub{
  margin:.35rem 0 0;
  color:#708399;
  font-size:clamp(13px,1.6vw,15px);
}

.kh-sec-head--lite.no-underline .kh-sec-title::after{ display:none; }

.kh-footer { background:#0d3573; color:#fff; }
.kh-footer-top { position:relative; }
.kh-footer-top::before{
  content:""; display:block; height:3px; width:100%;
  background:#bc9c22;
}
.kh-footer a{ color:rgba(255,255,255,.85); text-decoration:none; }
.kh-footer a:hover{ color:#fff; }
.kh-head{ font-weight:700; margin-bottom:.6rem; }
.kh-social{ font-size:1.2rem; line-height:1; opacity:.9; }
.kh-social:hover{ opacity:1; transform:translateY(-1px); }
.kh-footer-bottom{ background:rgba(0,0,0,.12); border-top:1px solid rgba(255,255,255,.15); }

html, body { height:100%; }
#page{ min-height:100dvh; display:flex; flex-direction:column; }
#page > main{ flex:1 0 auto; }
.kh-footer{ flex-shrink:0; }

.kh-topbar{
    gap: 15px;
  padding: 6px 12px;
  height: 38px;                
  color:#fff;
}

.kh-top-item{
  display:inline-flex; align-items:center; gap:6px;
  color:#fff; text-decoration:none; line-height:1;
  padding: 15px;
  cursor:pointer;
  border-radius: 8px;
}

.kh-topbar img{
  width:22px; height:16px; border-radius:999px;
  border:0 !important; display:block;
}

.kh-top-item:hover{ 
  background-color: rgba(255, 255, 255, 0.1);
 }

.btn-outline-light.btn-sm:hover{
  background:#fff; color:#000; border-color:#fff; transition:all .25s ease;
}
.btn-light.btn-sm.text-primary:hover{
  background:#0d6efd; color:#fff !important; border-color:#0d6efd; transition:all .25s ease;
}

.flag-square {
    width: 26px;
    height: 26px;
  overflow: hidden;
  border-radius: 4px;
  display: inline-flex;
}

.flag-square img {
  width: 100%;
  height: 100%;
  object-fit: cover; 
}


.kh-owl .owl-stage { display:flex; }
.kh-owl .owl-item  { display:flex; }
.kh-owl .owl-nav   { display:none; }
.kh-owl .owl-dots  { margin-top:.5rem; }

.kh-link {
  font-family: inherit;
  font-size: 14px;
  color: #0e4a98;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  transition: color 0.2s ease;
}

.kh-link i {
  font-size: 15px;
  transition: transform 0.2s ease;
}

.kh-link:hover {
  color: #07367a;
  text-decoration: none;
}

.kh-link:hover i {
  transform: translateX(3px);
}


.kh-owl .owl-stage,
.kh-owl .owl-item { display:block; }

.kh-card{
  background:#fff;
  border-radius:20px;
  overflow:hidden;
}


.kh-card-img{ position:relative; display:block; border-radius:20px; overflow:hidden; }
.kh-card-img img{
  width:100%; height:100%; object-fit:cover; display:block;
  transition:transform .35s ease;
}
.kh-card:hover .kh-card-img img{ transform:scale(1.02); }

.kh-card-badge{
  position:absolute; left:12px; top:12px;
  padding:.35rem .6rem;
  background:rgba(255,255,255,.92);
  color:#222; font-weight:600; font-size:.8rem;
  border-radius:999px; border:1px solid rgba(0,0,0,.08);
  backdrop-filter:saturate(180%) blur(2px);
}

.kh-card-body{ padding:.65rem .75rem .8rem;
padding-left: 0; }
.kh-title{
  font-size:1rem; font-weight:700; color:#222;
  margin:.25rem 0 .2rem; line-height:1.25; text-decoration:none;
}
.kh-title:hover{ color:#003580; }
.kh-meta{ color:#6b6b6b; font-size:.92rem; margin-bottom:.35rem; }
.kh-bottom{ display:flex; align-items:center; justify-content:space-between; }
.kh-rating {
    color: #222;
    font-weight: 600;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 3px;
}
.kh-rating .bxs-star{ color:#f5a623; vertical-align:baseline; }
.kh-price{ color:#222; }

@media (max-width:575.98px){
  #home-hotel-strips h3{ font-size:1.125rem; }
  .kh-title{ font-size:.98rem; }
  .kh-meta{ font-size:.9rem; }
}

@media (prefers-reduced-motion:reduce){
  .kh-card, .kh-card-img img { transition:none !important; }
}

.kh-card-badge {
  position: absolute;
  left: 10px;
  top: 10px;
  background: #bc9c22;
  color: #fff;
  padding: .25rem .5rem;
  font-size: .75rem;
  border-radius: 999px;
  line-height: 1;
  width: auto;
    height: auto;
}
.fav-btn {
  position: absolute;
  top: 10px;
  right: 10px;
  background: rgba(0,0,0,0.4); 
  color: #fff;
  border: none;
  border-radius: 50%;
  width: 38px;
  height: 38px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.25s ease;
  backdrop-filter: blur(4px);
}

.fav-btn i {
  font-size: 20px;
  color: #fff;
  transition: color 0.25s ease, transform 0.25s ease;
}

.fav-btn:hover {
  background: rgba(255, 0, 60, 0.8);
  transform: scale(1.1);
}

.fav-btn:hover i {
  color: #fff;
  transform: scale(1.2);
}

/* favori aktifken dolu kalp */
.fav-btn.active i {
  color: #ff1744;
}



@media (max-width: 576px){
  .img-mobile-fluid {
    width: 100% !important;
  }
  .kh-topbar {
    display: none !important;
  }
  .daterangepicker{
    width: calc(100vw - 24px) !important;
    left: 12px !important; right: 12px !important;
    border-radius:16px;
  }
  .daterangepicker .calendar-table th,
  .daterangepicker .calendar-table td{
    width:42px; height:40px; border-radius:10px;
  }
  .daterangepicker .monthselect,
  .daterangepicker .yearselect{
    height:36px; padding:6px 10px; border-radius:10px;
  }
  .daterangepicker .drp-calendar {
        max-width: 100%;
    }
  .kh-sec-head--lite{ text-align:center; }
  .kh-sec-title::after{ margin-left:auto; margin-right:auto; }
  .kh-footer .row > [class*="col-"]{ margin-bottom:.5rem; }
  #home-hotel-strips h3{ font-size:1.125rem; }
.kh-footer {
  padding-bottom: 60px;
}
}

.kh-owl-cats .owl-item {
  padding-bottom: 20px;
}

#siteLoader {
  position: fixed;
  inset: 0;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 99999;
  flex-direction: column;
  font-family: system-ui, sans-serif;
  transition: opacity 0.4s ease, visibility 0.4s ease;
}
#siteLoader.hidden {
  opacity: 0;
  visibility: hidden;
}
.loader .ring {
  width: 60px;
  height: 60px;
  border: 4px solid #e5e7eb;
  border-top-color: #0e4a98;
  border-radius: 50%;
  animation: spin 0.9s linear infinite;
  margin-bottom: 10px;
}
@keyframes spin {
  to { transform: rotate(360deg); }
}


@media screen and (max-width: 768px) {
    .text-mobile-center {
        text-align: center !important;
    }
    body {
        padding-bottom: 80px;
    }
}