.jb-suite-analytics-tabs {
    display: flex;
    gap: 18px;
    border-bottom: 1px solid #e5e1d9;
    padding-bottom: 6px;
    flex-wrap: wrap;
}

.jb-suite-analytics-tab {
    border: 0;
    background: transparent;
    font-weight: 600;
    color: #111827;
    padding: 6px 0;
    cursor: pointer;
    border-bottom: 2px solid transparent;
}

.jb-suite-analytics-tab.is-active {
    color: #1b5e20;
    border-bottom-color: #1b5e20;
}

.jb-suite-analytics-toolbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.jb-suite-analytics-form {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    align-items: flex-end;
}

.jb-suite-analytics-label {
    display: flex;
    flex-direction: column;
    gap: 4px;
    font-size: 12px;
    color: #6b7280;
}

.jb-suite-analytics-select,
.jb-suite-analytics-date {
    border: 1px solid #d1d5db;
    background: #fff;
    padding: 6px 10px;
    border-radius: 8px;
    min-width: 180px;
    max-width: 260px;
}

.jb-suite-analytics-select {
    appearance: none;
    -webkit-appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M6 8l4 4 4-4' stroke='%236b7280' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 10px center;
    background-size: 16px;
    padding-right: 32px;
}

.jb-suite-analytics-apply {
    border: 0;
    background: #1b5e20;
    color: #fff;
    padding: 7px 14px;
    border-radius: 999px;
    font-weight: 600;
    cursor: pointer;
}

.jb-suite-analytics-range {
    border: 1px solid #d1d5db;
    background: #fff;
    padding: 10px 12px;
    border-radius: 8px;
    cursor: pointer;
    font-weight: 600;
}

.jb-suite-analytics-export {
    border: 0;
    background: #0b5fff;
    color: #fff;
    padding: 6px 14px;
    border-radius: 999px;
    font-weight: 600;
    cursor: pointer;
}

.jb-suite-analytics-export:hover {
    color: #fff;
}

.jb-suite-analytics-pill {
    background: #1b5e20;
    color: #fff;
    border: 0;
    padding: 6px 14px;
    border-radius: 999px;
    font-weight: 600;
    cursor: pointer;
}

@media (max-width: 900px) {
    .jb-suite-analytics-toolbar,
    .jb-suite-analytics-form {
        width: 100%;
        flex-direction: column;
        align-items: stretch;
    }

    .jb-suite-analytics-range-control {
        width: 100%;
    }

    .jb-suite-analytics-range,
    .jb-suite-analytics-select,
    .jb-suite-analytics-date {
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }
}
