.chart {
    width: 60%;
    height: 100%;
    margin: 0 auto;
    color: #fff;
    padding: 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.chart-kind-container {
    flex-shrink: 0;
    display: flex;
    flex-wrap: wrap;
    border-radius: 8px;
    align-content: space-between;
    overflow: hidden;
    border-radius: 8px;
    background-color: #0f0f0faf;
    backdrop-filter: blur(10px);
    box-shadow: inset 0.3px 0.3px 3px 0.3px rgba(160, 160, 160, 0.6), 2px 2px 5px 0px rgba(0, 0, 0, 0.7);

}

.chart-kind-item {
    flex: 1;
    font-size: 16px;
    font-weight: bold;
    color: #fff;
    padding: 5px 8px;
    cursor: pointer;
    text-align: center;
    box-shadow: inset 0.3px 0.3px 3px 0.3px rgba(160, 160, 160, 0.6);
    white-space: nowrap;
}


.chart-kind-item:not(.chart-kind-item-activate):hover {
    background-color: #5f5f5f;
}

.chart-kind-item-activate {
    background-color: #ff8c00;
    box-shadow: inset 0.3px 0.3px 3px 0.9px rgba(260, 260, 260, 0.9);
}

.chart-table {
    margin: 20px 0;
    border-radius: 8px;
    overflow: hidden;
    background-color: #0f0f0faf;
    backdrop-filter: blur(10px);
    box-shadow: inset 0.3px 0.3px 3px 0.3px rgba(160, 160, 160, 0.6), 2px 2px 5px 0px rgba(0, 0, 0, 0.7);
}

.chart-table th {
    padding: 8px;
    text-align: center;
    font-size: 16px;
    font-weight: bold;
    box-shadow: inset 0.3px 0.3px 3px 0.3px rgba(160, 160, 160, 0.6);
    white-space: nowrap;
}

.chart-table td {
    padding: 5px;
    text-align: center;
    box-shadow: inset 0.3px 0.3px 3px 0.3px rgba(160, 160, 160, 0.6);
    white-space: nowrap;
}

.chart-table tr:hover {
    background-color: #5f5f5f;
}

.chart-table-title-1 {
    text-align: center;
    width: 80px;
}

.chart-table-title-2 {
    text-align: center;
    width: 140px;
}

.chart-table-title-3 {
    text-align: center;
    width: 140px;
}

.chart-table-title-4 {
    text-align: center;
    width: 100px;
}

.chart-table button {
    padding: 5px 8px;
}

.chart-separator {
    flex-shrink: 0;
    width: 100%;
    height: 10px;
}