@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800&display=swap');

:root {
    --bs-primary: #7aa23f;
    --bs-primary-rgb: 122, 162, 63;
    --bs-secondary: #6e7c72;
    --bs-secondary-rgb: 110, 124, 114;
    --bs-success: #70b77e;
    --bs-success-rgb: 112, 183, 126;
    --bs-info: #8cbf8c;
    --bs-info-rgb: 140, 191, 140;
    --bs-warning: #f0d992;
    --bs-warning-rgb: 240, 217, 146;
    --bs-danger: #d96c6c;
    --bs-danger-rgb: 217, 108, 108;
    --bs-light: #f7f6ef;
    --bs-light-rgb: 247, 246, 239;
    --bs-dark: #273126;
    --bs-dark-rgb: 39, 49, 38;
    --bs-border-color: rgba(130, 152, 131, 0.18);
    --bs-body-color: #33413a;
    --bs-body-bg: #f5f3ea;
    --bs-body-font-family: 'Outfit', system-ui, -apple-system, sans-serif;
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: var(--bs-body-font-family);
    color: var(--bs-body-color);
    background:
        radial-gradient(circle at top left, rgba(209, 228, 183, 0.6), transparent 28%),
        radial-gradient(circle at top right, rgba(255, 244, 210, 0.7), transparent 24%),
        linear-gradient(180deg, #fbfaf4 0%, #f3f0e5 100%);
    min-height: 100vh;
}

a {
    color: #6b9342;
}

a:hover {
    color: #587a36;
}

.navbar {
    background: rgba(255, 255, 255, 0.72) !important;
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    border: 1px solid rgba(255, 255, 255, 0.7);
    box-shadow: 0 12px 30px rgba(90, 114, 76, 0.08) !important;
}

.navbar .navbar-brand,
.navbar .nav-link,
.navbar .btn-outline-light {
    color: #2e3a2f !important;
}

.navbar .btn-outline-light {
    border-color: rgba(122, 162, 63, 0.28) !important;
    background: rgba(244, 249, 236, 0.9);
}

.card,
.modal-content,
.dropdown-menu,
.toast,
.list-group-item,
.accordion-item {
    border: 1px solid rgba(130, 152, 131, 0.14) !important;
    border-radius: 24px !important;
    background: rgba(255, 255, 255, 0.82) !important;
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    box-shadow: 0 18px 40px rgba(91, 108, 83, 0.08) !important;
}

.card-header,
.card-footer,
.modal-header,
.modal-footer {
    background: transparent !important;
    border-color: rgba(130, 152, 131, 0.14) !important;
}

.product-card,
.card-stat,
.table,
.btn,
.form-control,
.form-select,
.input-group-text,
.badge,
.alert {
    transition: all 0.25s ease;
}

.product-card:hover,
.card:hover {
    transform: translateY(-4px);
    box-shadow: 0 22px 45px rgba(91, 108, 83, 0.12) !important;
}

.btn {
    border-radius: 14px;
    font-weight: 600;
    letter-spacing: 0.2px;
    padding-top: 0.62rem;
    padding-bottom: 0.62rem;
    border: 1px solid transparent !important;
}

.btn-primary,
.bg-primary {
    background: linear-gradient(135deg, #90b85d 0%, #6f9641 100%) !important;
    color: #fff !important;
}

.btn-primary {
    box-shadow: 0 12px 24px rgba(122, 162, 63, 0.24) !important;
}

.btn-primary:hover,
.btn-primary:focus {
    background: linear-gradient(135deg, #7fa94a 0%, #5d8133 100%) !important;
    transform: translateY(-2px);
    box-shadow: 0 16px 28px rgba(122, 162, 63, 0.3) !important;
}

.btn-info,
.bg-info {
    background: linear-gradient(135deg, #98c7a7 0%, #7bb091 100%) !important;
    color: #fff !important;
}

.btn-success,
.bg-success {
    background: linear-gradient(135deg, #89c485 0%, #62a96c 100%) !important;
    color: #fff !important;
}

.btn-warning,
.bg-warning {
    background: linear-gradient(135deg, #f3dfa3 0%, #dfc26d 100%) !important;
    color: #5a4820 !important;
}

.btn-secondary,
.bg-secondary {
    background: linear-gradient(135deg, #94a195 0%, #6f7b70 100%) !important;
    color: #fff !important;
}

.btn-dark,
.bg-dark {
    background: linear-gradient(135deg, #405042 0%, #273126 100%) !important;
    color: #fff !important;
}

.btn-outline-primary {
    color: #6f9641 !important;
    border-color: rgba(122, 162, 63, 0.4) !important;
    background: rgba(246, 250, 238, 0.8) !important;
}

.btn-outline-primary:hover,
.btn-outline-primary:focus {
    color: #fff !important;
    background: linear-gradient(135deg, #90b85d 0%, #6f9641 100%) !important;
    border-color: transparent !important;
}

.btn-light {
    background: rgba(255, 255, 255, 0.86) !important;
    color: #314033 !important;
    border-color: rgba(130, 152, 131, 0.16) !important;
}

.sidebar {
    background:
        linear-gradient(180deg, rgba(47, 63, 43, 0.97) 0%, rgba(35, 48, 33, 0.98) 100%) !important;
    border-right: 1px solid rgba(177, 205, 145, 0.15);
    box-shadow: 18px 0 40px rgba(31, 42, 32, 0.12);
}

.sidebar .bg-primary {
    background: linear-gradient(135deg, #8cb35b 0%, #66893c 100%) !important;
}

.sidebar a {
    color: rgba(242, 247, 236, 0.82) !important;
    font-weight: 500;
    border-radius: 16px;
    margin: 0 12px 8px;
    padding: 13px 16px !important;
}

.sidebar a:hover,
.sidebar a.active {
    color: #fff !important;
    background: linear-gradient(135deg, rgba(154, 197, 95, 0.26) 0%, rgba(124, 169, 69, 0.48) 100%) !important;
    box-shadow: inset 0 0 0 1px rgba(203, 224, 175, 0.12);
}

.table {
    --bs-table-bg: transparent;
    --bs-table-striped-bg: rgba(244, 248, 237, 0.7);
    --bs-table-hover-bg: rgba(236, 243, 225, 0.9);
    color: #33413a;
}

.table thead,
.table-light,
thead.table-light {
    background: rgba(244, 248, 237, 0.92) !important;
}

.table > :not(caption) > * > * {
    border-bottom-color: rgba(130, 152, 131, 0.14);
    padding-top: 0.9rem;
    padding-bottom: 0.9rem;
}

.form-control,
.form-select,
.input-group-text {
    border-radius: 14px !important;
    border: 1px solid rgba(130, 152, 131, 0.18) !important;
    background: rgba(255, 255, 255, 0.88) !important;
    color: #33413a !important;
    min-height: 46px;
}

.form-control:focus,
.form-select:focus {
    border-color: rgba(122, 162, 63, 0.38) !important;
    box-shadow: 0 0 0 0.25rem rgba(122, 162, 63, 0.12) !important;
}

.input-group > .btn,
.input-group > .form-control,
.input-group > .form-select,
.input-group > .input-group-text {
    margin: 0;
}

.badge {
    border-radius: 999px;
    padding: 0.5em 0.8em;
    font-weight: 600;
}

.badge.bg-danger {
    background: linear-gradient(135deg, #de8383 0%, #c86161 100%) !important;
    box-shadow: 0 8px 18px rgba(201, 97, 97, 0.22);
}

.badge.bg-success {
    background: linear-gradient(135deg, #89c485 0%, #62a96c 100%) !important;
}

.badge.bg-warning {
    color: #5a4820 !important;
}

.alert {
    border: 1px solid rgba(130, 152, 131, 0.15);
    border-radius: 20px;
}

.modal-content {
    overflow: hidden;
}

.dropdown-item {
    border-radius: 12px;
    color: #33413a;
}

.dropdown-item:hover {
    background: rgba(239, 245, 229, 0.9);
}

.text-primary {
    color: #6f9641 !important;
}

.text-success {
    color: #5d8f58 !important;
}

.text-muted,
.text-secondary {
    color: #738075 !important;
}

.border,
.border-top,
.border-bottom,
.border-start,
.border-end {
    border-color: rgba(130, 152, 131, 0.16) !important;
}

@media (max-width: 768px) {
    .card,
    .modal-content,
    .dropdown-menu {
        border-radius: 18px !important;
    }
}
