.header-icon-menu {
    display: flex;
    align-items: center;
    flex-wrap: nowrap; /* ✅ kabhi niche wrap nahi hoga */
    overflow-x: auto; /* ✅ mobile me sideways scroll */
    white-space: nowrap;
    /*gap: 18px;*/
    padding-bottom: 6px;
}

    /* Optional: scrollbar ko clean banana */
    .header-icon-menu::-webkit-scrollbar {
        height: 6px;
    }

    .header-icon-menu::-webkit-scrollbar-thumb {
        background: #ccc;
        border-radius: 10px;
    }

.menu-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    /*min-width: 64px;*/
    padding: 6px 8px;
    cursor: pointer;
    border-radius: 6px;
    transition: background 0.2s ease;
    font-size: 12px;
    flex-shrink: 0; /* ✅ item shrink nahi hoga */
}

    /*.menu-item:hover {
        background-color: #ffffff;*/ /* light background */
    /*}*/

    /* ---------- HOVER ICON ZOOM EFFECT ADD HERE ---------- */

    /* Smooth transition */
    .menu-item .icon {
        transition: transform 0.2s ease;
    }

    /* Hover → Icon thoda bada */
    .menu-item:hover .icon {
        transform: scale(1.2);
    }

    /* Hover background remove */
    .menu-item:hover {
        background-color: transparent !important;
    }

    /* ------------------------------------------------------ */


    /* ✅ ICON SIZE */
    .menu-item .icon {
        width: 20px;
        height: 20px;
        flex-shrink: 0;
    }



    /* ✅ TEXT CENTER */
    .menu-item span {
        text-align: center;
        line-height: 1.1;
    }

    .menu-item .icon {
        color: #ffffff;
        fill: #ffffff; /* ✅ SVG ke liye important */
    }

    .menu-item span {
        color: #ffffff; /* ✅ agar text bhi white chahiye */
    }

.pc-header {
    background-color: #0073ba !important;
}