/* =========================================================
   Premium Select2 teması (Offer, Konsinye, Ana sayfa)
   Dropdown'lar .cs-field içine açılır (dropdownParent) → stiller burada izole.
========================================================= */
.cs-field.cs-field {
  position: relative;
}
.cs-field.cs-field > select {
  width: 100%;
}

/* ---- Kapalı hal (selection) ---- */
.cs-field.cs-field .select2-container {
  width: 100% !important;
}
.cs-field.cs-field .select2-container .select2-selection--single {
  height: 3.25rem;
  padding: 0 2.75rem 0 0.875rem;
  border: 1px solid rgba(15, 23, 42, 0.12);
  border-radius: 0.875rem;
  background: linear-gradient(180deg, #fff 0%, #fbfbfc 100%);
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04), inset 0 1px 0 rgba(255, 255, 255, 0.8);
  transition: border-color 0.18s, box-shadow 0.18s, background 0.18s;
  display: flex;
  align-items: center;
}
.cs-field.cs-field .select2-container--default .select2-selection--single .select2-selection__rendered {
  line-height: 1.25rem;
  padding: 0;
  color: #171717;
  font-size: 0.9375rem;
  font-weight: 600;
  width: 100%;
}
.cs-field.cs-field .select2-container--default .select2-selection--single .select2-selection__placeholder {
  color: #94a3b8;
  font-weight: 500;
}
.cs-field.cs-field .select2-container .select2-selection--single:hover {
  border-color: rgba(6, 182, 212, 0.45);
}
.cs-field.cs-field .select2-container--open .select2-selection--single,
.cs-field.cs-field .select2-container--focus .select2-selection--single {
  border-color: #06b6d4;
  background: #fff;
  box-shadow: 0 0 0 4px rgba(6, 182, 212, 0.14);
}
.cs-field.cs-field .select2-container--open .select2-selection--single {
  border-bottom-left-radius: 0.875rem;
  border-bottom-right-radius: 0.875rem;
}

/* Ok: yuvarlak turuncu chevron */
.cs-field.cs-field .select2-container--default .select2-selection--single .select2-selection__arrow {
  top: 50%;
  right: 0.625rem;
  width: 1.75rem;
  height: 1.75rem;
  margin: 0;
  transform: translateY(-50%);
  border-radius: 999px;
  background: #ecfeff;
  transition: transform 0.2s, background 0.2s;
}
.cs-field.cs-field .select2-container--default .select2-selection--single .select2-selection__arrow b {
  border: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  left: 0;
  top: 0;
  background: no-repeat center / 14px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2306b6d4' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
}
.cs-field.cs-field .select2-container--open .select2-selection__arrow {
  transform: translateY(-50%) rotate(180deg) !important;
  background: #06b6d4 !important;
}
.cs-field.cs-field .select2-container--open .select2-selection__arrow b {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") !important;
}

/* Pasif (önce üstteki alan seçilmeli) */
.cs-field.cs-field .select2-container--disabled .select2-selection--single {
  background: #f8fafc;
  border-style: dashed;
  cursor: not-allowed;
  box-shadow: none;
}
.cs-field.cs-field .select2-container--disabled .select2-selection__placeholder,
.cs-field.cs-field .select2-container--disabled .select2-selection__rendered {
  color: #b6bfcc !important;
  font-weight: 500 !important;
}
.cs-field.cs-field .select2-container--disabled .select2-selection__arrow {
  background: #f1f5f9 !important;
  opacity: 0.6;
}

/* Hatalı alan */
.cs-field.cs-field.is-invalid .select2-selection--single {
  border-color: #dc2626 !important;
  box-shadow: 0 0 0 4px rgba(220, 38, 38, 0.12) !important;
}

