/* Cases Celleres - Custom Styles */

/* Calendar: selected check-in
   Diagonal 135deg: top-left = sea-500 (selected), bottom-right = sea-100 (range) */
.cal-checkin {
    background: linear-gradient(135deg, #318dab 50%, #d9eff5 50%);
    border-radius: 0.75rem;
    color: #fff;
    font-weight: 700;
}

/* Calendar: selected check-out
   Diagonal 135deg: top-left = sea-100 (range), bottom-right = sea-500 (selected) */
.cal-checkout {
    background: linear-gradient(135deg, #d9eff5 50%, #318dab 50%);
    border-radius: 0.75rem;
    color: #fff;
    font-weight: 700;
}

/* Calendar: hover preview for check-out
   Diagonal 135deg: top-left = sea-100, bottom-right = sea-300 (lighter) */
.cal-checkout-hover {
    background: linear-gradient(135deg, #d9eff5 50%, #85c8dc 50%);
    border-radius: 0.75rem;
    color: #fff;
    font-weight: 600;
}

/* Calendar: arrival turnover day (booking starts here, morning free for check-out)
   Diagonal 135deg: top-left = white (available), bottom-right = gray (booked) */
.cal-arrival-turnover {
    background: linear-gradient(135deg, #ffffff 50%, #e5e7eb 50%);
    border-radius: 0.75rem;
    color: #6b7280;
}
.cal-arrival-turnover:hover {
    background: linear-gradient(135deg, #f0f9fb 50%, #d1d5db 50%);
    color: #374151;
}

/* Calendar: departure turnover day (booking ends here, afternoon free for check-in)
   Diagonal 135deg: top-left = gray (booked), bottom-right = white (available) */
.cal-departure-turnover {
    background: linear-gradient(135deg, #e5e7eb 50%, #ffffff 50%);
    border-radius: 0.75rem;
    color: #6b7280;
}
.cal-departure-turnover:hover {
    background: linear-gradient(135deg, #d1d5db 50%, #f0f9fb 50%);
    color: #374151;
}

/* Animations */
@keyframes fade-in {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes fade-in-up {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.animate-fade-in {
    animation: fade-in 0.8s ease-out forwards;
}

.animate-fade-in-up {
    animation: fade-in-up 0.8s ease-out 0.2s forwards;
    opacity: 0;
}

.animate-fade-in-up-delay {
    animation: fade-in-up 0.8s ease-out 0.4s forwards;
    opacity: 0;
}

.animate-fade-in-up-delay-2 {
    animation: fade-in-up 0.8s ease-out 0.6s forwards;
    opacity: 0;
}

/* Scroll animations */
.scroll-animate {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}

.scroll-animate.visible {
    opacity: 1;
    transform: translateY(0);
}

/* Line clamp */
.line-clamp-2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.line-clamp-3 {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Scrollbar */
.scrollbar-hide {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

.scrollbar-hide::-webkit-scrollbar {
    display: none;
}

/* Alpine x-cloak */
[x-cloak] { display: none !important; }

/* GLightbox customization */
.gslide-description {
    font-family: 'Inter', system-ui, sans-serif !important;
}

/* Prose styling for descriptions */
.prose h2 {
    font-family: 'Playfair Display', Georgia, serif;
    color: #1a1a1a;
    margin-top: 2rem;
    margin-bottom: 1rem;
}

.prose h3 {
    font-family: 'Playfair Display', Georgia, serif;
    color: #333;
}

.prose p {
    line-height: 1.8;
}

/* Activity description justified with paragraph spacing */
.activity-text {
    text-align: justify;
}

.activity-text p {
    margin-bottom: 1.5rem;
    line-height: 1.8;
}

.activity-text p:last-child {
    margin-bottom: 0;
}

.prose ul li {
    line-height: 1.8;
}

/* Smooth scroll */
html {
    scroll-behavior: smooth;
}

/* Selection color */
::selection {
    background-color: #d9eff5;
    color: #254254;
}

/* Focus styles */
:focus-visible {
    outline: 2px solid #318dab;
    outline-offset: 2px;
    border-radius: 4px;
}
