/* ========================================
   爱宠智能体 - 宠物主题图标
   温暖可爱风格 · 橙色系配色
   ======================================== */

/* 图标基础样式 */
.nav-icon {
    font-style: normal;
    font-weight: normal;
    display: inline-block;
    width: 32px;
    height: 32px;
    fill: currentColor;
    transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.nav-item .nav-icon {
    margin-bottom: 4px;
}

/* 首页图标 - 宠物小屋 */
.icon-home::before {
    content: "";
    display: inline-block;
    width: 32px;
    height: 32px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cdefs%3E%3ClinearGradient id='homeGrad' x1='0%25' y1='0%25' x2='100%25' y2='100%25'%3E%3Cstop offset='0%25' stop-color='%23FFB347'/%3E%3Cstop offset='100%25' stop-color='%23FF9F43'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath fill='url(%23homeGrad)' d='M32 4L4 28h6v28h44V28h6L32 4z'/%3E%3Ccircle fill='%23FFF' cx='32' cy='40' r='12'/%3E%3Cpath fill='%23FF9F43' d='M28 36h8v16h-8z'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    filter: drop-shadow(0 2px 4px rgba(255, 159, 67, 0.4));
}

.nav-item.active .icon-home::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cdefs%3E%3ClinearGradient id='homeGradActive' x1='0%25' y1='0%25' x2='100%25' y2='100%25'%3E%3Cstop offset='0%25' stop-color='%23FF8787'/%3E%3Cstop offset='100%25' stop-color='%23FF6B6B'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath fill='url(%23homeGradActive)' d='M32 4L4 28h6v28h44V28h6L32 4z'/%3E%3Ccircle fill='%23FFF' cx='32' cy='40' r='12'/%3E%3Cpath fill='%23FF6B6B' d='M28 36h8v16h-8z'/%3E%3C/svg%3E");
    filter: drop-shadow(0 3px 6px rgba(255, 107, 107, 0.5));
    transform: scale(1.15);
}

.nav-item.active .icon-home::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath fill='%23FF6B6B' d='M32 4L4 28h6v28h44V28h6L32 4z'/%3E%3Ccircle fill='%23FF8787' cx='32' cy='40' r='12'/%3E%3Cpath fill='%23FFF' d='M28 36h8v16h-8z'/%3E%3C/svg%3E");
}

/* 问诊图标 - 听诊器（无圆形背景） */
.icon-consultation::before {
    content: "";
    display: inline-block;
    width: 32px;
    height: 32px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Crect fill='%23FFB347' x='29' y='4' width='6' height='16' rx='3'/%3E%3Ccircle fill='%23FF9F43' cx='32' cy='46' r='12' stroke='%23FFF' stroke-width='3'/%3E%3Cpath fill='none' stroke='%23FF9F43' stroke-width='5' stroke-linecap='round' d='M32 20c0 8-10 10-10 20v6h20v-6c0-10-10-12-10-20'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    filter: drop-shadow(0 2px 4px rgba(255, 159, 67, 0.4));
}

.nav-item.active .icon-consultation::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Crect fill='%23FF8787' x='29' y='4' width='6' height='16' rx='3'/%3E%3Ccircle fill='%23FF6B6B' cx='32' cy='46' r='12' stroke='%23FFF' stroke-width='3'/%3E%3Cpath fill='none' stroke='%23FF6B6B' stroke-width='5' stroke-linecap='round' d='M32 20c0 8-10 10-10 20v6h20v-6c0-10-10-12-10-20'/%3E%3C/svg%3E");
    filter: drop-shadow(0 3px 6px rgba(255, 107, 107, 0.5));
    transform: scale(1.15);
}

/* 发布图标 - 猫爪 + */
.icon-publish::before {
    content: "";
    display: inline-block;
    width: 32px;
    height: 32px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cdefs%3E%3ClinearGradient id='pubGrad' x1='0%25' y1='0%25' x2='100%25' y2='100%25'%3E%3Cstop offset='0%25' stop-color='%23FFB347'/%3E%3Cstop offset='100%25' stop-color='%23FF9F43'/%3E%3C/linearGradient%3E%3C/defs%3E%3Ccircle fill='url(%23pubGrad)' cx='32' cy='32' r='28'/%3E%3Cpath fill='%23FFF' d='M32 18c-2 0-4 2-4 4v6h-6c-2 0-4 2-4 4s2 4 4 4h6v6c0 2 2 4 4 4s4-2 4-4v-6h6c2 0 4-2 4-4s-2-4-4-4h-6v-6c0-2-2-4-4-4z'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    filter: drop-shadow(0 2px 4px rgba(255, 159, 67, 0.4));
}

