/**
 * KB Featured Categories - Hover Effects
 *
 * @author    Starter
 * @copyright 2024
 * @license   http://opensource.org/licenses/afl-3.0.php  Academic Free License (AFL 3.0)
 */

/* ===== BASE HOVER STATE ===== */
.kbfc-category-item:hover .kbfc-overlay {
    opacity: 0.6;
}

/* ===== EFFECT: NONE ===== */
.kbfc-hover-none .kbfc-category-image {
    transition: none;
}

.kbfc-hover-none:hover .kbfc-category-image {
    transform: none;
}

/* ===== EFFECT: ZOOM IN ===== */
.kbfc-hover-zoom-in .kbfc-category-image {
    transition: transform 0.5s ease;
}

.kbfc-hover-zoom-in:hover .kbfc-category-image {
    transform: scale(1.1);
}

/* ===== EFFECT: ZOOM OUT ===== */
.kbfc-hover-zoom-out .kbfc-category-image {
    transform: scale(1.1);
    transition: transform 0.5s ease;
}

.kbfc-hover-zoom-out:hover .kbfc-category-image {
    transform: scale(1);
}

/* ===== EFFECT: FADE ===== */
.kbfc-hover-fade .kbfc-category-image {
    transition: opacity 0.4s ease;
}

.kbfc-hover-fade:hover .kbfc-category-image {
    opacity: 0.7;
}

/* ===== EFFECT: SLIDE UP ===== */
.kbfc-hover-slide-up .kbfc-content {
    transform: translateY(100%);
    opacity: 0;
    background: var(--kbfc-hover-color, rgba(0,0,0,0.8));
    transition: transform 0.4s ease, opacity 0.4s ease;
}

.kbfc-hover-slide-up:hover .kbfc-content {
    transform: translateY(0);
    opacity: 1;
}

/* ===== EFFECT: SLIDE DOWN ===== */
.kbfc-hover-slide-down .kbfc-content {
    top: 0;
    bottom: auto;
    transform: translateY(-100%);
    opacity: 0;
    background: var(--kbfc-hover-color, rgba(0,0,0,0.8));
    transition: transform 0.4s ease, opacity 0.4s ease;
}

.kbfc-hover-slide-down:hover .kbfc-content {
    transform: translateY(0);
    opacity: 1;
}

/* ===== EFFECT: SLIDE LEFT ===== */
.kbfc-hover-slide-left .kbfc-content {
    top: 0;
    left: auto;
    right: 0;
    width: 50%;
    height: 100%;
    transform: translateX(100%);
    opacity: 0;
    background: var(--kbfc-hover-color, rgba(0,0,0,0.8));
    display: flex;
    flex-direction: column;
    justify-content: center;
    transition: transform 0.4s ease, opacity 0.4s ease;
}

.kbfc-hover-slide-left:hover .kbfc-content {
    transform: translateX(0);
    opacity: 1;
}

/* ===== EFFECT: SLIDE RIGHT ===== */
.kbfc-hover-slide-right .kbfc-content {
    top: 0;
    left: 0;
    right: auto;
    width: 50%;
    height: 100%;
    transform: translateX(-100%);
    opacity: 0;
    background: var(--kbfc-hover-color, rgba(0,0,0,0.8));
    display: flex;
    flex-direction: column;
    justify-content: center;
    transition: transform 0.4s ease, opacity 0.4s ease;
}

.kbfc-hover-slide-right:hover .kbfc-content {
    transform: translateX(0);
    opacity: 1;
}

/* ===== EFFECT: ROTATE ===== */
.kbfc-hover-rotate .kbfc-category-image {
    transition: transform 0.5s ease;
}

.kbfc-hover-rotate:hover .kbfc-category-image {
    transform: rotate(3deg) scale(1.1);
}

/* ===== EFFECT: BLUR ===== */
.kbfc-hover-blur .kbfc-category-image {
    transition: filter 0.4s ease, transform 0.4s ease;
}

.kbfc-hover-blur:hover .kbfc-category-image {
    filter: blur(3px);
    transform: scale(1.05);
}

/* ===== CONTENT ANIMATIONS FOR ALL EFFECTS ===== */
.kbfc-category-item .kbfc-category-name {
    transition: transform 0.3s ease;
}

.kbfc-category-item:hover .kbfc-category-name {
    transform: translateY(-3px);
}

/* ===== FOCUS STATES FOR ACCESSIBILITY ===== */
.kbfc-category-item a:focus {
    outline: 2px solid #2fb5d2;
    outline-offset: 2px;
}

.kbfc-category-item a:focus .kbfc-overlay {
    opacity: 0.6;
}

/* ===== REDUCED MOTION ===== */
@media (prefers-reduced-motion: reduce) {
    .kbfc-category-image,
    .kbfc-content,
    .kbfc-overlay,
    .kbfc-category-name,
    .kbfc-view-more {
        transition: none !important;
        animation: none !important;
    }

    .kbfc-hover-zoom-in:hover .kbfc-category-image,
    .kbfc-hover-zoom-out .kbfc-category-image,
    .kbfc-hover-zoom-out:hover .kbfc-category-image,
    .kbfc-hover-rotate:hover .kbfc-category-image,
    .kbfc-hover-blur:hover .kbfc-category-image {
        transform: none !important;
        filter: none !important;
    }
}