﻿/* ────────────────────────────────────────────────────────
   KöltségKezelő – egyedi téma Bootstrap 5.3-hoz
   ──────────────────────────────────────────────────────── */

/* 1) Alapszínek */
:root {
    --bs-primary: #4f46e5;
    --bs-primary-rgb: 79,70,229;
    --bs-secondary: #0ea5e9;
    --bs-secondary-rgb: 14,165,233;
    --bs-success: #22c55e;
    --bs-info: #06b6d4;
    --bs-warning: #facc15;
    --bs-danger: #ef4444;
    --bs-body-font-family: "Inter","Segoe UI",sans-serif;
    --transition-fast: .15s ease-in-out;
}

/* 2) Tipográfia, háttér */
html {
    font-size: 16px;
    position: relative;
    min-height: 100%
}

body {
    background: #f3f4f6 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' opacity='.03' width='200' height='200' viewBox='0 0 100 100'%3E%3Cdefs%3E%3Cpath id='a' fill='%239ca3af' d='M0 0h50v50H0z'/%3E%3C/defs%3E%3Cg fill='%239ca3af'%3E%3Cuse href='%23a'/%3E%3Cuse href='%23a' x='50'/%3E%3Cuse href='%23a' y='50'/%3E%3Cuse href='%23a' x='50' y='50'/%3E%3C/g%3E%3C/svg%3E");
    background-attachment: fixed;
    line-height: 1.6;
    margin-bottom: 4rem;
    color: #374151;
}

h1, h2, h3, .navbar-brand {
    font-weight: 600
}

/* 3) Navbar üveghatás – világos téma */
.navbar {
    backdrop-filter: blur(6px) saturate(180%);
    background: rgba(255,255,255,.8);
    box-shadow: 0 2px 8px rgba(0,0,0,.05);
}

/* 4) Kártyák */
.card {
    border: none;
    border-radius: 1rem;
    box-shadow: 0 6px 16px rgba(0,0,0,.05);
}

.card-title {
    font-weight: 600;
}

.card-body {
    padding: 1.5rem 2rem;
}

/* 5) Gombok */
.btn-primary {
    background-image: linear-gradient(120deg,var(--bs-primary) 0%,#6366f1 100%);
    border: none;
    box-shadow: 0 3px 6px rgba(var(--bs-primary-rgb),.3);
    transition: var(--transition-fast);
}

    .btn-primary:hover {
        filter: brightness(1.05);
        box-shadow: 0 4px 10px rgba(var(--bs-primary-rgb),.35);
    }

.btn-outline-primary {
    color: var(--bs-primary);
    border-color: var(--bs-primary);
    transition: var(--transition-fast);
}

    .btn-outline-primary:hover {
        background: var(--bs-primary);
        color: #fff
    }

/* 6) Form-elemek */
.form-control, .form-select {
    border-radius: .6rem;
    transition: var(--transition-fast)
}

    .form-control:focus, .form-select:focus {
        border-color: rgba(var(--bs-primary-rgb),.55);
        box-shadow: 0 0 0 .25rem rgba(var(--bs-primary-rgb),.25);
    }

/* 7) Táblázatok */
.table > :not(caption) > * > * {
    padding: .75rem 1rem
}

.table-striped tbody tr:nth-of-type(odd) {
    background: rgba(79,70,229,.04);
}

.table thead th {
    color: #1f2937;
    font-weight: 600
}

.table tbody td {
    color: #374151
}

/* 8) Footer */
footer {
    font-size: .875rem;
    color: #6b7280
}

/* 9) Modal */
.modal-content {
    border-radius: 1rem;
    border: none;
    box-shadow: 0 12px 28px rgba(0,0,0,.15);
}

/* 10) DARK THEME – ha gombbal vagy böngészővel aktiválják */
html[data-bs-theme='dark'] {
    color-scheme: dark;
}

    html[data-bs-theme='dark'] body {
        background-color: #111827;
        color: #e5e7eb;
    }

    html[data-bs-theme='dark'] .navbar {
        background: rgba(17,19,27,.9);
    }

    html[data-bs-theme='dark'] .card {
        background: #1f2937;
    }

    html[data-bs-theme='dark'] .table thead th,
    html[data-bs-theme='dark'] .table tbody td {
        color: #e5e7eb;
    }

    html[data-bs-theme='dark'] .table-striped tbody tr:nth-of-type(odd) {
        background: rgba(79,70,229,.1);
    }

/* 11) Backup – automatikus preferencia */
@media (prefers-color-scheme:dark) {
    :root:not([data-bs-theme]) {
        color-scheme: dark;
    }
}
