html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
  position: relative;
  min-height: 100%;
}

body {
  margin-bottom: 60px;
}

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
  color: var(--bs-secondary-color);
  text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
  text-align: start;
}


/* -------- THEME: Dark Mode -------- */
:root {
    --sm-bg: #ffffff;
    --sm-text: #111111;
    --sm-card: #ffffff;
    --sm-border: #e5e7eb;
    --sm-muted: #6b7280;
}

html[data-theme="dark"] {
    --sm-bg: #0b0f19;
    --sm-text: #e5e7eb;
    --sm-card: #111827;
    --sm-border: #1f2937;
    --sm-muted: #9ca3af;
}

body {
    background: var(--sm-bg);
    color: var(--sm-text);
}

/* Kártyák, táblák, panelek */
.card, .table, .dropdown-menu, .modal-content, .list-group-item {
    background: var(--sm-card);
    color: var(--sm-text);
    border-color: var(--sm-border);
}

/* Muted szövegek */
.text-muted {
    color: var(--sm-muted) !important;
}

/* Navbar */
.navbar, .navbar .dropdown-menu {
    background: var(--sm-card) !important;
    border-color: var(--sm-border) !important;
}

    .navbar .nav-link, .navbar-brand {
        color: var(--sm-text) !important;
    }

/* Táblázat csíkok sötétben */
html[data-theme="dark"] .table {
    color: var(--sm-text);
}

html[data-theme="dark"] .table-striped > tbody > tr:nth-of-type(odd) > * {
    color: var(--sm-text);
}

/* Inputok */
.form-control, .form-select {
    background: var(--sm-card);
    color: var(--sm-text);
    border-color: var(--sm-border);
}

    .form-control::placeholder {
        color: var(--sm-muted);
    }

/* =========================
   DARK MODE FIXES
   (html[data-bs-theme="dark"])
   ========================= */
html[data-bs-theme="dark"] body {
    background-color: #0b1220;
    color: #e8eefc;
}

/* Navbar */
html[data-bs-theme="dark"] .navbar {
    background-color: #0f1a2b !important;
    border-color: rgba(255,255,255,.08) !important;
}

    html[data-bs-theme="dark"] .navbar .navbar-brand,
    html[data-bs-theme="dark"] .navbar .nav-link,
    html[data-bs-theme="dark"] .navbar .btn-link {
        color: #e8eefc !important;
    }

/* Cards / Panels */
html[data-bs-theme="dark"] .card,
html[data-bs-theme="dark"] .container .bg-white {
    background-color: #0f1a2b !important;
    color: #e8eefc !important;
    border-color: rgba(255,255,255,.08) !important;
}

/* TABLES (Audit log + Users) */
html[data-bs-theme="dark"] .table {
    --bs-table-bg: #0f1a2b;
    --bs-table-color: #e8eefc;
    --bs-table-border-color: rgba(255,255,255,.10);
    --bs-table-striped-bg: rgba(255,255,255,.04);
    --bs-table-striped-color: #e8eefc;
    --bs-table-hover-bg: rgba(255,255,255,.06);
    --bs-table-hover-color: #e8eefc;
}

    html[data-bs-theme="dark"] .table th,
    html[data-bs-theme="dark"] .table td {
        color: #e8eefc !important;
        border-color: rgba(255,255,255,.10) !important;
    }

/* Inputs (search mezők) */
html[data-bs-theme="dark"] .form-control,
html[data-bs-theme="dark"] .form-select {
    background-color: #0b1220 !important;
    color: #e8eefc !important;
    border-color: rgba(255,255,255,.12) !important;
}

    html[data-bs-theme="dark"] .form-control::placeholder {
        color: rgba(232,238,252,.55) !important;
    }

/* Accordion / Module header (a “fehér” modul csíkok miatt) */
html[data-bs-theme="dark"] .accordion-item,
html[data-bs-theme="dark"] .accordion-button {
    background-color: #0f1a2b !important;
    color: #e8eefc !important;
    border-color: rgba(255,255,255,.10) !important;
}

    html[data-bs-theme="dark"] .accordion-button:not(.collapsed) {
        background-color: #12223a !important;
        color: #e8eefc !important;
    }

/* Progress bar környezet */
html[data-bs-theme="dark"] .progress {
    background-color: rgba(255,255,255,.10) !important;
}

