/* =========================================================
    Webreta VIP Transfer – LUX Theme (FLAT BUTTONS + NO DARK)
    - soft glass surfaces
    - pixel-perfect spacing & type scale
    - accessible focus, reduced-motion aware
    - dark mode removed (always light)
    ======================================================= */

/* ---------- Tokens ---------- */
:root {
  /* Brand */
  --wvt-primary: #b58913;
  --wvt-primary-600: #a37a12;
  --wvt-primary-700: #8d6a10;
  --wvt-on-primary: #fff;

  /* Surfaces */
  --wvt-bg: #f6f7f9;
  --wvt-surface: #ffffffcc; /* light translucency */
  --wvt-surface-solid: #fff;
  --wvt-border: #e6e9ee;
  --wvt-shadow-soft: 0 8px 24px rgba(15, 23, 42, 0.08);
  --wvt-shadow-hard: 0 12px 32px rgba(15, 23, 42, 0.12);

  /* Text */
  --wvt-text: #1e2329;
  --wvt-muted: #6b7280;

  /* Radii & spacing */
  --wvt-r: 14px;
  --wvt-r-sm: 10px;
  --wvt-gap: 18px;
  --wvt-gap-lg: 26px;

  /* Type scale */
  --fs-12: 12px; --fs-13: 13px; --fs-14: 14px; --fs-15: 15px;
  --fs-16: 16px; --fs-18: 18px; --fs-20: 20px; --fs-24: 24px;

  /* Effects */
  --ring: 0 0 0 3px rgba(181, 137, 19, .18);
  --press: .985;
}

:root { color-scheme: light; }

@media (prefers-reduced-motion: reduce) {
  * { animation: none !important; transition: none !important; }
}

