body {
            font-family: 'Roboto', sans-serif;
            margin: 0;
            padding: 0;
            background-color: #F3F4F6;
            color: #333333;
        }
        .navbar {
            background-color: #1E3A8A;
            color: white;
            padding: 1rem;
            display: flex;
            justify-content: flex-start;
            align-items: center;
        }
        .logo {
            font-size: 1.5rem;
            font-weight: bold;
            margin-right: auto;
        }
        .menu-item:hover,
        .menu-item:focus {
            background-color: #3B82F6; /* 悬停时的背景颜色 */
            color: white; /* 悬停时的文字颜色 */
            box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* 轻微阴影效果 */
        }

        .menu-item.active {
            background-color: #2563EB; /* 点击后的背景颜色 */
            color: white; /* 点击后的文字颜色 */
            box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* 轻微阴影效果 */
        }
        .main-container {
            display: flex;
            height: calc(100vh - 60px);
        }
        .sidebar {
            width: 250px;
            background-color: white;
            border-right: 1px solid #E5E7EB;
            overflow-y: auto;
        }
        .category-title {
            font-weight: bold;
            padding: 10px;
            background-color: #f0f0f0;
            border-bottom: 1px solid #ddd;
        }
        .stock-list {
            list-style-type: none;
            padding: 0;
            margin: 0;
        }
        .stock-item {
            padding: 8px 10px;
            border-bottom: 1px solid #E5E7EB;
            cursor: pointer;
            transition: background-color 0.3s;
        }
        .stock-item:hover {
            background-color: #F3F4F6;
        }
        .content {
            flex-grow: 1;
            padding: 2rem;
            overflow-y: auto;
            display: flex;
            flex-direction: column;
        }
        .initial-message {
            font-size: 1.2rem;
            color: #555;
            width: 60%;  /* 或者您认为合适的宽度 */
            max-width: 1200px;  /* 设置最大宽度，避免在大屏幕上过宽 */
            height: 600px;
            margin: 20px 0 20px 20px;  /* 上 右 下 左 */
            float: left;  /* 使图表靠左 */
        }
        .chart-container {
            display: flex;
            justify-content: flex-start; /* 使图表靠左 */
        }

        .expiry-dates {
            display: flex;
            flex-wrap: wrap;
            gap: 0.5rem;
            margin-bottom: 1rem;
        }
        .expiry-date {
            background-color: #1E3A8A;
            color: white;
            padding: 0.5rem 1rem;
            border-radius: 4px;
            cursor: pointer;
            transition: background-color 0.3s;
        }
        .expiry-date:hover {
            background-color: #2563EB;
        }
        #gexChart {
            width: 85%;  /* 或者您认为合适的宽度 */
            max-width: 1200px;  /* 设置最大宽度，避免在大屏幕上过宽 */
            height: 600px;
            margin: 20px 0 20px 20px;  /* 上 右 下 左 */
            float: left;  /* 使图表靠左 */
        }

        .content::after {
            content: "";
            display: table;
            clear: both;
        }

        .chart-and-ad-container {
            display: flex;
            justify-content: space-between;
            align-items: flex-start;
        }

        .ad-container {
            width: 28%;  /* 广告容器的宽度 */
            margin-left: 2%;  /* 与图表的间距 */
        }