* { font-family: 'Inter', sans-serif; }
        :root {
            --primary: #1e3a8a;
            --primary-light: #3b82f6;
            --accent: #f59e0b;
            --success: #10b981;
            --danger: #ef4444;
        }

        /* Hero search bar */
        .search-hero {
            background: linear-gradient(135deg, #0f172a 0%, #1e3a8a 50%, #1d4ed8 100%);
            position: relative;
            overflow: hidden;
        }
        .search-hero::before {
            content: '';
            position: absolute;
            inset: 0;
            background: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.03'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
        }

        /* Flight card */
        .flight-card {
            background: white;
            border-radius: 16px;
            border: 1px solid #e5e7eb;
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            overflow: hidden;
            position: relative;
        }
        .flight-card:hover {
            box-shadow: 0 20px 60px rgba(0,0,0,0.12);
            transform: translateY(-2px);
            border-color: #bfdbfe;
        }
        .flight-card.best-price {
            border-color: #10b981;
            border-width: 2px;
        }
        .flight-card.best-price::before {
            content: '🏆 En Uygun';
            position: absolute;
            top: 0; left: 0;
            background: linear-gradient(90deg, #10b981, #059669);
            color: white;
            font-size: 11px;
            font-weight: 700;
            padding: 4px 14px;
            border-radius: 0 0 10px 0;
            letter-spacing: 0.5px;
        }

        /* Airline badge */
        .airline-logo {
            width: 48px;
            height: 48px;
            object-fit: contain;
            border-radius: 10px;
            background: #f8fafc;
            padding: 4px;
            border: 1px solid #f1f5f9;
        }

        /* Timeline flight path */
        .flight-path {
            position: relative;
            display: flex;
            align-items: center;
            gap: 16px;
        }
        .flight-line {
            flex: 1;
            height: 2px;
            background: linear-gradient(90deg, #e2e8f0, #94a3b8, #e2e8f0);
            position: relative;
        }
        .flight-line::after {
            content: '✈';
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            background: white;
            padding: 0 6px;
            font-size: 14px;
            color: #3b82f6;
        }

        /* Price display */
        .price-badge {
            background: linear-gradient(135deg, #eff6ff, #dbeafe);
            border-radius: 12px;
            padding: 16px 20px;
            text-align: center;
            border: 1px solid #bfdbfe;
        }

        /* Seat indicator */
        .seat-indicator {
            display: inline-flex;
            align-items: center;
            gap: 4px;
            font-size: 11px;
            font-weight: 600;
            padding: 3px 8px;
            border-radius: 20px;
        }
        .seat-indicator.urgent { background: #fee2e2; color: #dc2626; }
        .seat-indicator.moderate { background: #fef3c7; color: #d97706; }
        .seat-indicator.plenty { background: #d1fae5; color: #059669; }

        /* Filter sidebar */
        .filter-card {
            background: white;
            border-radius: 16px;
            border: 1px solid #e5e7eb;
            overflow: hidden;
        }
        .filter-section {
            padding: 20px;
            border-bottom: 1px solid #f1f5f9;
        }
        .filter-section:last-child { border-bottom: none; }

        /* Range slider */
        input[type="range"] {
            -webkit-appearance: none;
            width: 100%;
            height: 4px;
            border-radius: 2px;
            background: linear-gradient(90deg, #3b82f6 0%, #3b82f6 var(--val, 50%), #e2e8f0 var(--val, 50%));
            outline: none;
        }
        input[type="range"]::-webkit-slider-thumb {
            -webkit-appearance: none;
            width: 18px;
            height: 18px;
            border-radius: 50%;
            background: #3b82f6;
            cursor: pointer;
            box-shadow: 0 2px 6px rgba(59,130,246,0.5);
            border: 2px solid white;
        }

        /* Sort tabs */
        .sort-tab {
            padding: 8px 18px;
            border-radius: 8px;
            font-size: 13px;
            font-weight: 500;
            cursor: pointer;
            transition: all 0.2s;
            color: #64748b;
            border: 1px solid transparent;
        }
        .sort-tab.active, .sort-tab:hover {
            background: #3b82f6;
            color: white;
            border-color: #3b82f6;
        }

        /* Tag chips */
        .tag-chip {
            display: inline-flex;
            align-items: center;
            gap: 6px;
            padding: 4px 10px;
            border-radius: 20px;
            font-size: 11px;
            font-weight: 600;
        }
        .tag-direkt { background: #d1fae5; color: #065f46; }
        .tag-aktarma { background: #fef3c7; color: #92400e; }
        .tag-erken { background: #ede9fe; color: #4c1d95; }
        .tag-gece { background: #1e293b; color: #e2e8f0; }

        /* Airline color accents */
        .tk-accent { border-left: 4px solid #dc2626; }
        .pc-accent { border-left: 4px solid #f97316; }
        .xq-accent { border-left: 4px solid #eab308; }
        .vf-accent { border-left: 4px solid #8b5cf6; }

        /* Book button */
        .btn-book {
            background: linear-gradient(135deg, #3b82f6, #1d4ed8);
            color: white;
            border: none;
            border-radius: 10px;
            padding: 12px 24px;
            font-weight: 700;
            font-size: 14px;
            cursor: pointer;
            transition: all 0.3s;
            width: 100%;
            letter-spacing: 0.3px;
        }
        .btn-book:hover {
            background: linear-gradient(135deg, #2563eb, #1e40af);
            box-shadow: 0 8px 25px rgba(59,130,246,0.4);
            transform: translateY(-1px);
        }

        /* Date navigation */
        .date-nav-btn {
            padding: 8px 14px;
            border-radius: 8px;
            border: 1px solid #e2e8f0;
            background: white;
            cursor: pointer;
            transition: all 0.2s;
            font-size: 13px;
            color: #475569;
        }
        .date-nav-btn:hover, .date-nav-btn.active {
            background: #3b82f6;
            border-color: #3b82f6;
            color: white;
        }
        .date-nav-btn.today { font-weight: 700; }

        /* Loading skeleton */
        @keyframes shimmer {
            0% { background-position: -468px 0; }
            100% { background-position: 468px 0; }
        }
        .skeleton {
            background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
            background-size: 468px 100%;
            animation: shimmer 1.2s ease-in-out infinite;
            border-radius: 8px;
        }

        /* Sticky search bar */
        .sticky-search {
            top: 0;
            z-index: 100;
            backdrop-filter: blur(12px);
            -webkit-backdrop-filter: blur(12px);
        }

        /* Mobile filter toggle */
        @media (max-width: 1024px) {
            .filter-sidebar { display: none; }
            .filter-sidebar.open { display: block; }
        }

        /* Fade in animation */
        @keyframes fadeInUp {
            from { opacity: 0; transform: translateY(16px); }
            to { opacity: 1; transform: translateY(0); }
        }
        .flight-card {
            animation: fadeInUp 0.4s ease both;
        }
        .flight-card:nth-child(1) { animation-delay: 0.05s; }
        .flight-card:nth-child(2) { animation-delay: 0.1s; }
        .flight-card:nth-child(3) { animation-delay: 0.15s; }
        .flight-card:nth-child(4) { animation-delay: 0.2s; }
        .flight-card:nth-child(5) { animation-delay: 0.25s; }
        .flight-card:nth-child(n+6) { animation-delay: 0.3s; }