/* Yükleniyor */
.cs-field.cs-field.is-loading .select2-selection__arrow {
  background: #ecfeff !important;
}
.cs-field.cs-field.is-loading .select2-selection__arrow b {
  background-image: none !important;
}
.cs-field.cs-field.is-loading .select2-selection__arrow::after {
  content: "";
  position: absolute;
  inset: 0.4rem;
  border: 2px solid rgba(6, 182, 212, 0.25);
  border-top-color: #06b6d4;
  border-radius: 999px;
  animation: cs-spin 0.7s linear infinite;
}
@keyframes cs-spin {
  to { transform: rotate(360deg); }
}

/* ---- Açık hal (dropdown) ---- */
.cs-field.cs-field .select2-dropdown {
  margin-top: 0.5rem;
  border: 1px solid rgba(15, 23, 42, 0.08) !important;
  border-radius: 1rem !important;
  background: #fff;
  overflow: hidden;
  box-shadow: 0 24px 48px -16px rgba(15, 23, 42, 0.22), 0 8px 16px -8px rgba(15, 23, 42, 0.08);
  animation: cs-drop-in 0.16s ease-out;
  z-index: 60;
}
.cs-field.cs-field .select2-dropdown--above {
  margin-top: 0;
  margin-bottom: 0.5rem;
}
@keyframes cs-drop-in {
  from { opacity: 0; transform: translateY(-4px) scale(0.99); }
  to { opacity: 1; transform: none; }
}

/* Arama kutusu – büyüteç ikonlu */
.cs-field.cs-field .select2-search--dropdown {
  position: relative;
  padding: 0.75rem 0.75rem 0.5rem;
  border-bottom: 1px solid rgba(15, 23, 42, 0.06);
  background: #fcfcfd;
}
.cs-field.cs-field .select2-search--dropdown::before {
  content: "";
  position: absolute;
  left: 1.5rem;
  top: 50%;
  width: 1.05rem;
  height: 1.05rem;
  margin-top: 0.125rem;
  transform: translateY(-50%);
  pointer-events: none;
  background: no-repeat center / contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-3.5-3.5'/%3E%3C/svg%3E");
}
.cs-field.cs-field .select2-search--dropdown:focus-within::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2306b6d4' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-3.5-3.5'/%3E%3C/svg%3E");
}
.cs-field.cs-field .select2-container--default .select2-search--dropdown .select2-search__field {
  height: 2.75rem;
  padding: 0 0.875rem 0 2.5rem;
  border: 1px solid rgba(15, 23, 42, 0.1);
  border-radius: 0.75rem;
  background: #fff;
  font-size: 0.9375rem;
  color: #171717;
  outline: none;
  transition: border-color 0.15s, box-shadow 0.15s;
}
.cs-field.cs-field .select2-container--default .select2-search--dropdown .select2-search__field:focus {
  border-color: #06b6d4;
  box-shadow: 0 0 0 3px rgba(6, 182, 212, 0.14);
}
.cs-field.cs-field .select2-container--default .select2-search--dropdown .select2-search__field::placeholder {
  color: #94a3b8;
}

/* Liste */
.cs-field.cs-field .select2-results > .select2-results__options {
  max-height: 18rem !important;
  padding: 0.375rem;
  overscroll-behavior: contain;
}
.cs-field.cs-field .select2-results__options::-webkit-scrollbar { width: 8px; }
.cs-field.cs-field .select2-results__options::-webkit-scrollbar-thumb {
  background: rgba(15, 23, 42, 0.14);
  border-radius: 999px;
  border: 2px solid #fff;
}
.cs-field.cs-field .select2-container--default .select2-results__option {
  display: flex !important;
  align-items: center;
  gap: 0.625rem;
  min-height: 2.75rem;
  padding: 0.5rem 0.75rem;
  border-radius: 0.625rem;
  font-size: 0.9375rem;
  font-weight: 500;
  color: #334155;
  transition: background 0.12s, color 0.12s;
}
.cs-field.cs-field .select2-container--default .select2-results__option--highlighted[aria-selected] {
  background: #ecfeff;
  color: #0e7490;
}
.cs-field.cs-field .select2-container--default .select2-results__option[aria-selected="true"] {
  background: #06b6d4;
  color: #fff;
  font-weight: 600;
}
.cs-field.cs-field .select2-container--default .select2-results__option[aria-selected="true"]::after {
  content: "";
  margin-left: auto;
  width: 1rem;
  height: 1rem;
  flex-shrink: 0;
  background: no-repeat center / contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5L20 7'/%3E%3C/svg%3E");
}
.cs-field.cs-field .select2-results__message {
  color: #94a3b8 !important;
  font-size: 0.875rem;
  justify-content: center;
}

