﻿html {
    font-size: 14px;
}

@media (min-width: 768px) {
    html {
        font-size: 16px;
    }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
    box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
    position: relative;
    min-height: 100%;
}

body {
    margin-bottom: 60px;
    background-color: #0f2236; /* sayfa koyu arka plan */
    color: #f0f0f0; /* varsayılan açık yazı */
}

/* =========================
   NAVBAR STİLİ
   ========================= */
.navbar {
    background-color: #0f2236 !important; /* koyu mavi-lacivert */
    border-bottom: 1px solid rgba(212,175,55,.18); /* altın rengi ince çizgi */
}

.navbar-nav .nav-link {
    color: #f0f0f0 !important;
    font-weight: 500;
    letter-spacing: 0.5px;
    transition: color 0.3s ease;
}

    .navbar-nav .nav-link:hover {
        color: #f4d36e !important;
    }

/* =========================
   LOGO (eski sınıflar, gerekirse kalsın)
   ========================= */
.brand-mark {
    height: 40px;
    width: auto;
    display: block;
}

@media (min-width: 768px) {
    .brand-mark {
        height: 48px;
    }
}

@media (min-width: 1200px) {
    .brand-mark {
        height: 56px;
    }
}

/* Wordmark boyutu (kullanılmıyor ama dursun) */
.brand-wordmark {
    height: 28px;
    width: auto;
    display: block;
}

@media (min-width: 992px) {
    .brand-wordmark {
        height: 36px;
    }
}

.navbar-brand:hover .brand-wordmark {
    color: #ffe08a;
}

/* =========================
   MODAL
   ========================= */
.modal-content {
    background-color: #1e293b;
    color: #f1f5f9;
}

.modal-header, .modal-footer {
    border-color: #334155;
}

.modal-title {
    font-weight: 600;
}

.modal-body p {
    margin-bottom: .5rem;
}

.modal a {
    color: #93c5fd;
}

.modal strong {
    color: #facc15;
}

.modal-backdrop.show {
    opacity: .7;
}

/* =========================
   VEHICLE CARD
   ========================= */
.vehicle-card .carousel,
.vehicle-card .carousel-inner,
.vehicle-card .carousel-item {
    height: clamp(180px, 22vw, 240px);
}

    .vehicle-card .carousel-item img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center;
        display: block;
    }

.vehicle-card.card {
    height: 100%;
    display: flex;
    flex-direction: column;
}

.vehicle-card .card-body {
    display: flex;
    flex-direction: column;
}

.vehicle-card .btn-book {
    margin-top: auto;
}

/* =========================================================
   YENİ: NAVBAR LOGO BOYUTU (daha büyük, responsive)
   ========================================================= */
.nav-logo {
    height: 54px;
    width: auto;
    display: block;
}

@media (min-width: 992px) {
    .nav-logo {
        height: 64px;
    }
}
/* desktop */
@media (min-width: 1400px) {
    .nav-logo {
        height: 72px;
    }
}
/* büyük ekran */

/* =========================================================
   YENİ: PROMOSYON ŞERİDİ (logo altını ile uyumlu sıcak altın)
   ========================================================= */
