/* iKuai风格图标CSS */
.ikuai-icon {
    display: inline-block;
    width: 1em;
    height: 1em;
    vertical-align: middle;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

/* 爱快路由器图标 - 基于爱快品牌设计 */
.ikuai-router {
    background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICA8IS0tIGlLdWFp6Lev5b+r6Lev55Sx5Zmo5Zu+5qCHIC0tPgogIDxyZWN0IHg9IjMiIHk9IjgiIHdpZHRoPSIxOCIgaGVpZ2h0PSI4IiByeD0iMiIgZmlsbD0iIzMzNzNkYyIgc3Ryb2tlPSIjMjU2M2ViIiBzdHJva2Utd2lkdGg9IjEuNSIvPgogIDwhLS0g5YmN6Z2i5oyH56S65Yqf6IO9IC0tPgogIDxjaXJjbGUgY3g9IjciIGN5PSIxMiIgcj0iMS41IiBmaWxsPSIjNDBkZjlmIi8+CiAgPGNpcmNsZSBjeD0iMTIiIGN5PSIxMiIgcj0iMS41IiBmaWxsPSIjNDBkZjlmIi8+CiAgPGNpcmNsZSBjeD0iMTciIGN5PSIxMiIgcj0iMS41IiBmaWxsPSIjNDBkZjlmIi8+CiAgPCEtLSDnvZHnu5zlpKfnur/lm77moIcgLS0+CiAgPHBhdGggZD0iTTYgOFY2YzAtMS4xLjktMiAyLTJoOGMxLjEgMCAyIC45IDIgMnYyIiBzdHJva2U9IiMyNTYzZWIiIHN0cm9rZS13aWR0aD0iMS41IiBmaWxsPSJub25lIi8+CiAgPCEtLSDnvZHnu5zlsI/nur/lm77moIcgLS0+CiAgPHBhdGggZD0iTTYgMTZ2MmMwIDEuMS45IDIgMiAyaDhjMS4xIDAgMi0uOSAyLTJ2LTIiIHN0cm9rZT0iIzI1NjNlYiIgc3Ryb2tlLXdpZHRoPSIxLjUiIGZpbGw9Im5vbmUiLz4KICA8IS0tIGlLdWFp5ZOB54mM5qCH6K+GIC0tPgogIDx0ZXh0IHg9IjEyIiB5PSI0IiB0ZXh0LWFuY2hvcj0ibWlkZGxlIiBmb250LXNpemU9IjYiIGZvbnQtZmFtaWx5PSJBcmlhbCIgZmlsbD0iIzMzNzNkYyIgZm9udC13ZWlnaHQ9ImJvbGQiPmlLPC90ZXh0Pgo8L3N2Zz4K');
}

/* 爱快网络管理图标 */
.ikuai-network {
    background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICA8IS0tIOS4reW/g+e9kee7nOeuoeeQhuWbvuaghyAtLT4KICA8Y2lyY2xlIGN4PSIxMiIgY3k9IjEyIiByPSI0IiBmaWxsPSIjMzM3M2RjIiBzdHJva2U9IiMyNTYzZWIiIHN0cm9rZS13aWR0aD0iMS41Ii8+CiAgPCEtLSDlpJblm7Tnu5Hnu5zov57mjqXnur8gLS0+CiAgPGNpcmNsZSBjeD0iNiIgY3k9IjYiIHI9IjIiIGZpbGw9IiM0MGRmOWYiIHN0cm9rZT0iIzEwYjk4MSIgc3Ryb2tlLXdpZHRoPSIxIi8+CiAgPGNpcmNsZSBjeD0iMTgiIGN5PSI2IiByPSIyIiBmaWxsPSIjNDBkZjlmIiBzdHJva2U9IiMxMGI5ODEiIHN0cm9rZS13aWR0aD0iMSIvPgogIDxjaXJjbGUgY3g9IjYiIGN5PSIxOCIgcj0iMiIgZmlsbD0iIzQwZGY5ZiIgc3Ryb2tlPSIjMTBiOTgxIiBzdHJva2Utd2lkdGg9IjEiLz4KICA8Y2lyY2xlIGN4PSIxOCIgY3k9IjE4IiByPSIyIiBmaWxsPSIjNDBkZjlmIiBzdHJva2U9IiMxMGI5ODEiIHN0cm9rZS13aWR0aD0iMSIvPgogIDwhLS0g6L+e5o6l57q/IC0tPgogIDxsaW5lIHgxPSI4IiB5MT0iOCIgeDI9IjEwIiB5Mj0iMTAiIHN0cm9rZT0iIzI1NjNlYiIgc3Ryb2tlLXdpZHRoPSIxLjUiLz4KICA8bGluZSB4MT0iMTYiIHkxPSI4IiB4Mj0iMTQiIHkyPSIxMCIgc3Ryb2tlPSIjMjU2M2ViIiBzdHJva2Utd2lkdGg9IjEuNSIvPgogIDxsaW5lIHgxPSI4IiB5MT0iMTYiIHgyPSIxMCIgeTI9IjE0IiBzdHJva2U9IiMyNTYzZWIiIHN0cm9rZS13aWR0aD0iMS41Ii8+CiAgPGxpbmUgeDE9IjE2IiB5MT0iMTYiIHgyPSIxNCIgeTI9IjE0IiBzdHJva2U9IiMyNTYzZWIiIHN0cm9rZS13aWR0aD0iMS41Ii8+Cjwvc3ZnPgo=');
}

/* 爱快WiFi无线管理图标 */
.ikuai-wifi {
    background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICA8IS0tIFdpRmk2L1dpRmk3IOaXoOe6v+S/oeWPt+azouWKqOWbvuaghyAtLT4KICA8cGF0aCBkPSJNMTIgM0M3LjAzIDMgMi43MyA1LjY0IDAgOWwyIDJjMi4yNy0yLjI3IDUuMjgtMy41IDguNS0zLjVzNi4yMyAxLjIzIDguNSAzLjVsMiAyQzE5LjI3IDUuNjQgMTQuOTcgMyAxMiAzWiIgZmlsbD0iIzMzNzNkYyIvPgogIDxwYXRoIGQ9Ik0xMiA3Yy0zLjMxIDAtNi4zMSAxLjMxLTguNSAzLjVsMiAyQzcuNjkgMTAuNjkgOS43NyAxMCAxMiAxMHMzLjMxLjY5IDUuNSAyLjVsMiAyQzE3LjMxIDguMzEgMTQuMzEgNyAxMiA3WiIgZmlsbD0iIzI1NjNlYiIvPgogIDxwYXRoIGQ9Ik0xMiAxMWMtMS42NSAwLTMuMTUuNjUtNC4yNSAxLjc1bDIgMkM5Ljc1IDEzLjc1IDEwLjgzIDEzIDEyIDEzczIuMjUuNzUgMi4yNSAxLjc1bDIgMkMxNS4xNSAxMS42NSAxMy42NSAxMSAxMiAxMVoiIGZpbGw9IiM0MGRmOWYiLz4KICA8IS0tIFdpRmk2IOaKgOacr+agh+ivhiAtLT4KICA8dGV4dCB4PSIxOSIgeT0iNyIgZm9udC1zaXplPSI0IiBmb250LWZhbWlseT0iQXJpYWwiIGZpbGw9IiMzMzczZGMiIGZvbnQtd2VpZ2h0PSJib2xkIj42PC90ZXh0PgogIDwhLS0g5Lit5b+D6L+e5o6l54K5IC0tPgogIDxjaXJjbGUgY3g9IjEyIiBjeT0iMTgiIHI9IjIiIGZpbGw9IiM0MGRmOWYiLz4KPC9zdmc+Cg==');
}

/* 爱快系统设置管理图标 */
.ikuai-settings {
    background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICA8IS0tIGlLdWFp57O757uf6K6+572u6b2Q6L2u5Zu+5qCHIC0tPgogIDxjaXJjbGUgY3g9IjEyIiBjeT0iMTIiIHI9IjMiIGZpbGw9IiMzMzczZGMiIHN0cm9rZT0iIzI1NjNlYiIgc3Ryb2tlLXdpZHRoPSIxLjUiLz4KICA8IS0tIOiuvue9ruWPguaVsOmhueeCuSAtLT4KICA8cGF0aCBkPSJNMTIgMWwtMyA1aDZsLTMtNXoiIGZpbGw9IiM0MGRmOWYiIHN0cm9rZT0iIzEwYjk4MSIgc3Ryb2tlLXdpZHRoPSIxIi8+CiAgPHBhdGggZD0iTTEyIDIzbDMtNWgtNmwzIDV6IiBmaWxsPSIjNDBkZjlmIiBzdHJva2U9IiMxMGI5ODEiIHN0cm9rZS13aWR0aD0iMSIvPgogIDxwYXRoIGQ9Ik0xIDEybDUgM3YtNmwtNSAzeiIgZmlsbD0iIzQwZGY5ZiIgc3Ryb2tlPSIjMTBiOTgxIiBzdHJva2Utd2lkdGg9IjEiLz4KICA8cGF0aCBkPSJNMjMgMTJsLTUtM3Y2bDUtM3oiIGZpbGw9IiM0MGRmOWYiIHN0cm9rZT0iIzEwYjk4MSIgc3Ryb2tlLXdpZHRoPSIxIi8+CiAgPCEtLSDlr7nop5Lnur/orr7nva4gLS0+CiAgPHBhdGggZD0iTTE5LjA3IDQuOTNsLTIuMTIgMi4xMiAyLjEyIDIuMTIgMi4xMi0yLjEyLTIuMTItMi4xMnoiIGZpbGw9IiMyNTYzZWIiLz4KICA8cGF0aCBkPSJNNC45MyAxOS4wN2wyLjEyLTIuMTItMi4xMi0yLjEyLTIuMTIgMi4xMiAyLjEyIDIuMTJ6IiBmaWxsPSIjMjU2M2ViIi8+CiAgPHBhdGggZD0iTTE5LjA3IDE5LjA3bC0yLjEyLTIuMTItMi4xMiAyLjEyIDIuMTIgMi4xMiAyLjEyLTIuMTJ6IiBmaWxsPSIjMjU2M2ViIi8+CiAgPHBhdGggZD0iTTQuOTMgNC45M2wyLjEyIDIuMTIgMi4xMi0yLjEyLTIuMTItMi4xMi0yLjEyIDIuMTJ6IiBmaWxsPSIjMjU2M2ViIi8+Cjwvc3ZnPgo=');
}

/* 状态指示灯 */
.status-indicator {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    margin-right: 8px;
}

.status-online {
    background-color: #4CAF50;
    box-shadow: 0 0 8px rgba(76, 175, 80, 0.6);
}

.status-offline {
    background-color: #F44336;
    box-shadow: 0 0 8px rgba(244, 67, 54, 0.6);
}

/* 动画效果 */
@keyframes pulse {
    0% {
        box-shadow: 0 0 0 0 rgba(102, 126, 234, 0.7);
    }
    70% {
        box-shadow: 0 0 0 10px rgba(102, 126, 234, 0);
    }
    100% {
        box-shadow: 0 0 0 0 rgba(102, 126, 234, 0);
    }
}

.pulse {
    animation: pulse 2s infinite;
}

/* 爱快(iKuai)官方主题色彩 - 基于企业级网络设备品牌风格 */
:root {
    --ikuai-primary: #3373dc;     /* 爱快主蓝色 */
    --ikuai-secondary: #2563eb;   /* 爱快深蓝色 */
    --ikuai-success: #10b981;     /* 在线状态绿色 */
    --ikuai-online: #40df9f;      /* 设备在线指示色 */
    --ikuai-danger: #ef4444;      /* 离线/错误红色 */
    --ikuai-warning: #f59e0b;     /* 警告橙色 */
    --ikuai-info: #06b6d4;        /* 信息青色 */
    --ikuai-gray: #6b7280;        /* 中性灰色 */
    --ikuai-light: #f8fafc;       /* 浅色背景 */
    --ikuai-dark: #1e293b;        /* 深色文字 */
}

/* 响应式设计 */
@media (max-width: 768px) {
    .ikuai-icon {
        width: 1.2em;
        height: 1.2em;
    }
}