.brandoz-measurement-table {
    --brandoz-measurement-primary: #001736;
    --brandoz-measurement-surface: #f9f9ff;
    --brandoz-measurement-light-surface: #f0f3ff;
    --brandoz-measurement-highlight: #d0e1fb;
    --brandoz-measurement-border: #c4c6d0;
    --brandoz-measurement-white: #ffffff;
    --brandoz-measurement-muted: #43474f;
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    margin: 0;
    padding: 0;
    overflow: hidden;
    border: 1px solid var(--brandoz-measurement-border);
    border-radius: 12px;
    color: var(--brandoz-measurement-primary);
    background: var(--brandoz-measurement-white);
    font-family: "Hanken Grotesk", sans-serif;
    font-size: 14px;
    line-height: 20px;
    font-weight: 500;
}

.brandoz-measurement-table *,
.brandoz-measurement-table *::before,
.brandoz-measurement-table *::after {
    box-sizing: border-box;
}

.brandoz-measurement-table__scroll {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow-x: auto;
    overflow-y: hidden;
    outline: none;
    scrollbar-color: #cbd5e1 #f1f5f9;
    scrollbar-width: thin;
}

.brandoz-measurement-table__scroll:focus-visible {
    box-shadow: inset 0 0 0 3px rgba(0, 61, 131, .22);
}

.brandoz-measurement-table__scroll::-webkit-scrollbar {
    height: 4px;
}

.brandoz-measurement-table__scroll::-webkit-scrollbar-track {
    background: #f1f5f9;
}

.brandoz-measurement-table__scroll::-webkit-scrollbar-thumb {
    border-radius: 2px;
    background: #cbd5e1;
}

.brandoz-measurement-table__table {
    width: 100%;
    min-width: max-content;
    margin: 0;
    border: 0;
    border-collapse: separate;
    border-spacing: 0;
    color: var(--brandoz-measurement-primary);
    background: var(--brandoz-measurement-white);
    font: inherit;
}

.brandoz-measurement-table__header-cell,
.brandoz-measurement-table__measurement,
.brandoz-measurement-table__size,
.brandoz-measurement-table__cell {
    padding: 16px;
    border: 0;
    vertical-align: middle;
    white-space: nowrap;
}

.brandoz-measurement-table__header-cell {
    border-bottom: 2px solid var(--brandoz-measurement-primary);
    color: var(--brandoz-measurement-primary);
    background: var(--brandoz-measurement-surface);
    font-size: 12px;
    line-height: 16px;
    font-weight: 700;
    letter-spacing: .05em;
    text-align: center;
    text-transform: uppercase;
}

.brandoz-measurement-table__measurement {
    position: sticky;
    left: 0;
    z-index: 2;
    min-width: 120px;
    border-right: 1px solid var(--brandoz-measurement-border);
    color: var(--brandoz-measurement-primary);
    background: var(--brandoz-measurement-white);
    text-align: left;
}

.brandoz-measurement-table__header-cell.brandoz-measurement-table__measurement {
    z-index: 4;
    background: var(--brandoz-measurement-surface);
}

.brandoz-measurement-table__size {
    min-width: 80px;
    text-align: center;
}

.brandoz-measurement-table__cell {
    border-bottom: 1px solid var(--brandoz-measurement-border);
    color: var(--brandoz-measurement-primary);
    text-align: center;
    transition: background-color .15s ease;
}

.brandoz-measurement-table__row:nth-child(even) .brandoz-measurement-table__measurement,
.brandoz-measurement-table__row:nth-child(even) .brandoz-measurement-table__cell:not(.brandoz-measurement-table__highlighted) {
    background: var(--brandoz-measurement-light-surface);
}

.brandoz-measurement-table__row .brandoz-measurement-table__measurement {
    font-weight: 600;
}

.brandoz-measurement-table__row:last-child .brandoz-measurement-table__measurement,
.brandoz-measurement-table__row:last-child .brandoz-measurement-table__cell {
    border-bottom: 0;
}

.brandoz-measurement-table__cell:not(.brandoz-measurement-table__highlighted):hover {
    background: #e8effd !important;
}

.brandoz-measurement-table__highlighted {
    border-right: 1px solid rgba(0, 23, 54, .2);
    border-left: 1px solid rgba(0, 23, 54, .2);
    color: var(--brandoz-measurement-primary);
    font-weight: 700;
}

.brandoz-measurement-table__header-cell.brandoz-measurement-table__highlighted {
    background: rgba(208, 225, 251, .3);
}

.brandoz-measurement-table__cell.brandoz-measurement-table__highlighted {
    background: rgba(208, 225, 251, .5);
}

.brandoz-measurement-table__highlighted span {
    font-size: 14px;
}

@media (max-width: 767px) {
    .brandoz-measurement-table__header-cell,
    .brandoz-measurement-table__measurement,
    .brandoz-measurement-table__size,
    .brandoz-measurement-table__cell {
        padding: 14px 16px;
    }
}