/* "fehér doboz" jellegű blokkok általánosan */
html[data-bs-theme="dark"] .bg-light,
html[data-bs-theme="dark"] .bg-white {
    background-color: #0f1a2b !important;
    color: #e8eefc !important;
}


/* =========================
   DARK MODE - TABLE FIXES
   ========================= */

:root[data-theme="dark"] .table {
    /* Bootstrap table CSS vars */
    --bs-table-color: #e8eef7;
    --bs-table-bg: transparent;
    --bs-table-border-color: rgba(255,255,255,0.10);
    --bs-table-striped-color: #e8eef7;
    --bs-table-striped-bg: rgba(255,255,255,0.03);
    --bs-table-hover-color: #e8eef7;
    --bs-table-hover-bg: rgba(255,255,255,0.05);
    color: var(--bs-table-color);
}

    :root[data-theme="dark"] .table thead th,
    :root[data-theme="dark"] .table thead td,
    :root[data-theme="dark"] .table thead tr {
        background-color: rgba(255,255,255,0.06) !important;
        color: #ffffff !important;
        border-color: rgba(255,255,255,0.12) !important;
    }

/* Ha véletlenül table-light / bg-white / text-dark maradt a fejlécen */
:root[data-theme="dark"] .table-light,
:root[data-theme="dark"] .bg-white {
    background-color: rgba(255,255,255,0.06) !important;
}

:root[data-theme="dark"] .text-dark {
    color: #e8eef7 !important;
}

/* Inputs/Selects a táblákban (Admin: role dropdown, stb.) */
:root[data-theme="dark"] .table select,
:root[data-theme="dark"] .table input,
:root[data-theme="dark"] .table textarea {
    background-color: rgba(255,255,255,0.05) !important;
    color: #e8eef7 !important;
    border-color: rgba(255,255,255,0.15) !important;
}

/* placeholder */
:root[data-theme="dark"] ::placeholder {
    color: rgba(232,238,247,0.55);
}

/* Alap: legyen látható light módban */
[data-bs-theme="light"] .back-btn {
    color: #0d6efd;
    border-color: #0d6efd;
}

/* Dark módban meg lehet maradni világosnak */
[data-bs-theme="dark"] .back-btn {
    color: #f8f9fa;
    border-color: #f8f9fa;
}

.blog-content {
    white-space: pre-wrap; /* a \n sortöréseket megjeleníti */
}

/* Theme-aware "surface" (kártya/panel háttér) */
.blog-surface,
.admin-surface {
    background: var(--bs-body-bg);
    color: var(--bs-body-color);
    border-radius: 14px;
}

/* Egy picit "kártyásabb" felület a listákon (különösen blog kártyák) */
.blog-card {
    background: var(--bs-tertiary-bg);
}

/* Blog tartalom: sortörések és behúzások kezelése (ha sima szöveg is van benne) */
.blog-content {
    white-space: pre-line; /* ENTER-ek látszódjanak */
}

/* ADMIN: inputok/textarea ne legyenek mindig feketék */
.admin-surface .form-control,
.admin-surface textarea,
.admin-surface input {
    background-color: var(--bs-body-bg);
    color: var(--bs-body-color);
    border-color: var(--bs-border-color);
}

/* ADMIN: táblázat is váltson témával */
.admin-table {
    background: var(--bs-body-bg);
    color: var(--bs-body-color);
}

    .admin-table th,
    .admin-table td {
        border-color: var(--bs-border-color);
    }

/* BlogAdmin table header - theme aware */
.admin-thead {
    background: var(--bs-tertiary-bg);
    color: var(--bs-body-color);
}

/* Táblázat keretek, hogy ne legyen "szénfekete" világos módban */
.table td, .table th {
    border-color: var(--bs-border-color);
}

/* ============ THEME TOKENS (light/dark) ============ */
html[data-bs-theme="light"] {
    --sm-bg: #ffffff;
    --sm-surface: #ffffff;
    --sm-surface-2: #f6f7f9;
    --sm-text: #111111;
    --sm-muted: #6c757d;
    --sm-border: rgba(0,0,0,.10);
    --sm-input-bg: #ffffff;
    --sm-input-text: #111111;
    --sm-input-border: rgba(0,0,0,.15);
}

