.wons-table-instance,
.wons-table-instance * {
    box-sizing: border-box;
}

.wons-table-instance {
    width: 100%;
    max-width: var(--wons-max-width, 100%);
    margin: 1.5rem auto;
    padding: var(--wons-container-padding, 0);
    color: var(--wons-text, #263238);
    background: var(--wons-background, #fff);
    font-family: var(--wons-font-family, inherit);
    font-size: var(--wons-font-size, 15px);
    line-height: 1.5;
}

.wons-table-instance.wons-container-left { margin-right: auto; margin-left: 0; }
.wons-table-instance.wons-container-center { margin-right: auto; margin-left: auto; }
.wons-table-instance.wons-container-right { margin-right: 0; margin-left: auto; }

.wons-table-instance [hidden] {
    display: none !important;
}

.wons-control-bar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--wons-controls-gap, 10px);
    width: 100%;
    margin: 0 0 14px;
    padding: var(--wons-controls-padding, 0);
    color: var(--wons-controls-text, #263238);
    background: var(--wons-controls-background, #fff);
    border: var(--wons-controls-border-width, 0) solid var(--wons-controls-border, #e1e5ea);
    border-radius: var(--wons-controls-radius, 10px);
}

.wons-table-scroll + .wons-no-results + .wons-pagination + .wons-control-bar,
.wons-table-scroll + .wons-no-results + .wons-control-bar,
.wons-pagination + .wons-control-bar {
    margin-top: 14px;
    margin-bottom: 0;
}

.wons-controls-left .wons-control-bar { justify-content: flex-start; }
.wons-controls-center .wons-control-bar { justify-content: center; }
.wons-controls-right .wons-control-bar { justify-content: flex-end; }
.wons-controls-space-between .wons-control-bar { justify-content: space-between; }

.wons-control {
    position: relative;
    display: inline-flex;
    min-width: min(210px, 100%);
    margin: 0;
}

.wons-table-instance .wons-control input,
.wons-table-instance .wons-control select,
.wons-table-instance .wons-download,
.wons-table-instance .wons-pagination button {
    min-height: 42px;
    margin: 0;
    padding: 8px 38px 8px 12px;
    color: var(--wons-control-text, #263238);
    background-color: var(--wons-control-background, #fff);
    border: 1px solid var(--wons-control-border, #cfd5dc);
    border-radius: var(--wons-control-radius, 7px);
    box-shadow: none;
    font: inherit;
    line-height: 1.2;
}

.wons-table-instance .wons-control input,
.wons-table-instance .wons-control select {
    width: 100%;
}

.wons-table-instance .wons-control input:focus,
.wons-table-instance .wons-control select:focus,
.wons-table-instance .wons-download:focus,
.wons-table-instance .wons-pagination button:focus,
.wons-table-instance .wons-sort-button:focus-visible {
    border-color: var(--wons-accent, #1769aa);
    outline: 2px solid color-mix(in srgb, var(--wons-accent, #1769aa) 30%, transparent);
    outline-offset: 1px;
}

.wons-table-instance .wons-search-control input {
    padding-left: 38px;
}

.wons-search-icon {
    position: absolute;
    z-index: 1;
    top: 50%;
    left: 14px;
    width: 14px;
    height: 14px;
    border: 2px solid currentColor;
    border-radius: 50%;
    opacity: .55;
    transform: translateY(-58%);
    pointer-events: none;
}

.wons-search-icon::after {
    position: absolute;
    right: -5px;
    bottom: -3px;
    width: 6px;
    height: 2px;
    background: currentColor;
    content: "";
    transform: rotate(45deg);
    transform-origin: left center;
}

.wons-table-instance .wons-download,
.wons-table-instance .wons-pagination button {
    padding-right: 13px;
    padding-left: 13px;
    cursor: pointer;
}

.wons-table-instance .wons-download:hover,
.wons-table-instance .wons-pagination button:hover:not(:disabled) {
    color: #fff;
    background: var(--wons-accent, #1769aa);
    border-color: var(--wons-accent, #1769aa);
}

.wons-card-sort {
    display: none;
}

.wons-table-instance .wons-table-scroll {
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    border: var(--wons-border-width, 1px) solid var(--wons-border, #e1e5ea);
    border-radius: var(--wons-radius, 10px);
    -webkit-overflow-scrolling: touch;
}

.wons-table-instance .wons-table {
    width: 100%;
    min-width: 100%;
    margin: 0;
    border: 0;
    border-spacing: 0;
    border-collapse: separate;
    table-layout: var(--wons-table-layout, auto);
    color: inherit;
    background: var(--wons-row-background, #fff);
    font: inherit;
}

.wons-table-instance .wons-table caption {
    padding: var(--wons-cell-y, 13px) var(--wons-cell-x, 16px);
    color: var(--wons-header-text, #263238);
    background: var(--wons-header-background, #f4f6f8);
    font-size: 1.08em;
    font-weight: 700;
    text-align: inherit;
}

.wons-table-instance .wons-table th,
.wons-table-instance .wons-table td {
    min-width: var(--wons-column-width, var(--wons-column-min-width, 140px));
    height: auto;
    margin: 0;
    padding: var(--wons-cell-y, 13px) var(--wons-cell-x, 16px);
    overflow-wrap: anywhere;
    vertical-align: top;
    border: 0;
    border-bottom: var(--wons-border-width, 1px) solid var(--wons-border, #e1e5ea);
    text-align: inherit;
}

.wons-table-instance .wons-table th {
    color: var(--wons-header-text, #263238);
    background: var(--wons-header-background, #f4f6f8);
    font-size: var(--wons-header-font-size, 13px);
    font-weight: 700;
    letter-spacing: .02em;
}

.wons-table-instance .wons-table tr:last-child td {
    border-bottom: 0;
}

.wons-table-instance .wons-table td {
    color: var(--wons-text, #263238);
    background: var(--wons-row-background, #fff);
}

.wons-has-stripes .wons-table tbody tr:nth-child(even) td {
    background: var(--wons-alternate-background, #f8fafc);
}

.wons-has-hover .wons-table tbody tr:hover td {
    background: var(--wons-hover, #eef6fc);
}

.wons-align-left { text-align: left; }
.wons-align-center { text-align: center; }
.wons-align-right { text-align: right; }

.wons-table-instance .wons-table a {
    color: var(--wons-accent, #1769aa);
}

.wons-table-instance .wons-column-align-left { text-align: left; }
.wons-table-instance .wons-column-align-center { text-align: center; }
.wons-table-instance .wons-column-align-right { text-align: right; }

.wons-table-instance .wons-cell-html > :first-child { margin-top: 0; }
.wons-table-instance .wons-cell-html > :last-child { margin-bottom: 0; }
.wons-table-instance .wons-cell-html ul,
.wons-table-instance .wons-cell-html ol { padding-left: 1.4em; }

.wons-table-instance .wons-cell-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    padding: 7px 13px;
    color: #fff;
    background: var(--wons-accent, #1769aa);
    border: 1px solid var(--wons-accent, #1769aa);
    border-radius: var(--wons-control-radius, 7px);
    text-decoration: none;
}

.wons-table-instance .wons-cell-button:hover,
.wons-table-instance .wons-cell-button:focus {
    color: #fff;
    filter: brightness(.92);
}

.wons-table-instance .wons-cell-image {
    display: block;
    width: auto;
    max-width: min(100%, var(--wons-media-width, 180px));
    height: auto;
    margin-right: auto;
    margin-left: auto;
    border-radius: min(var(--wons-radius, 10px), 12px);
}

.wons-table-instance .wons-sort-button {
    display: flex;
    align-items: center;
    justify-content: inherit;
    gap: 7px;
    width: 100%;
    margin: 0;
    padding: 0;
    color: inherit;
    background: transparent;
    border: 0;
    font: inherit;
    font-weight: inherit;
    letter-spacing: inherit;
    text-align: inherit;
    cursor: pointer;
}

.wons-sort-icon::after {
    display: inline-block;
    color: var(--wons-muted, #667085);
    content: "↕";
    font-size: 12px;
    opacity: .7;
}

.wons-table-instance .wons-table th[aria-sort="ascending"] .wons-sort-icon::after { content: "↑"; color: var(--wons-accent, #1769aa); opacity: 1; }
.wons-table-instance .wons-table th[aria-sort="descending"] .wons-sort-icon::after { content: "↓"; color: var(--wons-accent, #1769aa); opacity: 1; }

.wons-no-results {
    margin: 18px 0;
    padding: 14px;
    color: var(--wons-muted, #667085);
    text-align: center;
}

.wons-pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    margin-top: 14px;
}

.wons-table-instance .wons-pagination button:disabled {
    cursor: not-allowed;
    opacity: .45;
}

.wons-page-status {
    color: var(--wons-muted, #667085);
    font-size: .92em;
}

.wons-card-active {
    background: var(--wons-background, #fff);
}

.wons-card-active .wons-table-scroll {
    overflow: visible;
    border: 0;
    border-radius: 0;
}

.wons-card-active .wons-table,
.wons-card-active .wons-table tbody {
    display: block;
    width: 100%;
    background: transparent;
}

.wons-card-active .wons-table thead {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.wons-card-active .wons-table caption {
    display: block;
    width: 100%;
    margin-bottom: var(--wons-card-gap, 16px);
    border: var(--wons-border-width, 1px) solid var(--wons-border, #e1e5ea);
    border-radius: var(--wons-card-radius, 12px);
}

.wons-card-active .wons-table tbody {
    display: grid;
    gap: var(--wons-card-gap, 16px);
}

.wons-card-active .wons-table tbody tr {
    display: grid;
    overflow: hidden;
    background: var(--wons-row-background, #fff);
    border: var(--wons-border-width, 1px) solid var(--wons-border, #e1e5ea);
    border-radius: var(--wons-card-radius, 12px);
    box-shadow: var(--wons-card-shadow, none);
}

.wons-card-active.wons-has-stripes .wons-table tbody tr:nth-child(even) {
    background: var(--wons-alternate-background, #f8fafc);
}

.wons-card-active .wons-table td,
.wons-card-active.wons-has-stripes .wons-table tbody tr:nth-child(even) td {
    display: grid;
    grid-template-columns: minmax(100px, var(--wons-card-label-width, 38%)) minmax(0, 1fr);
    gap: 14px;
    align-items: baseline;
    background: transparent;
    min-width: 0;
}

.wons-card-active .wons-table td::before {
    color: var(--wons-header-text, #263238);
    content: attr(data-label);
    font-size: var(--wons-header-font-size, 13px);
    font-weight: 700;
    letter-spacing: .02em;
    text-align: left;
}

.wons-card-active .wons-table tbody tr td:last-child {
    border-bottom: 0;
}

.wons-card-active .wons-hide-in-cards {
    display: none !important;
}

.wons-card-active .wons-card-sort {
    display: inline-flex;
}

.wons-visually-hidden {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

.wons-table-error {
    padding: 10px 14px;
    border-left: 4px solid #d63638;
    background: #fff3f3;
}

@media (max-width: 600px) {
    .wons-control-bar,
    .wons-controls-space-between .wons-control-bar {
        align-items: stretch;
        justify-content: stretch;
    }

    .wons-control,
    .wons-download {
        width: 100%;
    }

    .wons-card-active .wons-table td {
        grid-template-columns: minmax(88px, var(--wons-card-label-width, 38%)) minmax(0, 1fr);
        gap: 10px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .wons-table-instance * { scroll-behavior: auto !important; }
}