/* Scope wrapper */
.cq-wrap.cq-scope{ display:flex; gap:20px; align-items:flex-end; flex-wrap:wrap; font-family: inherit; }

.cq-scope .cq-field{ display:flex; flex-direction:column; min-width:220px; }
.cq-scope .cq-label{ font-size:12px; letter-spacing:.08em; color:#555; margin-bottom:6px; }

/* Inputs */
.cq-scope .cq-input{
  appearance:none;
  background:#fff !important;
  border:1px solid #bbb !important;
  border-radius:8px !important;
  padding:12px 14px !important;
  min-height:44px !important;
  font-size:14px; line-height:1.2;
  color:#111 !important;
  box-shadow:none !important;
}
.cq-scope .cq-input:focus{ outline:none; border-color:#222 !important; box-shadow:0 0 0 2px rgba(0,0,0,.06) !important; }

/* Date trigger like input */
.cq-scope .cq-date-field{ position:relative; }
.cq-scope .cq-date-trigger{
  display:flex; align-items:center; justify-content:space-between;
  width:100%; cursor:pointer;
  background:#fff !important; color:#111 !important; border:1px solid #bbb !important;
  border-radius:8px !important;
}

/* Calendar popup */
.cq-scope .cq-datepicker{
  position:absolute; top:100%; left:0; z-index:9999; margin-top:8px;
  background:#fff; border:1px solid #dcdcdc; border-radius:12px;
  width:680px; max-width:95vw;
  box-shadow:0 10px 30px rgba(0,0,0,.12); display:none;
}
.cq-scope .cq-datepicker-head{
  display:flex; align-items:center; justify-content:space-between;
  padding:12px 16px; border-bottom:1px solid #eee; font-size:14px; color:#444;
}
.cq-scope .cq-close{ background:transparent; border:none; font-size:20px; cursor:pointer; }

/* Two months equal width & no group margins */
.cq-scope .cq-datepicker .ui-datepicker{ width:100% !important; border:0 !important; position:relative; }
.cq-scope .cq-datepicker .ui-datepicker-multi{ display:flex !important; gap:24px; align-items:flex-start; }
.cq-scope .cq-datepicker .ui-datepicker-group{ margin:0 !important; } /* override jQuery UI defaults */
.cq-scope .cq-datepicker .ui-datepicker-multi .ui-datepicker-group{ flex:1 1 0 !important; width:auto !important; float:none !important; }
.cq-scope .cq-datepicker .ui-datepicker-title{ text-align:center; margin:0 0 8px; }
.cq-scope .cq-datepicker table{ width:100%; table-layout:fixed; font-size:13px; border-collapse:separate; }
.cq-scope .cq-datepicker th, .cq-scope .cq-datepicker td{ padding:0; }
.cq-scope .cq-datepicker td a{
  display:block; text-align:center; padding:6px; border-radius:6px;
  background:transparent !important; color:#111 !important; border:0 !important;
}
.cq-scope .cq-datepicker td a:hover{ background:#f2f2f2 !important; }

/* Prev / Next arrows */
.cq-scope .cq-datepicker .ui-datepicker-header{ position:relative; min-height:34px; }
.cq-scope .cq-datepicker .ui-datepicker-prev,
.cq-scope .cq-datepicker .ui-datepicker-next{
  position:absolute; top:2px; width:28px; height:28px; line-height:28px;
  display:flex; align-items:center; justify-content:center;
  border-radius:50%; color:#555; text-decoration:none;
  font-size:18px;
}
.cq-scope .cq-datepicker .ui-datepicker-prev{ left:8px; }
.cq-scope .cq-datepicker .ui-datepicker-next{ right:8px; }
.cq-scope .cq-datepicker .ui-datepicker-prev:hover,
.cq-scope .cq-datepicker .ui-datepicker-next:hover{ background:#f2f2f2; }

/* Range highlight */
.cq-scope .cq-datepicker .cq-in-range a{ background:#e7ebf3 !important; color:#111 !important; border-radius:6px; }
.cq-scope .cq-datepicker .cq-range-start a,
.cq-scope .cq-datepicker .cq-range-end a{ background:#111 !important; color:#fff !important; border-radius:999px !important; }

/* Bottom actions */
.cq-scope .cq-datepicker-actions{
  display:flex; justify-content:flex-end; gap:10px; padding:10px 16px; border-top:1px solid #eee;
}
.cq-scope .cq-btn{ background:#111; color:#fff; border:none; border-radius:999px; padding:10px 16px; cursor:pointer; }
.cq-scope .cq-btn.cq-muted{ background:#e9e9e9; color:#333; }

/* CTA */
.cq-scope .cq-action{ margin-left:auto; }
.cq-scope .cq-cta{
  background:#111 !important; color:#fff !important; border:none !important;
  border-radius:24px !important; padding:12px 18px !important; min-height:44px; font-weight:600;
}

/* Desktop layout */
@media (min-width: 992px){
  .cq-scope .cq-field{ flex: 1 1 280px; }
  .cq-scope .cq-action{ flex: 0 0 auto; }
}

/* Mobile */
@media (max-width: 767px){
  .cq-wrap.cq-scope{ gap:12px; }
  .cq-scope .cq-field{ min-width:100%; }
  .cq-scope .cq-action{ width:100%; }
  .cq-scope .cq-cta{ width:100%; }
}


/* v1.5 — normalize disabled (past) dates to same size as active ones */
.cq-scope .cq-datepicker table{ border-collapse:separate; }
.cq-scope .cq-datepicker td, 
.cq-scope .cq-datepicker th{ padding:0; }

/* Style both anchors and spans via .ui-state-default */
.cq-scope .cq-datepicker td .ui-state-default{
  display:block; width:100%;
  text-align:center; padding:6px; 
  border:0 !important; border-radius:6px;
  background:transparent !important; color:#111 !important;
  box-sizing:border-box;
  line-height:1.4;
}

/* Hover only for clickable dates */
.cq-scope .cq-datepicker td a.ui-state-default:hover{ background:#f2f2f2 !important; }

/* Disabled past days should look muted but keep the same box metrics */
.cq-scope .cq-datepicker td.ui-datepicker-unselectable .ui-state-default{
  opacity:.5; cursor:default;
  background:transparent !important;
}

/* Keep range highlight above generic defaults */
.cq-scope .cq-datepicker .cq-in-range .ui-state-default{ background:#e7ebf3 !important; color:#111 !important; }
.cq-scope .cq-datepicker .cq-range-start .ui-state-default,
.cq-scope .cq-datepicker .cq-range-end .ui-state-default{ background:#111 !important; color:#fff !important; border-radius:999px !important; }


/* v1.6 — Add custom dropdown arrows for SELECT fields (Destinasyon & Misafir) */
.cq-scope select.cq-input{
  -webkit-appearance:none !important;
  appearance:none !important;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23666'><path d='M7 10l5 5 5-5z'/></svg>");
  background-repeat: no-repeat !important;
  background-position: right 12px center !important;
  background-size: 16px 16px !important;
  padding-right: 36px !important;
  cursor: pointer;
}
/* Hide legacy IE arrow if present */
.cq-scope select.cq-input::-ms-expand{ display:none; }


/* v1.7 — force dropdown chevron on SELECT via background shorthand */
.cq-scope select.cq-input{
  -webkit-appearance:none !important;
  appearance:none !important;
  background: #fff url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23666'><path d='M7 10l5 5 5-5z'/></svg>") no-repeat right 12px center !important;
  background-size: 16px 16px !important;
  padding-right: 40px !important;
  cursor: pointer;
}
.cq-scope select.cq-input::-ms-expand{ display:none; }
