/* styles/components/tabs.css */

/* Report Tabs */
.mp-report-tabs {
    display: flex;
    border-bottom: 1px solid var(--theme-border);
    margin-bottom: 20px;
    gap: 0;
}

.mp-tab-button {
    padding: 10px 20px;
    cursor: pointer;
    background-color: transparent;
    border: none;
    border-bottom: 3px solid transparent;
    color: var(--theme-text-secondary);
    font-weight: 500;
    transition: all 0.3s ease;
    flex: 1;
    text-align: center;
}

.mp-tab-button:hover {
    color: var(--theme-text);
    background-color: rgba(74, 144, 226, 0.1);
}

.mp-tab-button.active {
    color: var(--theme-accent);
    border-bottom-color: var(--theme-accent);
    font-weight: 600;
}

/* Tab Panes */
.mp-tab-content {
    /* Styles for the content container if needed */
}

.mp-tab-pane {
    display: none;
}

.mp-tab-pane.active {
    display: block;
}

/* LLM Tabs (if you have any) */
.llm-tabs {
    display: flex;
    border-bottom: 1px solid var(--theme-border);
    margin-bottom: 20px;
    gap: 0;
}

.llm-tab-button {
    padding: 10px 20px;
    cursor: pointer;
    background-color: transparent;
    border: none;
    border-bottom: 3px solid transparent;
    color: var(--theme-text-secondary);
    font-weight: 500;
    transition: all 0.3s ease;
    flex: 1;
    text-align: center;
}

.llm-tab-button:hover {
    color: var(--theme-text);
    background-color: rgba(74, 144, 226, 0.1);
}

.llm-tab-button.active {
    color: var(--theme-accent);
    border-bottom-color: var(--theme-accent);
    font-weight: 600;
}

.llm-tab-content {
    /* Styles for the content container if needed */
}

.llm-tab-pane {
    display: none;
}

.llm-tab-pane.active {
    display: block;
}

/* styles/components/tabs.css */

/* Market Pulse Tabs */
.mp-report-tabs {
    display: flex;
    border-bottom: 1px solid var(--theme-border);
    margin-bottom: 20px;
    gap: 0;
}

.mp-tab-button {
    padding: 10px 20px;
    cursor: pointer;
    background-color: transparent;
    border: none;
    border-bottom: 3px solid transparent;
    color: var(--theme-text-secondary);
    font-weight: 500;
    transition: all 0.3s ease;
    flex: 1;
    text-align: center;
}

.mp-tab-button:hover {
    color: var(--theme-text);
    background-color: rgba(74, 144, 226, 0.1);
}

.mp-tab-button.active {
    color: var(--theme-accent);
    border-bottom-color: var(--theme-accent);
    font-weight: 600;
}

/* Tab Panes */
.mp-tab-content {
    /* Styles for the content container if needed */
}

.mp-tab-pane {
    display: none;
}

.mp-tab-pane.active {
    display: block;
}

/* Any other tab styles from your original CSS */
.tabs {
    display: flex;
    border-bottom: 1px solid var(--theme-border);
    margin-bottom: 20px;
    gap: 0;
}

.tab-button {
    padding: 10px 20px;
    cursor: pointer;
    background-color: transparent;
    border: none;
    border-bottom: 3px solid transparent;
    color: var(--theme-text-secondary);
    font-weight: 500;
    transition: all 0.3s ease;
    flex: 1;
    text-align: center;
}

.tab-button:hover {
    color: var(--theme-text);
    background-color: rgba(74, 144, 226, 0.1);
}

.tab-button.active {
    color: var(--theme-accent);
    border-bottom-color: var(--theme-accent);
    font-weight: 600;
}

.tab-content {
    /* Styles for the content container if needed */
}

.tab-pane {
    display: none;
}

.tab-pane.active {
    display: block;
}