.nav-item.active .icon-publish::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cdefs%3E%3ClinearGradient id='pubGradActive' x1='0%25' y1='0%25' x2='100%25' y2='100%25'%3E%3Cstop offset='0%25' stop-color='%23FF8787'/%3E%3Cstop offset='100%25' stop-color='%23FF6B6B'/%3E%3C/linearGradient%3E%3C/defs%3E%3Ccircle fill='url(%23pubGradActive)' cx='32' cy='32' r='28'/%3E%3Cpath fill='%23FFF' d='M32 18c-2 0-4 2-4 4v6h-6c-2 0-4 2-4 4s2 4 4 4h6v6c0 2 2 4 4 4s4-2 4-4v-6h6c2 0 4-2 4-4s-2-4-4-4h-6v-6c0-2-2-4-4-4z'/%3E%3C/svg%3E");
    filter: drop-shadow(0 3px 6px rgba(255, 107, 107, 0.5));
    transform: scale(1.15);
}

/* 宠圈图标 - 对话气泡（无圆形背景） */
.icon-circle::before {
    content: "";
    display: inline-block;
    width: 32px;
    height: 32px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath fill='%23FFB347' d='M6 10h52c5 0 10 5 10 10v18c0 5-5 10-10 10h-10l-10 10v-10H6c-5 0-10-5-10-10V20c0-5 5-10 10-10z'/%3E%3Ccircle fill='%23FFF' cx='24' cy='32' r='5'/%3E%3Ccircle fill='%23FFF' cx='32' cy='32' r='5'/%3E%3Ccircle fill='%23FFF' cx='40' cy='32' r='5'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    filter: drop-shadow(0 2px 4px rgba(255, 159, 67, 0.4));
}

.nav-item.active .icon-circle::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath fill='%23FF8787' d='M6 10h52c5 0 10 5 10 10v18c0 5-5 10-10 10h-10l-10 10v-10H6c-5 0-10-5-10-10V20c0-5 5-10 10-10z'/%3E%3Ccircle fill='%23FFF' cx='24' cy='32' r='5'/%3E%3Ccircle fill='%23FFF' cx='32' cy='32' r='5'/%3E%3Ccircle fill='%23FFF' cx='40' cy='32' r='5'/%3E%3C/svg%3E");
    filter: drop-shadow(0 3px 6px rgba(255, 107, 107, 0.5));
    transform: scale(1.15);
}

/* 我的图标 - 人头剪影（无圆形背景） */
.icon-mine::before {
    content: "";
    display: inline-block;
    width: 32px;
    height: 32px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Ccircle fill='%23FFB347' cx='32' cy='22' r='12'/%3E%3Cpath fill='%23FF9F43' d='M14 50c0-10 8-16 18-16s18 6 18 16v4H14v-4z'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    filter: drop-shadow(0 2px 4px rgba(255, 159, 67, 0.4));
}

.nav-item.active .icon-mine::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Ccircle fill='%23FF8787' cx='32' cy='22' r='12'/%3E%3Cpath fill='%23FF6B6B' d='M14 50c0-10 8-16 18-16s18 6 18 16v4H14v-4z'/%3E%3C/svg%3E");
    filter: drop-shadow(0 3px 6px rgba(255, 107, 107, 0.5));
    transform: scale(1.15);
}

