﻿/* Reset mặc định */
/* Mỗi tab chiếm 1/3 hàng */
/* Mặc định trên desktop giữ nguyên */


#policiesTab .nav-link {
    position: relative;
    width: 100%;
    text-align: center;
    color: #002d5b; /* xanh navy */
    font-weight: 600;
    border: none;
}
    #policiesTab .nav-item {
        flex: 1 1 0;
        text-align: center;
    }
    /* Gạch underline cam khi active */
    #policiesTab .nav-link::after {
        content: "";
        position: absolute;
        left: 50%;
        bottom: 0;
        width: 0;
        height: 3px;
        background-color: #ff6600; /* cam */
        transition: all 0.3s ease-in-out;
        transform: translateX(-50%);
        border-radius: 2px;
    }

    /* Khi active thì underline bung ra */
    #policiesTab .nav-link.active::after {
        width: 50%; /* chiếm nửa chiều rộng tab */
    }

    /* Khi hover cũng highlight nhẹ */
    #policiesTab .nav-link:hover {
        color: #ff6600;
    }
#policiesTab .nav-link {
    font-size: 1rem; /* 16px */
    font-weight: 600;
    padding: 0.5rem 1rem;
}

/* Khi màn hình nhỏ hơn 576px (mobile) */
@media (max-width: 576px) {
    #policiesTab .nav-link {
        font-size: 0.75rem; /* giảm còn ~12px */
        padding: 0.25rem 0.5rem; /* thu gọn padding */
    }

    #policiesTab {
        flex-wrap: nowrap; /* giữ 3 tab cùng nằm 1 hàng */
        overflow-x: auto; /* nếu vẫn chật thì có thể trượt ngang */
    }
}
    /*Link tài liệu*/
.doc-link {
    margin-bottom: 12px;
    transition: all 0.3s ease;
}


    .doc-link a {
        font-weight: 600;
        color: #002d5b; /* xanh navy */
        text-decoration: none;
    }

        .doc-link a:hover {
            color: #ff6600; /* cam */
            transform: translateX(5px); /* hiệu ứng trượt nhẹ khi hover */
        }

    .doc-link small {
        display: block; /* đảm bảo xuống hàng */
        margin-top: 2px;
        font-size: 0.85rem;
    }
/*Trạm phục vụ nong dan*/
.card {
    border-radius: 12px;
    transition: transform 0.2s ease-in-out;
}

    .card:hover {
        transform: translateY(-5px);
    }

.line-orange {
    border-top: 3px solid #ff6600;
    margin-top: 30px;
}

