/* ================= TOUR DETAILS PAGE STYLES ================= */
            
            /* Hero Banner Section */
            .tour-hero-banner {
                position: relative;
                height: 30vh;
                min-height: 400px;
                background-size: cover;
                background-position: center;
                display: flex;
                align-items: center;
                justify-content: center;
                text-align: center;
                color: white;
                padding: 0 20px 60px;
                margin-top: -1px;
            }
            
            .tour-hero-overlay {
                position: absolute;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
                background: linear-gradient(to bottom, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0.7) 100%);
            }
            
            .tour-hero-content {
                position: relative;
                z-index: 2;
                max-width: 1200px;
                width: 100%;
            }
            
            .tour-hero-title {
                font-size: 4rem;
                font-weight: 800;
                margin-bottom: 20px;
                text-shadow: 0 4px 12px rgba(0,0,0,0.8);
                line-height: 1.2;
                font-family: 'Montserrat', sans-serif;
            }
            
            .tour-hero-subtitle {
                font-size: 1.5rem;
                font-weight: 500;
                color: rgba(255,255,255,0.9);
                max-width: 800px;
                margin: 0 auto;
                text-shadow: 0 2px 4px rgba(0,0,0,0.5);
            }
            
            /* Breadcrumb */
            .tour-breadcrumb {
                background: rgba(255, 255, 255, 0.95);
                padding: 18px 0;
                border-bottom: 1px solid rgba(0,0,0,0.08);
                box-shadow: 0 2px 10px rgba(0,0,0,0.05);
            }
            
            .dark-mode .tour-breadcrumb {
                background: rgba(30, 30, 30, 0.95);
                border-bottom: 1px solid rgba(255,255,255,0.1);
            }
            
            .breadcrumb-content {
                max-width: 1200px;
                margin: 0 auto;
                padding: 0 20px;
            }
            
            .breadcrumb-links {
                display: flex;
                align-items: center;
                gap: 12px;
                color: #666;
                font-size: 0.95rem;
            }
            
            .dark-mode .breadcrumb-links {
                color: #aaa;
            }
            
            .breadcrumb-links a {
                color: #027094;
                text-decoration: none;
                font-weight: 600;
                transition: all 0.3s ease;
                display: flex;
                align-items: center;
                gap: 8px;
                padding: 5px 10px;
                border-radius: 6px;
            }
            
            .breadcrumb-links a:hover {
                background: rgba(255,122,0,0.1);
                transform: translateX(3px);
            }
            
            .breadcrumb-divider {
                color: #999;
                font-size: 0.8rem;
                display: flex;
                align-items: center;
            }
            
            .dark-mode .breadcrumb-divider {
                color: #777;
            }
            
            .breadcrumb-current {
                color: #333;
                font-weight: 600;
                padding: 5px 10px;
                background: rgba(255,122,0,0.08);
                border-radius: 6px;
            }
            
            .dark-mode .breadcrumb-current {
                color: white;
                background: rgba(255,122,0,0.15);
            }
            
            /* Main Content Layout */
            .tour-details-container {
                max-width: 1400px;
                margin: 0 auto;
                padding: 50px 20px;
            }
            
            .tour-details-layout {
                display: grid;
                grid-template-columns: 1fr 400px;
                gap: 40px;
                align-items: start;
            }
            
            /* Left Column - Image Slider & Tour Details */
            .tour-details-left {
                display: flex;
                flex-direction: column;
                gap: 40px;
            }
            
            /* Image Slider */
            .tour-image-slider {
                position: relative;
                width: 100%;
                height: 500px;
                border-radius: 20px;
                overflow: hidden;
                box-shadow: 0 15px 40px rgba(0,0,0,0.15);
            }
            
            .slider-container {
                width: 100%;
                height: 100%;
                position: relative;
            }
            
            .slider-slide {
                position: absolute;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
                opacity: 0;
                transition: opacity 0.8s ease;
                background-size: cover;
                background-position: center;
            }
            
            .slider-slide.active {
                opacity: 1;
            }
            
            .slider-nav {
                position: absolute;
                top: 50%;
                transform: translateY(-50%);
                background: rgba(255,255,255,0.9);
                color: #333;
                border: none;
                width: 56px;
                height: 56px;
                border-radius: 50%;
                font-size: 1.4rem;
                cursor: pointer;
                display: flex;
                align-items: center;
                justify-content: center;
                transition: all 0.3s ease;
                z-index: 10;
                box-shadow: 0 4px 15px rgba(0,0,0,0.2);
            }
            
            .slider-nav:hover {
                background: #00559c;
                color: white;
                transform: translateY(-50%) scale(1.1);
                box-shadow: 0 6px 20px rgba(255,122,0,0.4);
            }
            
            .slider-prev {
                left: 25px;
            }
            
            .slider-next {
                right: 25px;
            }
            
            .slider-dots {
                position: absolute;
                bottom: 25px;
                left: 0;
                width: 100%;
                display: flex;
                justify-content: center;
                gap: 12px;
                z-index: 10;
            }
            
            .slider-dot {
                width: 14px;
                height: 14px;
                border-radius: 50%;
                background: rgba(255,255,255,0.6);
                cursor: pointer;
                transition: all 0.3s ease;
                border: 2px solid transparent;
            }
            
            .slider-dot:hover {
                background: rgba(255,255,255,0.9);
                transform: scale(1.2);
            }
            
            .slider-dot.active {
                background: #00559c;
                transform: scale(1.3);
                border-color: white;
                box-shadow: 0 0 10px rgba(255,122,0,0.8);
            }
            
            /* Tour Info Section */
            .tour-info-section {
                background: white;
                border-radius: 20px;
                padding: 40px;
                box-shadow: 0 10px 30px rgba(0,0,0,0.08);
                border: 1px solid rgba(0,0,0,0.05);
            }
            
            .dark-mode .tour-info-section {
                background: #2a2a2a;
                border-color: rgba(255,255,255,0.1);
            }
            
            .tour-header {
                display: flex;
                justify-content: space-between;
                align-items: flex-start;
                margin-bottom: 30px;
                padding-bottom: 20px;
                border-bottom: 2px solid rgba(255,122,0,0.2);
            }
            
            .tour-title-wrapper {
                flex: 1;
            }
            
            .tour-main-title {
                font-size: 2.5rem;
                font-weight: 700;
                color: #1a1a1a;
                margin-bottom: 10px;
                display: flex;
                align-items: center;
                gap: 15px;
            }
            
            .dark-mode .tour-main-title {
                color: white;
            }
            
            .tour-main-title i {
                color: #00559c;
                font-size: 2.2rem;
            }
            
            .tour-meta-badge {
                display: inline-flex;
                align-items: center;
                gap: 8px;
                background: linear-gradient(135deg, rgba(255,122,0,0.1), rgba(255,157,66,0.1));
                color: #00559c;
                padding: 8px 16px;
                border-radius: 30px;
                font-weight: 600;
                font-size: 0.95rem;
                border: 1px solid rgba(255,122,0,0.2);
            }
            
            .tour-price-display {
                text-align: right;
                min-width: 180px;
            }
            
            .tour-starting-price {
                font-size: 1.2rem;
                color: #666;
                margin-bottom: 5px;
                font-weight: 500;
            }
            
            .dark-mode .tour-starting-price {
                color: #aaa;
            }
            
            .tour-price-amount {
                font-size: 2.8rem;
                font-weight: 800;
                color: #00559c;
                line-height: 1;
            }
            
            .tour-price-note {
                font-size: 0.9rem;
                color: #888;
                margin-top: 5px;
            }
            
            .dark-mode .tour-price-note {
                color: #999;
            }
            
            /* Tour Description */
            .tour-description-box {
                background: #f8f9fa;
                padding: 30px;
                border-radius: 15px;
                margin-bottom: 40px;
                border-left: 4px solid #00559c;
            }
            
            .dark-mode .tour-description-box {
                background: rgba(255,122,0,0.05);
            }
            
            .tour-description-title {
                font-size: 1.4rem;
                color: #1a1a1a;
                margin-bottom: 20px;
                display: flex;
                align-items: center;
                gap: 12px;
            }
            
            .dark-mode .tour-description-title {
                color: white;
            }
            
            .tour-description-title i {
                color: #00559c;
            }
            
            .tour-description-text {
                font-size: 1.15rem;
                line-height: 1.9;
                color: #555;
                margin: 0;
            }
            
            .dark-mode .tour-description-text {
                color: #ddd;
            }
            
            /* Features Section */
            .features-section {
                margin-top: 40px;
            }
            
            .features-section-title {
                font-size: 1.8rem;
                color: #1a1a1a;
                margin-bottom: 30px;
                display: flex;
                align-items: center;
                gap: 12px;
            }
            
            .dark-mode .features-section-title {
                color: white;
            }
            
            .features-section-title i {
                color: #00559c;
            }
            
            .features-comparison {
                display: grid;
                grid-template-columns: 1fr;
                gap: 30px;
            }
            
            .features-column {
                background: white;
                border-radius: 15px;
                padding: 30px;
                border: 2px solid #e0e0e0;
                position: relative;
                overflow: hidden;
                transition: all 0.3s ease;
            }
            
            .dark-mode .features-column {
                background: #333;
                border-color: #444;
            }
            
            .features-column:hover {
                transform: translateY(-5px);
                box-shadow: 0 15px 35px rgba(0,0,0,0.1);
            }
            
            .features-column.large-boat {
                border-color: #00559c;
                box-shadow: 0 5px 20px rgba(255,122,0,0.1);
            }
            
            .features-column.large-boat:hover {
                box-shadow: 0 20px 40px rgba(255,122,0,0.15);
            }
            
            .features-column.small-boat {
                border-color: #2196F3;
                box-shadow: 0 5px 20px rgba(33,150,243,0.1);
            }
            
            .features-column.small-boat:hover {
                box-shadow: 0 20px 40px rgba(33,150,243,0.15);
            }
            
            .features-column.sunset-boat {
                border-color: #FF4081;
                box-shadow: 0 5px 20px rgba(255,64,129,0.1);
            }
            
            .features-column.sunset-boat:hover {
                box-shadow: 0 20px 40px rgba(255,64,129,0.15);
            }
            
            .features-column-title {
                font-size: 1.5rem;
                font-weight: 700;
                margin-bottom: 25px;
                text-align: center;
                padding-bottom: 15px;
                border-bottom: 2px solid;
                display: flex;
                align-items: center;
                justify-content: center;
                gap: 12px;
            }
            
            .features-column.large-boat .features-column-title {
                color: #00559c;
                border-bottom-color: #00559c;
            }
            
            .features-column.small-boat .features-column-title {
                color: #2196F3;
                border-bottom-color: #2196F3;
            }
            
            .features-column.sunset-boat .features-column-title {
                color: #FF4081;
                border-bottom-color: #FF4081;
            }
            
            .features-list {
                list-style: none;
                padding: 0;
                margin: 0;
            }
            
            .features-list li {
                padding: 16px 0;
                border-bottom: 1px dashed #e0e0e0;
                display: flex;
                align-items: flex-start;
                gap: 15px;
                font-size: 1.05rem;
                color: #555;
                line-height: 1.5;
            }
            
            .dark-mode .features-list li {
                color: #ccc;
                border-bottom-color: #444;
            }
            
            .features-list li:last-child {
                border-bottom: none;
            }
            
            .features-list li i {
                color: #4CAF50;
                font-size: 1.2rem;
                margin-top: 3px;
                flex-shrink: 0;
            }
            
            .feature-note {
                font-size: 0.9rem;
                color: #888;
                font-style: italic;
                margin-top: 15px;
                padding: 12px 15px;
                background: rgba(0,0,0,0.03);
                border-radius: 8px;
                border-left: 3px solid;
            }
            
            .dark-mode .feature-note {
                color: #aaa;
                background: rgba(255,255,255,0.05);
            }
            
            .features-column.large-boat .feature-note {
                border-left-color: #00559c;
            }
            
            .features-column.small-boat .feature-note {
                border-left-color: #2196F3;
            }
            
            .features-column.sunset-boat .feature-note {
                border-left-color: #FF4081;
            }
            
            /* Right Column - Booking Card */
            .booking-card {
                background: white;
                border-radius: 20px;
                padding: 35px;
                box-shadow: 0 15px 40px rgba(0,0,0,0.12);
                border: 1px solid rgba(0,0,0,0.05);
                position: sticky;
                top: 30px;
            }
            
            .dark-mode .booking-card {
                background: #2a2a2a;
                border-color: rgba(255,255,255,0.1);
            }
            
            .booking-title {
                font-size: 2rem;
                color: #1a1a1a;
                margin-bottom: 30px;
                text-align: center;
                display: flex;
                align-items: center;
                justify-content: center;
                gap: 15px;
            }
            
            .booking-title i {
                color: #0067bc;
            }
            
            .dark-mode .booking-title {
                color: white;
            }
            
            /* Boat Type Selector Styles */
            .boat-type-selector {
                margin-bottom: 30px;
            }
            
            .boat-type-details {
                transition: all 0.3s ease;
                animation: fadeIn 0.5s ease;
                background: rgba(255,122,0,0.05);
                padding: 15px;
                border-radius: 10px;
                margin-top: 10px;
                border-left: 3px solid #00559c;
            }
            
            .dark-mode .boat-type-details {
                background: rgba(255,122,0,0.1);
            }
            
            .boat-icon-title {
                display: flex;
                align-items: center;
                gap: 10px;
                margin-bottom: 10px;
            }
            
            @keyframes fadeIn {
                from { opacity: 0; transform: translateY(-10px); }
                to { opacity: 1; transform: translateY(0); }
            }
            
            /* Custom select styling */
            select.form-control {
                background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ff7a00'%3E%3Cpath d='M7 10l5 5 5-5z'/%3E%3C/svg%3E");
                background-repeat: no-repeat;
                background-position: right 15px center;
                background-size: 20px;
                padding-right: 50px;
                appearance: none;
                -webkit-appearance: none;
                -moz-appearance: none;
            }
            
            select.form-control option {
                padding: 15px !important;
                font-size: 1rem !important;
                background: white;
                color: #333;
            }
            
            .dark-mode select.form-control option {
                background: #2a2a2a;
                color: white;
            }
            
            /* Price Options */
            .price-options {
                margin-bottom: 30px;
            }
            
            .price-option {
                background: #f8f9fa;
                border-radius: 15px;
                padding: 25px;
                margin-bottom: 20px;
                border: 2px solid transparent;
                cursor: pointer;
                transition: all 0.3s ease;
                position: relative;
                overflow: hidden;
                box-shadow: 1px 1px 21px 5px #0d0d0d2b;
            }
            
            .price-option::before {
                content: '';
                position: absolute;
                top: 0;
                left: 0;
                width: 5px;
                height: 100%;
                background: linear-gradient(to bottom, #012eae, #1c82d7);
                transform: scaleY(0);
                transition: transform 0.3s ease;
            }
            
            .dark-mode .price-option {
                background: rgba(255,255,255,0.05);
            }
            
            .price-option:hover {
                border-color: #00559c;
                transform: translateY(-5px);
                box-shadow: 0 10px 25px rgba(255,122,0,0.15);
            }
            
            .price-option:hover::before {
                transform: scaleY(1);
            }
            
            .price-option.selected {
                border-color: #0053a7;
                background: linear-gradient(135deg, rgba(255,122,0,0.1), rgba(255,157,66,0.1));
            }
            
            .price-option.selected::before {
                transform: scaleY(1);
            }
            
            .price-header {
                display: flex;
                justify-content: space-between;
                align-items: center;
                margin-bottom: 12px;
                flex-direction: column;
            }
            
            .price-label {
                font-size: 1.3rem;
                font-weight: 700;
                color: #1a1a1a;
                display: flex;
                align-items: center;
                gap: 10px;
            }
            
            .price-label i {
                color: #00559c;
            }
            
            .dark-mode .price-label {
                color: white;
            }
            
            .price-amount {
                font-size: 2.2rem;
                font-weight: 800;
                display: flex;
                align-items: baseline;
            }
            
            .price-option[data-boat-type="large"] .price-amount {
                color: #00559c;
            }
            
            .price-option[data-boat-type="small"] .price-amount {
                color: #2196F3;
            }
            
            .price-option[data-boat-type="sunset"] .price-amount {
                color: #FF4081;
            }
            
            .price-amount span {
                font-size: 1.1rem;
                color: #666;
                margin-left: 5px;
                font-weight: 600;
            }
            
            .dark-mode .price-amount span {
                color: #aaa;
            }
            
            .price-note {
                font-size: 1rem;
                color: #666;
                padding-left: 15px;
                border-left: 3px solid #00559c;
                background: rgba(255,122,0,0.05);
                padding: 12px 15px;
                border-radius: 8px;
                margin-top: 10px;
            }
            
            .dark-mode .price-note {
                color: #aaa;
                background: rgba(255,122,0,0.1);
            }
            
            /* Booking Form */
            .booking-form {
                margin-top: 30px;
            }
            
            .form-group {
                margin-bottom: 25px;
            }
            
            .form-label {
                display: block;
                margin-bottom: 10px;
                font-weight: 600;
                color: #1a1a1a;
                font-size: 1rem;
                display: flex;
                align-items: center;
                gap: 10px;
            }
            
            .form-label i {
                color: #00559c;
                width: 20px;
            }
            
            .dark-mode .form-label {
                color: white;
            }
            
            .form-control {
                width: 100%;
                padding: 15px 20px;
                border: 2px solid #e0e0e0;
                border-radius: 12px;
                font-size: 1rem;
                transition: all 0.3s ease;
                background: white;
                color: #333;
                font-family: 'Poppins', sans-serif;
            }
            
            .dark-mode .form-control {
                background: rgba(255,255,255,0.05);
                border-color: #444;
                color: white;
            }
            
            .form-control:focus {
                outline: none;
                border-color: #00559c;
                box-shadow: 0 0 0 3px rgba(255,122,0,0.1);
            }
            
            .input-row {
                display: grid;
                grid-template-columns: 1fr 1fr;
                gap: 20px;
            }
            
            .btn-book-now {
                width: 100%;
                padding: 18px;
                background: linear-gradient(135deg, #00559c, rgb(0 70 89));
                color: white;
                border: none;
                border-radius: 15px;
                font-size: 1.3rem;
                font-weight: 700;
                cursor: pointer;
                transition: all 0.3s ease;
                margin-top: 25px;
                display: flex;
                align-items: center;
                justify-content: center;
                gap: 12px;
                position: relative;
                overflow: hidden;
                font-family: 'Montserrat', sans-serif;
                letter-spacing: 0.5px;
            }
            
            .btn-book-now::before {
                content: '';
                position: absolute;
                top: 0;
                left: -100%;
                width: 100%;
                height: 100%;
                background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent);
                transition: left 0.6s ease;
            }
            
            .btn-book-now:hover::before {
                left: 100%;
            }
            
            .btn-book-now:hover {
                transform: translateY(-5px);
                box-shadow: 0 15px 35px rgba(255,122,0,0.3);
                letter-spacing: 0.8px;
            }
            
            .btn-book-now:disabled {
                background: linear-gradient(135deg, #cccccc, #aaaaaa);
                cursor: not-allowed;
                transform: none;
                box-shadow: none;
                opacity: 0.6;
            }
            
            .btn-book-now:disabled:hover::before {
                left: -100%;
            }
            
            .secure-note {
                text-align: center;
                margin-top: 15px;
                font-size: 0.9rem;
                color: #666;
                display: flex;
                align-items: center;
                justify-content: center;
                gap: 8px;
                line-height: 1.5;
            }
            
            .dark-mode .secure-note {
                color: #aaa;
            }
            
            /* What's Included Section */
            .whats-included-section {
                margin-top: 40px;
                padding: 35px;
                background: linear-gradient(135deg, rgba(255,122,0,0.05), rgba(255,157,66,0.05));
                border-radius: 15px;
                border: 1px solid rgba(255,122,0,0.1);
            }
            
            .dark-mode .whats-included-section {
                background: linear-gradient(135deg, rgba(255,122,0,0.1), rgba(255,157,66,0.1));
                border-color: rgba(255,122,0,0.2);
            }
            
            .whats-included-title {
                font-size: 1.8rem;
                color: #00559c;
                margin-bottom: 25px;
                display: flex;
                align-items: center;
                gap: 12px;
            }
            
            .included-grid {
                display: grid;
                grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
                gap: 20px;
            }
            
            .included-item {
                display: flex;
                align-items: center;
                gap: 15px;
                padding: 15px;
                background: rgba(255,255,255,0.8);
                border-radius: 10px;
                border-left: 3px solid #4CAF50;
                transition: all 0.3s ease;
            }
            
            .dark-mode .included-item {
                background: rgba(255,255,255,0.05);
            }
            
            .included-item:hover {
                transform: translateX(5px);
                background: rgba(255,255,255,0.9);
            }
            
            .dark-mode .included-item:hover {
                background: rgba(255,255,255,0.1);
            }
            
            .included-item i {
                color: #4CAF50;
                font-size: 1.3rem;
                width: 30px;
                flex-shrink: 0;
            }
            
            .included-item span {
                color: #555;
                font-size: 1rem;
                line-height: 1.5;
            }
            
            .dark-mode .included-item span {
                color: #ddd;
            }
            
            /* Boat Type Badges */
            .boat-type-badge {
                display: inline-block;
                padding: 4px 12px;
                border-radius: 20px;
                font-size: 0.8rem;
                font-weight: 600;
                margin-left: 8px;
            }
            
            .badge-large {
                background: rgba(255,122,0,0.1);
                color: #00559c;
                border: 1px solid rgba(255,122,0,0.3);
            }
            
            .badge-small {
                background: rgba(33,150,243,0.1);
                color: #2196F3;
                border: 1px solid rgba(33,150,243,0.3);
            }
            
            .badge-sunset {
                background: rgba(255,64,129,0.1);
                color: #FF4081;
                border: 1px solid rgba(255,64,129,0.3);
            }
            
            /* Number input styling */
            input[type=number] {
                -moz-appearance: textfield;
                appearance: textfield;
            }
            
            input[type=number]::-webkit-inner-spin-button, 
            input[type=number]::-webkit-outer-spin-button { 
                opacity: 1;
                height: 24px;
                margin-left: 5px;
                cursor: pointer;
            }
            
            .form-group small {
                display: block;
                margin-top: 5px;
                color: #666;
                font-size: 0.85rem;
            }
            
            .dark-mode .form-group small {
                color: #aaa;
            }
            
            /* Success Popup Styles */
            .success-popup-overlay {
                position: fixed;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
                background: rgba(0, 0, 0, 0.7);
                backdrop-filter: blur(5px);
                display: flex;
                align-items: center;
                justify-content: center;
                z-index: 999999;
                animation: fadeIn 0.3s ease;
                padding: 20px;
            }
    
            .success-popup {
                background: white;
                border-radius: 30px;
                max-width: 550px;
                width: 100%;
                max-height: 90vh;
                overflow-y: auto;
                box-shadow: 0 30px 60px rgba(0, 0, 0, 0.3);
                animation: slideUp 0.4s ease;
            }
    
            .dark-mode .success-popup {
                background: #2a2a2a;
                color: white;
            }
    
            .popup-header {
                background: linear-gradient(135deg, #4CAF50, #45a049);
                color: white;
                padding: 40px 30px 30px;
                text-align: center;
                border-radius: 30px 30px 0 0;
                position: relative;
            }
    
            .success-icon {
                width: 80px;
                height: 80px;
                background: rgba(255, 255, 255, 0.2);
                border-radius: 50%;
                display: flex;
                align-items: center;
                justify-content: center;
                margin: 0 auto 20px;
                font-size: 3rem;
                animation: bounce 1s ease infinite;
            }
    
            .popup-header h2 {
                font-size: 2rem;
                margin-bottom: 10px;
                font-weight: 700;
            }
    
            .thank-you {
                font-size: 1.1rem;
                opacity: 0.9;
            }
    
            .popup-body {
                padding: 30px;
            }
    
            .booking-reference {
                background: linear-gradient(135deg, #f8f9fa, #e9ecef);
                border-radius: 15px;
                padding: 20px;
                text-align: center;
                margin-bottom: 30px;
                border: 2px dashed #4CAF50;
            }
    
            .dark-mode .booking-reference {
                background: #333;
                border-color: #4CAF50;
            }
    
            .ref-label {
                display: block;
                font-size: 0.9rem;
                color: #666;
                margin-bottom: 5px;
                text-transform: uppercase;
                letter-spacing: 1px;
            }
    
            .ref-number {
                font-size: 1.8rem;
                font-weight: 800;
                color: #4CAF50;
                font-family: monospace;
                letter-spacing: 2px;
            }
    
            .booking-details h3,
            .customer-info h3,
            .next-steps h3 {
                font-size: 1.3rem;
                margin-bottom: 20px;
                color: #333;
                display: flex;
                align-items: center;
                gap: 10px;
            }
    
            .dark-mode .booking-details h3,
            .dark-mode .customer-info h3,
            .dark-mode .next-steps h3 {
                color: white;
            }
    
            .booking-details h3:before,
            .customer-info h3:before,
            .next-steps h3:before {
                content: '';
                width: 4px;
                height: 24px;
                background: #4CAF50;
                border-radius: 2px;
            }
    
            .detail-row {
                display: flex;
                align-items: center;
                gap: 15px;
                padding: 12px 0;
                border-bottom: 1px solid #eee;
            }
    
            .dark-mode .detail-row {
                border-bottom-color: #444;
            }
    
            .detail-row:last-child {
                border-bottom: none;
            }
    
            .detail-row.highlight {
                background: rgba(76, 175, 80, 0.1);
                margin: 15px -15px;
                padding: 15px;
                border-radius: 10px;
            }
    
            .detail-icon {
                width: 40px;
                height: 40px;
                background: #f0f0f0;
                border-radius: 50%;
                display: flex;
                align-items: center;
                justify-content: center;
                color: #4CAF50;
                font-size: 1.2rem;
            }
    
            .dark-mode .detail-icon {
                background: #444;
            }
    
            .detail-content {
                flex: 1;
                display: flex;
                justify-content: space-between;
                align-items: center;
            }
    
            .detail-label {
                color: #666;
                font-size: 0.95rem;
            }
    
            .dark-mode .detail-label {
                color: #aaa;
            }
    
            .detail-value {
                font-weight: 600;
                color: #333;
            }
    
            .dark-mode .detail-value {
                color: white;
            }
    
            .detail-value.price {
                color: #4CAF50;
                font-size: 1.3rem;
                font-weight: 800;
            }
    
            .customer-info {
                background: #f8f9fa;
                border-radius: 15px;
                padding: 20px;
                margin: 20px 0;
            }
    
            .dark-mode .customer-info {
                background: #333;
            }
    
            .info-item {
                display: flex;
                align-items: center;
                gap: 12px;
                padding: 10px 0;
                border-bottom: 1px solid #dee2e6;
            }
    
            .dark-mode .info-item {
                border-bottom-color: #444;
            }
    
            .info-item:last-child {
                border-bottom: none;
            }
    
            .info-item i {
                width: 20px;
                color: #4CAF50;
                font-size: 1.1rem;
            }
    
            .info-item span {
                color: #555;
            }
    
            .dark-mode .info-item span {
                color: #ddd;
            }
    
            .next-steps {
                background: #e8f5e9;
                border-radius: 15px;
                padding: 20px;
                margin-top: 20px;
            }
    
            .dark-mode .next-steps {
                background: #1e3a1e;
            }
    
            .next-steps ul {
                list-style: none;
                padding: 0;
                margin: 0;
            }
    
            .next-steps li {
                display: flex;
                align-items: center;
                gap: 12px;
                padding: 10px 0;
                color: #2e7d32;
            }
    
            .dark-mode .next-steps li {
                color: #a5d6a7;
            }
    
            .next-steps li i {
                width: 20px;
                font-size: 1rem;
            }
    
            .popup-footer {
                padding: 30px;
                border-top: 1px solid #eee;
                text-align: center;
            }
    
            .dark-mode .popup-footer {
                border-top-color: #444;
            }
    
            .btn-close-popup {
                background: linear-gradient(135deg, #4CAF50, #45a049);
                color: white;
                border: none;
                padding: 15px 40px;
                border-radius: 50px;
                font-size: 1.1rem;
                font-weight: 600;
                cursor: pointer;
                transition: all 0.3s ease;
                display: inline-flex;
                align-items: center;
                gap: 10px;
                box-shadow: 0 10px 20px rgba(76, 175, 80, 0.3);
            }
    
            .btn-close-popup:hover {
                transform: translateY(-3px);
                box-shadow: 0 15px 30px rgba(76, 175, 80, 0.4);
            }
    
            /* Animations */
            @keyframes fadeIn {
                from { opacity: 0; }
                to { opacity: 1; }
            }
    
            @keyframes fadeOut {
                from { opacity: 1; }
                to { opacity: 0; }
            }
    
            @keyframes slideUp {
                from {
                    opacity: 0;
                    transform: translateY(50px);
                }
                to {
                    opacity: 1;
                    transform: translateY(0);
                }
            }
    
            @keyframes bounce {
                0%, 100% { transform: translateY(0); }
                50% { transform: translateY(-10px); }
            }
    
            /* Scrollbar Styling */
            .success-popup::-webkit-scrollbar {
                width: 8px;
            }
    
            .success-popup::-webkit-scrollbar-track {
                background: #f1f1f1;
                border-radius: 10px;
            }
    
            .success-popup::-webkit-scrollbar-thumb {
                background: #4CAF50;
                border-radius: 10px;
            }
    
            .success-popup::-webkit-scrollbar-thumb:hover {
                background: #45a049;
            }
    
            /* Responsive Design */
            @media (max-width: 1200px) {
                .tour-details-container {
                    max-width: 95%;
                }
                
                .tour-hero-title {
                    font-size: 3.5rem;
                }
                
                .tour-details-layout {
                    gap: 30px;
                }
            }
            
            @media (max-width: 992px) {
                .tour-details-layout {
                    grid-template-columns: 1fr;
                    gap: 30px;
                }
                
                .booking-card {
                    position: static;
                    max-width: 600px;
                    margin: 0 auto;
                }
                
                .tour-hero-title {
                    font-size: 3rem;
                }
                
                .tour-image-slider {
                    height: 400px;
                }
                
                .tour-header {
                    flex-direction: column;
                    gap: 20px;
                }
                
                .tour-price-display {
                    text-align: left;
                    width: 100%;
                }
                
                .features-comparison {
                    grid-template-columns: 1fr;
                    gap: 20px;
                }
                
                .included-grid {
                    grid-template-columns: 1fr;
                }
                
                .slider-nav {
                    width: 50px;
                    height: 50px;
                    font-size: 1.2rem;
                }
                
                .success-popup {
                    max-width: 95%;
                }
                
                .popup-header h2 {
                    font-size: 1.5rem;
                }
                
                .ref-number {
                    font-size: 1.3rem;
                }
                
                .detail-content {
                    flex-direction: column;
                    align-items: flex-start;
                    gap: 5px;
                }
                
                .btn-close-popup {
                    padding: 12px 30px;
                    font-size: 1rem;
                }
            }
            
            @media (max-width: 768px) {
                .tour-hero-banner {
                    height: 25vh;
                    padding-bottom: 40px;
                }
                
                .tour-hero-title {
                    font-size: 2.5rem;
                }
                
                .tour-hero-subtitle {
                    font-size: 1.3rem;
                }
                
                .tour-main-title {
                    font-size: 2rem;
                    flex-direction: column;
                    align-items: flex-start;
                    gap: 10px;
                }
                
                .tour-image-slider {
                    height: 350px;
                }
                
                .tour-info-section {
                    padding: 30px;
                }
                
                .input-row {
                    grid-template-columns: 1fr;
                    gap: 15px;
                }
                
                .booking-card {
                    padding: 25px;
                }
                
                .tour-description-box {
                    padding: 25px;
                }
                
                .features-column {
                    padding: 25px;
                }
                
                .slider-nav {
                    width: 45px;
                    height: 45px;
                    font-size: 1.1rem;
                }
                
                .slider-prev {
                    left: 15px;
                }
                
                .slider-next {
                    right: 15px;
                }
            }
            
            @media (max-width: 576px) {
                .tour-hero-banner {
                    height: 20vh;
                    min-height: 300px;
                    padding-bottom: 30px;
                }
                
                .tour-hero-title {
                    font-size: 2.2rem;
                }
                
                .tour-hero-subtitle {
                    font-size: 1.1rem;
                }
                
                .tour-main-title {
                    font-size: 1.8rem;
                }
                
                .tour-image-slider {
                    height: 300px;
                }
                
                .tour-price-amount {
                    font-size: 2.2rem;
                }
                
                .price-amount {
                    font-size: 1.8rem;
                }
                
                .price-label {
                    font-size: 1.1rem;
                }
                
                .btn-book-now {
                    padding: 16px;
                    font-size: 1.1rem;
                }
                
                .whats-included-section {
                    padding: 25px;
                }
                
                .features-column-title {
                    font-size: 1.3rem;
                }
                
                .slider-nav {
                    width: 40px;
                    height: 40px;
                    font-size: 1rem;
                }
            }
            
            @media (max-width: 480px) {
                .tour-hero-title {
                    font-size: 1.8rem;
                }
                
                .tour-main-title {
                    font-size: 1.6rem;
                }
                
                .tour-description-text {
                    font-size: 1rem;
                }
                
                .tour-description-box {
                    padding: 20px;
                }
                
                .features-column {
                    padding: 20px;
                }
                
                .features-list li {
                    font-size: 1rem;
                    padding: 14px 0;
                }
                
                .slider-nav {
                    width: 36px;
                    height: 36px;
                    font-size: 0.9rem;
                }
            }