/* assets/flight-datepicker.css
   Uçuş bölümü tarih seçici. style.css'ten sonra yüklenir; mevcut
   .when-btn görünümünü miras alır, yalnızca takvim popover'ını tanımlar. */

/* tetikleyici: diğer dönem düğmeleriyle aynı ailede, tarih seçilince vurgulu */
.flight-when .when-btn.when-date { display: inline-flex; align-items: center; gap: 6px; }
.flight-when .when-btn.when-date::before {
  content: "";
  width: 13px; height: 13px; flex: 0 0 auto;
  background: currentColor;
  -webkit-mask: var(--fdp-cal) center/contain no-repeat;
          mask: var(--fdp-cal) center/contain no-repeat;
}
:root {
  --fdp-cal: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2'/%3E%3Cpath d='M16 2v4M8 2v4M3 10h18'/%3E%3C/svg%3E");
}

/* popover'ın konumlanacağı çerçeve */
.flight-when { position: relative; }

.fdp-pop {
  position: absolute; top: calc(100% + 6px); left: 0; z-index: 60;
  width: 288px; max-width: calc(100vw - 24px);
  padding: 10px;
  background: #fff;
  border: 1px solid var(--line, #e5e0d6);
  border-radius: 12px;
  box-shadow: 0 6px 14px rgba(15,44,89,.10), 0 18px 40px rgba(15,44,89,.16);
  font-family: 'Inter', system-ui, sans-serif;
  color: var(--ink, #1a1a2e);
}
.fdp-pop[hidden] { display: none; }

/* başlık + ay okları */
.fdp-head { display: flex; align-items: center; justify-content: space-between; gap: 6px; margin-bottom: 8px; }
.fdp-title { font-size: 13px; font-weight: 650; color: var(--pine, #0F2C59); text-transform: capitalize; }
.fdp-nav {
  width: 28px; height: 28px; flex: 0 0 auto;
  display: inline-flex; align-items: center; justify-content: center;
  padding: 0; cursor: pointer;
  background: none; border: 1px solid var(--line, #e5e0d6); border-radius: 8px;
  color: var(--pine, #0F2C59);
}
.fdp-nav svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.fdp-nav:hover:not(:disabled) { background: var(--paper, #F8F6F0); }
.fdp-nav:disabled { opacity: .35; cursor: default; }

/* gün ızgarası */
.fdp-grid { display: block; }
.fdp-row { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; }
.fdp-wd span {
  display: flex; align-items: center; justify-content: center;
  height: 24px; font-size: 10px; font-weight: 600; letter-spacing: .04em;
  color: var(--muted, #626b77); text-transform: uppercase;
}
.fdp-day {
  height: 34px; padding: 0; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  background: none; border: 1px solid transparent; border-radius: 8px;
  font: 500 12.5px/1 'Inter', system-ui, sans-serif;
  color: var(--ink, #1a1a2e);
}
.fdp-day:hover:not(:disabled):not(.is-selected) { background: var(--paper, #F8F6F0); }
.fdp-day:focus-visible { outline: 2px solid var(--pine, #0F2C59); outline-offset: 1px; }
.fdp-blank { cursor: default; }
.fdp-day.is-off { color: #b9c0c8; cursor: default; }
/* bugün göstergesi: seçili değilken çerçeveli */
.fdp-day.is-today { border-color: var(--pine, #0F2C59); font-weight: 700; }
/* seçili gün */
.fdp-day.is-selected {
  background: #0E5A43; border-color: #0E5A43; color: #fff; font-weight: 650;
}

/* alt satır: seçilen tarih + temizle */
.fdp-foot {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--line, #e5e0d6);
}
.fdp-picked { font-size: 12px; font-weight: 600; color: var(--pine, #0F2C59); }
.fdp-clear {
  padding: 5px 10px; cursor: pointer;
  background: none; border: 1px solid var(--line, #e5e0d6); border-radius: 7px;
  font: 500 11.5px/1 'Inter', system-ui, sans-serif; color: var(--muted, #626b77);
}
.fdp-clear:hover { background: var(--paper, #F8F6F0); color: var(--ink, #1a1a2e); }

/* uçuş başlığı yanındaki "ucuz uçak bileti" etiketi */
.flight-head .flight-cheap {
  display: inline-block; margin-inline-start: 8px;
  padding: 3px 9px; border-radius: 999px;
  background: rgba(14,90,67,.1);
  font-size: 11px; font-weight: 600; letter-spacing: .01em;
  color: #0E5A43; vertical-align: middle; white-space: nowrap;
  animation: flight-cheap-pulse 1.8s ease-in-out infinite;
}
@keyframes flight-cheap-pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: .45; }
}
@media (prefers-reduced-motion: reduce) {
  .flight-head .flight-cheap { animation: none; }
}

@media (max-width: 480px) {
  .fdp-pop { width: min(288px, calc(100vw - 24px)); }
  .flight-head .flight-cheap { margin-inline-start: 6px; font-size: 10.5px; }
}