:root {
    --viva-acid: #d9ff3f;
    --viva-acid-deep: #b9dd24;
    --viva-forest: #174e39;
    --viva-forest-deep: #0c3123;
    --viva-ink: #18221e;
    --viva-muted: #66726c;
    --viva-paper: #f6f4ec;
    --viva-surface: rgba(255, 255, 255, .88);
    --viva-line: rgba(24, 34, 30, .13);
    --viva-danger: #d95549;
    --viva-warning: #c47720;
    --viva-success: #188a58;
    --viva-radius-sm: 11px;
    --viva-radius: 17px;
    --viva-radius-lg: 24px;
    --viva-shadow: 0 12px 32px rgba(24, 34, 30, .07);
    --primary-color: var(--viva-forest);
    --primary-hover: var(--viva-forest-deep);
    --secondary-color: var(--viva-muted);
    --bg-color: var(--viva-paper);
    --card-bg: var(--viva-surface);
    --text-color: var(--viva-ink);
    --sidebar-bg: #10271f;
    --sidebar-text: #9aafa5;
    --sidebar-text-hover: #f8fff9;
    --sidebar-active-bg: rgba(217, 255, 63, .12);
    --sidebar-active-text: #edff9e;
    --sidebar-active-icon: var(--viva-acid);
}

html { background: var(--viva-paper); }

body.viva-app {
    font-family: 'Manrope', system-ui, sans-serif;
    color: var(--viva-ink);
    background:
        radial-gradient(circle at 96% 3%, rgba(217, 255, 63, .18), transparent 24rem),
        linear-gradient(120deg, rgba(23, 78, 57, .025) 1px, transparent 1px),
        var(--viva-paper);
    background-size: auto, 34px 34px, auto;
}

body.viva-app h1,
body.viva-app h2,
body.viva-app .display-heading {
    font-family: 'Unbounded', 'Manrope', sans-serif;
    letter-spacing: -.045em;
}

body.viva-app .sidebar {
    border-right: 1px solid rgba(217, 255, 63, .08);
    background:
        radial-gradient(circle at 20% -5%, rgba(217, 255, 63, .10), transparent 12rem),
        var(--sidebar-bg);
}

body.viva-app .sidebar-header { height: 72px; }

body.viva-app .sidebar-logo-icon,
body.viva-app .mobile-logo-mark {
    position: relative;
    display: inline-grid;
    place-items: center;
    width: 34px;
    height: 34px;
    border-radius: 10px;
    color: #fff;
    background: var(--viva-forest);
    box-shadow: 0 7px 20px rgba(0, 0, 0, .22);
    font-weight: 900;
}

body.viva-app .sidebar-logo-icon::after,
body.viva-app .mobile-logo-mark::after {
    content: '';
    position: absolute;
    top: -2px;
    right: -2px;
    width: 10px;
    height: 10px;
    border: 2px solid #10271f;
    border-radius: 50%;
    background: var(--viva-acid);
}

body.viva-app .sidebar-logo-text {
    font-family: 'Unbounded', sans-serif;
    font-size: .9rem;
    letter-spacing: .14em;
}

body.viva-app .sidebar-menu li a { border-radius: 10px; }
body.viva-app .sidebar-menu li a.active { box-shadow: inset 2px 0 var(--viva-acid); }
body.viva-app .sidebar-section-label { color: #577268; }

body.viva-app .main-content {
    max-width: 1900px;
    padding: 28px 30px 48px;
}

body.viva-app .mobile-header {
    min-height: 60px;
    color: var(--viva-ink);
    border-color: var(--viva-line);
    background: rgba(246, 244, 236, .9);
    box-shadow: none;
    backdrop-filter: blur(14px);
}

body.viva-app .card,
body.viva-app .modal-content {
    border: 1px solid var(--viva-line);
    border-radius: var(--viva-radius);
    background: var(--viva-surface);
    box-shadow: var(--viva-shadow);
}

body.viva-app .card-header,
body.viva-app .modal-header,
body.viva-app .modal-footer {
    border-color: var(--viva-line);
    background: transparent !important;
}

body.viva-app .btn {
    border-radius: 10px;
    font-weight: 700;
    transition: transform .16s ease, box-shadow .16s ease, background .16s ease;
}

body.viva-app .btn:hover { transform: translateY(-1px); }

body.viva-app .btn-primary,
body.viva-app .btn-outline-primary.active,
body.viva-app .btn-outline-primary:hover {
    color: #fff;
    border-color: var(--viva-forest);
    background: var(--viva-forest);
    box-shadow: 0 7px 16px rgba(23, 78, 57, .18);
}

body.viva-app .btn-outline-primary { color: var(--viva-forest); border-color: rgba(23, 78, 57, .38); }
body.viva-app .text-primary { color: var(--viva-forest) !important; }
body.viva-app .bg-primary { background-color: var(--viva-forest) !important; }
body.viva-app .border-primary { border-color: var(--viva-forest) !important; }

body.viva-app .form-control,
body.viva-app .form-select,
body.viva-app .select2-container--bootstrap-5 .select2-selection {
    min-height: 40px;
    color: var(--viva-ink);
    border: 1px solid var(--viva-line);
    border-radius: 11px;
    background-color: rgba(255, 255, 255, .78);
    box-shadow: none;
}

body.viva-app .form-control:focus,
body.viva-app .form-select:focus {
    border-color: var(--viva-forest);
    box-shadow: 0 0 0 3px rgba(217, 255, 63, .42);
}

body.viva-app .form-switch .form-check-input:checked {
    border-color: var(--viva-forest);
    background-color: var(--viva-forest);
}

body.viva-app .table { color: var(--viva-ink); }
body.viva-app .table > :not(caption) > * > * { border-color: var(--viva-line); }
body.viva-app .table thead th { color: #617069; background: rgba(23, 78, 57, .035); }
body.viva-app .table-hover > tbody > tr:hover > * { background: rgba(217, 255, 63, .07); }

body.viva-app .badge.bg-success,
body.viva-app .status-success { color: #0f5132 !important; background-color: #d9f3e5 !important; }
body.viva-app .badge.bg-warning,
body.viva-app .status-warning { color: #7a4615 !important; background-color: #fbedd7 !important; }
body.viva-app .badge.bg-danger,
body.viva-app .status-error { color: #842029 !important; background-color: #f8d7da !important; }

@media (max-width: 1024px) {
    body.viva-app .main-content { padding: 22px 20px 38px; }
}

@media (max-width: 768px) {
    body.viva-app .main-content { width: 100%; padding: 16px 12px 32px; }
    body.viva-app .sidebar-header { height: 60px; }
    body.viva-app .card { border-radius: 15px; }
    body.viva-app .btn { min-height: 40px; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}