/* Seçenek içerikleri (logo / renk noktası) */
.cs-opt {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  min-width: 0;
}
.cs-opt-logo {
  width: 1.75rem;
  height: 1.75rem;
  flex-shrink: 0;
  padding: 0.125rem;
  border-radius: 0.5rem;
  background: #fff;
  border: 1px solid rgba(15, 23, 42, 0.06);
  object-fit: contain;
}
.select2-results__option .cs-opt-logo {
  width: 1.75rem !important;
  height: 1.75rem !important;
  margin: 0 !important;
}
.cs-opt-dot {
  width: 1.125rem;
  height: 1.125rem;
  flex-shrink: 0;
  border-radius: 999px;
  border: 1px solid rgba(15, 23, 42, 0.15);
  box-shadow: inset 0 -2px 4px rgba(0, 0, 0, 0.08);
}
.cs-opt-text {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Alan etiketi */
.cs-label {
  display: flex;
  align-items: center;
  gap: 0.375rem;
  margin-bottom: 0.375rem;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #171717;
}
.cs-label .ti {
  font-size: 1rem;
  color: #06b6d4;
}
.cs-label .cs-step {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.25rem;
  height: 1.25rem;
  border-radius: 999px;
  background: #ecfeff;
  color: #0e7490;
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0;
}
.cs-field.cs-field.is-done .cs-step,
.cs-field-wrap.is-done .cs-step {
  background: #16a34a;
  color: #fff;
}

/* Mobil: dokunma hedefleri */
@media (max-width: 640px) {
  .cs-field .select2-results > .select2-results__options {
    max-height: 55vh !important;
  }
}

/* =========================================================
   Telefon ön eki: bulanık Türk bayrağı zemin + üstte +90 (kompakt)
========================================================= */
.tr-flag-prefix {
  position: relative;
  isolation: isolate;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 3.5rem;
  min-height: 2.5rem;
  padding: 0 0.625rem;
  background: #e30a17;
  color: #fff;
  font-size: 0.9375rem;
  font-weight: 700;
  letter-spacing: 0.01em;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.45);
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.06);
  user-select: none;
  overflow: hidden;
}
/* Bayrak: altta, bulanık */
.tr-flag-prefix::before {
  content: "";
  position: absolute;
  inset: -6px;                 /* blur kenarlarda beyazlamasın */
  z-index: -2;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 -30000 90000 60000'%3E%3Cpath fill='%23e30a17' d='m0-30000h90000v60000H0z'/%3E%3Cpath fill='%23fff' d='m41750 0 13568-4408-8386 11541V-7133l8386 11541zm925 8021a15000 15000 0 1 1 0-16042 12000 12000 0 1 0 0 16042z'/%3E%3C/svg%3E") no-repeat left 8px center / auto 100%;
  filter: blur(2.5px) saturate(1.1);
  transform: scale(1.08);
}
/* Okunurluk + premium parlama */
.tr-flag-prefix::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.16) 0%, rgba(255, 255, 255, 0) 50%),
    radial-gradient(ellipse at center, rgba(120, 0, 8, 0.28) 0%, rgba(120, 0, 8, 0) 75%);
  pointer-events: none;
}

