/* ========================================
   Eltaf Turizm - Custom Styles
   ======================================== */

/* Navigation Links */
.nav-link {
    @apply px-3 py-2 rounded-lg text-gray-700 font-medium text-sm hover:text-emerald-700 hover:bg-emerald-50 transition-all duration-200;
}
.nav-active {
    @apply text-emerald-700 bg-emerald-50;
}
.mobile-nav-link {
    @apply block px-4 py-3 text-gray-700 font-medium rounded-lg hover:bg-emerald-50 hover:text-emerald-700 transition;
}

/* Hero Section */
.hero-slide {
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}
.hero-overlay {
    background: linear-gradient(135deg, rgba(27,94,32,0.85) 0%, rgba(26,35,126,0.75) 100%);
}

/* Tour Cards */
.tour-card {
    @apply bg-white rounded-2xl overflow-hidden shadow-md hover:shadow-xl transition-all duration-300 transform hover:-translate-y-1;
}
.tour-card img {
    @apply w-full h-52 object-cover;
}
.tour-card .tour-badge {
    @apply absolute top-3 left-3 bg-emerald-700 text-white text-xs font-semibold px-3 py-1 rounded-full;
}
.tour-card .tour-campaign {
    @apply absolute top-3 right-3 bg-red-500 text-white text-xs font-semibold px-3 py-1 rounded-full;
}

/* Price Display */
.price-tag {
    @apply text-2xl font-bold text-emerald-700 font-heading;
}
.price-old {
    @apply text-lg text-gray-400 line-through;
}
.price-note {
    @apply text-xs text-gray-500 mt-1;
}

/* Buttons */
.btn-primary {
    @apply bg-emerald-700 hover:bg-emerald-800 text-white px-6 py-3 rounded-xl font-semibold transition-all duration-200 transform hover:scale-[1.02];
}
.btn-whatsapp {
    @apply bg-green-500 hover:bg-green-600 text-white px-6 py-3 rounded-xl font-semibold transition-all duration-200 flex items-center gap-2;
}
.btn-phone {
    @apply border-2 border-emerald-700 text-emerald-700 hover:bg-emerald-700 hover:text-white px-6 py-3 rounded-xl font-semibold transition-all duration-200 flex items-center gap-2;
}
.btn-outline {
    @apply border-2 border-emerald-700 text-emerald-700 hover:bg-emerald-700 hover:text-white px-6 py-3 rounded-xl font-semibold transition-all duration-200;
}

/* Feature Cards */
.feature-card {
    @apply bg-white rounded-2xl p-6 text-center shadow-md hover:shadow-lg transition-all duration-300 border border-gray-100;
}
.feature-card .feature-icon {
    @apply w-16 h-16 mx-auto mb-4 bg-emerald-50 text-emerald-700 rounded-2xl flex items-center justify-center text-2xl;
}

/* Accordion */
.accordion-item {
    @apply border border-gray-200 rounded-xl overflow-hidden mb-3;
}
.accordion-header {
    @apply w-full flex items-center justify-between p-5 bg-white hover:bg-gray-50 transition cursor-pointer text-left font-semibold text-gray-800;
}
.accordion-header.active {
    @apply bg-emerald-50 text-emerald-700;
}
.accordion-body {
    @apply hidden p-5 pt-0 text-gray-600 leading-relaxed;
}
.accordion-body.active {
    @apply block;
}

/* Testimonial Cards */
.testimonial-card {
    @apply bg-white rounded-2xl p-6 shadow-md border border-gray-100;
}

/* Form Styles */
.form-input {
    @apply w-full px-4 py-3 border border-gray-300 rounded-xl focus:border-emerald-500 focus:ring-2 focus:ring-emerald-100 focus:outline-none transition text-gray-700;
}
.form-select {
    @apply w-full px-4 py-3 border border-gray-300 rounded-xl focus:border-emerald-500 focus:ring-2 focus:ring-emerald-100 focus:outline-none transition text-gray-700 bg-white;
}
.form-label {
    @apply block text-sm font-medium text-gray-700 mb-1.5;
}

/* Section Titles */
.section-title {
    @apply font-heading text-3xl md:text-4xl font-bold text-gray-900;
}
.section-subtitle {
    @apply text-gray-500 mt-2 max-w-2xl mx-auto;
}

/* Document Badge */
.doc-badge {
    @apply bg-white rounded-2xl p-6 text-center shadow-md hover:shadow-lg transition border border-gray-100;
}
.doc-badge img {
    @apply w-20 h-20 mx-auto mb-3 object-contain;
}

/* Swiper Custom */
.swiper-button-next,
.swiper-button-prev {
    color: #1B5E20 !important;
    background: white;
    width: 44px !important;
    height: 44px !important;
    border-radius: 50%;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}
.swiper-button-next::after,
.swiper-button-prev::after {
    font-size: 18px !important;
    font-weight: bold;
}
.swiper-pagination-bullet-active {
    background: #1B5E20 !important;
}

/* Scroll Animations */
.fade-up {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.6s ease, transform 0.6s ease;
}
.fade-up.visible {
    opacity: 1;
    transform: translateY(0);
}

/* Daily Program */
.program-day {
    @apply relative pl-8 pb-6 border-l-2 border-emerald-200 last:border-0;
}
.program-day::before {
    content: '';
    @apply absolute left-[-9px] top-0 w-4 h-4 bg-emerald-700 rounded-full border-2 border-white;
}

/* Sticky Header Shadow on Scroll */
.header-scrolled {
    box-shadow: 0 4px 20px rgba(0,0,0,0.08);
}

/* Cookie Banner - Mobile Spacing for Fixed CTA */
@media (max-width: 1023px) {
    #cookie-banner {
        bottom: 56px;
    }
    body {
        padding-bottom: 56px;
    }
    .fixed.bottom-24 {
        bottom: 80px;
    }
}

/* Pulse Animation for WhatsApp */
@keyframes pulse-green {
    0%, 100% { box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.4); }
    50% { box-shadow: 0 0 0 12px rgba(37, 211, 102, 0); }
}
.wa-pulse {
    animation: pulse-green 2s infinite;
}

/* Tour Detail Gallery */
.gallery-thumb {
    @apply w-20 h-20 rounded-lg object-cover cursor-pointer border-2 border-transparent hover:border-emerald-500 transition;
}
.gallery-thumb.active {
    @apply border-emerald-700;
}

/* Filter Tags */
.filter-tag {
    @apply inline-flex items-center gap-1 px-3 py-1.5 bg-emerald-50 text-emerald-700 text-sm rounded-full font-medium;
}

/* Loading Spinner */
.spinner {
    @apply w-8 h-8 border-4 border-gray-200 border-t-emerald-700 rounded-full animate-spin;
}
