/*
 * 酒仙网脚本管理平台 - 主样式文件
 * 包含全局样式和基础布局
 */

/* 全局页面样式设置 */
body {
    font-family: 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    background-color: #f3f4f6;
}

/* 页面切换动画 */
.page-section {
    transition: opacity 0.3s ease;
}

/* 隐藏类 */
.hidden {
    display: none;
}

/* 通用卡片样式 */
.bg-white {
    background-color: white;
}

.rounded-lg {
    border-radius: 0.5rem;
}

.shadow {
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
}

.shadow-sm {
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
}

.shadow-md {
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
}

.shadow-lg {
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
}

/* 渐变背景 */
.bg-gradient-to-r {
    background-image: linear-gradient(to right, var(--tw-gradient-stops));
}

.from-blue-600 {
    --tw-gradient-from: #2563eb;
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(37, 99, 235, 0));
}

.to-indigo-700 {
    --tw-gradient-to: #4338ca;
}

/* 图表容器样式定义 */
.chart-container {
    position: relative;
    width: 100%;
    max-width: 800px;
    height: 400px;
    margin: 0 auto;
}

/* 自定义浏览器滚动条样式 */
::-webkit-scrollbar {
    width: 8px;
}

::-webkit-scrollbar-track {
    background: #f1f1f1;
}

::-webkit-scrollbar-thumb {
    background: #cbd5e1;
    border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
    background: #94a3b8;
}

/* 响应式设计 */
@media (max-width: 768px) {
    .flex.h-screen {
        flex-direction: column;
        height: auto;
    }

    .w-64 {
        width: 100%;
        height: auto;
    }

    .flex-1 {
        flex: 1 1 auto;
    }
}