/* 底部导航栏样式 */
:root {
    --tabbar-height: 14.5vw;
    --item-margin-bottom: 2vw;
    --font-size: 2.8vw;
    --icon-size: 4.5vw;
    --gap-size: 3vw;
    --active-color: #007AFF;
}

.tabBar_main {
    height: var(--tabbar-height);
    width: 100%;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--gap-size);
    text-align: center;
    position: fixed;
    bottom: 0;
    justify-content: space-evenly;
    align-items: flex-end;
    background-color: #FFFFFF;
    font-size: var(--font-size);
    z-index: 4;
}

/* 统一样式类 */
.tabBar_main_item {
    margin-bottom: var(--item-margin-bottom);
    font-size: var(--font-size);
    cursor: pointer;
}

/* 图标基础样式 */
.tabBar_main_item_icon {
    margin: 0 auto;
    width: var(--icon-size);
    height: var(--icon-size);
    background-size: 100% 100%;
    background-repeat: no-repeat;
    background-position: center;
}

.tabBar_main_item_d {
    color: #FF6975;
}

/* 首页图标 */
.tabBar_main_item_a .tabBar_main_item_icon {
    background-image: url(/static/img/footer_main_item_a.png);
}

.tabBar_main_item_a.active .tabBar_main_item_icon {
    background-image: url(/static/img/footer_main_item_a_active.png);
}

/* 我的图标 */
.tabBar_main_item_c .tabBar_main_item_icon {
    background-image: url(/static/img/footer_main_item_c.png);
}

.tabBar_main_item_c.active .tabBar_main_item_icon {
    background-image: url(/static/img/footer_main_item_c_active.png);
}

/* AI创作图标 */
.tabBar_main_item_d .tabBar_main_item_icon {
    background-image: url(/static/img/footer_main_item_d.png);
}

.tabBar_main_item_d.active .tabBar_main_item_icon {
    background-image: url(/static/img/footer_main_item_d_active.png);
}

/* 灵感图标 - 如果需要的话可以添加 */
.tabBar_main_item_b .tabBar_main_item_icon {
    background-image: url(/static/img/footer_main_item_b.png);
}

.tabBar_main_item_b.active .tabBar_main_item_icon {
    background-image: url(/static/img/footer_main_item_b_active.png);
}