@charset "UTF-8";
/* ==========================================================================
   theme.css – Light / Dark mód
   A main CSS UTÁN kell betölteni!
   Light = az eredeti oldal, Dark = minden [data-theme="dark"] alatt
   ========================================================================== */

/* ---------- Váltógomb (mindkét témában) ---------- */
#theme-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    padding: 0;
    margin-right: 4px;
    vertical-align: top;
    font-size: 15px;
    line-height: 1;
    color: #fff;
    background: transparent;
    border: 1px solid rgba(255, 255, 255, 0.45);
    border-radius: 50%;
    cursor: pointer;
    transition: background-color .2s, border-color .2s;
}
#theme-toggle:hover { background: rgba(255, 255, 255, 0.15); }

/* görgetés után a fejléc fehér (light módban) */
.background-header #theme-toggle { color: #000; border-color: rgba(0, 0, 0, 0.35); }
.background-header #theme-toggle:hover { background: rgba(0, 0, 0, 0.08); }

/* mobilon a fejléc világos (#f7f7f7) */
@media (max-width: 768px) {
    #theme-toggle { color: #000; border-color: rgba(0, 0, 0, 0.35); }
}

/* ---------- Dark színek ---------- */
[data-theme="dark"] {
    color-scheme: dark;
    --dk-bg: #0d1612;
    --dk-surface: #15231c;
    --dk-surface-2: #1c2f25;
    --dk-border: #2c4538;
    --dk-text: #dde4da;
    --dk-muted: #9db0a2;
    --dk-green: #C5D2C0;
    --dk-yellow: #DEDAB1;
}

/* Alap */
html[data-theme="dark"],
[data-theme="dark"] body {
    background: var(--dk-bg);
    color: var(--dk-text);
}

/* Scrollbar */
[data-theme="dark"] * { scrollbar-color: #3f7a58 var(--dk-bg); }
[data-theme="dark"] *::-webkit-scrollbar-track { background: var(--dk-bg); }
[data-theme="dark"] *::-webkit-scrollbar-thumb { background-color: #3f7a58; border-color: var(--dk-bg); }

/* ---------- Szövegek ---------- */
[data-theme="dark"] .container,
[data-theme="dark"] p { color: var(--dk-text); }

[data-theme="dark"] h1,
[data-theme="dark"] h2,
[data-theme="dark"] h3,
[data-theme="dark"] h4,
[data-theme="dark"] h5,
[data-theme="dark"] h6,
[data-theme="dark"] .section-heading h2,
[data-theme="dark"] .load-heading h2,
[data-theme="dark"] .feature-item .feature-content h4,
[data-theme="dark"] .tabs-content h4 { color: var(--dk-green); }

[data-theme="dark"] .section-heading h2 em,
[data-theme="dark"] .load-heading h2 em { color: var(--dk-yellow); }

[data-theme="dark"] .tabs-content p { color: var(--dk-text); }
[data-theme="dark"] .feature-item .feature-content a.text-button { color: var(--dk-muted); }

/* ami eredetileg is fehér volt sötét háttéren, maradjon az */
[data-theme="dark"] .cta-content h2,
[data-theme="dark"] .cta-content p,
[data-theme="dark"] .dark-bg h2,

[data-theme="dark"] a,

[data-theme="dark"] .dark-bg p { color: #fff; }

/* Linkek (a gombok, menük, dropdownok saját színe megmarad) */
[data-theme="dark"] a:where(:not(.btn, .dropdown-item, .page-link, .nav-link, .cookie-button)) {
    color: var(--dk-green);
}
[data-theme="dark"] a:where(:not(.btn, .dropdown-item, .page-link, .nav-link, .cookie-button)):hover {
    color: #fff;
}

/* ---------- Fejléc (görgetés után: .background-header) ---------- */
[data-theme="dark"] .background-header {
    background: rgba(10, 20, 16, 0.97) !important;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.6) !important;
}
[data-theme="dark"] .background-header .logo,
[data-theme="dark"] .background-header .main-nav .nav li a { color: #e6ede3 !important; }

/* világos almenü → sötét */
[data-theme="dark"] .background-header .MainSubmenu {
    background: rgba(21, 35, 28, 0.97);
    border-color: var(--dk-border) !important;
}
[data-theme="dark"] .background-header .MainSubmenu li a { color: #e6ede3 !important; }
[data-theme="dark"] .background-header .MainSubmenu li a:hover {
    background: linear-gradient(120deg, transparent, rgba(146, 248, 163, 0.25), transparent) !important;
    border-bottom-color: #4b7a5e !important;
}

/* ---------- Tabok ---------- */
[data-theme="dark"] #tabs ul li a {
    background: var(--dk-surface);
    color: var(--dk-text);
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.5);
}
[data-theme="dark"] #tabs ul .ui-tabs-active a {
    background: #0C3222;
    color: #fff;
}

/* ---------- Kapcsolat űrlap ---------- */
[data-theme="dark"] #contact-us .contact-form #contact { background: var(--dk-surface); }
[data-theme="dark"] .contact-form input,
[data-theme="dark"] .contact-form textarea {
    background: var(--dk-surface-2);
    color: var(--dk-text);
    border-color: var(--dk-border);
}
[data-theme="dark"] .contact-form button:hover { background-color: #0C3222; color: #fff; }

/* ---------- Lábléc ---------- */
[data-theme="dark"] footer {
    background-color: rgba(255, 255, 255, 0.04) !important;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.5) !important;
}
[data-theme="dark"] footer p { color: var(--dk-muted); }
[data-theme="dark"] .footer_links { background-color: rgba(255, 255, 255, 0.06) !important; }
[data-theme="dark"] #impessum {
    background: #13221b;
    border-top-color: var(--dk-border);
    color: var(--dk-green);
}
[data-theme="dark"] #impessum p { color: var(--dk-green); }

