/* Gamevers Advanced Breadcrumb */
.gv-breadcrumb-nav {
    display: block;
    width: 100%;
    margin-bottom: 18px;
    font-family: 'Inter', sans-serif;
    /* Use modern font if available */
}

/* Flex Container */
.gv-breadcrumb-list {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0;
    margin: 0;
    padding: 0;
}

/* Items (Wrapper Spans) */
.gv-bc-item {
    display: flex;
    align-items: center;
    font-size: 13px;
    /* Bigger size as requested */
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    /* Slightly reduced tracking for bigger text */
    color: #888;
}

/* Links inside Items */
.gv-bc-item a {
    text-decoration: none;
    color: #888;
    /* Lighter base color for visibility */
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    display: flex;
    align-items: center;
    gap: 8px;
    /* Space between Icon and Text */
    padding: 4px 0;
    position: relative;
}

.gv-bc-item a:hover {
    color: #fff;
    /* White on Hover */
    text-shadow: 0 0 10px rgba(255, 255, 255, 0.3);
    transform: translateY(-1px);
    /* Subtle lift */
}

/* Home Image ("GV") */
/* Home Image ("GV") */
.gv-bc-home-img img {
    display: block;
    width: 22px;
    height: 22px;
    object-fit: contain;
    transition: all 0.3s ease;
    /* Animate all properties including filter */

    /* Apply same "Icon" style: Grayscale + Opacity */
    filter: grayscale(100%) brightness(1.5) opacity(0.6);
}

.gv-bc-home-img:hover img {
    /* Reveal Color and Pop */
    transform: scale(1.15) rotate(-5deg);
    filter: grayscale(0%) brightness(1) opacity(1) drop-shadow(0 2px 4px rgba(0, 0, 0, 0.5));
}

/* Category Images (The Icons) */
.gv-bc-cat-img {
    width: 16px;
    height: 16px;
    object-fit: contain;
    /* Ensure icon shape is preserved */

    /* Make them look like icons by default */
    filter: grayscale(100%) brightness(1.5) opacity(0.6);
    transition: all 0.3s ease;
}

/* On Link Hover, reveal color/white */
.gv-bc-item a:hover .gv-bc-cat-img {
    filter: grayscale(0%) brightness(1) opacity(1);
    transform: scale(1.1);
}

/* Current Item (Text inside span but not link) */
/* WC default outputs the last item as text directly inside .gv-bc-item or without wrapper? 
   Actually, standard WC outputs: before + Link + after ... before + Text + after 
   So the last item is just text inside .gv-bc-item
*/
.gv-bc-item {
    color: #fff;
    /* Last item (text) will inherit this white */
}

/* But links override it to grey */
.gv-bc-item a {
    color: #888;
}

/* Home Icon Helper */
.gv-bc-home-icon {
    display: flex;
    align-items: center;
    margin-right: 0;
}

.gv-bc-home-icon svg {
    display: block;
}

/* Separator */
.gv-bc-sep {
    display: flex;
    align-items: center;
    color: #ccc;
    /* Bright Light Grey for visibility */
    margin: 0 10px;
    /* Airy spacing */
    opacity: 1;
}

.gv-bc-sep svg {
    width: 12px;
    height: 12px;
}

/* Mobile Responsiveness */
@media (max-width: 600px) {
    .gv-bc-item {
        font-size: 10px;
    }

    .gv-bc-sep {
        margin: 0 4px;
        /* Tighter on mobile */
    }

    .gv-bc-cat-img {
        width: 14px;
        height: 14px;
    }
}