:root {
    --stna-ink: #202124;
    --stna-muted: #666b70;
    --stna-line: #dfe2e5;
    --stna-line-strong: #cfd3d7;
    --stna-soft: #f6f7f8;
    --stna-card: #fff;
    --stna-accent: #e30613;
    --stna-radius: 10px;
    --stna-control-height: 40px;
}

body.com_stna:not(.view-dashboards8) #sp-main-body,
body.com_stna:not(.view-dashboards8) #sp-component,
body.com_stna:not(.view-dashboards8) #sp-main-body > .container,
body.com_stna:not(.view-dashboards8) #sp-main-body > .container-fluid,
body.com-stna:not(.view-dashboards8) #sp-main-body,
body.com-stna:not(.view-dashboards8) #sp-component,
body.com-stna:not(.view-dashboards8) #sp-main-body > .container,
body.com-stna:not(.view-dashboards8) #sp-main-body > .container-fluid {
    width: 100% !important;
    max-width: none !important;
}

body.com_stna:not(.view-dashboards8) #sp-component,
body.com-stna:not(.view-dashboards8) #sp-component {
    padding-right: 0 !important;
    padding-left: 0 !important;
}

.stna-page,
.pulpit.stna-page,
.pulpit7.stna-page,
.stna-users.stna-page,
.stna-user-edit.stna-page,
.stna-configuration.stna-page,
.stna-help-page.stna-page {
    box-sizing: border-box;
    width: calc(100vw - 32px) !important;
    max-width: none !important;
    margin: 24px 0 48px calc(50% - 50vw + 16px) !important;
    color: var(--stna-ink);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
}

.stna-page *,
.stna-page *::before,
.stna-page *::after {
    box-sizing: border-box;
}

.stna-card {
    border: 1px solid var(--stna-line) !important;
    border-radius: var(--stna-radius) !important;
    background: var(--stna-card) !important;
}

.stna-card--muted {
    background: var(--stna-soft) !important;
}

.stna-header {
    position: relative;
    min-height: 124px;
    padding: 28px 32px !important;
}

.stna-header > div:first-child {
    padding-right: 190px;
}

.stna-header__actions,
.stna-help-actions.stna-header__actions {
    position: absolute;
    z-index: 4;
    top: 22px;
    right: 24px;
    margin: 0;
}

.stna-field,
.stna-field label {
    display: grid;
    gap: 5px;
}

.stna-field > label,
.stna-page .control-label,
.stna-page .form-label {
    color: #33383d;
    font-size: 13px;
    font-weight: 700;
}

.stna-page input:not([type="radio"]):not([type="checkbox"]),
.stna-page select,
.stna-page textarea,
.stna-control {
    width: 100%;
    min-height: var(--stna-control-height);
    border: 1px solid var(--stna-line-strong);
    border-radius: 8px;
    background: #fff;
    color: var(--stna-ink);
    font: inherit;
}

.stna-page input:not([type="radio"]):not([type="checkbox"]),
.stna-page select {
    padding: 0 11px;
}

.stna-page textarea {
    padding: 10px 11px;
}

.stna-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: var(--stna-control-height);
    padding: 0 15px;
    border: 1px solid var(--stna-line-strong);
    border-radius: 8px;
    background: #fff;
    color: var(--stna-ink);
    font: inherit;
    font-weight: 700;
    text-decoration: none;
    cursor: pointer;
}

.stna-button--primary {
    border-color: var(--stna-ink);
    background: var(--stna-ink);
    color: #fff;
}

.stna-filterbar {
    display: grid;
    grid-template-columns: minmax(220px, 1.1fr) minmax(155px, .8fr) minmax(155px, .8fr) minmax(260px, 1.6fr) 112px;
    gap: 10px;
    align-items: end;
    width: 100%;
    padding: 12px;
    border: 1px solid var(--stna-line);
    border-radius: 9px;
    background: var(--stna-soft);
}

@media (max-width: 1100px) {
    .stna-filterbar {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .stna-page,
    .pulpit.stna-page,
    .pulpit7.stna-page,
    .stna-users.stna-page,
    .stna-user-edit.stna-page,
    .stna-configuration.stna-page,
    .stna-help-page.stna-page {
        width: calc(100vw - 20px) !important;
        margin-left: calc(50% - 50vw + 10px) !important;
    }

    .stna-header {
        padding: 22px !important;
    }

	.stna-header > div:first-child {
		padding-right: 0;
	}

    .stna-header__actions,
    .stna-help-actions.stna-header__actions {
        position: static;
        margin-top: 14px;
    }

    .stna-filterbar {
        grid-template-columns: 1fr;
    }
}
