/* ========================================
   UI ENHANCEMENTS
   Clean, human-written micro-interactions
   ======================================== */

/* ── Service Boxes ── */
.service-box {
    border-radius: 8px;
    border: 1px solid #e8eaed;
    background: #fff;
}

.service-box:hover {
    border-color: #FF6900;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .06);
}

.service-box:hover .servive-name h5 a {
    color: #FF6900;
}

.service-box>a {
    transition: background-color 0.15s, color 0.15s;
}

.service-box:hover>a {
    background: #FF6900;
    color: #fff;
}

/* ── Product Cards ── */
.gigs-grid {
    background: #fff;
    border-radius: 8px;
    border: 1px solid #e8eaed;
}

.gigs-grid:hover {
    border-color: #d0d3d8;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .08);
}

.gigs-grid:hover .gigs-title h3 a {
    color: #FF6900;
}

/* Favorite heart */
.fav-selection a:hover i,
.fav-selection a.favorited i {
    color: #e74c3c;
}

/* User avatar */
.user-thumb img {
    border: 3px solid #fff;
}

.gigs-grid:hover .user-thumb img {
    border-color: #FF6900;
}

/* Price on hover */
.gigs-grid:hover .gigs-card-footer h5 {
    color: #FF6900;
}

/* ── Filter Buttons ── */
.service-filter-btn {
    font-weight: 500;
    transition: border-color 0.15s, color 0.15s, background-color 0.15s;
}

.service-filter-btn:hover {
    border-color: #FF6900;
    color: #FF6900;
}

.service-filter-btn.active {
    background: #FF6900;
    border-color: #FF6900;
    color: #fff;
}

/* ── Carousel Nav ── */
.owl-nav button {
    transition: background-color 0.15s, color 0.15s;
}

.owl-nav button:hover {
    background: #FF6900 !important;
    color: #fff !important;
}

/* ── Loading Spinner (only animation kept) ── */
.loading-indicator {
    display: flex;
    justify-content: center;
    padding: 40px 0;
}

.spinner {
    width: 40px;
    height: 40px;
    border: 3px solid #eee;
    border-top-color: #FF6900;
    border-radius: 50%;
    animation: spin .6s linear infinite;
}

@keyframes spin {
    to {
        transform: rotate(360deg);
    }
}

/* ── Reduce motion ── */
@media (prefers-reduced-motion: reduce) {

    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        transition-duration: 0.01ms !important;
    }
}