:root {
    --app-background: #F4F4F4;
    --app-surface: #ffffff;
    --app-surface-secondary: #f5f5f5;
    --app-text: #666;
    --app-text-muted: #999;
    --app-border: #e5e5e5;
}

html[data-theme="dark"] {
    --app-background: #000000;
    --app-surface: #1B1F23;
    --app-surface-secondary: #1B1F23;
    --app-text: #999;
    --app-text-muted: #666;
    --app-text-placeholder: #333;
    --app-border: #373A3D;
    --app-border-secondary: #293037;
}

html {
    background-color: var(--app-background);
    color: var(--app-text);
}

::placeholder {
    color: var(--app-text-placeholder) !important;
}

a.uk-disabled {
    color: var(--app-text-muted) !important;
}

.actions-chevron {
    margin-left: 5px;
    transition: transform 0.2s ease;
}

.actions-button.is-open .actions-chevron {
    transform: scaleY(-1);
}

.input-validation-error {
    border: solid 1px #F0506E !important;
}

.ph-thin {
    font-size: 24px;
}

.ql-toolbar.ql-snow {
    border: 1px solid var(--app-border);
}

.ql-container {
    border: 1px solid var(--app-border) !important;
    font-family: inherit !important;
    font-size: inherit !important;
}

.uk-accordion-content {
    margin-top: 0px;
}

.uk-accordion-title {
    font-size: 16px;
}

.uk-accordion > li {
    border: 1px solid #55555C;
}

.uk-accordion-content .uk-list {
    padding-top: 0px;
}

.uk-alert-close {
    color: #373A3D !important;
}

.uk-border {
    border: 1px solid var(--app-border);
}

.uk-button {
    text-transform: none;
}

    .uk-button:disabled {
        border: 1px solid var(--app-border) !important;
    }

.uk-button-default {
    color: var(--app-text-muted);
    border: 1px solid var(--app-border);
}

    .uk-button-default:hover {
        color: var(--app-text);
    }

.uk-button-link {
    color: #999;
}

    .uk-button-link:hover {
        color: #666;
    }

.uk-button:disabled {
    color: var(--app-text-muted) !important;
}

.uk-button-primary > .uk-icon {
    color: #fff !important;
}

.uk-card-default {
    background: var(--app-surface);
    border: 1px solid var(--app-border);
}

.uk-card-header {
    border-bottom: 1px solid var(--app-border) !important;
}

.uk-disabled {
    color: #e5e5e5 !important;
}

.uk-drop {
    background: var(--app-surface);
    border: 1px solid var(--app-border);
}

    .uk-drop > ul > li > a {
        color: var(--app-text-muted);
        text-transform: none;
    }

        .uk-drop > ul > li > a:hover {
            color: var(--app-text);
        }

.uk-form-label {
    color: var(--app-text) !important;
}

.uk-gap-small {
    gap: 10px;
}

.uk-heading-line {
    color: var(--app-text-muted);
}

    .uk-heading-line > span::after {
        border-bottom: calc(.2px + .05em) solid var(--app-border) !important;
    }

    .uk-heading-line > span::before {
        border-bottom: calc(.2px + .05em) solid var(--app-border) !important;
    }

.uk-icon {
    color: var(--app-text);
}

.uk-input,
.uk-textarea {
    background-color: var(--app-surface);
    border: 1px solid var(--app-border);
    color: var(--app-text);
}

    .uk-input:disabled,
    .uk-input.uk-disabled,
    .uk-input.uk-disabled::placeholder,
    .uk-select:disabled,
    .select.uk-disabled,
    .select.uk-disabled::placeholder,
    .uk-textarea:disabled,
    .uk-textarea.uk-disabled,
    .uk-textarea.uk-disabled::placeholder {
        border: 1px solid var(--app-border);
        background: var(--app-surface);
        color: var(--app-text-placeholder) !important;
        opacity: 1;
    }

    .uk-input:focus,
    .uk-textarea:focus {
        background-color: var(--app-surface);
        color: var(--app-text);
    }

.uk-label {
    text-transform: none;
}

.uk-link {
    color: #1E87f0 !important;
}

.uk-placeholder {
    border: 1px solid #55555C;
    margin: 0px;
}

.uk-navbar {
    background: var(--app-surface);
}

.uk-navbar-container {
    background: var(--app-surface) !important;
}

.uk-nav-divider {
    border-top: 1px solid var(--app-border) !important;
}

.uk-navbar-nav > li > a {
    color: var(--app-text-muted);
    text-transform: none;
}

    .uk-navbar-nav > li > a:hover {
        color: var(--app-text);
    }

.uk-navbar-nav > li.uk-active > a {
    border-bottom: 1px solid #2191F2;
    color: var(--app-text);
}

.uk-notification {
    border: 1px solid #BFBFBF;
}

.uk-padding-small-left {
    padding-right: 8px;
}

.uk-padding-small-right {
    padding-right: 8px;
}

.uk-pagination li {
    width: 2.5rem;
    height: 2.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .uk-pagination li a,
    .uk-pagination li span {
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .uk-pagination li span {
        font-weight: 500;
    }

.uk-select {
    background-color: var(--app-surface);
    border: 1px solid var(--app-border);
    color: var(--app-text);
}

    .uk-select:focus {
        background-color: var(--app-surface);
        color: var(--app-text);
    }

.uk-spinner > svg > circle {
    color: #1e87f0;
}

.uk-tab::before {
    border-bottom: 1px solid var(--app-border);
}

.uk-tab > li > a {
    color: var(--app-text-muted);
}

    .uk-tab > li.uk-active > a {
        color: var(--app-text) !important;
    }

.uk-table th {
    cursor: default;
    font-size: 1rem;
    text-transform: none;
}

.uk-table tr {
    color: var(--app-text);
    cursor: pointer;
}

.uk-table-hover tbody tr:hover {
    background-color: var(--app-border-secondary) !important;
}

.uk-table-striped tbody tr:last-of-type {
    border-bottom: 1px solid var(--app-border) !important;
}

.uk-table-striped tbody tr:nth-of-type(2n+1) {
    background: var(--app-surface);
    border-bottom: 1px solid var(--app-border) !important;
    border-top: 1px solid var(--app-border) !important;
}

.uk-text {
    color: var(--app-text) !important;
}

.uk-text-muted {
    color: var(--app-text-muted) !important;
}

.uk-text-lead {
    color: var(--app-text) !important;
}

.actions-chevron {
    transition: transform 0.2s ease;
}

.uk-open > button .actions-chevron {
    transform: rotate(180deg);
}

.uk-switch-label {
    display: inline-flex;
    align-items: center;
    cursor: pointer;
}

input.uk-switch-input {
    display: none !important;
}

.uk-switch-slider {
    position: relative;
    display: inline-block;
    width: 44px;
    height: 24px;
    background-color: var(--app-surface);
    border: 1px solid var(--app-border);
    border-radius: 50px;
    transition: background-color 0.2s ease-in-out;
}

    .uk-switch-slider::before {
        content: "";
        position: absolute;
        width: 20px;
        height: 20px;
        left: 2px;
        bottom: 2px;
        background-color: var(--app-text);
        border-radius: 50%;
        box-shadow: 0 1px 3px rgba(0,0,0,0.2);
        transition: transform 0.2s ease-in-out;
    }

input.uk-switch-input:checked + .uk-switch-slider {
    background-color: #1e87f0;
}

    input.uk-switch-input:checked + .uk-switch-slider::before {
        transform: translateX(20px) !important;
    }