/* Additional responsive styles for navbar spacing */

/* For 768-991px screens - 150% zoom */
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .mk-nav-link {
        padding: 6px 8px !important;
        font-size: 12px !important;
    }

    .mk-nav-list {
        gap: 4px !important;
    }

    .mk-header-right {
        gap: 10px !important;
    }

    .mk-logo-img {
        height: 32px !important;
    }

    .mk-user-name {
        display: none !important;
    }
}

/* For 991-1200px screens - 150% zoom on larger screens */
@media only screen and (min-width: 991px) and (max-width: 1200px) {
    .mk-nav-link {
        padding: 8px 10px !important;
        font-size: 12px !important;
    }

    .mk-nav-list {
        gap: 5px !important;
    }

    .mk-header-right {
        gap: 12px !important;
    }

    .mk-logo-img {
        height: 38px !important;
    }

    .mk-nav-link i {
        font-size: 14px !important;
    }

    .mk-user-name {
        display: inline-block !important;
        /* Keep it if it fits */
    }
}

/* For 1200-1300px screens - 125% zoom */
@media only screen and (min-width: 1200px) and (max-width: 1300px) {
    .mk-nav-link {
        padding: 8px 12px !important;
        font-size: 13px !important;
    }

    .mk-nav-list {
        gap: 6px !important;
    }
}

/* For 1300-1400px screens - 110% zoom */
@media only screen and (min-width: 1300px) and (max-width: 1400px) {
    .mk-nav-link {
        padding: 10px 14px !important;
        font-size: 14px !important;
    }

    .mk-nav-list {
        gap: 7px !important;
    }
}