:root {
    /* Brand Queen Kost */

    --green-dark: #14532d;
    --green-main: #1f7a42;
    --green-light: #43a047;
    --green-soft: #6fcf97;

    --gold: #d4a017;
    --gold-light: #f5c542;

    --white: #ffffff;
    --gray: #f8f9fa;
    --text: #2d3748;

    /* Bootstrap */

    --bs-primary: var(--green-main);
    --bs-primary-rgb: 31, 122, 66;
}
html,
body {
    height: 100%;
    font-size: 14px;
}

body {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

.main-wrapper {
    flex: 1;
}

/* ================= HEADER ================= */
.navbar-sipojak {
    background: linear-gradient(90deg, #0f4420, #175b2c, #2d8c54);

    padding: 10px 0;

    box-shadow: 0 4px 18px rgba(0, 0, 0, 0.15);

    border-bottom: 2px solid rgba(212, 160, 23, 0.25);
}

/* ================= BRAND ================= */
.navbar-sipojak .navbar-brand img {
    height: 45px;
}

/* ================= MENU LINK ================= */
.navbar-sipojak .nav-link {
    color: rgba(255, 255, 255, 0.92);

    border-radius: 10px;

    transition: 0.25s;
}

.navbar-sipojak .nav-link:hover {
    background: rgba(255, 255, 255, 0.12);

    color: #fff;
}

/* Active Menu */
.navbar-sipojak .nav-link.active,
.navbar-sipojak .nav-link.show {
    color: #0d6efd !important;
    background: #fff;
    font-weight: 700;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
}

/* ================= DROPDOWN ================= */
.navbar-sipojak .nav-link.active,
.navbar-sipojak .nav-link.show {
    background: #fff;

    color: #14532d !important;

    font-weight: 700;

    box-shadow: 0 8px 18px rgba(0, 0, 0, 0.12);
}

/* Dropdown Item */
.navbar-sipojak .dropdown-menu {
    border: none;

    border-radius: 16px;

    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.12);
}

/* Hover Dropdown */
.navbar-sipojak .dropdown-item:hover {
    background: linear-gradient(90deg, rgba(31, 122, 66, 0.1), rgba(212, 160, 23, 0.1));

    color: #14532d;
}

/* Active Dropdown */
.navbar-sipojak .dropdown-item.active {
    background: linear-gradient(90deg, #14532d, #2d8c54);

    color: #fff;
}

/* ================= SUBMENU ================= */
.navbar-sipojak .dropdown-submenu {
    position: relative;
}

/* ================= ANIMATION ================= */
@keyframes fadeDropdown {
    from {
        opacity: 0;
        transform: translateY(6px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ================= FOOTER ================= */
.footer-sipojak {
    background: linear-gradient(90deg, #0f4420, #14532d);

    color: #fff;

    border-top: 2px solid rgba(212, 160, 23, 0.3);
}

.footer-sipojak h5,
.footer-sipojak h6 {
    font-weight: 600;
}

.footer-sipojak a {
    color: #d8f3dc;
    text-decoration: none;
}

.footer-sipojak a:hover {
    text-decoration: underline;
}

/* ================= LOGO FIX ================= */
.logo-wrapper {
    display: flex;
    align-items: center;
    gap: 10px;
}

/* optional biar logo lebih hidup */
.logo-wrapper img {
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.2));
}
/* BASE */
.page-link {
    color: #14532d;

    border-radius: 10px;

    border: 1px solid #d9e7dd;
}

.page-link:hover {
    color: #fff;

    background: linear-gradient(90deg, #14532d, #2d8c54);
}

.page-item.active .page-link {
    background: linear-gradient(90deg, #14532d, #2d8c54);

    color: #fff;
}

/* DISABLED */
.page-item.disabled .page-link {
    color: #aaa;
    background: #f5f5f5;
    border-color: #eee;
}

/* FOCUS */
.page-link:focus {
    box-shadow: 0 0 0 0.2rem rgba(82, 183, 136, 0.25);
}
.btn-primary {
    --bs-btn-bg: #1f7a42;
    --bs-btn-border-color: #1f7a42;

    --bs-btn-hover-bg: #14532d;
    --bs-btn-hover-border-color: #14532d;

    --bs-btn-active-bg: #0f4420;
    --bs-btn-active-border-color: #0f4420;

    --bs-btn-focus-shadow-rgb: 31, 122, 66;

    border-radius: 10px;

    font-weight: 600;

    transition: 0.25s;
}

.btn-primary:hover {
    box-shadow: 0 10px 20px rgba(31, 122, 66, 0.25);

    transform: translateY(-1px);
}
.btn-group > .btn-group:not(:last-child) > .btn,
.btn-group > .btn.dropdown-toggle-split:first-child,
.btn-group > .btn:not(:last-child):not(.dropdown-toggle) {
    border-top-right-radius: inherit;
    border-bottom-right-radius: inherit;
}
.btn-group > .btn-group:not(:first-child) > .btn,
.btn-group > .btn:nth-child(n + 3),
.btn-group > :not(.btn-check) + .btn {
    border-top-left-radius: inherit;
    border-bottom-left-radius: inherit;
}
.card {
    border: none;

    border-radius: 18px;

    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.08);
}
.card {
    border: none;

    border-radius: 18px;

    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.08);
}
.form-control:focus {
    border-color: #2d8c54;

    box-shadow: 0 0 0 0.2rem rgba(45, 140, 84, 0.18);
}