.news-2-nav-title {
    @apply text-[0.75rem] font-bold tracking-[0.05em] leading-[1.5] w-full text-center;
}

.news-2-nav-item {
    @apply transition-colors duration-300 cursor-pointer flex items-center ;
    
    &.active {
        & .news-2-nav-item-text {
            @apply bg-[#5B7C8C] text-white;
        }
    }
}


.news-2-nav-item-text {
    @apply w-full text-[clamp(0.875rem,1.5vw,1rem)] font-bold tracking-[0.05em] leading-[1.5] bg-gray-2 group-hover:bg-[#5B7C8C] rounded-[5px] px-[clamp(0.75rem,2vw,1.25rem)] py-[clamp(0.375rem,1vw,0.625rem)] text-gray-3 group-hover:text-white transition-all duration-300 font-mj;

    
}

/* Swiper 分類導航容器 */
.news-category-swiper {
    @apply relative w-full  ;
    
    & .swiper-wrapper {
        @apply flex items-center w-full;
    }
    
    & .swiper-slide {
        width: auto; /* 使用 auto 讓內容決定寬度 */
        max-width:100%;
        display: flex;
        align-items: center;
        justify-content: center;
    }
}


/* Swiper 導航按鈕樣式 */
.news-swiper-button-prev,
.news-swiper-button-next {
    position: absolute;
    top: 80%;
    transform: translateY(-50%);
    width: 36px;
    height: 36px;
    background: white;
    border: 2px solid #5B7C8C;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 10;
    transition: all 0.3s ease;
    
    &::after {
        content: '';
        width: 10px;
        height: 10px;
        border-top: 2px solid #5B7C8C;
        border-right: 2px solid #5B7C8C;
        transition: border-color 0.3s ease;
    }
    
    &:hover {
        background: #5B7C8C;
        border-color: #5B7C8C;
        
        &::after {
            border-color: white;
        }
    }
    
    &.swiper-button-disabled {
        opacity: 0.3;
        cursor: not-allowed;
        pointer-events: none;
    }
    @media (min-width: 768px) {
        top: 75%;
    }
}

.news-swiper-button-prev {
    left: 10px;
    
    &::after {
        transform: rotate(-135deg);
        margin-right: -2px;
    }
}

.news-swiper-button-next {
    right: 10px;
    
    &::after {
        transform: rotate(45deg);
        margin-left: -2px;
    }
}

/* 響應式調整 */
@media (max-width: 768px) {
    .news-category-swiper {
        @apply px-[40px];
    }
    
    .news-swiper-button-prev,
    .news-swiper-button-next {
        width: 30px;
        height: 30px;
        
        &::after {
            width: 8px;
            height: 8px;
        }
    }
    
    .news-swiper-button-prev {
        left: 5px;
    }
    
    .news-swiper-button-next {
        right: 5px;
    }
}

/* 1024px 以上隱藏導航箭頭 */
@media (min-width: 1024px) {
    .news-swiper-button-prev,
    .news-swiper-button-next {
        display: none;
    }
}

/* 無障礙性支援 */
@media (prefers-reduced-motion: reduce) {
    .news-2-nav-item,
    .news-2-nav-item-text,
    .news-swiper-button-prev,
    .news-swiper-button-next {
        transition: none !important;
    }
}

/* 頁面導航鏈接樣式 */
.nav-link {
    @apply relative inline-block font-bold leading-[1.5] tracking-[0.1em];
    transition: all 0.3s ease;
}


.nav-link:focus {
    @apply outline-none ring-2  ring-offset-transparent;
}

