/* ============================================================
   VyTeklif — Minimal Custom CSS
   Bootstrap 4.1.0 tamamlayıcısı — sadece BS4'ün karşılamadığı stiller
   ============================================================ */

/* Kilitli kart (müşteri sorgulanmadan araç, araç sorgulanmadan çalıştır) */
:root{
	--jt-red: #e31e27;
	--jt-red-hover: color-mix(in srgb, #e31e27 85%, #000000);
	--jt-blue: #1e3da3;
	--jt-blue-hover: color-mix(in srgb, #1e3da3 85%, #000000);
}

.btn{
	box-shadow:none!important;
	background-image:none!important;
}
.jt-btn-red{
	background-color: var(--jt-red)!important;
	border-color: var(--jt-red)!important;
}
.jt-btn-red:hover{
	background-color: var(--jt-red-hover)!important;
	border-color: var(--jt-red-hover)!important;
}
.jt-btn-blue{
	background-color: var(--jt-blue)!important;
	border-color: var(--jt-blue)!important;
	box-shadow:none!important;
	background-image:none!important;
}
.jt-btn-blue:hover{
	background-color: var(--jt-blue-hover)!important;
	border-color: var(--jt-blue-hover)!important;
}
.jt-card {
	border-left: 4px solid var(--jt-red) !important;
    border-radius: 8px !important;
}
.jt-locked {
    opacity: .5;
    pointer-events: none;
    user-select: none;
	border-left-color: var(--gray)!important
}
#jt-tabs.nav-pills .nav-link, #jt-tabs.nav-pills .nav-link.disabled {
    background-color: var(--gray);
	color:#fff;
}
#jt-tabs.nav-pills .nav-link.active, #jt-tabs.nav-pills .show>.nav-link {
    background-color: var(--jt-red);
}
#jt-tabs.nav-pills .nav-link:has(.text-success) {
    background-color: var(--green);
}
#jt-tabs.nav-pills > li > a {
    margin-top: 0;
    margin-bottom: 0;
    margin-right: 15px;
	border-radius: 8px;
	padding:15px 20px;
}
#jt-tabs.nav-pills > li:last-child > a{
	margin-right: 0;
}
.jt-panel .custom-control-input:checked~.custom-control-label::before {
    background-color: var(--jt-red);
}
.jt-panel .custom-radio .custom-control-input:checked~.custom-control-label::before {
    background-color: var(--jt-red);
}
.jt-panel .custom-checkbox .custom-control-input:checked~.custom-control-label::before {
    background-color: var(--jt-red);
}
.jt-panel .custom-control-input:focus~.custom-control-label::before {
    box-shadow: 0 0 0 1px #fff,0 0 0 .2rem rgba(227,30,39,.25);
}
.jt-panel .custom-control-input:active~.custom-control-label::before {
    color: #fff;
    background-color: #ffc9cb;
}

/* Tab "tamamlandı" state — adım 2'ye geçince tab1 kırmızı kalır */
#jt-tabs.nav-pills .nav-link.jt-done {
    background-color: var(--jt-red);
    color: #fff;
}

/* Kart başarı state — müşteri/araç sorgusu tamamlanınca sol kenar yeşil */
.jt-card.jt-card-success {
    border-left-color: var(--green) !important;
}

/* Hata/ret teklif satırı — sol kırmızı kenarlık (BS4'te border-start yok) */
.jt-item-hata, .jt-item-hata.border {
    border-left: 3px solid var(--jt-red) !important;
    background-color: color-mix(in srgb, #e31e27 5%, #fff)!important;
}
.jt-teklif-item:not(.jt-item-hata), .jt-teklif-item:not(.jt-item-hata).border {
    border-left: 3px solid var(--green) !important;
	background-color: color-mix(in srgb, var(--green) 5%, #fff)!important;
	border-color: var(--green) !important;
}
#jt-arac-sonuc input.form-control, #jt-musteri-sonuc input.form-control {
    background: #f8f9fa;
}
#jt-arac-sonuc input.form-control:focus, #jt-musteri-sonuc input.form-control:focus {
    background: #fff;
	box-shadow:none;
}
.jt-teklif-item:not(.jt-item-hata) .badge {
    color: #fff !important;
    border-color: var(--secondary) !important;
    background-color: var(--secondary) !important;
}
.jt-teklif-item.jt-item-hata .badge {
    background-color: #fff !important;
    color: var(--secondary) !important;
}
/* ---------------------------------------------------------------
   Stream Status — d-flex sınıfı !important çakışmasını önlemek
   için inline style'ın çalışması adına class yerine CSS kullanılır
--------------------------------------------------------------- */
#jt-stream-status {
    display: flex;
    align-items: center;
}

/* ---------------------------------------------------------------
   Spinner — Bootstrap 4.1.0'da .spinner-border bileşeni yok
--------------------------------------------------------------- */
.jt-spinner {
    width: 20px;
    height: 20px;
    border: 3px solid rgba(30, 61, 163, .2);
    border-top-color: var(--jt-blue);
    border-radius: 50%;
    animation: jt-spin .7s linear infinite;
    flex-shrink: 0;
}
@keyframes jt-spin { to { transform: rotate(360deg); } }

/* ---------------------------------------------------------------
   Teklif listesi — Bootstrap 4'te flex gap desteği yok
--------------------------------------------------------------- */
#jt-teklif-listesi {
    display: flex;
    flex-direction: column;
    gap: .5rem;
	min-height: 400px;
    max-height: 800px;
    overflow-y: auto;
	padding-right: 5px;
	scrollbar-width: thin; /* Tüm çubukları ince yapar */
  scrollbar-color: #e31e27 transparent; /* Çubuk Rengi ve Arka Plan Rengi */
}

#jt-teklif-listesi::-webkit-scrollbar {
  width: 5px; /* Dikey scrollbar genişliği */
  height: 5px; /* Yatay scrollbar yüksekliği */
}

#jt-teklif-listesi::-webkit-scrollbar-track {
  background: transparent;
}

#jt-teklif-listesi::-webkit-scrollbar-thumb {
  background: #e31e27;
  border-radius: 5px; /* Köşeleri yuvarlar */
  border: 2px solid transparent; /* Çubuğun etrafına boşluk bırakarak daha şık gösterir */
}

#jt-teklif-listesi::-webkit-scrollbar-thumb:hover {
  background: color-mix(in srgb, #e31e27 80%, #000000);
}
/* ---------------------------------------------------------------
   Teklif item — logo bölmesi
--------------------------------------------------------------- */
.jt-item-logo {
    width: 50px;
	height: 50px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
	border-radius: 50%;
	overflow: hidden;
}

.jt-company-logo-img {
    width: 40px;
    height: 40px;
    object-fit: cover;
	object-position: center;
    display: block;
}

/* Şirket logosu yüklenemediğinde baş harf dairesi */
.jt-logo-fallback {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: var(--jt-blue);
    color: #fff;
    font-weight: 700;
    font-size: .85rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Bootstrap 5'te var, 4'te yok — flex item taşmasını önler */
.min-width-0 { min-width: 0; }
.jt-teklif-item .badge {
    font-size: 60%;
    /* font-weight: 600; */
}