@charset "utf-8";

:root {
    --body-bg: #ffffff;
    --body-text: #0e0e0e;
    --error-bg: #eab5b5;
    --error-border: #c23a3a;
    --error-text: #c23a3a;
    --success-bg: #baffba;
    --success-border: #2fad2f;
    --success-text: #2fad2f;
    --table-a-bg: #ffffff;
    --table-a-row-border: #2a2a2a;
    --table-a-row-hover-border: #d1d1d1;
    --link: #1d1d1d;
    --link-hover: #111111;
    --menu-link-border: #1d1d1d;
    --menu-link-hover: #000000;
    --tender-menu-link: #b73c3e;
    --tender-menu-act: #f0ac00;
    --input-bg: #ffffff;
    --input-border: #b9b9b9;
    --input-text: #181818;
    --label-color: #5f5f5f;
    --ajax-result-border: #b9b9b9;
    --ajax-result-shadow: rgba(0, 0, 0, 0.2);
    --item-cell-border: #2c2c2c;
    --edit-hover-bg: #efecec;
    --edit-layout-bg: #ffffff;
    --edit-layout-border: #909090;
    --recipient-item-bg: #f5f5f5;
    --recipient-item-border: #d9d9d9;
    --recipient-ename: #222222;
    --demo-border: #8f8f8f;
    --pagination-bg: #efecec;
    --pagination-muted: #9c9c9c;
    --pagination-link: #000000;
    --pagination-border: #2c2c2c;
    --pagination-hover: #157acc;
    --search-btn-bg: #f0f0f0;
    --theme-control-bg: #ffffff;
    --theme-control-border: #b9b9b9;
    --theme-control-text: #181818;
}

/* Lágyabb, kevésbé kontrasztos sötét (meleg szürke alap, tompa szegélyek) */
html[data-theme="dark"] {
    color-scheme: dark;
    --body-bg: #1c1d21;
    --body-text: #c8c9cd;
    --error-bg: #3a2d30;
    --error-border: #c75c5c;
    --error-text: #f0b4b4;
    --success-bg: #2a332c;
    --success-border: #5a9a62;
    --success-text: #b8dcb8;
    --table-a-bg: #22232a;
    --table-a-row-border: #383a42;
    --table-a-row-hover-border: #4a4d58;
    --link: #9db0d0;
    --link-hover: #c5d4eb;
    --menu-link-border: #6b6e78;
    --menu-link-hover: #e2e4ea;
    --tender-menu-link: #c77a7c;
    --tender-menu-act: #d9a84a;
    --input-bg: #25262c;
    --input-border: #40434c;
    --input-text: #d8d9dd;
    --label-color: #989aa2;
    --ajax-result-border: #40434c;
    --ajax-result-shadow: rgba(0, 0, 0, 0.35);
    --item-cell-border: #383a42;
    --edit-hover-bg: #2a2c33;
    --edit-layout-bg: #25262c;
    --edit-layout-border: #40434c;
    --recipient-item-bg: #2a2c33;
    --recipient-item-border: #383a42;
    --recipient-ename: #c8c9cd;
    --demo-border: #40434c;
    --pagination-bg: #22232a;
    --pagination-muted: #848790;
    --pagination-link: #c8c9cd;
    --pagination-border: #383a42;
    --pagination-hover: #7eb3e8;
    --search-btn-bg: #2a2c33;
    --theme-control-bg: #25262c;
    --theme-control-border: #40434c;
    --theme-control-text: #b4b6be;
}

html[data-theme="light"] {
    color-scheme: light;
}

.theme-control-wrap {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    padding: 4px;
    border-radius: 999px;
    background: var(--theme-control-bg);
    border: 1px solid var(--theme-control-border);
    color: var(--theme-control-text);
    box-shadow: 0 1px 3px var(--ajax-result-shadow);
    vertical-align: middle;
}

/* Fejléc táblázat: kisebb, a kereső és a kijelentkezés között */
.theme-control-wrap--headbar {
    gap: 1px;
    padding: 2px;
    box-shadow: 0 1px 2px var(--ajax-result-shadow);
}

.theme-control-wrap--headbar .theme-icon-btn {
    width: 26px;
    height: 26px;
}

.theme-icon-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    margin: 0;
    padding: 0;
    border: none;
    border-radius: 999px;
    background: transparent;
    color: var(--theme-control-text);
    cursor: pointer;
    opacity: 0.55;
    transition: opacity 0.15s ease, background 0.15s ease, color 0.15s ease;
}

.theme-icon-btn:hover {
    opacity: 0.95;
}

.theme-icon-btn--active {
    opacity: 1;
    background: var(--edit-hover-bg);
    color: var(--body-text);
}

.theme-icon-btn:focus-visible {
    outline: 2px solid var(--pagination-hover);
    outline-offset: 2px;
}

.theme-icon-btn svg {
    display: block;
    flex-shrink: 0;
}

/* jQuery UI (get_tender) — alapvető sötét illeszkedés */
html[data-theme="dark"] .ui-widget-content {
    background: var(--edit-layout-bg);
    color: var(--body-text);
    border-color: var(--input-border);
}

html[data-theme="dark"] .ui-widget-header {
    background: var(--edit-hover-bg);
    color: var(--body-text);
    border-color: var(--input-border);
}

html[data-theme="dark"] .ui-state-default,
html[data-theme="dark"] .ui-widget-content .ui-state-default {
    background: var(--table-a-bg);
    color: var(--body-text);
    border-color: var(--input-border);
}
