:root {
    color-scheme: dark;
    --viax-bg: #0c1020;
    --viax-surface: #171b2b;
    --viax-surface-soft: #202536;
    --viax-border: rgba(255, 255, 255, 0.12);
    --viax-text: #f7f7f8;
    --viax-muted: #b8bdc9;
    --viax-yellow: #f5e537;
    --viax-yellow-text: #101633;
    --viax-danger: #ef6379;
    --viax-success: #65d890;
    --viax-radius: 8px;
}

body.viax-app {
    background: var(--viax-bg);
    color: var(--viax-text);
}

.viax-header {
    margin-bottom: 28px;
    border-bottom: 1px solid var(--viax-border);
}

.viax-header__main {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding-bottom: 18px;
}

.viax-header__brand {
    flex: 0 0 auto;
}

.viax-header__brand img {
    display: block;
    width: auto;
    height: 34px;
}

.viax-header__account {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    min-width: 0;
}

.viax-header__identity {
    min-width: 0;
    max-width: 520px;
    overflow: hidden;
    color: var(--viax-muted);
    font-size: 14px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.viax-header__identity-label {
    color: #8f96a8;
}

.viax-header__role {
    display: inline-flex;
    margin-left: 6px;
    padding: 3px 7px;
    border: 1px solid var(--viax-border);
    border-radius: 999px;
    color: var(--viax-text);
    font-size: 12px;
    font-weight: 800;
}

.viax-language {
    display: inline-flex;
    overflow: hidden;
    border: 1px solid var(--viax-border);
    border-radius: var(--viax-radius);
}

.viax-language a,
.viax-header__logout,
.viax-header__nav-link {
    color: var(--viax-text);
    font-weight: 800;
    text-decoration: none;
}

.viax-language a {
    min-width: 42px;
    padding: 8px 10px;
    text-align: center;
}

.viax-language a.active {
    background: var(--viax-yellow);
    color: var(--viax-yellow-text);
}

.viax-header__logout {
    padding: 9px 12px;
    border: 1px solid var(--viax-border);
    border-radius: var(--viax-radius);
}

.viax-header__nav {
    display: flex;
    align-items: center;
    gap: 4px;
    overflow-x: auto;
    padding: 0 0 12px;
    scrollbar-width: thin;
}

.viax-header__nav-link {
    flex: 0 0 auto;
    padding: 10px 13px;
    border-radius: var(--viax-radius);
    color: var(--viax-muted);
    font-size: 14px;
}

.viax-header__nav-link:hover,
.viax-header__nav-link:focus-visible,
.viax-header__nav-link.active {
    background: var(--viax-surface-soft);
    color: var(--viax-text);
}

.viax-header__nav-link.active {
    box-shadow: inset 0 -2px var(--viax-yellow);
}

body.viax-app .viax-page-title {
    margin: 0 0 8px;
    font-size: clamp(32px, 5vw, 46px);
    line-height: 1.08;
}

body.viax-app .viax-page-intro {
    margin: 0 0 26px;
    color: var(--viax-muted);
    font-size: 18px;
    line-height: 1.5;
}

.viax-table-shell {
    width: 100%;
    overflow-x: auto;
    border: 1px solid var(--viax-border);
    border-radius: var(--viax-radius);
    -webkit-overflow-scrolling: touch;
}

.viax-empty-state {
    padding: 28px 18px !important;
    color: var(--viax-muted);
    text-align: center !important;
}

.viax-status {
    display: inline-flex;
    align-items: center;
    min-height: 26px;
    padding: 4px 8px;
    border: 1px solid var(--viax-border);
    border-radius: 999px;
    font-size: 12px;
    font-weight: 900;
}

body.viax-app .card,
body.viax-app .job-card,
body.viax-app .detailed-description,
body.viax-app .application-form,
body.viax-app .notice {
    border-radius: var(--viax-radius);
}

body.viax-app .card {
    background: var(--viax-surface);
    border-color: var(--viax-border);
    box-shadow: none;
    backdrop-filter: none;
}

body.viax-app input,
body.viax-app select,
body.viax-app textarea,
body.viax-app button,
body.viax-app .action-link,
body.viax-app .logout-link {
    border-radius: var(--viax-radius);
}

body.viax-app input:not([type="checkbox"]):not([type="radio"]),
body.viax-app select,
body.viax-app textarea {
    min-height: 48px;
    background: #ffffff;
    color: #171a28;
    color-scheme: light;
}

body.viax-app select {
    height: 48px;
    min-height: 48px;
    line-height: 1.2;
    padding-right: 38px;
}

body.viax-app .checkbox-row,
body.viax-app .checkbox-line,
body.viax-app label.checkbox,
body.viax-app .checkbox-label {
    align-items: center;
}

body.viax-app .checkbox-row input[type="checkbox"],
body.viax-app .checkbox-line input[type="checkbox"],
body.viax-app label.checkbox input[type="checkbox"],
body.viax-app .checkbox-label input[type="checkbox"] {
    flex: 0 0 18px;
    width: 18px;
    height: 18px;
    margin: 0;
}

body.viax-app .apply-panel summary {
    border-radius: var(--viax-radius);
}

body.viax-app .candidates-table {
    min-width: 1320px;
}

body.viax-app .admin-data-table {
    min-width: 1320px;
}

body.viax-app .hero {
    margin-bottom: 24px;
}

body.viax-app .hero h1 {
    max-width: none;
    font-size: clamp(32px, 5vw, 46px);
}

body.viax-app .hero p {
    margin-bottom: 0;
    font-size: 18px;
}

body.viax-app table th {
    color: #c7cbd5;
    font-size: 12px;
    line-height: 1.25;
    overflow-wrap: normal;
    word-break: normal;
}

body.viax-app table td {
    line-height: 1.4;
    overflow-wrap: anywhere;
}

@media (max-width: 900px) {
    .viax-header__main {
        align-items: flex-start;
        flex-direction: column;
        gap: 16px;
    }

    .viax-header__account {
        justify-content: flex-start;
        flex-wrap: wrap;
        width: 100%;
    }

    .viax-header__identity {
        flex-basis: 100%;
        max-width: 100%;
        overflow: visible;
        text-overflow: clip;
        white-space: normal;
    }

    .viax-table-shell table,
    body.admin-page table { display: table; }
    .viax-table-shell thead,
    body.admin-page thead { display: table-header-group; }
    .viax-table-shell tbody,
    body.admin-page tbody { display: table-row-group; }
    .viax-table-shell tr,
    body.admin-page tr { display: table-row; padding: 0; background: transparent; }
    .viax-table-shell th,
    .viax-table-shell td,
    body.admin-page th,
    body.admin-page td { display: table-cell; min-width: initial; border-bottom: 1px solid var(--viax-border); padding: 12px; }

    body.admin-page .card { overflow-x: auto; }
}