/* 聊天图标 - 对话气泡 + 猫耳 */
.icon-chat::before {
    content: "";
    display: inline-block;
    width: 26px;
    height: 26px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Ccircle fill='%23FF9F43' cx='32' cy='32' r='28'/%3E%3Cpath fill='%23FFF' d='M20 24h24c2 0 4 2 4 4v12c0 2-2 4-4 4H28l-8 6V28c0-2 2-4 4-4z'/%3E%3Ccircle fill='%23FFB347' cx='28' cy='32' r='3'/%3E%3Ccircle fill='%23FFB347' cx='36' cy='32' r='3'/%3E%3Ccircle fill='%23FFB347' cx='44' cy='32' r='3'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

.nav-item.active .icon-chat::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Ccircle fill='%23FF6B6B' cx='32' cy='32' r='28'/%3E%3Cpath fill='%23FFF' d='M20 24h24c2 0 4 2 4 4v12c0 2-2 4-4 4H28l-8 6V28c0-2 2-4 4-4z'/%3E%3Ccircle fill='%23FF8787' cx='28' cy='32' r='3'/%3E%3Ccircle fill='%23FF8787' cx='36' cy='32' r='3'/%3E%3Ccircle fill='%23FF8787' cx='44' cy='32' r='3'/%3E%3C/svg%3E");
}

/* 贴士图标 - 书本 + 爪印 */
.icon-tips::before {
    content: "";
    display: inline-block;
    width: 26px;
    height: 26px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Ccircle fill='%23FF9F43' cx='32' cy='32' r='28'/%3E%3Cpath fill='%23FFF' d='M20 24h24v20H20z'/%3E%3Cpath fill='%23FFB347' d='M32 24v20M24 32h16' stroke='%23FFB347' stroke-width='2'/%3E%3Cpath fill='%23FFB347' d='M28 44l4 4 4-4'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

.nav-item.active .icon-tips::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Ccircle fill='%23FF6B6B' cx='32' cy='32' r='28'/%3E%3Cpath fill='%23FFF' d='M20 24h24v20H20z'/%3E%3Cpath fill='%23FF8787' d='M32 24v20M24 32h16' stroke='%23FF8787' stroke-width='2'/%3E%3Cpath fill='%23FF8787' d='M28 44l4 4 4-4'/%3E%3C/svg%3E");
}

/* 反馈图标 - 信封 + 爱心 */
.icon-feedback::before {
    content: "";
    display: inline-block;
    width: 26px;
    height: 26px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Ccircle fill='%23FF9F43' cx='32' cy='32' r='28'/%3E%3Cpath fill='%23FFF' d='M20 28h24v16H20z'/%3E%3Cpath fill='%23FFB347' d='M20 28l12 8 12-8'/%3E%3Cpath fill='%23FF6B6B' d='M32 38c-2 0-4-2-4-4s2-4 4-4 4 2 4 4-2 4-4 4z'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

.nav-item.active .icon-feedback::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Ccircle fill='%23FF6B6B' cx='32' cy='32' r='28'/%3E%3Cpath fill='%23FFF' d='M20 28h24v16H20z'/%3E%3Cpath fill='%23FF8787' d='M20 28l12 8 12-8'/%3E%3Cpath fill='%23FF6B6B' d='M32 38c-2 0-4-2-4-4s2-4 4-4 4 2 4 4-2 4-4 4z'/%3E%3C/svg%3E");
}

/* 档案图标 - 文件夹 + 爪印 */
.icon-profile::before {
    content: "";
    display: inline-block;
    width: 26px;
    height: 26px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Ccircle fill='%23FF9F43' cx='32' cy='32' r='28'/%3E%3Cpath fill='%23FFF' d='M20 28h24v20H20z'/%3E%3Cpath fill='%23FFB347' d='M20 28v-4h8l4 4h12v4H20z'/%3E%3Cpath fill='%23FFB347' d='M32 38c-3 0-6 2-6 6s3 6 6 6 6-2 6-6-3-6-6-6z'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

.nav-item.active .icon-profile::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Ccircle fill='%23FF6B6B' cx='32' cy='32' r='28'/%3E%3Cpath fill='%23FFF' d='M20 28h24v20H20z'/%3E%3Cpath fill='%23FF8787' d='M20 28v-4h8l4 4h12v4H20z'/%3E%3Cpath fill='%23FF8787' d='M32 38c-3 0-6 2-6 6s3 6 6 6 6-2 6-6-3-6-6-6z'/%3E%3C/svg%3E");
}