/* ---- Teklif akışı yardımcıları (OtoTikla ile aynı yapı, Oto2Next renkleri) ---- */
.field-error { display:none; align-items:center; gap:4px; margin-top:6px; font-size:.8125rem; font-weight:500; color:#dc2626; }
.field-error.flex { display:flex; }
.field-error.hidden { display:none; }

/* Metin kutusu (KM, tramer) */
.cs-input-box { display:flex; align-items:center; height:3.25rem; padding-left:.875rem; border:1px solid rgba(15,23,42,.12); border-radius:.875rem;
                background:#fff; box-shadow:0 1px 2px rgba(15,23,42,.04); transition:border-color .18s, box-shadow .18s; }
.cs-input-box:hover { border-color:rgba(6,182,212,.55); }
.cs-input-box:focus-within { border-color:#0891b2; box-shadow:0 0 0 4px rgba(6,182,212,.16); }
.cs-input-box.is-invalid { border-color:#dc2626 !important; box-shadow:0 0 0 4px rgba(220,38,38,.12) !important; }
.cs-input-box input { flex:1; min-width:0; height:100%; border:0; outline:none; background:transparent; font-size:.9375rem; font-weight:600; color:#111827; }
.cs-input-box input::placeholder { color:#94a3b8; font-weight:500; }
.cs-input-box .cs-unit { margin-right:.625rem; padding:.25rem .625rem; border-radius:999px; background:#ecfeff; color:#0e7490; font-size:.75rem; font-weight:700; }

/* Seçim hapları (sunroof) ve segment (tramer yok/var) */
.cs-segment { display:inline-flex; padding:4px; border-radius:.875rem; border:1px solid rgba(15,23,42,.12); background:#f8fafc; }
.cs-segment label { position:relative; margin:0; cursor:pointer; padding:.5rem 1.25rem; border-radius:.65rem; font-size:.875rem; font-weight:600; color:#64748b; transition:all .15s; }
.cs-segment label input { position:absolute; opacity:0; pointer-events:none; }
.cs-segment label:has(input:checked) { background:#fff; color:#0e7490; box-shadow:0 2px 8px -2px rgba(15,23,42,.15); }

/* =========================================================
   Teklif Akışı – Premium seçim ekranları (Oto2Next)
   Yıl / Marka / Model / Vites / Yakıt / Versiyon + KM & Ek Bilgiler + Tramer
   Sade kalır: beyaz kartlar, ince çerçeve, Oto2Next camgöbeği vurgu.
========================================================= */
.ot-offer { --ot-red:#0891b2; --ot-red-d:#0e7490; --ot-red-soft:#ecfeff; --ot-ink:#111827; --ot-muted:#64748b; --ot-line:rgba(15,23,42,.08); }

/* Kartlar */
.ot-offer .ot-card { border:1px solid var(--ot-line); border-radius:1.125rem; box-shadow:0 1px 2px rgba(15,23,42,.04), 0 12px 32px -24px rgba(15,23,42,.25); }
@media (max-width:640px){ .ot-offer .ot-card { padding:1rem; border-radius:1rem; } }

/* Başlık satırı */
.ot-offer .ot-head { display:flex; flex-wrap:wrap; align-items:center; gap:.75rem 1rem; padding-bottom:1rem; margin-bottom:1.125rem; border-bottom:1px solid #eef1f5; }
.ot-offer .ot-head h3 { margin:0; font-size:.72rem; font-weight:700; letter-spacing:.09em; text-transform:uppercase; color:var(--ot-ink); }
.ot-offer .ot-head p { margin:.15rem 0 0; font-size:1.125rem; font-weight:700; color:var(--ot-ink); line-height:1.3; }
.ot-offer .ot-back { width:38px; height:38px; flex-shrink:0; border-radius:12px; display:inline-flex; align-items:center; justify-content:center; background:var(--ot-ink); color:#fff; font-size:1.125rem; cursor:pointer; transition:background .15s, transform .15s; }
.ot-offer .ot-back:hover { background:var(--ot-red); color:#fff; transform:translateX(-2px); }

/* Arama */
.ot-offer .ot-search-wrap { width:100%; }
@media (min-width:768px){ .ot-offer .ot-search-wrap { width:auto; min-width:260px; } }
.ot-offer .ot-search { display:flex; align-items:center; height:44px; border:1px solid rgba(15,23,42,.12); border-radius:12px; background:#f8fafc; transition:border-color .15s, box-shadow .15s, background .15s; }
.ot-offer .ot-search:focus-within { background:#fff; border-color:var(--ot-red); box-shadow:0 0 0 4px rgba(6,182,212,.12); }
.ot-offer .ot-search input { flex:1; min-width:0; height:100%; padding:0 .875rem; border:0; outline:none; background:transparent; font-size:.9375rem; color:var(--ot-ink); -webkit-appearance:none; appearance:none; }
.ot-offer .ot-search input::-webkit-search-cancel-button { display:none; }
.ot-offer .ot-search input::placeholder { color:#94a3b8; }
.ot-offer .ot-search button { width:44px; height:100%; display:inline-flex; align-items:center; justify-content:center; color:var(--ot-muted); font-size:1.125rem; }
.ot-offer .ot-search:focus-within button { color:var(--ot-red); }

/* Grup başlıkları */
.ot-offer .ot-group-title { display:flex; align-items:center; gap:.625rem; margin:0 0 .75rem; font-size:.75rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:#94a3b8; }
.ot-offer .ot-group-title::after { content:""; flex:1; height:1px; background:#eef1f5; }

/* Seçim kutuları */
.ot-offer .ot-grid { gap:.625rem; }
.ot-offer .ot-item { position:relative; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.375rem; min-height:52px; padding:.75rem .625rem; border:1px solid var(--ot-line); border-radius:.875rem; background:#fff; color:#1f2937; font-weight:600; font-size:.9375rem; line-height:1.25; text-align:center; cursor:pointer; user-select:none; -webkit-tap-highlight-color:transparent; box-shadow:0 1px 2px rgba(15,23,42,.04); transition:border-color .15s, color .15s, background .15s, box-shadow .2s, transform .15s; }
.ot-offer .ot-item:hover { border-color:rgba(6,182,212,.55); background:#f5feff; color:var(--ot-red); box-shadow:0 10px 24px -16px rgba(6,182,212,.55); transform:translateY(-1px); }
.ot-offer .ot-item:active { transform:translateY(0) scale(.985); }
.ot-offer .ot-item.selected { border-color:var(--ot-red); background:var(--ot-red); color:#fff; box-shadow:0 10px 24px -14px rgba(6,182,212,.7); }

/* Yıl */
.ot-offer .ot-item--year { min-height:48px; font-size:1rem; font-variant-numeric:tabular-nums; letter-spacing:.01em; }
@media (max-width:640px){ .ot-offer .ot-grid--year { grid-template-columns:repeat(3,minmax(0,1fr)); gap:.5rem; } }

/* Marka */
.ot-offer .ot-item--brand { padding:.875rem .5rem .75rem; font-size:.8125rem; }
.ot-offer .ot-logo { width:56px; height:56px; display:inline-flex; align-items:center; justify-content:center; border-radius:14px; background:#f8fafc; transition:background .15s; }
.ot-offer .ot-logo img { width:40px; height:40px; object-fit:contain; }
.ot-offer .ot-item--brand:hover .ot-logo { background:#fff; }
.ot-offer .ot-item--brand.selected .ot-logo { background:#fff; }
@media (max-width:640px){
  .ot-offer .ot-grid--brand { grid-template-columns:repeat(3,minmax(0,1fr)); gap:.5rem; }
  .ot-offer .ot-logo { width:46px; height:46px; border-radius:12px; }
  .ot-offer .ot-logo img { width:34px; height:34px; }
  .ot-offer .ot-item--brand { font-size:.75rem; padding:.625rem .375rem; }
}

/* Model */
.ot-offer .ot-item--model { min-height:54px; }

/* İkonlu (vites / yakıt) */
.ot-offer .ot-item--icon { min-height:118px; gap:.625rem; padding:1rem .75rem; }
.ot-offer .ot-ico { width:60px; height:60px; display:inline-flex; align-items:center; justify-content:center; border-radius:16px; background:#f1f5f9; color:#64748b; font-size:2rem; transition:background .15s, color .15s; }
.ot-offer .ot-ico .ot-ico-svg { max-width:38px; max-height:38px; }
.ot-offer .ot-item--icon:hover .ot-ico { background:var(--ot-red-soft); color:var(--ot-red); }
.ot-offer .ot-item--icon.selected .ot-ico { background:rgba(255,255,255,.18); color:#fff; }
.ot-offer .ot-ico-combo { position:relative; width:40px; height:40px; display:block; font-size:1.3rem; }
.ot-offer .ot-ico-combo i { position:absolute; line-height:1; }
.ot-offer .ot-ico-combo i:first-child { top:0; left:0; }
.ot-offer .ot-ico-combo i:last-child { right:0; bottom:0; }
.ot-offer .ot-ico-slash { position:absolute; left:50%; top:50%; width:120%; height:1.5px; border-radius:2px; background:currentColor; opacity:.35; transform:translate(-50%,-50%) rotate(-45deg); }
@media (min-width:768px){ .ot-offer .ot-grid--transmission, .ot-offer .ot-grid--fuel { grid-template-columns:repeat(4,minmax(0,1fr)); } }
@media (max-width:640px){ .ot-offer .ot-item--icon { min-height:104px; } .ot-offer .ot-ico { width:52px; height:52px; } }

/* Versiyon (satır) */
.ot-offer .ot-item--row { flex-direction:row; justify-content:space-between; text-align:left; gap:.75rem; padding:.875rem 1rem; font-size:.875rem; }
.ot-offer .ot-item--row .version-name { flex:1; }
.ot-offer .ot-row-arrow { color:#cbd5e1; font-size:1.125rem; transition:color .15s, transform .15s; }
.ot-offer .ot-item--row:hover .ot-row-arrow { color:var(--ot-red); transform:translateX(2px); }
.ot-offer .ot-item--row.selected .ot-row-arrow { color:#fff; }

/* Bilgi notu (yıl sayfası) */
.ot-offer .ot-note { padding-right:3rem !important; }
.ot-offer .ot-note-ico { width:48px; height:48px; flex-shrink:0; display:inline-flex; align-items:center; justify-content:center; border-radius:14px; background:var(--ot-red-soft); color:var(--ot-red); font-size:1.625rem; }
.ot-offer .ot-note-close { position:absolute; top:.875rem; right:.875rem; width:32px; height:32px; display:inline-flex; align-items:center; justify-content:center; border-radius:10px; color:#94a3b8; font-size:1.125rem; cursor:pointer; transition:background .15s, color .15s; }
.ot-offer .ot-note-close:hover { background:#f1f5f9; color:var(--ot-ink); }

/* Boş arama */
.ot-offer .ot-empty { display:flex; align-items:center; justify-content:center; gap:.5rem; padding:1.25rem 1rem; margin:.25rem 0 1rem; border:1px dashed #e2e8f0; border-radius:.875rem; color:var(--ot-muted); font-size:.875rem; }
.ot-offer .ot-empty[hidden] { display:none; }
.ot-offer .ot-empty i { font-size:1.375rem; color:#94a3b8; }

/* "Aracımı bulamıyorum" – WhatsApp */
.ot-offer .ot-cantfind { display:flex; align-items:center; gap:.75rem; margin-top:2rem; padding:.75rem .75rem .75rem 1rem; border:1px solid #d6f5e1; border-radius:1rem; background:linear-gradient(135deg,#f3fdf6 0%,#ffffff 70%); }
.ot-offer .ot-cantfind-text { flex:1; min-width:0; display:flex; flex-direction:column; gap:.1rem; }
.ot-offer .ot-cantfind-text strong { font-size:.875rem; line-height:1.3; color:var(--ot-ink); }
.ot-offer .ot-cantfind-text span { font-size:.75rem; line-height:1.35; color:var(--ot-muted); }
.ot-offer .ot-cantfind-btn { flex-shrink:0; display:inline-flex; align-items:center; justify-content:center; gap:.4rem; height:40px; padding:0 1rem; border-radius:12px; background:#25d366; color:#fff !important; font-size:.8125rem; font-weight:700; white-space:nowrap; text-decoration:none; transition:background .15s, transform .15s; box-shadow:0 8px 18px -10px rgba(37,211,102,.9); }
.ot-offer .ot-cantfind-btn:hover { background:#1ebe5a; transform:translateY(-1px); }
.ot-offer .ot-cantfind-btn i { font-size:1.05rem; }
.ot-offer .ot-cantfind.is-pulse { animation:ot-pulse 1.2s ease 1; }
@keyframes ot-pulse { 0%,100%{ box-shadow:0 0 0 0 rgba(37,211,102,0);} 40%{ box-shadow:0 0 0 6px rgba(37,211,102,.22);} }
@media (max-width:640px){
  .ot-offer .ot-cantfind { gap:.5rem; margin-top:1.75rem; padding:.625rem .5rem .625rem .75rem; border-radius:.875rem; }
  .ot-offer .ot-cantfind-text strong { font-size:.8125rem; }
  .ot-offer .ot-cantfind-text span { font-size:.6875rem; }
  .ot-offer .ot-cantfind-btn { height:36px; padding:0 .625rem; font-size:.75rem; gap:.3rem; border-radius:10px; }
  .ot-offer .ot-cantfind-btn i { font-size:.95rem; }
}
@media (max-width:359px){ .ot-offer .ot-cantfind-text span { display:none; } }

/* Araç özeti kartı – mobilde sade */
@media (max-width:767px){ .ot-offer .ot-overview { order:2; } }

/* ---------- KM & Ek Bilgiler ---------- */
.ot-offer .ot-form-grid { display:grid; grid-template-columns:1fr; gap:1.125rem; }
@media (min-width:768px){ .ot-offer .ot-form-grid { grid-template-columns:1fr 1fr; gap:1.25rem 1.5rem; } .ot-offer .ot-field-full { grid-column:1 / -1; } }
.ot-offer .ot-label { display:flex; align-items:center; gap:.4rem; margin-bottom:.5rem; font-size:.875rem; font-weight:600; color:#1f2937; }
.ot-offer .ot-req { color:#dc2626; }
.ot-offer .ot-opt { font-weight:500; color:#94a3b8; font-size:.8125rem; }
.ot-offer .ot-textarea { position:relative; border:1px solid rgba(15,23,42,.12); border-radius:.875rem; background:#fff; transition:border-color .15s, box-shadow .15s; }
.ot-offer .ot-textarea:hover { border-color:rgba(6,182,212,.55); }
.ot-offer .ot-textarea:focus-within { border-color:var(--ot-red); box-shadow:0 0 0 4px rgba(6,182,212,.14); }
.ot-offer .ot-textarea textarea { display:block; width:100%; min-height:112px; padding:.75rem .875rem 1.75rem; border:0; outline:none; resize:vertical; background:transparent; border-radius:.875rem; font-size:.9375rem; color:var(--ot-ink); }
.ot-offer .ot-textarea textarea::placeholder { color:#94a3b8; }
.ot-offer .ot-counter { position:absolute; right:.75rem; bottom:.5rem; font-size:.75rem; color:#94a3b8; pointer-events:none; }
.ot-offer .ot-actions { display:flex; justify-content:flex-end; margin-top:1.5rem; padding-top:1rem; border-top:1px solid #eef1f5; }
@media (max-width:640px){ .ot-offer .ot-actions .button { width:100%; justify-content:center; } }
.ot-offer .cs-input-box input { font-size:1rem; }
.ot-offer .cs-input-box .cs-unit, .ot-tramer .cs-input-box .cs-unit { background:#f1f5f9; color:#111827; }

/* Telefon alanı (kişisel bilgiler – Offer & Konsinye): belirgin çerçeve */
.ot-phone-box { border:1px solid #cbd5e1; box-shadow:0 1px 2px rgba(15,23,42,.05); transition:border-color .15s, box-shadow .15s; }
.ot-phone-box:hover { border-color:#94a3b8; }
.ot-phone-box:focus-within { border-color:#f59e0b; box-shadow:0 0 0 3px rgba(245,158,11,.18); }

/* ---------- Tramer (ekspertiz) – kompakt, parça tablosunun altında ---------- */
.ot-tramer { margin:-1rem 0 1rem; padding-top:1rem; border-top:1px solid #eef1f5; }
.ot-tramer-label { display:block; margin-bottom:.5rem; font-size:.875rem; font-weight:600; color:#1f2937; }
.ot-tramer-row { display:flex; align-items:center; gap:.5rem; }
.ot-tramer-row .cs-segment { flex-shrink:0; height:2.75rem; align-items:center; padding:3px; }
.ot-tramer-row .cs-segment label { padding:.4rem .875rem; }
.ot-tramer-row .cs-input-box { flex:1; min-width:0; height:2.75rem; }
@media (min-width:768px){ .ot-tramer-row .cs-input-box { max-width:280px; } }
.cs-input-box.is-disabled { background:#f8fafc; border-style:dashed; cursor:pointer; }
.cs-input-box.is-disabled input { color:#94a3b8; cursor:pointer; }
.cs-input-box.is-disabled .cs-unit { background:#f1f5f9; color:#94a3b8; }

/* Mobil header: "Ücretsiz Teklif Al" butonu */
.ot-m-actions { align-items:center; gap:.875rem; }
.header-btn-offer-m { display:inline-flex; align-items:center; height:36px; padding:0 .875rem; border-radius:999px; background:#06b6d4; color:#fff !important; font-size:.8125rem; font-weight:700; white-space:nowrap; text-decoration:none; box-shadow:0 6px 14px -8px rgba(6,182,212,.8); transition:background .15s; }
.header-btn-offer-m:hover { background:#0891b2; }
@media (max-width:359px){ .header-btn-offer-m { padding:0 .625rem; font-size:.75rem; } }

/* Renk seçimi */
.ot-offer .ot-item--color { flex-direction:row; justify-content:flex-start; gap:.625rem; padding:.625rem .75rem; text-align:left; font-size:.875rem; }
.ot-offer .ot-swatch { width:26px; height:26px; flex-shrink:0; border-radius:999px; box-shadow:inset 0 0 0 1px rgba(15,23,42,.12), 0 1px 2px rgba(15,23,42,.12); }
.ot-offer .ot-swatch.is-white { background:#fff; }
.ot-offer .ot-swatch.is-more { display:inline-flex; align-items:center; justify-content:center; background:#f1f5f9; color:#111827; font-size:.95rem; box-shadow:inset 0 0 0 1px rgba(15,23,42,.12); }
.ot-offer .ot-item--color.selected .ot-swatch { box-shadow:0 0 0 2px #fff; }
.ot-offer .ot-color-more { border:1px dashed #cbd5e1; color:#111827; font-family:inherit; }
.ot-offer .ot-color-more:hover { color:#111827; }
.ot-offer .ot-color-extra { display:none !important; }
.ot-offer .ot-color-reveal { animation:ot-fade-in .25s ease both; }
@keyframes ot-fade-in { from { opacity:0; transform:translateY(4px); } to { opacity:1; transform:none; } }
@media (max-width:640px){
  .ot-offer .ot-grid--color { grid-template-columns:repeat(3,minmax(0,1fr)); gap:.5rem; }
  .ot-offer .ot-item--color { flex-direction:column; justify-content:center; gap:.375rem; min-height:72px; padding:.5rem .25rem; text-align:center; font-size:.75rem; line-height:1.2; }
  .ot-offer .ot-swatch { width:22px; height:22px; }
  .ot-offer .ot-swatch.is-more { font-size:.8rem; }
}
.ot-offer .ot-actions--color { align-items:center; justify-content:flex-end; gap:1rem; }
.ot-offer .ot-actions-hint { font-size:.8125rem; color:#64748b; }
@media (max-width:640px){ .ot-offer .ot-actions--color { flex-direction:column-reverse; align-items:stretch; gap:.5rem; } .ot-offer .ot-actions-hint { text-align:center; font-size:.75rem; } }