body { background: radial-gradient(1200px 800px at 10% 0%, #ffffff 0%, #f4f6f9 50%, #eef1f6 100%), var(--wvt-bg); }

/* ---------- Buttons (FLAT) ---------- */
.wvt-button-primary,
button.wvt-select-vehicle-btn {
  background: var(--wvt-primary);
  color: var(--wvt-on-primary) !important;
  border: 1px solid transparent !important;
  padding: 12px 22px;
  font-size: var(--fs-15);
  font-weight: 800;
  border-radius: var(--wvt-r);
  cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  text-decoration: none; line-height: 1.1 !important; width: 100%;
  box-shadow: 0 2px 0 rgba(0,0,0,.04), var(--wvt-shadow-soft) !important;
  transition: transform .15s ease, filter .25s ease, box-shadow .25s ease;
  margin-right:0;
}
.wvt-button-primary:hover,
button.wvt-select-vehicle-btn:hover { filter: brightness(1.03) saturate(1.02); }
.wvt-button-primary:active,
button.wvt-select-vehicle-btn:active { transform: scale(var(--press)); }
.wvt-button-primary:focus-visible,
button.wvt-select-vehicle-btn:focus-visible { outline: none; box-shadow: var(--wvt-shadow-soft), var(--ring) !important; }

.wvt-button-secondary {
  background: #eef2f7;
  color: var(--wvt-text) !important;
  border: 1px solid #d7dee8;
  padding: 10px 16px; font-size: var(--fs-14); border-radius: var(--wvt-r-sm);
  display: inline-flex; align-items: center; gap: 8px;
  transition: transform .15s ease, filter .25s ease;
}
.wvt-button-secondary:hover { filter: brightness(0.98); }
.wvt-button-secondary:active { transform: scale(var(--press)); }
.wvt-button-secondary:focus-visible { outline: none; box-shadow: var(--ring); }

.wvt-button-whatsapp {
  --wa: #25D366;
  background: var(--wa);
  color: #fff !important;
  padding: 11px 18px; border-radius: var(--wvt-r);
  font-weight: 800; border: 1px solid #20bd5f;
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  transition: transform .15s ease, filter .25s ease;
}
.wvt-button-whatsapp:hover { filter: brightness(0.97); }
.wvt-button-whatsapp:active { transform: scale(var(--press)); }
.wvt-button-whatsapp:focus-visible { outline: none; box-shadow: var(--ring); }
.wvt-button-whatsapp::before {
  content: ''; width: 18px; height: 18px; background: currentColor;
  mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path d="M380.9 97.1C339 55.1 283.2 32 223.9 32c-122.4 0-222 99.6-222 222 0 39.1 10.2 77.3 29.6 111L0 480l117.7-30.9c32.4 17.7 68.9 27 106.1 27h.1c122.3 0 224.1-99.6 224.1-222 0-59.3-25.2-115-67.1-157zm-157 341.6c-33.2 0-65.7-8.9-94-25.7l-6.7-4-69.8 18.3L72 359.2l-4.4-7c-18.5-29.4-28.2-63.3-28.2-98.2 0-101.7 82.8-184.5 184.6-184.5 49.3 0 95.6 19.2 130.4 54.1 34.8 34.9 56.2 81.2 56.1 130.5 0 101.8-84.9 184.6-186.6 184.6zm101.2-138.2c-5.5-2.8-32.8-16.2-37.9-18-5.1-1.9-8.8-2.8-12.5 2.8-3.7 5.6-14.3 18-17.6 21.8-3.2 3.7-6.5 4.2-12 1.4-32.8-16.2-54-29.1-75.5-66-5.7-9.8 5.7-9.1 16.3-30.3 1.8-3.7.9-6.9-.5-9.7-1.4-2.8-12.5-30.1-17.1-41.2-4.5-10.8-9.1-9.3-12.5-9.5-3.2-.2-6.9-.2-10.6-.2-3.7 0-9.7 1.4-14.8 6.9-5.1 5.6-19.4 19-19.4 46.3 0 27.3 19.9 53.7 22.6 57.4 2.8 3.7 39.1 59.7 94.8 83.8 35.2 15.2 49 16.5 66.6 13.9 10.7-1.6 32.8-13.4 37.4-26.4 4.6-13 4.6-24.1 3.2-26.4-1.3-2.5-5-3.9-10.5-6.6z"/></svg>') center/contain no-repeat;
}

/* ---------- Forms ---------- */
.wvt-form-group { margin-bottom: 18px; }
.wvt-form-group label {
  display: block; font-weight: 800; margin-bottom: 8px;
  color: var(--wvt-text); font-size: var(--fs-14); letter-spacing: .1px;
}

/* === GÜNCELLEME: Tüm Form Alanları (MOBİL DÜZELTMELERİYLE) === */
.wvt-form-group input,
.wvt-form-group select,
.wvt-form-group textarea,
.wvt-form-group input[type="number"],
.wvt-form-group input[type="date"] {
  width: 100%;
  height: 39px;
  padding: 0 14px;
  border: 1px solid var(--wvt-border);
  border-radius: 12px;
  background: var(--wvt-surface-solid) !important; /* Düz beyazı zorla */
  backdrop-filter: none;
  color: var(--wvt-text);
  transition: border-color .2s ease, box-shadow .2s ease;
  font-size: var(--fs-14);
  box-shadow: inset 0 1px 0 rgba(0,0,0,.02);
  -webkit-appearance: none;
  appearance: none;
  box-sizing: border-box;
  display: flex; /* Düzeltme: Dikey hizalama için */
  align-items: center; /* Düzeltme: Dikey hizalama için */
}
.wvt-form-group textarea {
  height: auto;
  min-height: 80px;
  line-height: 1.6;
  padding: 12px 14px;
  display: block; /* Textarea için flex'i iptal et */
}
.wvt-form-group select {
  background-image: url('data:image/svg+xml;utf8,<svg fill="black" height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg"><path d="M7 10l5 5 5-5z"/><path d="M0 0h24v24H0z" fill="none"/></svg>');
  background-repeat: no-repeat;
  background-position: right 14px center;
  padding-right: 40px;
}
.wvt-form-group input:focus,
.wvt-form-group select:focus,
.wvt-form-group textarea:focus {
  outline: none; border-color: var(--wvt-primary); box-shadow: var(--ring);
}
.wvt-form-group input::placeholder,
.wvt-form-group textarea::placeholder { color: var(--wvt-muted); }

.wvt-location-group-vertical { position: relative; padding: 20px 0; }
.wvt-swap-button-vertical {
  position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
  width: 30px; height: 30px; border-radius: 50%;
  background: var(--wvt-primary); border: 1px solid var(--wvt-border);
  display: grid; place-items: center; cursor: pointer; z-index: 2;
  box-shadow: 0 6px 20px rgba(0,0,0,.08); color: #fff;
  transition: all .25s ease;
  margin-top: 5px !important;
}
.wvt-swap-button-vertical:hover { background: var(--wvt-primary); border-color: var(--wvt-primary); color: #fff; transform: translate(-50%, -50%) rotate(180deg); }
.wvt-swap-button-vertical:focus-visible { outline: none; box-shadow: var(--ring); }
.wvt-swap-button-vertical svg {width: 14px !important; height:14px !important;}

/* Tarih & Saat Alanları */
.wvt-datetime-group { display: flex; gap: 12px; align-items: stretch; }
.wvt-datetime-group input { position: relative; }
.wvt-datetime-group input[type="date"]::-webkit-calendar-picker-indicator,
.wvt-datetime-group input[type="time"]::-webkit-calendar-picker-indicator {
  position: absolute;
  right: 14px;
  top: 50%;
  transform: translateY(-50%);
  opacity: .6;
  filter: none;
}
/* Seçilmemişken placeholder rengini ayarla */
.wvt-datetime-group input[type="date"]:invalid,
.wvt-datetime-group input[type="time"]:invalid {
  color: var(--wvt-muted);
}

@media (max-width: 767px) {
  .wvt-form-group input, .wvt-form-group select, .wvt-form-group textarea,
  .wvt-datetime-group input {
    font-size: 16px; /* mobile tap target */
  }
}

/* ---------- Route Cards ---------- */
.wvt-routes-grid { display: grid; gap: 16px; }
.wvt-routes-grid.wvt-cols-1 { grid-template-columns: 1fr; }
.wvt-routes-grid.wvt-cols-2 { grid-template-columns: repeat(2, 1fr); }
.wvt-routes-grid.wvt-cols-3 { grid-template-columns: repeat(3, 1fr); }
.wvt-routes-grid.wvt-cols-4 { grid-template-columns: repeat(4, 1fr); }

a.wvt-route-card-v3 {
  background: var(--wvt-surface-solid);
  border-radius: 16px;
  border: 1px solid var(--wvt-border);
  box-shadow: 0 2px 0 rgba(0,0,0,.03), var(--wvt-shadow-soft);
  transition: all .25s ease;
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 18px; text-decoration: none;
}
a.wvt-route-card-v3:hover {
  transform: translateY(-3px);
  box-shadow: var(--wvt-shadow-hard);
  border-color: color-mix(in srgb, var(--wvt-primary), #ffffff 40%);
}

.wvt-route-info-v2 { display: flex; flex-direction: column; text-align: left; gap: 2px; }
.wvt-from-location { font-size: var(--fs-16); font-weight: 900; color: var(--wvt-text); letter-spacing: .2px; }
.wvt-to-location { font-size: var(--fs-14); color: #a56600; }
.wvt-price-tag-v2 {
  --chip: #2c3e50;
  background-color: #3b3b3a;
  color: #fff; padding: 9px 14px; border-radius: 10px;
  font-size: var(--fs-13); font-weight: 900; white-space: nowrap; min-width: 110px; text-align: center;
  box-shadow: 0 10px 18px rgba(44,62,80,.2), inset 0 1px 0 rgba(255,255,255,.08);
}
.wvt-price-tag-v2 strong { display: block; font-size: var(--fs-18); line-height: 1.05; }
.wvt-price-tag-v2.inquire { --chip: #6c757d; }

/* ---------- Booking / Vehicles ---------- */
.wvt-booking-wrapper { display: grid; grid-template-columns: 370px 1fr; gap: var(--wvt-gap-lg); align-items: start; }
.wvt-booking-form-container,
.wvt-checkout-form-container,
.wvt-summary-container,
.wvt-thank-you-message {
  background: var(--wvt-surface-solid);
  border: 1px solid var(--wvt-border);
  border-radius: 18px;
  box-shadow: var(--wvt-shadow-soft);
}

.wvt-summary-container {
	background-color: black;
	color: #fff;
}

.wvt-summary-container h3 {
	color: #fff;
}
.wvt-booking-form-container { padding: 24px; position: sticky; top: 28px; }
.wvt-booking-form-container h3,
.wvt-vehicle-list-container h3 { margin: 0 0 16px; padding-bottom: 10px; border-bottom: 2px solid var(--wvt-primary); font-size: clamp(18px, 1.1vw + 14px, 22px); }

.wvt-vehicle-list { display: flex; flex-direction: column; gap: 18px; }
.wvt-vehicle-card {
  background: var(--wvt-surface-solid);
  border: 1px solid var(--wvt-border);
  border-radius: 18px;
  padding: 18px; gap: 18px;
  display: flex; align-items: center; transition: transform .18s ease, box-shadow .25s ease, border-color .25s ease;
}
.wvt-vehicle-card:hover { transform: translateY(-2px); box-shadow: var(--wvt-shadow-hard); border-color: color-mix(in srgb, var(--wvt-primary), #fff 50%); }
.wvt-vehicle-unavailable { opacity: .6; background: color-mix(in srgb, var(--wvt-surface-solid) 92%, #000 8%); }

.wvt-vehicle-image { width: 190px; flex-shrink: 0; }
.wvt-vehicle-image img { width: 100%; height: auto; object-fit: cover; border-radius: 12px;}

.wvt-vehicle-details { flex: 1 1 auto; min-width: 0; }
.wvt-vehicle-details h4 { margin: 0 0 6px; font-size: var(--fs-16); font-weight: 900; color: var(--wvt-text); }
.wvt-vehicle-details p { margin: 0; color: var(--wvt-muted); font-size: var(--fs-13); }

.wvt-vehicle-price-action { text-align: right; min-width: 220px; display: flex; flex-direction: column; align-items: flex-end; gap: 8px; }
.wvt-price-main { font-size: 1.68em; font-weight: 900; color: var(--wvt-primary); letter-spacing: .2px; }
/* GÜNCELLEME: Para birimlerini yan yana yap */
.wvt-price-converted {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 4px 12px; /* Dikey ve yatay boşluk */
    font-size: var(--fs-12);
    color: var(--wvt-muted);
    line-height: 1.45;
    margin-top: 2px;
    max-width: 200px;
}
.wvt-price-converted span {
    display: inline;
}
.wvt-vehicle-price-action .wvt-select-vehicle-btn { width: auto; padding: 10px 18px; font-size: var(--fs-14); }

/* 👇 Mobilde ortala */
@media (max-width: 767px) {
  .wvt-price-converted {
    justify-content: center;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
  }
}

/* Notices */
.wvt-no-vehicles { background: #fff3cd; border: 1px solid #ffe299; color: #7a5a00; padding: 14px; border-radius: 12px; }
.wvt-unavailable-notice { background: #dc3545; color: #fff; font-weight: 900; padding: 10px 16px; border-radius: 10px; font-size: var(--fs-14); text-align: center; }

/* ---------- Checkout & Summary ---------- */
.wvt-checkout-wrapper-v2 { display: grid; grid-template-columns: 1fr 410px; gap: var(--wvt-gap-lg); align-items: start; }
.wvt-summary-container { padding: 24px; position: sticky; top: 28px; }
.wvt-checkout-form-container { padding: 24px; }
.wvt-checkout-form-container h3,
.wvt-summary-container h3 { margin: 0 0 18px; padding-bottom: 12px; border-bottom: 2px solid var(--wvt-primary); }

.wvt-summary-details p {
  display: flex; align-items: center; gap: 14px;
  margin: 0 0 12px; padding: 12px 14px;
  background: var(--wvt-surface-solid);
  border: 1px solid var(--wvt-border);
  border-radius: 12px; font-size: var(--fs-15);
  box-shadow: 0 1px 0 rgba(255,255,255,.4) inset;
}
.wvt-summary-details p:last-child { margin-bottom: 0; }
.wvt-summary-details p strong { font-weight: 900; color: var(--wvt-text); }

.wvt-summary-details p::before {
  content: ''; width: 20px; height: 20px; background-color: var(--wvt-primary);
  mask-size: contain; -webkit-mask-size: contain; flex-shrink: 0;
}
.wvt-summary-details p:nth-child(1)::before { mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><path d="M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z"/><circle cx="12" cy="10" r="3"/></svg>'); }
.wvt-summary-details p:nth-child(2)::before { mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><rect x="3" y="4" width="18" height="18" rx="2" ry="2"/><path d="M16 2v4M8 2v4M3 10h18"/></svg>'); }
.wvt-summary-details p:nth-child(3)::before { mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"/><circle cx="9" cy="7" r="4"/><path d="M23 21v-2a4 4 0 0 0-3-3.87"/><path d="M16 3.13a4 4 0 0 1 0 7.75"/></svg>'); }
.wvt-summary-details p:nth-child(4)::before { mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><path d="M14 16.5V18a2 2 0 0 1-2 2H8a2 2 0 0 1-2-2v-1.5"/><path d="M14 6.5V5a2 2 0 0 0-2-2H8a2 2 0 0 0-2 2v1.5"/><path d="M5 12h14"/><circle cx="19" cy="18" r="2"/><circle cx="5" cy="18" r="2"/><circle cx="19" cy="6" r="2"/><circle cx="5" cy="6" r="2"/></svg>'); }
.wvt-summary-details p:nth-child(5)::before { mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M20.59 13.41l-7.17 7.17a2 2 0 0 1-2.83 0L2 12V2h10l8.59 8.59a2 2 0 0 1 0 2.82z"></path><line x1="7" y1="7" x2="7.01" y2="7"></line></svg>'); } /* Fiyat */

.wvt-summary-price {
  border-top: 2px solid var(--wvt-primary);
  padding-top: 18px !important; margin-top: 18px !important; text-align: center;
}
.wvt-summary-price strong { display: block; font-size: var(--fs-13); color: var(--wvt-muted); font-weight: 800; margin-bottom: 4px; }
.wvt-summary-price .wvt-total-amount { font-size: 2.2em; font-weight: 900; color: var(--wvt-primary); line-height: 1; }

.wvt-thank-you-message { padding: 38px; max-width: 740px; margin: 22px auto; text-align: center; }
.wvt-thank-you-message::before {
  content: "✓"; display: block; font-size: 50px; width: 84px; height: 84px; line-height: 84px;
  border-radius: 50%; background: #2ecc71; color: #fff; margin: 0 auto 16px; box-shadow: inset 0 -3px 0 rgba(0,0,0,.12);
}
.wvt-thank-you-message h3 { color: var(--wvt-text); font-size: 1.72em; margin: 0 0 8px; }

/* ---------- Responsive ---------- */
@media (max-width: 991px) {
  .wvt-routes-grid.wvt-cols-3, .wvt-routes-grid.wvt-cols-4 { grid-template-columns: repeat(2, 1fr); }
  .wvt-booking-wrapper, .wvt-checkout-wrapper-v2 { grid-template-columns: 1fr; }
  .wvt-booking-form-container, .wvt-summary-container { position: static; box-shadow: none; }
  .wvt-summary-container { order: -1; }
}

@media (max-width: 767px) {
  a.wvt-route-card-v3 { flex-direction: column; align-items: flex-start; gap: 12px; }
  .wvt-from-location { font-size: var(--fs-15); }
  .wvt-to-location { font-size: var(--fs-13); }
  .wvt-vehicle-card { flex-direction: column; align-items: stretch; text-align: center; }
  .wvt-vehicle-image { width: 100%; max-width: 270px; margin: 0 auto 12px; }
  .wvt-vehicle-price-action { align-items: center; min-width: 0; }
  .wvt-vehicle-price-action .wvt-select-vehicle-btn { width: 100%; }
}

@media (max-width: 600px) {
  .wvt-routes-grid.wvt-cols-2, .wvt-routes-grid.wvt-cols-3, .wvt-routes-grid.wvt-cols-4 {  grid-template-columns: repeat(1, minmax(0, 1fr)) !important; gap: 12px; }
}

/* Print */
@media print {
  .wvt-inquiry-wrapper { max-width: none; }
  .wvt-inquiry-result { box-shadow: none; border-color: #bbb; }
  .wvt-inquiry-wrapper .wvt-button-secondary { display: none !important; }
}

/* --- YENİ: Rota Kartları İçin Para Birimi Gösterimi --- */

.wvt-route-info-v2 {
    gap: 4px; /* Satırlar arasına boşluk ekler */
}

.wvt-converted-prices {
    font-size: 0.8em;
    color: #aaa;
    display: flex;
    gap: 10px;
    margin-top: 5px;
}

/* Fiyatı olmayan veya gizli olan kartlarda bu alanı gizle */
.wvt-price-tag-v2.inquire ~ .wvt-converted-prices,
.wvt-price-tag-v2.action ~ .wvt-converted-prices {
    display: none;
}


/* --- YENİ: Mobil Cihazlar İçin Para Birimi Hizalaması --- */

@media (max-width: 767px) { 
    .wvt-route-info-v2 {
        text-align: left; /* Mobilde ortala */
    }
    .wvt-converted-prices {
        justify-content: center; /* Para birimlerini ortala */
        margin-top: 8px;
    }
}


