:root {
    --font-body: 'Satoshi', 'Segoe UI', sans-serif;
    --color-primary: #01696f;
    --color-primary-dark: #0c4e54;
    --color-bg: #f7f6f2;
    --color-surface: #ffffff;
    --color-text: #28251d;
    --color-text-muted: #6c757d;
    --color-border: #e0ddd8;
    --radius-md: 0.5rem;
    --radius-lg: 0.75rem;
    --shadow-sm: 0 1px 3px rgba(0,0,0,.07);
    --shadow-md: 0 4px 12px rgba(0,0,0,.09);
    --transition: 180ms cubic-bezier(.16,1,.3,1);
}
*, *::before, *::after { box-sizing: border-box; }
body { font-family: var(--font-body); background-color: var(--color-bg); color: var(--color-text); min-height: 100vh; display: flex; flex-direction: column; }
#main-navbar { background: var(--color-primary) !important; box-shadow: var(--shadow-md); padding-top:.6rem; padding-bottom:.6rem; }
#main-navbar .nav-link { color: rgba(255,255,255,.85) !important; transition: color var(--transition); font-size:.9rem; }
#main-navbar .nav-link:hover, #main-navbar .nav-link.active { color:#fff !important; }
#main-navbar .nav-link.active { font-weight:600; }
#main-navbar .navbar-brand { color:#fff !important; font-size:1.1rem; }
.main-content { padding:1.75rem 1.5rem; flex:1; }
.footer { background:#fff; border-top:1px solid var(--color-border); font-size:.82rem; }
.page-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:1.5rem; flex-wrap:wrap; gap:.75rem; }
.page-header h1 { font-size:1.4rem; font-weight:700; margin:0; }
.card { border:1px solid var(--color-border); border-radius:var(--radius-lg); box-shadow:var(--shadow-sm); background:var(--color-surface); transition:box-shadow var(--transition); }
.card:hover { box-shadow:var(--shadow-md); }
.card-header { background:transparent; border-bottom:1px solid var(--color-border); font-weight:600; font-size:.9rem; padding:.85rem 1.1rem; }
.kpi-card { border-radius:var(--radius-lg); padding:1.25rem 1.4rem; box-shadow:var(--shadow-sm); }
.kpi-card .kpi-icon { width:44px; height:44px; border-radius:var(--radius-md); display:flex; align-items:center; justify-content:center; font-size:1.3rem; }
.kpi-card .kpi-value { font-size:1.6rem; font-weight:700; line-height:1.1; font-variant-numeric:tabular-nums; }
.kpi-card .kpi-label { font-size:.8rem; color:var(--color-text-muted); margin-top:.2rem; }
.table-wrapper { overflow-x:auto; }
.table { font-size:.875rem; }
.table thead th { background:#f8f9fa; font-weight:600; font-size:.78rem; text-transform:uppercase; letter-spacing:.04em; border-bottom:2px solid var(--color-border); white-space:nowrap; cursor:pointer; user-select:none; }
.table thead th:hover { background:#eef0f2; }
.table tbody tr { transition:background var(--transition); }
.table tbody tr:hover { background:#f0f9f9; }
.badge-zaplatena { background:#d4efdf; color:#1a6b35; }
.badge-nezaplatena { background:#fef3cd; color:#856404; }
.badge-po_splatnosti { background:#fde8e8; color:#9b1c1c; }
.filters-bar { background:#fff; border:1px solid var(--color-border); border-radius:var(--radius-lg); padding:1rem 1.25rem; margin-bottom:1.25rem; display:flex; flex-wrap:wrap; gap:.75rem; align-items:flex-end; }
.filters-bar .form-label { font-size:.78rem; font-weight:600; text-transform:uppercase; letter-spacing:.04em; color:var(--color-text-muted); margin-bottom:.3rem; }
.filters-bar .form-control, .filters-bar .form-select { font-size:.875rem; border-color:var(--color-border); border-radius:var(--radius-md); }
.filters-bar .form-control:focus, .filters-bar .form-select:focus { border-color:var(--color-primary); box-shadow:0 0 0 3px rgba(1,105,111,.15); }
.btn-primary { background:var(--color-primary); border-color:var(--color-primary); }
.btn-primary:hover { background:var(--color-primary-dark); border-color:var(--color-primary-dark); }
.btn-outline-primary { color:var(--color-primary); border-color:var(--color-primary); }
.btn-outline-primary:hover { background:var(--color-primary); border-color:var(--color-primary); color:#fff; }
.alert { border-radius:var(--radius-md); font-size:.875rem; }
.login-wrapper { min-height:100vh; display:flex; align-items:center; justify-content:center; background:linear-gradient(135deg, var(--color-primary) 0%, #0c4e54 60%, #1a3a3c 100%); }
.login-card { width:100%; max-width:420px; border-radius:1rem; box-shadow:0 20px 60px rgba(0,0,0,.2); overflow:hidden; }
.login-card .login-header { background:var(--color-primary); padding:2rem; text-align:center; color:#fff; }
.login-card .login-header h1 { font-size:1.5rem; font-weight:700; margin:.5rem 0 .25rem; }
.login-card .login-body { padding:2rem; background:#fff; }
.chart-container { position:relative; height:260px; }
.pagination .page-link { color:var(--color-primary); border-color:var(--color-border); font-size:.85rem; }
.pagination .page-item.active .page-link { background:var(--color-primary); border-color:var(--color-primary); }
@media(max-width:768px) {
    .main-content { padding:1rem .75rem; }
    .page-header { flex-direction:column; align-items:flex-start; }
    .kpi-card .kpi-value { font-size:1.3rem; }
    .filters-bar { flex-direction:column; }
    .filters-bar > * { width:100%; }
}

/* ===== ANIMACIE & EFEKTY ===== */

/* Fade-in animácia pre karty */
@keyframes fadeInUp {
    from { opacity: 0; transform: translateY(16px); }
    to   { opacity: 1; transform: translateY(0); }
}
.card { animation: fadeInUp 0.35s ease both; }
.kpi-card { animation: fadeInUp 0.3s ease both; }
.kpi-card:nth-child(2) { animation-delay: .05s; }
.kpi-card:nth-child(3) { animation-delay: .10s; }
.kpi-card:nth-child(4) { animation-delay: .15s; }

/* Hover efekt na KPI kartách */
.kpi-card {
    transition: transform var(--transition), box-shadow var(--transition);
    cursor: default;
}
.kpi-card:hover {
    transform: translateY(-3px);
    box-shadow: var(--shadow-md);
}

/* Hover efekt na riadkoch tabuliek */
.table tbody tr {
    transition: background var(--transition), transform var(--transition);
}

/* Pulse animácia pre nezaplatené badge */
@keyframes pulse-warning {
    0%, 100% { box-shadow: 0 0 0 0 rgba(133, 100, 4, 0.4); }
    50%       { box-shadow: 0 0 0 5px rgba(133, 100, 4, 0); }
}
.badge-nezaplatena {
    animation: pulse-warning 2s ease-in-out infinite;
}

/* Carousel štýly */
.carousel-slide-content { border-radius: var(--radius-lg); }
.carousel-indicators button {
    width: 8px; height: 8px;
    border-radius: var(--radius-full);
    border: none;
    opacity: .5;
}
.carousel-indicators .active { opacity: 1; width: 20px; }

/* Smooth page load */
body { animation: fadeInUp 0.2s ease both; }

/* Navbar link grow efekt */
#main-navbar .nav-link {
    position: relative;
    transition: transform 0.2s cubic-bezier(0.34,1.56,0.64,1), color 0.15s ease !important;
    display: inline-block;
}
#main-navbar .nav-link:hover {
    transform: scale(1.10) translateY(-1px);
}
#main-navbar .nav-link.active {
    transform: scale(1.05);
}

/* Footer logo hover */
.footer-logo-fei, .footer-logo-kps {
    transition: transform var(--transition);
    cursor: default;
}
.footer-logo-fei:hover, .footer-logo-kps:hover {
    transform: translateY(-2px);
}

/* Tlačidlo Zaplatiť pulse */
@keyframes pulse-success {
    0%, 100% { box-shadow: 0 0 0 0 rgba(67,122,34,.35); }
    50%       { box-shadow: 0 0 0 6px rgba(67,122,34,0); }
}
.btn-success { animation: pulse-success 2.5s ease-in-out infinite; }
.btn-success:hover { animation: none; }

/* Responzívne footer logá */
@media (max-width: 576px) {
    .footer-logo-kps .lh-1,
    .footer-logo-fei .lh-1 { display: none; }
}

/* ===== FOOTER HOVER - grow efekt ===== */
.footer-logo-link {
    transition: transform 0.25s cubic-bezier(0.34,1.56,0.64,1), opacity 0.2s ease;
    opacity: 0.85;
}
.footer-logo-link:hover {
    transform: translateY(-4px) scale(1.06);
    opacity: 1;
}
.footer-logo-link img {
    transition: box-shadow 0.25s ease;
}
.footer-logo-link:hover img {
    box-shadow: 0 4px 14px rgba(1,105,111,0.22);
}

/* Oprava pagination - čísla vždy viditeľné */
.pagination .page-link {
    min-width: 36px;
    text-align: center;
    font-weight: 500;
    color: var(--color-primary) !important;
    background: var(--color-surface);
    border-color: var(--color-border);
    transition: all 0.18s ease;
}
.pagination .page-item.active .page-link {
    background: var(--color-primary) !important;
    border-color: var(--color-primary) !important;
    color: #fff !important;
    font-weight: 700;
}
.pagination .page-link:hover {
    background: var(--color-primary-highlight);
    transform: translateY(-1px);
}
.pagination .page-item.disabled .page-link {
    color: var(--color-text-faint) !important;
    pointer-events: none;
}