/* ---------- Saját háttér osztályok ---------- */
[data-theme="dark"] .bg-lg,
[data-theme="dark"] .bg-light-grey { background-color: var(--dk-surface-2); color: var(--dk-text); }
[data-theme="dark"] .bg-yellow { background-color: rgba(222, 218, 177, 0.08); }
[data-theme="dark"] .news_button {
    background-color: var(--dk-surface-2);
    border-color: var(--dk-border);
    color: var(--dk-text);
}
[data-theme="dark"] .ShadowImage { border-color: var(--dk-border); box-shadow: 0 0 5px #000; }

/* ---------- Bootstrap elemek ---------- */
[data-theme="dark"] .bg-light,
[data-theme="dark"] .bg-white { background-color: var(--dk-surface) !important; }
[data-theme="dark"] .text-dark { color: var(--dk-text) !important; }
[data-theme="dark"] .text-muted { color: var(--dk-muted) !important; }
[data-theme="dark"] .border,
[data-theme="dark"] .border-top,
[data-theme="dark"] .border-bottom { border-color: var(--dk-border) !important; }
[data-theme="dark"] hr { border-top-color: var(--dk-border); }

[data-theme="dark"] .card,
[data-theme="dark"] .modal-content,
[data-theme="dark"] .dropdown-menu,
[data-theme="dark"] .list-group-item,
[data-theme="dark"] .popover {
    background-color: var(--dk-surface);
    border-color: var(--dk-border);
    color: var(--dk-text);
}
[data-theme="dark"] .popover-body,
[data-theme="dark"] .popover-header { color: var(--dk-text); background-color: var(--dk-surface-2); }
[data-theme="dark"] .card-header,
[data-theme="dark"] .card-footer,
[data-theme="dark"] .modal-header,
[data-theme="dark"] .modal-footer { background-color: var(--dk-surface-2); border-color: var(--dk-border); }
[data-theme="dark"] .dropdown-item { color: var(--dk-text); }
[data-theme="dark"] .dropdown-item:hover { background-color: var(--dk-surface-2); color: #fff; }
[data-theme="dark"] .close { color: var(--dk-text); text-shadow: none; }

[data-theme="dark"] .form-control,
[data-theme="dark"] .custom-select,
[data-theme="dark"] .input-group-text {
    background-color: var(--dk-surface-2);
    border-color: var(--dk-border);
    color: var(--dk-text);
}
[data-theme="dark"] .form-control:focus { background-color: var(--dk-surface-2); color: var(--dk-text); }

[data-theme="dark"] .table { color: var(--dk-text); }
[data-theme="dark"] .table th,
[data-theme="dark"] .table td,
[data-theme="dark"] .table thead th { border-color: var(--dk-border); }
[data-theme="dark"] .table-striped tbody tr:nth-of-type(odd) { background-color: rgba(255, 255, 255, 0.04); }
[data-theme="dark"] .table-hover tbody tr:hover { color: var(--dk-text); background-color: rgba(255, 255, 255, 0.08); }

[data-theme="dark"] .btn-light { background-color: var(--dk-surface-2); border-color: var(--dk-border); color: var(--dk-text); }
[data-theme="dark"] .btn-outline-dark { color: var(--dk-text); border-color: var(--dk-muted); }
[data-theme="dark"] .btn-outline-dark:hover { background-color: var(--dk-text); color: var(--dk-bg); }
[data-theme="dark"] .page-link { background-color: var(--dk-surface); border-color: var(--dk-border); color: var(--dk-green); }
[data-theme="dark"] .page-item.disabled .page-link { background-color: var(--dk-surface); color: var(--dk-muted); }
[data-theme="dark"] .breadcrumb { background-color: var(--dk-surface-2); }

/* ---------- Mobil menü (≤ 768px): eredetileg fehér, !important-tal ---------- */
@media (max-width: 992px) {
    [data-theme="dark"] .header-area .main-nav .nav .dropdown-menu {
        background: var(--dk-surface) !important;
        color: var(--dk-text) !important;
    }
}

@media (max-width: 768px) {
    [data-theme="dark"] #theme-toggle { color: #fff; border-color: rgba(255, 255, 255, 0.4); }

    [data-theme="dark"] .header-area { background-color: var(--dk-bg); }
    [data-theme="dark"] .header-area .main-nav .logo { color: var(--dk-text); }

    [data-theme="dark"] .header-area .main-nav .nav li {
        background: var(--dk-surface);
        border-bottom-color: var(--dk-border);
    }
    [data-theme="dark"] .header-area .main-nav .nav li a {
        background: var(--dk-surface) !important;
        color: var(--dk-text) !important;
    }
    [data-theme="dark"] .header-area .main-nav .nav li a:hover,
    [data-theme="dark"] .header-area.header-sticky .nav li a:hover,
    [data-theme="dark"] .header-area.header-sticky .nav li a.active {
        background: var(--dk-surface-2) !important;
        color: #fff !important;
    }

    /* hamburger ikon */
    [data-theme="dark"] .header-area .main-nav .menu-trigger span,
    [data-theme="dark"] .header-area .main-nav .menu-trigger span:before,
    [data-theme="dark"] .header-area .main-nav .menu-trigger span:after { background-color: var(--dk-text); }

    [data-theme="dark"] .header-area .main-nav .menu-trigger.active span { background-color: transparent; }
    [data-theme="dark"] .header-area .main-nav .menu-trigger.active span:before,
    [data-theme="dark"] .header-area .main-nav .menu-trigger.active span:after { background-color: var(--dk-text); }
}