/* 
   RUDDER - Custom Styles
*/

/* Reveal Animations */
.reveal {
    opacity: 0;
    transform: translateY(20px);
    transition: all 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}

.reveal.active {
    opacity: 1;
    transform: translateY(0) translateX(0) scale(1);
}

/* Mobile-only text shrinkage to prevent wrapping */
.sp-shrink, .sp-shrink-xs, .sp-shrink-sm, .sp-shrink-lg {
    display: inline-block !important;
    white-space: nowrap !important;
}

@media (max-width: 767px) {
    /* Adjust these values based on the desired size relative to screen width */
    .sp-shrink {
        font-size: 5.5vw !important; /* Adjusts automatically with screen width */
    }
    .sp-shrink-xs {
        font-size: 3.8vw !important;
    }
    .sp-shrink-sm {
        font-size: 4.8vw !important;
    }
    .sp-shrink-lg {
        font-size: 7vw !important;
    }

    /* Reduce horizontal padding on mobile for shrink-wrapped elements to prevent overflow */
    a.sp-shrink, a.sp-shrink-xs, a.sp-shrink-sm, a.sp-shrink-lg {
        padding-left: 1.5rem !important;
        padding-right: 1.5rem !important;
    }
}
.reveal.translate-x-\[-20px\] { transform: translateX(-20px) translateY(0); opacity: 0; }
.reveal.translate-x-\[50px\] { transform: translateX(50px) translateY(0); opacity: 0; }
.reveal.translate-x-\[-50px\] { transform: translateX(-50px) translateY(0); opacity: 0; }
.reveal.scale-90 { transform: scale(0.9); opacity: 0; }
.reveal.scale-95 { transform: scale(0.95); opacity: 0; }

.reveal.active.translate-x-\[-20px\],
.reveal.active.translate-x-\[50px\],
.reveal.active.translate-x-\[-50px\],
.reveal.active.scale-90,
.reveal.active.scale-95 {
    transform: translateX(0) translateY(0) scale(1);
    opacity: 1;
}

/* Staggered Delays */
.delay-200 { transition-delay: 200ms; }
.delay-400 { transition-delay: 400ms; }
.delay-500 { transition-delay: 500ms; }
.delay-600 { transition-delay: 600ms; }
.delay-800 { transition-delay: 800ms; }

/* Custom Background classes if needed */
.bg-primary-container { background-color: #0d1b33; }

/* Selection fix for mobile menu */
body.menu-open {
    overflow: hidden;
}

/* Table scroll styling */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}
::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 10px;
}
::-webkit-scrollbar-thumb {
    background: #775a19;
    border-radius: 10px;
}
::-webkit-scrollbar-thumb:hover {
    background: #c3942a;
}

.scrollbar-thin {
    scrollbar-width: thin;
    scrollbar-color: #775a19 #f1f1f1;
    -webkit-overflow-scrolling: touch;
}
.scrollbar-thin::-webkit-scrollbar {
    display: block;
    height: 8px;
}
.scrollbar-thin::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 10px;
    display: block;
}
.scrollbar-thin::-webkit-scrollbar-thumb {
    background: #775a19;
    border-radius: 10px;
    display: block;
}

/* Custom spacing for Lucide icons and text alignment if needed */
i[data-lucide] {
    display: inline-block;
    vertical-align: middle;
}

/* PC-only line break: hidden on mobile, displayed as block on medium screens and up */
.pc-br {
    display: none;
}
@media (min-width: 768px) {
    .pc-br {
        display: block;
    }
}

/* Mobile-only line break: displayed on mobile, hidden on medium screens and up */
.sp-br {
    display: block;
}
@media (min-width: 768px) {
    .sp-br {
        display: none;
    }
}

/* Brighter gold for better readability on dark backgrounds */
.text-secondary-bright {
    color: rgb(195, 148, 42);
}