html[data-bs-theme="dark"] {
    --sm-bg: #0f1115;
    --sm-surface: #171a21;
    --sm-surface-2: #1f2430;
    --sm-text: #f3f5f7;
    --sm-muted: rgba(255,255,255,.65);
    --sm-border: rgba(255,255,255,.12);
    --sm-input-bg: #0f1115;
    --sm-input-text: #f3f5f7;
    --sm-input-border: rgba(255,255,255,.16);
}

/* ============ GENERIC SURFACE (cards/blocks) ============ */
.sm-surface {
    background: var(--sm-surface);
    color: var(--sm-text);
    border: 1px solid var(--sm-border);
    border-radius: 14px;
}

.sm-surface-soft {
    background: var(--sm-surface-2);
    color: var(--sm-text);
    border: 1px solid var(--sm-border);
    border-radius: 14px;
}

/* ============ FORM CONTROLS ============ */
.sm-input.form-control,
.sm-input.form-select,
.sm-input.form-control:focus,
.sm-input.form-select:focus,
.sm-input textarea {
    background: var(--sm-input-bg) !important;
    color: var(--sm-input-text) !important;
    border-color: var(--sm-input-border) !important;
}

    .sm-input.form-control::placeholder,
    .sm-input textarea::placeholder {
        color: var(--sm-muted);
    }

/* Checkbox / switch környék (ha kell) */
.sm-input.form-check-input {
    border-color: var(--sm-input-border);
}

/* ============ TABLE ============ */
.sm-table {
    background: var(--sm-surface);
    color: var(--sm-text);
    border-color: var(--sm-border);
}

    .sm-table thead th {
        color: var(--sm-text);
        background: transparent;
        border-color: var(--sm-border);
    }

    .sm-table td, .sm-table th {
        border-color: var(--sm-border);
    }

/* segéd: muted szöveg */
.sm-muted {
    color: var(--sm-muted) !important;
}

.sm-editor-toolbar {
    padding: 8px;
    border-radius: 10px;
    background: rgba(0,0,0,.04);
}

[data-bs-theme="dark"] .sm-editor-toolbar {
    background: rgba(255,255,255,.06);
}
.blog-content img.blog-img {
    max-width: 100%;
    height: auto;
    border-radius: 12px;
    display: block;
    margin: 12px 0;
}

    .blog-content img.blog-img.tall {
        max-height: 650px;
        object-fit: contain;
    }

/* Home hero - clean version */
.sm-hero-wrap {
    max-width: 1100px;
    margin: 0 auto;
}

.sm-hero-image {
    height: 260px;
    border-radius: 18px;
    background: center / cover no-repeat;
    box-shadow: 0 10px 30px rgba(0,0,0,.18);
}

/* a szöveg már nem a képen van */
.sm-hero-text {
    margin-top: 14px;
    padding: 18px 18px;
    border-radius: 14px;
    background: rgba(0,0,0,.03);
    border: 1px solid rgba(0,0,0,.06);
}

/* sötét módban is legyen oké */
html[data-bs-theme="dark"] .sm-hero-text {
    background: rgba(255,255,255,.05);
    border: 1px solid rgba(255,255,255,.08);
}

@media (max-width: 768px) {
    .sm-hero-image {
        height: 210px;
    }
}
.sm-hero-split {
    max-width: 1100px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1.1fr 1.4fr;
    gap: 16px;
    align-items: stretch;
}

.sm-hero-copy {
    padding: 24px;
    border-radius: 18px;
    background: rgba(0,0,0,.03);
    border: 1px solid rgba(0,0,0,.06);
}

html[data-bs-theme="dark"] .sm-hero-copy {
    background: rgba(255,255,255,.05);
    border: 1px solid rgba(255,255,255,.08);
}

.sm-hero-pic {
    min-height: 260px;
    border-radius: 18px;
    background: center / cover no-repeat;
    box-shadow: 0 10px 30px rgba(0,0,0,.18);
}

@media (max-width: 900px) {
    .sm-hero-split {
        grid-template-columns: 1fr;
    }
}

/* ===== Global background ===== */
.app-bg {
    min-height: 100vh;
    background: 
        linear-gradient( 
            rgba(5, 10, 20, 0.85), 
            rgba(5, 10, 20, 0.85) ), 
    url('/images/auth-bg.jpg') center center / cover no-repeat fixed;
}