.alert-warning,
.promo-banner {
    border: 1px solid rgba(212,175,55,.35);
    background: linear-gradient(180deg, #fff9e6, #fffdf5);
    color: #7a5d00; /* koyu altın metin */
}

    .promo-banner .badge,
    .alert-warning .badge {
        background: #f9e9a5;
        color: #704c00;
    }

/* =========================
   HERO & SEARCH PANEL
   ========================= */
.hero-banner {
    position: relative;
    border-radius: 16px;
    overflow: hidden;
    background: radial-gradient(120% 80% at 50% 10%, rgba(255,255,255,0.08), rgba(0,0,0,0.65)), var(--hero-image, url('/img/banner.jpg')) center/cover no-repeat;
    min-height: 280px;
}

    .hero-banner .display-5 {
        font-family: 'Cinzel Decorative', serif;
        letter-spacing: 1px;
        text-shadow: 0 6px 18px rgba(0,0,0,.35);
    }

    .hero-banner .lead {
        opacity: .95;
    }

/* Arama formu kart hissi (mevcut <form class="mb-3"> üzerine) */
form.mb-3[onsubmit] {
    background: rgba(7, 12, 24, .65);
    backdrop-filter: blur(6px);
    border: 1px solid rgba(212,175,55,.15);
    border-radius: 16px;
    padding: 18px;
    box-shadow: 0 10px 30px rgba(0,0,0,.35);
}

/* Google Places dropdown above other elements */
.pac-container {
    z-index: 2000 !important;
}

@media (min-width: 768px) {
    form.mb-3[onsubmit] {
        padding: 24px;
    }
}

/* Inputs & labels */
.form-label {
    color: #e8e8ea;
    font-weight: 500;
}

.form-control, .form-select {
    background: #0e1726;
    border: 1px solid #24324a;
    color: #f1f1f5;
    border-radius: 12px;
}

    .form-control::placeholder {
        color: #9fb0c9;
    }

    .form-control:focus, .form-select:focus {
        border-color: #35507a;
        box-shadow: 0 0 0 0.2rem rgba(53,80,122,.25);
    }

/* Primary button → premium gradient */
.btn-primary {
    border: 0;
    border-radius: 12px;
    background-image: linear-gradient(180deg, #3b82f6, #2563eb);
}

    .btn-primary:hover {
        filter: brightness(1.06);
    }

/* Promo banner (indirim kutusu) */
.promo-banner,
.alert-info, .alert-secondary {
    border-radius: 14px;
    border: 1px solid rgba(212,175,55,.35);
    background: linear-gradient(180deg, #fff9e6, #fffdf5);
    color: #7a5d00;
}

    .promo-banner i, .alert-info i, .alert-secondary i {
        color: #7a5d00;
    }

/* Footer */
.footer {
    background: #0f2236;
    color: #cbd5e1;
}

    .footer a {
        color: #93c5fd;
    }

/* Language dropdown */
.dropdown .btn.btn-outline-secondary {
    color: #e2e8f0;
    border-color: #334155;
}

.dropdown .btn.btn-outline-secondary:hover {
    background: #0f2236;
}

/* Passenger dropdown */
.passenger-dropdown .dropdown-menu {
    background: #0e1726;
    border: 1px solid #24324a;
    border-radius: 12px;
    color: #f1f1f5;
    width: 100%;
    min-width: 100%;
    padding: 1rem;
}

@media (min-width: 576px) {
    .passenger-dropdown .dropdown-menu {
        min-width: 250px;
        width: auto;
    }
}

.passenger-dropdown .input-group .btn {
    background: #0e1726;
    border-color: #24324a;
    color: #f1f1f5;
}

.passenger-dropdown .input-group .form-control {
    background: #0e1726;
    border-color: #24324a;
    color: #f1f1f5;
}

/* Vehicle cards */
.card.vehicle-card {
    background: #0e1726;
    border: 1px solid #24324a;
    border-radius: 18px;
    box-shadow: 0 8px 24px rgba(0,0,0,.35);
}

/* SEO route cards (homepage preset routes) */
.card.seo-route-card {
    background: #0e1726;
    border: 1px solid #24324a;
    border-radius: 18px;
    box-shadow: 0 8px 24px rgba(0,0,0,.35);
    color: #f1f1f5;
}

/* Reservation summary card */
.card.reservation-card {
    background: #0e1726;
    border: 1px solid #24324a;
    border-radius: 18px;
    box-shadow: 0 8px 24px rgba(0,0,0,.35);
    color: #f1f1f5;
}

.reservation-card .text-muted {
    color: #9fb0c9 !important;
}

.seo-route-card .text-muted {
    color: #9fb0c9 !important;
}

/* Toggle switch for round trip selection */
.form-switch .form-check-input {
    width: 3rem;
    height: 1.5rem;
}

.form-switch .form-check-input:focus {
    box-shadow: none;
}

.form-switch .form-check-input:checked {
    background-color: #198754;
    border-color: #198754;
}

/* Sonuç özet satırı: mobilde taşma önleme */
.result-meta {
    word-break: break-word;
    overflow-wrap: anywhere; /* uzun adresleri kır */
}

.fromto-badge {
    white-space: normal; /* bootstrap badge varsayılan nowrap'ını kır */
    max-width: 100%;
    display: inline-block;
    text-align: left;
    line-height: 1.1;
}

@media (max-width: 576px) {
    .fromto-badge { /* telefonda tek başına satıra geçsin */
        display: block;
        margin-bottom: .25rem;
    }
}
/* From-To rozetinde büyük, belirgin ok */
.fromto-arrow {
    font-size: 1.45rem; /* daha büyük ok */
    line-height: 1;
    color: #111827; /* koyu görünür */
    vertical-align: -2px; /* yazı satırına hizala */
}

@media (max-width: 576px) {
    .fromto-arrow {
        font-size: 1.65rem;
    }
    /* telefonda daha da büyük */
}

/* Promo: iki VIP araç ikonu */
.promo-iconstack {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: #ffecb5;
    box-shadow: inset 0 0 0 1px #ffe8a1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2px; /* iki ikon arası minicik boşluk */
}

    .promo-iconstack i {
        font-size: 1.05rem;
        color: #7a5d00;
    }

        .promo-iconstack i.second {
            transform: translateX(-2px); /* hafif üst üste premium duruş */
        }

/* --- Reservation sayfası --- */
.resv-hero {
    border-radius: 16px;
    overflow: hidden;
    background: var(--resv-hero, #0e1726);
    box-shadow: 0 12px 36px rgba(0,0,0,.35);
}

    .resv-hero .titlebar {
        background: rgba(0,0,0,.55);
        color: #fff;
        padding: .6rem .9rem;
        font-weight: 600;
    }

.form-card {
    background: rgba(7,12,24,.65);
    border: 1px solid rgba(212,175,55,.15);
    border-radius: 16px;
    padding: 20px;
    box-shadow: 0 10px 30px rgba(0,0,0,.35);
}

.btn-primary {
    border: 0;
    border-radius: 12px;
    background-image: linear-gradient(180deg,#3b82f6,#2563eb);
}

/* Kartlar */
.card.vehicle-card {
    background: #0e1726;
    border: 1px solid #24324a;
    border-radius: 18px;
    box-shadow: 0 8px 24px rgba(0,0,0,.35);
}

/* Truncate rozetler (masaüstünde tek satır) */
.badge.text-truncate {
    max-width: 100%;
}

/* Erişilebilirlik: label kontrast */
.form-label {
    color: #e8e8ea;
    font-weight: 500;
}

/* Carousel okları mobilde biraz daha büyük */
.carousel-control-prev-icon, .carousel-control-next-icon {
    filter: drop-shadow(0 2px 4px rgba(0,0,0,.5));
}

/* Search button color override */
#btnSearch,
.btn-route-search {
    background-image: none;
    background-color: #155440;
    border-color: #155440;
    color: #fff;
}