/* 分享图标 - 分享箭头 */
.icon-share::before {
    content: "";
    display: inline-block;
    width: 26px;
    height: 26px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Ccircle fill='%23FF9F43' cx='32' cy='32' r='28'/%3E%3Ccircle fill='%23FFF' cx='24' cy='40' r='6'/%3E%3Ccircle fill='%23FFF' cx='40' cy='40' r='6'/%3E%3Ccircle fill='%23FFF' cx='32' cy='24' r='6'/%3E%3Cpath fill='%23FFB347' d='M28 36l4-8 4 8'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

.nav-item.active .icon-share::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Ccircle fill='%23FF6B6B' cx='32' cy='32' r='28'/%3E%3Ccircle fill='%23FFF' cx='24' cy='40' r='6'/%3E%3Ccircle fill='%23FFF' cx='40' cy='40' r='6'/%3E%3Ccircle fill='%23FFF' cx='32' cy='24' r='6'/%3E%3Cpath fill='%23FF8787' d='M28 36l4-8 4 8'/%3E%3C/svg%3E");
}

/* 删除图标 - 垃圾桶 */
.icon-delete::before {
    content: "";
    display: inline-block;
    width: 26px;
    height: 26px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Ccircle fill='%23FFE5E5' cx='32' cy='32' r='28'/%3E%3Cpath fill='%23FF6B6B' d='M24 28h16v24H24z'/%3E%3Cpath fill='%23FF8787' d='M20 28h24v4H20z'/%3E%3Cpath fill='%23FF6B6B' d='M28 24h8v4h-8z'/%3E%3Cpath fill='%23FFF' d='M28 32h2v16h-2zM34 32h2v16h-2z'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

.nav-item.active .icon-delete::before,
.icon-delete:hover::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Ccircle fill='%23FFD0D0' cx='32' cy='32' r='28'/%3E%3Cpath fill='%23FF5252' d='M24 28h16v24H24z'/%3E%3Cpath fill='%23FF6B6B' d='M20 28h24v4H20z'/%3E%3Cpath fill='%23FF5252' d='M28 24h8v4h-8z'/%3E%3Cpath fill='%23FFF' d='M28 32h2v16h-2zM34 32h2v16h-2z'/%3E%3C/svg%3E");
}

/* 点赞图标 - 爱心 */
.icon-like::before {
    content: "";
    display: inline-block;
    width: 26px;
    height: 26px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Ccircle fill='%23FFE5E5' cx='32' cy='32' r='28'/%3E%3Cpath fill='%23FF6B6B' d='M32 44c-8-6-16-12-16-20 0-4 4-8 8-8s6 4 8 8c2-4 4-8 8-8s8 4 8 8c0 8-8 14-16 20z'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

.nav-item.active .icon-like::before,
.icon-like:hover::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Ccircle fill='%23FFD0D0' cx='32' cy='32' r='28'/%3E%3Cpath fill='%23FF5252' d='M32 44c-8-6-16-12-16-20 0-4 4-8 8-8s6 4 8 8c2-4 4-8 8-8s8 4 8 8c0 8-8 14-16 20z'/%3E%3C/svg%3E");
}

/* 评论图标 - 对话气泡 */
.icon-comment::before {
    content: "";
    display: inline-block;
    width: 26px;
    height: 26px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Ccircle fill='%23FFE5D0' cx='32' cy='32' r='28'/%3E%3Cpath fill='%23FF9F43' d='M20 24h24c2 0 4 2 4 4v12c0 2-2 4-4 4H28l-8 6V28c0-2 2-4 4-4z'/%3E%3Ccircle fill='%23FFF' cx='28' cy='32' r='2'/%3E%3Ccircle fill='%23FFF' cx='36' cy='32' r='2'/%3E%3Ccircle fill='%23FFF' cx='44' cy='32' r='2'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

.nav-item.active .icon-comment::before,
.icon-comment:hover::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Ccircle fill='%23FFD0B8' cx='32' cy='32' r='28'/%3E%3Cpath fill='%23FF8A30' d='M20 24h24c2 0 4 2 4 4v12c0 2-2 4-4 4H28l-8 6V28c0-2 2-4 4-4z'/%3E%3Ccircle fill='%23FFF' cx='28' cy='32' r='2'/%3E%3Ccircle fill='%23FFF' cx='36' cy='32' r='2'/%3E%3Ccircle fill='%23FFF' cx='44' cy='32' r='2'/%3E%3C/svg%3E");
}