/* Custom styles for RDM Electrical */

/* Targeted transitions for elements that need them */
a, button, input, select, textarea {
    transition-property: background-color, border-color, color, fill, stroke, opacity, box-shadow, transform;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 200ms;
}

/* Custom scrollbar */
* {
    scrollbar-width: thin;
    scrollbar-color: #1a1a1a #f1f1f1;
}

::-webkit-scrollbar {
    width: 10px;
}

::-webkit-scrollbar-track {
    background: #f1f1f1;
}

::-webkit-scrollbar-thumb {
    background: #1a1a1a;
    border-radius: 5px;
}

::-webkit-scrollbar-thumb:hover {
    background: #0066FF;
}

/* Heading refinements */
h1, h2, h3, h4, h5, h6 {
    letter-spacing: -0.02em;
}

/* Button hover effects */
.btn-primary {
    @apply relative overflow-hidden;
}

.btn-primary::after {
    content: '';
    @apply absolute inset-0 bg-white opacity-0 transition-opacity;
}

.btn-primary:hover::after {
    @apply opacity-10;
}

/* Form focus effects */
input:focus, select:focus, textarea:focus {
    @apply ring-offset-2 ring-offset-slate-50;
}

/* Custom animations */
@keyframes float {
    0% { transform: translateY(0px); }
    50% { transform: translateY(-10px); }
    100% { transform: translateY(0px); }
}

.animate-float {
    animation: float 3s ease-in-out infinite;
}

/* Lazy loading placeholder */
.lazy-bg {
    background-image: linear-gradient(110deg, #ececec 8%, #f5f5f5 18%, #ececec 33%);
    background-size: 200% 100%;
    animation: 1.5s shine linear infinite;
}

@keyframes shine {
    to {
        background-position-x: -200%;
    }
}