:root {
    --tree-950: #0d2f27;
    --tree-800: #145440;
    --tree-700: #1d6b4f;
    --tree-600: #27805e;
    --tree-100: #e6f2eb;
    --tree-50: #f4f8f5;
    --ink: #17221d;
    --muted: #65716a;
    --line: #dfe8e1;
    --cream: #fbfaf5;
}

html {
    font-size: 16px;
    min-height: 100%;
}

body {
    min-height: 100vh;
    margin: 0;
    display: flex;
    flex-direction: column;
    background: var(--cream);
    color: var(--ink);
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

a {
    color: var(--tree-700);
}

    a:hover {
        color: var(--tree-950);
    }

.site-header {
    position: sticky;
    top: 0;
    z-index: 1030;
    background: rgba(255, 255, 255, .92);
    border-bottom: 1px solid rgba(20, 84, 64, .1);
    backdrop-filter: blur(14px);
}

.site-navbar {
    min-height: 76px;
}

.site-primary-nav {
    gap: 1.35rem !important;
}

.site-brand {
    display: inline-flex;
    align-items: center;
    gap: .6rem;
    color: var(--tree-950) !important;
    font-size: 1.35rem;
    font-weight: 800;
    letter-spacing: -.045em;
    text-decoration: none;
}

.brand-mark {
    display: grid;
    width: 29px;
    height: 29px;
    place-items: center;
    color: #fff;
    background: var(--tree-700);
    border-radius: 10px 10px 4px 10px;
    font-size: .95rem;
    box-shadow: 0 6px 14px rgba(20, 84, 64, .2);
}

.site-navbar .nav-link {
    color: #4f5d55;
    font-size: .94rem;
    font-weight: 600;
    padding: .65rem .72rem;
}

.nav-cart-link {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2.6rem;
    font-size: 1.08rem !important;
}

.nav-cart-badge {
    position: absolute;
    top: .25rem;
    right: .05rem;
    display: grid;
    min-width: 1rem;
    height: 1rem;
    place-items: center;
    padding: 0 .15rem;
    border-radius: 999px;
    background: #17874b;
    color: #fff;
    font-size: .6rem;
    font-weight: 800;
    line-height: 1;
}

.site-navbar .nav-link:hover,
.site-navbar .nav-link:focus {
    color: var(--tree-700);
}

.site-dropdown {
    min-width: 210px;
    padding: .5rem;
    border-radius: 14px;
}

    .site-dropdown .dropdown-item {
        border-radius: 9px;
        padding: .55rem .75rem;
        font-size: .92rem;
        font-weight: 600;
    }

        .site-dropdown .dropdown-item:hover {
            background: var(--tree-100);
            color: var(--tree-950);
        }

.nav-user {
    display: block;
    max-width: 190px;
    overflow: hidden;
    color: var(--tree-950);
    font-size: .86rem;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.nav-logout {
    color: var(--muted);
    font-size: .9rem;
    font-weight: 700;
    text-decoration: none;
}

    .nav-logout:hover {
        color: var(--tree-700);
    }

.nav-register {
    padding: .48rem .82rem;
    font-weight: 700;
}

.site-main {
    flex: 1;
}

.site-footer {
    margin-top: 4rem;
    padding: 2.5rem 0;
    background: var(--tree-950);
    color: rgba(255,255,255,.66);
    font-size: .9rem;
}

    .site-footer .site-brand {
        color: #fff !important;
    }

.footer-brand .brand-mark {
    background: #d6edcb;
    color: var(--tree-950);
    box-shadow: none;
}

.footer-links {
    display: flex;
    flex-wrap: wrap;
    gap: 1.2rem;
    align-items: center;
}

    .footer-links a {
        color: #fff;
        font-weight: 600;
        text-decoration: none;
    }

        .footer-links a:hover {
            color: #d6edcb;
        }

.btn {
    border-radius: .7rem;
    font-weight: 700;
    padding: .55rem 1rem;
}

.btn-primary {
    border-color: var(--tree-700);
    background-color: var(--tree-700);
}

    .btn-primary:hover,
    .btn-primary:focus {
        border-color: var(--tree-950);
        background-color: var(--tree-950);
    }

.btn-success {
    border-color: var(--tree-600);
    background-color: var(--tree-600);
}

    .btn-success:hover, .btn-success:focus {
        border-color: var(--tree-800);
        background-color: var(--tree-800);
    }

.btn-outline-primary {
    color: var(--tree-700);
    border-color: var(--tree-700);
}

    .btn-outline-primary:hover {
        color: #fff;
        background: var(--tree-700);
        border-color: var(--tree-700);
    }

.form-control, .form-select {
    min-height: 44px;
    border-color: var(--line);
    border-radius: .7rem;
}

    .form-control:focus, .form-select:focus {
        border-color: var(--tree-600);
        box-shadow: 0 0 0 .22rem rgba(39, 128, 94, .15);
    }

.card {
    border: 1px solid var(--line);
    border-radius: 1rem;
}

.card-header {
    border-bottom-color: var(--line);
    background: rgba(244, 248, 245, .8);
    font-weight: 750;
}

.home-hero {
    padding: 2.7rem 0 0;
}

.home-hero-card {
    position: relative;
    overflow: hidden;
    padding: clamp(2.5rem, 6vw, 5.6rem);
    border-radius: 2rem;
    background: linear-gradient(125deg, #0a3228 0%, #175a42 55%, #2b7c58 100%);
    color: #fff;
    box-shadow: 0 24px 60px rgba(14, 53, 40, .18);
}

.hero-orb {
    position: absolute;
    border-radius: 50%;
    filter: blur(2px);
    opacity: .28;
}

.hero-orb-one {
    width: 380px;
    height: 380px;
    top: -170px;
    right: -90px;
    background: #b5dc74;
}

.hero-orb-two {
    width: 270px;
    height: 270px;
    right: 27%;
    bottom: -190px;
    background: #ccebd8;
}

.eyebrow {
    display: inline-block;
    color: #d6edcb;
    font-size: .73rem;
    font-weight: 800;
    letter-spacing: .13em;
}

.eyebrow-green {
    color: var(--tree-700);
}

.home-hero h1 {
    max-width: 650px;
    margin: 1rem 0 1.2rem;
    font-size: clamp(2.8rem, 6vw, 5.5rem);
    font-weight: 800;
    letter-spacing: -.07em;
    line-height: .98;
}

    .home-hero h1 span {
        color: #d6edcb;
    }

.hero-copy {
    max-width: 560px;
    color: rgba(255, 255, 255, .82);
    font-size: 1.12rem;
    line-height: 1.7;
}

.hero-primary-action {
    color: var(--tree-950);
    font-weight: 800;
}

    .hero-primary-action:hover {
        background: #d6edcb;
        color: var(--tree-950);
    }

.hero-trust-row {
    display: flex;
    flex-wrap: wrap;
    gap: 1.4rem 2.3rem;
    margin-top: 3.1rem;
}

    .hero-trust-row div {
        display: grid;
        gap: .18rem;
    }

    .hero-trust-row strong {
        font-size: .93rem;
    }

    .hero-trust-row span {
        color: rgba(255,255,255,.65);
        font-size: .78rem;
    }

.hero-visual {
    position: relative;
    min-height: 390px;
}

.hero-sun {
    position: absolute;
    width: 285px;
    height: 285px;
    left: 60px;
    top: 30px;
    border-radius: 50%;
    background: #d6edcb;
    opacity: .9;
}

.hero-pot {
    position: absolute;
    z-index: 1;
    width: 180px;
    height: 146px;
    left: 108px;
    bottom: 30px;
    border-radius: 26px 26px 44px 44px;
    background: linear-gradient(140deg, #f5d0a8, #c77d4f);
    box-shadow: inset -18px -8px 0 rgba(122, 60, 30, .12), 0 22px 24px rgba(5, 37, 27, .18);
}

    .hero-pot::before {
        content: "";
        position: absolute;
        left: -12px;
        top: -15px;
        width: 204px;
        height: 36px;
        border-radius: 50%;
        background: #a85f3e;
    }

.hero-stem {
    position: absolute;
    width: 12px;
    height: 210px;
    left: 84px;
    bottom: 116px;
    border-radius: 20px;
    background: #1a633f;
    transform: rotate(-3deg);
}

.hero-leaf {
    position: absolute;
    width: 92px;
    height: 46px;
    border-radius: 92px 10px 92px 10px;
    background: linear-gradient(145deg, #b5dc74, #4ca66c);
    box-shadow: inset -7px -5px 0 rgba(5, 64, 31, .1);
    transform-origin: bottom right;
}

.leaf-one {
    left: 18px;
    bottom: 258px;
    transform: rotate(-37deg);
}

.leaf-two {
    left: 92px;
    bottom: 290px;
    transform: rotate(34deg) scaleX(-1);
}

.leaf-three {
    left: 12px;
    bottom: 196px;
    transform: rotate(-22deg);
}

.leaf-four {
    left: 106px;
    bottom: 224px;
    transform: rotate(52deg) scaleX(-1);
}

.leaf-five {
    left: 57px;
    bottom: 334px;
    transform: rotate(-4deg);
}

.hero-note {
    position: absolute;
    z-index: 2;
    padding: .63rem .85rem;
    border: 1px solid rgba(255,255,255,.52);
    border-radius: .75rem;
    background: rgba(255,255,255,.18);
    color: #fff;
    font-size: .78rem;
    font-weight: 750;
    backdrop-filter: blur(8px);
}

.note-top {
    top: 36px;
    right: 0;
}

.note-bottom {
    right: -12px;
    bottom: 84px;
}

.section-space {
    padding: 6rem 0;
}

.section-heading {
    max-width: 690px;
}

    .section-heading h2, .home-cta-card h2 {
        margin: .7rem 0 1rem;
        color: var(--tree-950);
        font-size: clamp(2rem, 4vw, 3rem);
        font-weight: 800;
        letter-spacing: -.05em;
    }

    .section-heading p {
        color: var(--muted);
        font-size: 1.05rem;
        line-height: 1.65;
    }

.feature-card {
    padding: 2rem;
    border: 1px solid var(--line);
    border-radius: 1.35rem;
    background: #fff;
    transition: transform .2s ease, box-shadow .2s ease;
}

    .feature-card:hover {
        transform: translateY(-4px);
        box-shadow: 0 18px 35px rgba(20, 84, 64, .09);
    }

.feature-card-highlight {
    border-color: #c6e1c3;
    background: var(--tree-100);
}

.feature-number {
    display: inline-grid;
    width: 38px;
    height: 38px;
    place-items: center;
    border-radius: 50%;
    background: var(--tree-950);
    color: #fff;
    font-size: .79rem;
    font-weight: 800;
}

.feature-card h3 {
    margin: 1.45rem 0 .7rem;
    color: var(--tree-950);
    font-size: 1.25rem;
    font-weight: 800;
}

.feature-card p {
    margin: 0;
    color: var(--muted);
    line-height: 1.65;
}

.home-cta-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 2rem;
    padding: 2.3rem 2.6rem;
    border: 1px solid #c6e1c3;
    border-radius: 1.45rem;
    background: #e6f2eb;
}

    .home-cta-card h2 {
        max-width: 650px;
        margin-bottom: 0;
        font-size: clamp(1.8rem, 3.2vw, 2.6rem);
    }

@media (max-width: 991.98px) {
    .site-navbar {
        min-height: 68px;
    }

    .navbar-collapse {
        padding: 1rem 0 1.25rem;
    }

    .site-navbar .nav-link {
        padding-left: 0;
    }

    .site-dropdown {
        margin-bottom: .5rem;
        box-shadow: none !important;
    }

    .nav-user {
        padding: .45rem 0;
    }

    .home-hero {
        padding-top: 1.4rem;
    }

    .home-hero-card {
        border-radius: 1.35rem;
    }
}

@media (max-width: 767.98px) {
    .home-hero-card {
        padding: 2.2rem 1.5rem;
    }

    .home-hero h1 {
        font-size: clamp(2.65rem, 14vw, 4.4rem);
    }

    .hero-trust-row {
        margin-top: 2.25rem;
        gap: 1rem 1.4rem;
    }

    .section-space {
        padding: 4rem 0;
    }

    .home-cta-card {
        align-items: flex-start;
        flex-direction: column;
        padding: 1.75rem;
    }

    .site-footer {
        margin-top: 2.5rem;
    }
}

.shop-page, .product-detail-page {
    padding: 3.5rem 0 2rem;
}

.shop-heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 2rem;
    margin-bottom: 2rem;
}

    .shop-heading h1 {
        margin: .55rem 0 .45rem;
        color: var(--tree-950);
        font-size: clamp(2.3rem, 5vw, 4rem);
        font-weight: 800;
        letter-spacing: -.065em;
    }

    .shop-heading p {
        margin: 0;
        color: var(--muted);
        font-size: 1.05rem;
    }

.shop-filters {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .8rem;
    padding: 1rem;
    margin-bottom: 1.1rem;
    border: 1px solid var(--line);
    border-radius: 1rem;
    background: #fff;
    box-shadow: 0 10px 30px rgba(20, 84, 64, .045);
}

.shop-search-wrap {
    flex: 1;
    min-width: 180px;
}

.shop-category-wrap {
    width: 210px;
}

.shop-clear-filter {
    color: var(--muted);
    font-size: .9rem;
    text-decoration: none;
    white-space: nowrap;
}

    .shop-clear-filter:hover {
        color: var(--tree-700);
    }

.shop-results-bar {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    margin: 1.2rem 0 1.5rem;
    color: var(--muted);
    font-size: .9rem;
}

.product-card {
    overflow: hidden;
    background: #fff;
    transition: transform .2s ease, box-shadow .2s ease;
}

    .product-card:hover {
        transform: translateY(-5px);
        box-shadow: 0 20px 40px rgba(18, 65, 47, .12);
    }

.product-visual {
    position: relative;
    display: block;
    height: 230px;
    overflow: hidden;
    background: linear-gradient(135deg, #d8efd8, #f3e8c8);
    text-decoration: none;
}

    .product-visual img, .product-detail-visual img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

.product-leaf-shape {
    position: absolute;
    width: 128px;
    height: 66px;
    border-radius: 100% 0 100% 0;
    background: linear-gradient(135deg, #9bd576, #337b50);
    box-shadow: inset -8px -7px 0 rgba(16, 75, 44, .12);
}

.product-leaf-left {
    left: 20%;
    bottom: 34%;
    transform: rotate(-27deg);
}

.product-leaf-right {
    right: 17%;
    bottom: 43%;
    transform: rotate(38deg) scaleX(-1);
}

.product-stem-shape {
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 11px;
    height: 144px;
    border-radius: 12px;
    background: #286a43;
    transform: translateX(-50%) rotate(-3deg);
}

.product-visual-label {
    position: absolute;
    left: 1.1rem;
    bottom: 1rem;
    color: rgba(14, 59, 39, .8);
    font-size: .77rem;
    font-weight: 800;
    letter-spacing: .09em;
    text-transform: uppercase;
}

.product-stock-badge {
    position: absolute;
    top: 1rem;
    right: 1rem;
    padding: .42rem .58rem;
    border-radius: 999px;
    font-size: .72rem;
    font-weight: 800;
}

.product-offer-badge {
    position: absolute;
    top: 1rem;
    left: 1rem;
    padding: .42rem .58rem;
    border-radius: 999px;
    background: #c84242;
    color: #fff;
    font-size: .72rem;
    font-weight: 800;
}

.badge-in {
    background: #e3f4e7;
    color: #23633d;
}

.badge-low {
    background: #fff3ce;
    color: #835d00;
}

.badge-out {
    background: #fde4e1;
    color: #9e352b;
}

.product-card-body {
    min-height: 225px;
    padding: 1.35rem;
}

.product-card h2 {
    margin: .1rem 0 .7rem;
    color: var(--tree-950);
    font-size: 1.25rem;
    font-weight: 800;
    letter-spacing: -.03em;
}

    .product-card h2 a {
        color: inherit;
        text-decoration: none;
    }

        .product-card h2 a:hover {
            color: var(--tree-700);
        }

.product-farm-name {
    margin: 0;
    color: var(--tree-700);
    font-size: .76rem;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.product-category {
    padding: .3rem .52rem;
    border-radius: .45rem;
    background: var(--tree-50);
    color: var(--tree-700);
    font-size: .7rem;
    font-weight: 800;
    white-space: nowrap;
}

.product-description {
    display: -webkit-box;
    overflow: hidden;
    margin: 0 0 1.2rem;
    color: var(--muted);
    font-size: .92rem;
    line-height: 1.55;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.product-card-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.product-price {
    display: block;
    color: var(--tree-950);
    font-size: 1.05rem;
    font-weight: 850;
}

.product-offer-price {
    color: #b33434;
}

.product-original-price {
    color: #7a8c80;
    font-size: .82rem;
    font-weight: 600;
    text-decoration: line-through;
}

.offer-detail-badge {
    display: inline-block;
    padding: .28rem .5rem;
    border-radius: 999px;
    background: #fde2e2;
    color: #a52f2f;
    font-size: .75rem;
    font-weight: 800;
    vertical-align: middle;
}

.product-location {
    display: block;
    margin-top: .1rem;
    color: var(--muted);
    font-size: .75rem;
}

.notification-bell {
    position: relative;
    display: inline-grid;
    width: 2.35rem;
    height: 2.35rem;
    place-items: center;
    border-radius: 999px;
    color: var(--tree-900) !important;
    font-size: 1.25rem;
}

    .notification-bell:hover {
        background: var(--tree-50);
    }

.notification-badge {
    position: absolute;
    top: -.08rem;
    right: -.15rem;
    min-width: 1.15rem;
    padding: .08rem .28rem;
    border: 2px solid #fff;
    border-radius: 999px;
    background: #c84242;
    color: #fff;
    font-size: .64rem;
    font-weight: 800;
    line-height: 1.1;
    text-align: center;
}

.tracking-steps {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: .75rem;
    padding: 0;
    margin: 1.25rem 0 0;
    list-style: none;
}

.tracking-step {
    position: relative;
    display: grid;
    gap: .55rem;
    color: #7a8c80;
    font-size: .83rem;
}

    .tracking-step:not(:last-child)::after {
        position: absolute;
        top: .85rem;
        left: 2rem;
        width: calc(100% - 1.35rem);
        height: 2px;
        background: #dfe8e1;
        content: "";
    }

    .tracking-step > span {
        position: relative;
        z-index: 1;
        display: grid;
        width: 1.75rem;
        height: 1.75rem;
        place-items: center;
        border: 2px solid #dfe8e1;
        border-radius: 50%;
        background: #fff;
        color: #7a8c80;
        font-weight: 800;
    }

    .tracking-step strong, .tracking-step small {
        display: block;
    }

    .tracking-step small {
        margin-top: .15rem;
        color: inherit;
        line-height: 1.35;
    }

    .tracking-step.active {
        color: var(--tree-900);
    }

        .tracking-step.active > span {
            border-color: #1d9d73;
            background: #1d9d73;
            color: #fff;
        }

        .tracking-step.active:not(:last-child)::after {
            background: #8ed5b4;
        }

@media (max-width: 767.98px) {
    .tracking-steps {
        grid-template-columns: 1fr;
        gap: 1rem;
    }

    .tracking-step {
        grid-template-columns: 1.75rem 1fr;
        align-items: start;
    }

        .tracking-step:not(:last-child)::after {
            top: 2rem;
            left: .82rem;
            width: 2px;
            height: calc(100% + .25rem);
        }
}

.shop-empty-state {
    padding: 5rem 1.5rem;
    border: 1px dashed #bbd6bf;
    border-radius: 1.25rem;
    background: var(--tree-50);
    text-align: center;
}

.empty-leaf {
    display: grid;
    width: 56px;
    height: 56px;
    place-items: center;
    margin: 0 auto 1rem;
    border-radius: 18px;
    background: var(--tree-700);
    color: #fff;
    font-size: 1.35rem;
}

.shop-empty-state h2 {
    color: var(--tree-950);
    font-weight: 800;
}

.shop-empty-state p {
    max-width: 460px;
    margin: .6rem auto 1.5rem;
    color: var(--muted);
}

.shop-pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    margin-top: 2.5rem;
    color: var(--muted);
    font-size: .9rem;
}

    .shop-pagination .disabled {
        pointer-events: none;
        opacity: .45;
    }

.back-link {
    display: inline-block;
    margin-bottom: 1.5rem;
    color: var(--tree-700);
    font-size: .92rem;
    font-weight: 750;
    text-decoration: none;
}

    .back-link:hover {
        color: var(--tree-950);
    }

.product-detail-top-row {
    max-width: 1180px;
    margin-right: auto;
    margin-left: auto;
}

.product-detail-visual {
    position: relative;
    min-height: 470px;
    overflow: hidden;
    border-radius: 1.5rem;
    background: linear-gradient(145deg, #eff4d8, #c3e5c5);
}

.product-detail-image-frame {
    min-height: 420px;
    border: 1px solid var(--line);
    background: #f7f7f5;
}

.product-detail-image-link {
    display: grid;
    width: 100%;
    height: 100%;
    min-height: inherit;
    place-items: center;
    background: #f7f7f5;
}

.product-detail-image-frame img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    padding: 1.1rem;
    transition: transform .2s ease;
}

.product-detail-image-link:hover img {
    transform: scale(1.025);
}

.detail-sun {
    position: absolute;
    width: 295px;
    height: 295px;
    left: 50%;
    top: 45px;
    border-radius: 50%;
    background: #f7edbd;
    transform: translateX(-50%);
}

.detail-pot {
    position: absolute;
    z-index: 2;
    width: 205px;
    height: 150px;
    left: 50%;
    bottom: 55px;
    border-radius: 25px 25px 50px 50px;
    background: linear-gradient(135deg, #efb17c, #b8623f);
    box-shadow: inset -15px -10px 0 rgba(124, 60, 28, .11);
    transform: translateX(-50%);
}

    .detail-pot::before {
        content: "";
        position: absolute;
        top: -15px;
        left: -14px;
        width: 233px;
        height: 35px;
        border-radius: 50%;
        background: #9c4e31;
    }

.detail-stem {
    position: absolute;
    z-index: 1;
    bottom: 178px;
    left: calc(50% - 5px);
    width: 12px;
    height: 210px;
    border-radius: 20px;
    background: #286a43;
    transform: rotate(-3deg);
}

.detail-leaf {
    position: absolute;
    z-index: 1;
    width: 150px;
    height: 75px;
    border-radius: 100% 0 100% 0;
    background: linear-gradient(145deg, #b8dd78, #43945b);
    box-shadow: inset -10px -8px 0 rgba(14, 75, 40, .1);
}

.detail-leaf-one {
    left: calc(50% - 132px);
    bottom: 279px;
    transform: rotate(-32deg);
}

.detail-leaf-two {
    left: calc(50% - 2px);
    bottom: 318px;
    transform: rotate(37deg) scaleX(-1);
}

.detail-leaf-three {
    left: calc(50% - 80px);
    bottom: 365px;
    transform: rotate(0deg);
}

.detail-category-tag {
    position: absolute;
    z-index: 3;
    top: 1.2rem;
    left: 1.2rem;
    padding: .45rem .67rem;
    border-radius: .6rem;
    background: rgba(255,255,255,.83);
    color: var(--tree-800);
    font-size: .73rem;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
    backdrop-filter: blur(6px);
}

.product-detail-title {
    margin: .3rem 0 .55rem;
    color: var(--tree-950);
    font-size: clamp(2rem, 4vw, 3.25rem);
    font-weight: 800;
    letter-spacing: -.055em;
    line-height: 1.05;
}

.product-detail-price {
    margin: 0 0 1rem;
    color: var(--tree-700);
    font-size: 1.45rem;
    font-weight: 850;
}

.product-detail-description {
    max-width: 560px;
    margin-bottom: 1.25rem;
    color: var(--muted);
    font-size: 1rem;
    line-height: 1.65;
}

.product-detail-meta {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .75rem;
    margin: 1.25rem 0;
}

    .product-detail-meta div {
        padding: .85rem 1rem;
        border: 1px solid var(--line);
        border-radius: .85rem;
        background: #fff;
    }

    .product-detail-meta span, .product-detail-meta strong {
        display: block;
    }

    .product-detail-meta span {
        margin-bottom: .25rem;
        color: var(--muted);
        font-size: .78rem;
    }

    .product-detail-meta strong {
        color: var(--tree-950);
        font-size: .92rem;
    }

.product-specifications {
    margin-top: 2.2rem;
}

.product-detail-top-row .product-specifications,
.product-detail-top-row .plant-detail-panel {
    margin-top: 1.2rem;
}

.product-detail-top-row .plant-detail-panel {
    padding: 1rem;
}

.product-detail-top-row .plant-detail-grid {
    gap: .6rem;
}

.product-detail-top-row .plant-detail-card {
    padding: .7rem .8rem;
}

    .product-detail-top-row .plant-detail-card strong {
        font-size: .85rem;
    }

.product-detail-top-row .plant-detail-panel-heading {
    margin-bottom: .7rem;
}

    .product-detail-top-row .plant-detail-panel-heading h2 {
        font-size: 1rem;
    }

.product-detail-top-row .product-specifications-grid {
    margin-bottom: 0;
}

.product-detail-top-row .product-detail-meta {
    margin-top: 1rem;
}

    .product-detail-top-row .product-detail-meta div {
        padding: .75rem .85rem;
    }

.product-detail-top-row .product-specifications h2 {
    font-size: 1rem;
}

.product-detail-top-row .product-detail-meta strong {
    font-size: .85rem;
}

.product-detail-top-row .product-detail-meta span {
    font-size: .72rem;
}

.product-detail-top-row .btn-lg {
    padding: .65rem 1rem;
    font-size: 1rem;
}

/* Store-style product page */
.product-store-page {
    padding-top: 2rem;
}

.product-breadcrumb {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .55rem;
    margin: 0 0 1.25rem;
    color: var(--muted);
    font-size: .82rem;
}

    .product-breadcrumb a {
        color: var(--tree-700);
        font-weight: 750;
        text-decoration: none;
    }

    .product-breadcrumb strong {
        color: var(--tree-950);
        font-weight: 750;
    }

.product-store-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.02fr) minmax(360px, .98fr);
    gap: clamp(2rem, 4vw, 4.5rem);
    align-items: start;
}

.product-store-gallery {
    display: grid;
    grid-template-columns: 76px minmax(0, 1fr);
    gap: 1rem;
}

.product-thumbnail-list {
    display: grid;
    align-content: start;
    gap: .75rem;
}

.product-thumbnail {
    display: grid;
    width: 76px;
    height: 76px;
    place-items: center;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: .75rem;
    background: #f7f8f6;
    color: var(--muted);
    font-size: .72rem;
    font-weight: 800;
    text-decoration: none;
}

    .product-thumbnail.is-active {
        border: 2px solid #199657;
    }

    .product-thumbnail img {
        width: 100%;
        height: 100%;
        object-fit: contain;
        padding: .25rem;
    }

.product-store-main-image {
    position: relative;
    display: grid;
    min-height: 570px;
    place-items: center;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 1.2rem;
    background: #f7f8f6;
}

    .product-store-main-image > a {
        display: grid;
        width: 100%;
        height: 100%;
        min-height: 570px;
        place-items: center;
    }

    .product-store-main-image img {
        width: 100%;
        height: 100%;
        object-fit: contain;
        padding: 1.5rem;
        transition: transform .25s ease;
    }

    .product-store-main-image > a:hover img {
        transform: scale(1.025);
    }

.product-photo-zoom {
    position: absolute;
    bottom: 1rem;
    left: 1rem;
    padding: .45rem .7rem;
    border: 1px solid rgba(255,255,255,.9);
    border-radius: .55rem;
    background: rgba(255,255,255,.88);
    color: var(--muted);
    font-size: .75rem;
    font-weight: 700;
}

.product-store-summary {
    min-width: 0;
    padding-top: .15rem;
}

.product-category-pill {
    display: inline-block;
    padding: .28rem .62rem;
    border-radius: 999px;
    background: #e1f5e8;
    color: #197545;
    font-size: .72rem;
    font-weight: 800;
}

.product-store-summary .product-farm-name {
    margin: .9rem 0 .3rem;
}

.product-store-summary .product-detail-title {
    font-size: clamp(2.2rem, 4vw, 3.4rem);
}

.product-store-price {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .7rem;
    margin: .7rem 0 1.15rem;
}

    .product-store-price > strong {
        color: #078a47;
        font-size: 1.85rem;
        font-weight: 850;
    }

    .product-store-price .product-original-price {
        font-size: .95rem;
    }

.product-store-summary .product-detail-description {
    padding-bottom: 1.1rem;
    border-bottom: 1px solid var(--line);
}

.product-quick-features {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .65rem;
    padding: .9rem 0 1.1rem;
    border-bottom: 1px solid var(--line);
}

    .product-quick-features div {
        min-width: 0;
        display: grid;
        grid-template-columns: 1.45rem 1fr;
        column-gap: .45rem;
        align-items: center;
    }

    .product-quick-features span {
        grid-row: span 2;
        color: #198c50;
        font-size: 1.12rem;
    }

    .product-quick-features strong, .product-quick-features small {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .product-quick-features strong {
        color: var(--tree-950);
        font-size: .77rem;
    }

    .product-quick-features small {
        color: var(--muted);
        font-size: .68rem;
    }

.product-summary-details {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0;
    margin: 1.1rem 0 1.4rem;
}

    .product-summary-details > div {
        min-width: 0;
        padding: .65rem .75rem .65rem 0;
        border-bottom: 1px solid #edf0ed;
    }

    .product-summary-details span, .product-summary-details strong {
        display: block;
    }

    .product-summary-details span {
        color: var(--muted);
        font-size: .7rem;
    }

    .product-summary-details strong {
        overflow-wrap: anywhere;
        color: var(--tree-950);
        font-size: .82rem;
    }

.product-add-to-cart {
    width: 100%;
    padding: .82rem 1rem;
    border-radius: .7rem;
    font-size: 1.02rem;
    font-weight: 800;
}

.product-purchase-reassurance {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .65rem;
    margin-top: 1.25rem;
    padding: .9rem;
    border-radius: .85rem;
    background: linear-gradient(135deg, #edf8f0, #f7fbf7);
}

    .product-purchase-reassurance > div {
        min-width: 0;
        display: grid;
        grid-template-columns: 1.35rem 1fr;
        column-gap: .35rem;
        align-items: center;
    }

    .product-purchase-reassurance span {
        grid-row: span 2;
        color: #16894a;
        font-size: 1rem;
    }

    .product-purchase-reassurance strong, .product-purchase-reassurance small {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .product-purchase-reassurance strong {
        color: var(--tree-950);
        font-size: .72rem;
    }

    .product-purchase-reassurance small {
        color: var(--muted);
        font-size: .65rem;
    }

.product-information-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.55fr) minmax(300px, 1fr);
    gap: 1.25rem;
    margin-top: 2.75rem;
}

.product-information-card, .product-recommendations {
    padding: 1.35rem;
    border: 1px solid var(--line);
    border-radius: 1rem;
    background: #fff;
    box-shadow: 0 10px 26px rgba(34, 57, 45, .05);
}

.product-information-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5rem;
    margin-bottom: 1.25rem;
    border-bottom: 1px solid var(--line);
}

    .product-information-tabs button {
        padding: 0 0 .75rem;
        border: 0;
        border-bottom: 2px solid transparent;
        background: transparent;
        color: var(--muted);
        font-size: .83rem;
        font-weight: 750;
    }

        .product-information-tabs button:hover {
            color: var(--tree-700);
        }

    .product-information-tabs .is-current {
        border-bottom: 2px solid #169651;
        color: #148546;
    }

.product-information-card h2, .product-recommendations h2 {
    margin: 0 0 .8rem;
    color: var(--tree-950);
    font-size: 1.08rem;
    font-weight: 850;
}

.product-information-card p {
    margin: 0;
    color: #43584d;
    font-size: .92rem;
    line-height: 1.7;
}

.product-information-panel[hidden] {
    display: none;
}

.product-information-panel.is-active {
    display: block;
}

.product-details-description {
    display: flex;
    flex-wrap: wrap;
    gap: .25rem .85rem;
    margin-top: 1rem !important;
    color: #43584d;
    font-size: .88rem !important;
    line-height: 1.65 !important;
}

    .product-details-description span {
        overflow-wrap: anywhere;
    }

        .product-details-description span:not(:last-child)::after {
            content: "•";
            margin-left: .85rem;
            color: #8ba296;
        }

    .product-details-description strong {
        color: var(--tree-950);
        font-weight: 800;
    }

.product-recommendations {
    background: linear-gradient(145deg, #f4fbf5, #fff);
}

.product-recommendations-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
}

    .product-recommendations-heading h2 {
        margin: 0;
    }

    .product-recommendations-heading a {
        color: #16884a;
        font-size: .8rem;
        font-weight: 800;
        text-decoration: none;
    }

.product-recommendation-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .7rem;
}

    .product-recommendation-grid article {
        min-width: 0;
    }

.product-recommendation-image {
    display: grid;
    height: 125px;
    place-items: center;
    overflow: hidden;
    border-radius: .65rem;
    background: #fff;
    text-decoration: none;
}

    .product-recommendation-image img {
        width: 100%;
        height: 100%;
        object-fit: contain;
        padding: .4rem;
    }

    .product-recommendation-image span {
        color: var(--muted);
        font-size: .72rem;
    }

.product-recommendation-grid h3 {
    overflow: hidden;
    margin: .55rem 0 .15rem;
    color: var(--tree-950);
    font-size: .77rem;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

    .product-recommendation-grid h3 a {
        color: inherit;
        text-decoration: none;
    }

.product-recommendation-grid > article > strong {
    color: #078a47;
    font-size: .75rem;
}

/* Product page reference layout */
.product-reference-page {
    padding-top: 2rem;
}

.product-reference-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.03fr) minmax(390px, .97fr);
    gap: clamp(2rem, 4vw, 4.25rem);
    align-items: start;
}

.product-reference-gallery {
    display: grid;
    grid-template-columns: 76px minmax(0, 1fr);
    gap: 1rem;
}

    .product-reference-gallery .product-thumbnail {
        padding: 0;
        cursor: pointer;
        appearance: none;
    }

.product-reference-main-image {
    position: relative;
    display: grid;
    min-height: 620px;
    place-items: center;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 1rem;
    background: #f6f7f4;
}

    .product-reference-main-image > a {
        display: grid;
        width: 100%;
        height: 100%;
        min-height: 620px;
        place-items: center;
    }

    .product-reference-main-image img {
        width: 100%;
        height: 100%;
        object-fit: contain;
        padding: 1.25rem;
        transition: transform .25s ease;
    }

    .product-reference-main-image > a:hover img {
        transform: scale(1.025);
    }

.product-favourite-form {
    position: absolute;
    z-index: 2;
    top: 1rem;
    right: 1rem;
}

.product-favourite-icon {
    display: grid;
    width: 2.55rem;
    height: 2.55rem;
    place-items: center;
    border: 0;
    border-radius: 50%;
    background: rgba(255,255,255,.95);
    color: var(--tree-950);
    font-size: 1.7rem;
    line-height: 1;
    box-shadow: 0 4px 13px rgba(25,48,36,.1);
}

    .product-favourite-icon:hover, .product-favourite-icon.is-favorite {
        color: #168d4a;
    }

.product-reference-main-image .product-photo-zoom {
    left: 1rem;
    bottom: 1rem;
}

.product-image-empty {
    display: grid;
    place-items: center;
    gap: .45rem;
    color: var(--tree-700);
}

    .product-image-empty span {
        font-size: 3rem;
    }

    .product-image-empty strong {
        font-size: .85rem;
    }

.product-reference-summary {
    min-width: 0;
    padding-top: .05rem;
}

    .product-reference-summary h1 {
        margin: .55rem 0 .35rem;
        color: var(--ink);
        font-size: clamp(2.25rem, 4vw, 3.5rem);
        font-weight: 850;
        letter-spacing: -.06em;
        line-height: .98;
    }

.product-reference-rating {
    display: flex;
    align-items: center;
    gap: .55rem;
    margin: 0 0 1rem;
    color: #f0c100;
    font-size: 1.15rem;
    letter-spacing: .1rem;
}

    .product-reference-rating strong {
        color: var(--muted);
        font-size: .8rem;
        font-weight: 750;
        letter-spacing: 0;
    }

.product-reference-summary .product-store-price {
    margin: .65rem 0 1rem;
}

.product-reference-summary .product-detail-description {
    margin: 0;
    padding: 0 0 1.2rem;
    border-bottom: 0;
    color: #52625a;
    font-size: .92rem;
    line-height: 1.65;
}

.product-reference-features {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .65rem;
    padding: .9rem 0 1rem;
    border-bottom: 1px solid var(--line);
}

    .product-reference-features > div {
        display: grid;
        grid-template-columns: 1.45rem minmax(0, 1fr);
        gap: .35rem;
        align-items: center;
    }

        .product-reference-features > div > span {
            grid-row: span 2;
            color: #138749;
            font-size: 1.2rem;
        }

    .product-reference-features strong, .product-reference-features small {
        display: block;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .product-reference-features strong {
        color: var(--tree-950);
        font-size: .76rem;
        font-weight: 850;
    }

    .product-reference-features small {
        color: var(--muted);
        font-size: .66rem;
    }

.product-reference-specifications {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .6rem .85rem;
    margin: 1rem 0 1.25rem;
}

    .product-reference-specifications > div {
        display: grid;
        grid-template-columns: 1.2rem minmax(0, 1fr);
        gap: .45rem;
        align-items: center;
        min-width: 0;
    }

        .product-reference-specifications > div > span {
            color: #168a4d;
            font-size: 1rem;
            text-align: center;
        }

    .product-reference-specifications p, .product-purchase-reassurance p {
        margin: 0;
    }

    .product-reference-specifications strong, .product-reference-specifications small {
        display: block;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .product-reference-specifications strong {
        color: var(--tree-950);
        font-size: .74rem;
        font-weight: 850;
    }

    .product-reference-specifications small {
        color: var(--muted);
        font-size: .68rem;
    }

.product-purchase-form {
    margin-top: .25rem;
}

.product-quantity-label {
    margin: 0 0 .45rem;
    color: var(--tree-950);
    font-size: .82rem;
    font-weight: 850;
}

.product-purchase-row {
    display: grid;
    grid-template-columns: 146px minmax(0, 1fr);
    gap: 1rem;
}

.product-quantity-stepper {
    display: grid;
    grid-template-columns: 1fr 1.15fr 1fr;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: .7rem;
    background: #fff;
}

    .product-quantity-stepper button {
        border: 0;
        background: transparent;
        color: var(--tree-950);
        font-size: 1.15rem;
        font-weight: 800;
    }

        .product-quantity-stepper button:hover {
            background: var(--tree-50);
        }

    .product-quantity-stepper input {
        min-width: 0;
        border: 0;
        background: transparent;
        color: var(--tree-950);
        font-size: .9rem;
        font-weight: 750;
        text-align: center;
    }

        .product-quantity-stepper input:focus {
            outline: 0;
        }

.product-reference-summary .product-add-to-cart {
    min-height: 48px;
    padding: .72rem 1rem;
    border-radius: .7rem;
}

.product-purchase-reassurance {
    margin-top: 1.25rem;
}

    .product-purchase-reassurance > div {
        grid-template-columns: 1.35rem minmax(0, 1fr);
    }

    .product-purchase-reassurance strong, .product-purchase-reassurance small {
        display: block;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

@media (max-width: 991.98px) {
    .product-store-layout, .product-reference-layout, .product-information-layout {
        grid-template-columns: 1fr;
    }

    .product-store-main-image, .product-store-main-image > a, .product-reference-main-image, .product-reference-main-image > a {
        min-height: 480px;
    }
}

@media (max-width: 575.98px) {
    .product-store-gallery, .product-reference-gallery {
        grid-template-columns: 1fr;
    }

    .product-thumbnail-list {
        grid-template-columns: repeat(4, 58px);
        grid-auto-flow: column;
        overflow-x: auto;
    }

    .product-thumbnail {
        width: 58px;
        height: 58px;
    }

    .product-store-main-image, .product-store-main-image > a, .product-reference-main-image, .product-reference-main-image > a {
        min-height: 360px;
    }

    .product-quick-features, .product-reference-features, .product-purchase-reassurance {
        grid-template-columns: 1fr;
    }

    .product-summary-details {
        grid-template-columns: 1fr;
    }

    .product-reference-specifications {
        grid-template-columns: 1fr;
    }

    .product-purchase-row {
        grid-template-columns: 120px minmax(0, 1fr);
        gap: .65rem;
    }

    .product-recommendation-grid {
        grid-template-columns: repeat(3, minmax(85px, 1fr));
    }

    .product-recommendation-image {
        height: 100px;
    }
}

.product-specifications h2 {
    margin: 0 0 .8rem;
    color: var(--tree-950);
    font-size: 1.08rem;
    font-weight: 800;
}

.product-specifications-grid {
    margin: 0;
}

.plant-detail-panel {
    margin-top: 1.35rem;
    padding: 1.25rem;
    border: 1px solid #cde2cf;
    border-radius: 1rem;
    background: linear-gradient(145deg, #f5fbf3, #fff);
}

.plant-detail-panel-heading {
    margin-bottom: 1rem;
}

    .plant-detail-panel-heading > span {
        display: block;
        margin-bottom: .3rem;
        color: var(--tree-700);
        font-size: .68rem;
        font-weight: 800;
        letter-spacing: .1em;
    }

    .plant-detail-panel-heading h2 {
        margin: 0;
        color: var(--tree-950);
        font-size: 1.12rem;
        font-weight: 850;
    }

.plant-detail-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .75rem;
}

.plant-detail-card {
    min-width: 0;
    padding: .9rem 1rem;
    border: 1px solid rgba(191, 218, 193, .9);
    border-radius: .75rem;
    background: rgba(255, 255, 255, .86);
}

.plant-detail-card-wide {
    grid-column: span 2;
}

.plant-detail-card span {
    display: block;
    margin-bottom: .3rem;
    color: var(--muted);
    font-size: .72rem;
    font-weight: 750;
    letter-spacing: .03em;
    text-transform: uppercase;
}

.plant-detail-card strong {
    display: block;
    color: var(--tree-950);
    font-size: .92rem;
    line-height: 1.45;
    overflow-wrap: anywhere;
}

.plant-detail-status {
    display: inline-flex !important;
    width: max-content;
    padding: .22rem .55rem;
    border-radius: 999px;
    background: #f5e6e2;
    color: #994236 !important;
    font-size: .78rem !important;
}

    .plant-detail-status.is-positive {
        background: #ddf2df;
        color: #24713c !important;
    }

@media (max-width: 767.98px) {
    .shop-page, .product-detail-page {
        padding-top: 2.25rem;
    }

    .shop-heading {
        align-items: flex-start;
        flex-direction: column;
        gap: 1rem;
    }

    .shop-filters {
        align-items: stretch;
        flex-direction: column;
    }

    .shop-category-wrap {
        width: auto;
    }

    .shop-results-bar {
        align-items: flex-start;
        flex-direction: column;
    }

    .product-detail-visual {
        min-height: 380px;
    }

    .detail-sun {
        width: 230px;
        height: 230px;
    }

    .detail-pot {
        bottom: 35px;
        transform: translateX(-50%) scale(.85);
    }

    .detail-stem {
        bottom: 142px;
        transform: rotate(-3deg) scale(.85);
        transform-origin: bottom;
    }

    .detail-leaf {
        transform-origin: bottom;
    }

    .detail-leaf-one {
        bottom: 228px;
        transform: rotate(-32deg) scale(.85);
    }

    .detail-leaf-two {
        bottom: 263px;
        transform: rotate(37deg) scaleX(-1) scale(.85);
    }

    .detail-leaf-three {
        bottom: 304px;
        transform: scale(.85);
    }

    .product-detail-meta {
        grid-template-columns: 1fr;
    }

    .plant-detail-grid {
        grid-template-columns: 1fr;
    }

    .plant-detail-card-wide {
        grid-column: span 1;
    }
}

.cart-page {
    padding: 3.5rem 0 2rem;
}

.cart-heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 2rem;
    margin-bottom: 2rem;
}

    .cart-heading h1 {
        margin: .55rem 0 .45rem;
        color: var(--tree-950);
        font-size: clamp(2.3rem, 5vw, 4rem);
        font-weight: 800;
        letter-spacing: -.065em;
    }

    .cart-heading p {
        margin: 0;
        color: var(--muted);
    }

.cart-empty-state {
    padding: 5rem 1.5rem;
    border: 1px dashed #bbd6bf;
    border-radius: 1.25rem;
    background: var(--tree-50);
    text-align: center;
}

    .cart-empty-state h2 {
        color: var(--tree-950);
        font-weight: 800;
    }

    .cart-empty-state p {
        margin: .65rem auto 1.5rem;
        color: var(--muted);
    }

.cart-items-card {
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 1.1rem;
    background: #fff;
}

.cart-item-row {
    display: grid;
    grid-template-columns: 86px minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 1.2rem;
    padding: 1.2rem;
    border-bottom: 1px solid var(--line);
}

    .cart-item-row:last-child {
        border-bottom: 0;
    }

.cart-item-visual {
    position: relative;
    display: grid;
    width: 86px;
    height: 86px;
    place-items: center;
    overflow: hidden;
    border-radius: .85rem;
    background: linear-gradient(145deg, #e1f0dc, #efe5c8);
}

    .cart-item-visual img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

.cart-mini-leaf {
    width: 42px;
    height: 23px;
    border-radius: 100% 0 100% 0;
    background: linear-gradient(140deg, #a4d476, #2f7549);
    transform: rotate(-28deg);
}

.cart-item-info h2 {
    margin: 0 0 .2rem;
    color: var(--tree-950);
    font-size: 1.08rem;
    font-weight: 800;
}

    .cart-item-info h2 a {
        color: inherit;
        text-decoration: none;
    }

        .cart-item-info h2 a:hover {
            color: var(--tree-700);
        }

.cart-item-info p {
    margin: 0;
    color: var(--muted);
    font-size: .88rem;
}

.cart-quantity-control {
    display: flex;
    align-items: center;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: .65rem;
}

    .cart-quantity-control form {
        margin: 0;
    }

    .cart-quantity-control button, .cart-quantity-control span {
        display: grid;
        width: 33px;
        height: 34px;
        place-items: center;
        color: var(--tree-800);
        font-weight: 800;
        text-decoration: none;
    }

    .cart-quantity-control button {
        border: 0;
        background: transparent;
        cursor: pointer;
    }

        .cart-quantity-control button:hover {
            background: var(--tree-100);
        }

    .cart-quantity-control span {
        width: 36px;
        color: var(--ink);
        border-right: 1px solid var(--line);
        border-left: 1px solid var(--line);
        font-size: .9rem;
    }

.cart-item-total {
    display: grid;
    justify-items: end;
    gap: .45rem;
    min-width: 112px;
    color: var(--tree-950);
    font-size: .92rem;
}

.cart-remove-link {
    padding: 0;
    border: 0;
    background: transparent;
    color: #a34b42;
    font-size: .78rem;
    font-weight: 750;
    text-decoration: none;
    cursor: pointer;
}

    .cart-remove-link:hover {
        color: #742d26;
    }

.cart-summary-card {
    position: sticky;
    top: 100px;
    padding: 1.6rem;
    border: 1px solid #cae2ce;
    border-radius: 1.1rem;
    background: var(--tree-50);
}

    .cart-summary-card h2 {
        margin: 0 0 1.35rem;
        color: var(--tree-950);
        font-size: 1.25rem;
        font-weight: 800;
    }

.cart-summary-row, .cart-summary-total {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
}

.cart-summary-row {
    margin: .9rem 0;
    color: var(--muted);
    font-size: .9rem;
}

    .cart-summary-row span:last-child {
        text-align: right;
    }

.cart-summary-total {
    align-items: baseline;
    margin: 1.4rem 0;
    padding-top: 1.15rem;
    border-top: 1px solid #c5dbca;
    color: var(--tree-950);
    font-size: 1.05rem;
    font-weight: 800;
}

    .cart-summary-total strong {
        font-size: 1.35rem;
    }

.cart-summary-note {
    margin: 1rem 0 0;
    color: var(--muted);
    font-size: .78rem;
    line-height: 1.5;
}

@media (max-width: 767.98px) {
    .cart-page {
        padding-top: 2.25rem;
    }

    .cart-heading {
        align-items: flex-start;
        flex-direction: column;
        gap: 1rem;
    }

    .cart-item-row {
        grid-template-columns: 64px minmax(0, 1fr) auto;
        gap: .9rem;
    }

    .cart-item-visual {
        width: 64px;
        height: 64px;
    }

    .cart-quantity-control {
        grid-column: 2;
        justify-self: start;
    }

    .cart-item-total {
        grid-column: 3;
        grid-row: 1 / span 2;
    }

    .cart-summary-card {
        position: static;
    }
}

.checkout-page {
    padding: 3.5rem 0 2rem;
}

.checkout-heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 2rem;
    margin-bottom: 2rem;
}

    .checkout-heading h1 {
        margin: .55rem 0 .45rem;
        color: var(--tree-950);
        font-size: clamp(2.3rem, 5vw, 4rem);
        font-weight: 800;
        letter-spacing: -.065em;
    }

    .checkout-heading p {
        margin: 0;
        color: var(--muted);
    }

.checkout-form-card {
    padding: clamp(1.35rem, 3vw, 2.2rem);
    border: 1px solid var(--line);
    border-radius: 1.1rem;
    background: #fff;
}

.checkout-section-heading {
    display: flex;
    align-items: flex-start;
    gap: .85rem;
    margin-bottom: 1.35rem;
}

.checkout-step {
    display: grid;
    flex: 0 0 auto;
    width: 31px;
    height: 31px;
    place-items: center;
    border-radius: 50%;
    background: var(--tree-950);
    color: #fff;
    font-size: .8rem;
    font-weight: 800;
}

.checkout-section-heading h2 {
    margin: 0 0 .18rem;
    color: var(--tree-950);
    font-size: 1.2rem;
    font-weight: 800;
}

.checkout-section-heading p {
    margin: 0;
    color: var(--muted);
    font-size: .88rem;
    line-height: 1.5;
}

.checkout-map-section {
    margin-top: 2.4rem;
    padding-top: 2rem;
    border-top: 1px solid var(--line);
}

.checkout-map-search .form-control {
    border-radius: .7rem 0 0 .7rem;
}

.checkout-map-search .btn {
    border-radius: 0 .7rem .7rem 0;
}

.checkout-summary-card {
    position: sticky;
    top: 100px;
    padding: 1.6rem;
    border: 1px solid #cae2ce;
    border-radius: 1.1rem;
    background: var(--tree-50);
}

    .checkout-summary-card h2 {
        margin: 0 0 1.25rem;
        color: var(--tree-950);
        font-size: 1.3rem;
        font-weight: 800;
    }

.checkout-summary-items {
    display: grid;
    gap: 1rem;
}

.checkout-summary-item {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    color: var(--tree-950);
    font-size: .88rem;
}

    .checkout-summary-item div {
        display: grid;
        gap: .15rem;
    }

    .checkout-summary-item span {
        color: var(--muted);
        font-size: .78rem;
    }

    .checkout-summary-item > strong {
        white-space: nowrap;
    }

.checkout-total-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 1rem;
    margin: 1.4rem 0;
    padding-top: 1.25rem;
    border-top: 1px solid #c5dbca;
    color: var(--tree-950);
    font-weight: 800;
}

    .checkout-total-row strong {
        font-size: 1.42rem;
    }

.checkout-summary-note {
    margin: 1rem 0 0;
    color: var(--muted);
    font-size: .78rem;
    line-height: 1.5;
}

#location-results .list-group-item {
    border-color: var(--line);
    font-size: .87rem;
}

@media (max-width: 991.98px) {
    .checkout-summary-card {
        position: static;
    }
}

@media (max-width: 767.98px) {
    .checkout-page {
        padding-top: 2.25rem;
    }

    .checkout-heading {
        align-items: flex-start;
        flex-direction: column;
        gap: 1rem;
    }
}

.payment-page, .payment-history-page {
    padding: 3.5rem 0 2rem;
}

    .payment-page h2, .payment-history-page h2 {
        color: var(--tree-950);
        font-weight: 800;
        letter-spacing: -.045em;
    }

.payment-summary-card, .payment-history-card {
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 1.1rem;
    background: #fff;
    box-shadow: 0 12px 30px rgba(20, 84, 64, .05);
}

    .payment-summary-card .card-body {
        padding: 1.5rem;
    }

    .payment-summary-card .text-muted {
        color: var(--muted) !important;
    }

.payment-method-heading {
    padding: 1rem 1.5rem;
    border-bottom: 1px solid var(--line);
    background: var(--tree-50);
    color: var(--tree-950);
    font-size: 1rem;
    font-weight: 800;
}

.payment-method-body {
    padding: 1.5rem;
}

    .payment-method-body p {
        color: var(--muted);
        line-height: 1.6;
    }

.payment-history-card .table {
    margin-bottom: 0;
}

.payment-history-card .table-light th {
    border-bottom-color: var(--line);
    color: var(--tree-800);
    font-size: .78rem;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.payment-history-card td {
    border-color: var(--line);
}

.order-success-page {
    padding: 5rem 0 3rem;
}

.success-mark {
    display: grid;
    width: 66px;
    height: 66px;
    place-items: center;
    margin: 0 auto 1.4rem;
    border-radius: 50%;
    background: var(--tree-700);
    color: #fff;
    font-size: 2rem;
    font-weight: 800;
    box-shadow: 0 12px 24px rgba(20, 84, 64, .2);
}

.order-success-page h1 {
    margin: 0;
    color: var(--tree-950);
    font-size: clamp(2.25rem, 5vw, 3.5rem);
    font-weight: 800;
    letter-spacing: -.065em;
}

.success-copy {
    max-width: 510px;
    margin: 1rem auto 0;
    color: var(--muted);
    font-size: 1.04rem;
    line-height: 1.65;
}

.success-next-step {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    padding: 1.6rem;
    border: 1px solid #c6e1c3;
    border-radius: 1.1rem;
    background: var(--tree-50);
}

    .success-next-step h2 {
        margin: .1rem 0 .45rem;
        color: var(--tree-950);
        font-size: 1.2rem;
        font-weight: 800;
    }

    .success-next-step p {
        color: var(--muted);
        line-height: 1.55;
    }

@media (max-width: 767.98px) {
    .payment-page, .payment-history-page {
        padding-top: 2.25rem;
    }

    .order-success-page {
        padding-top: 3.5rem;
    }
}

.dashboard-page {
    padding: 3.5rem 0 2rem;
}

.dashboard-heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 2rem;
    margin-bottom: 2rem;
}

    .dashboard-heading h1 {
        margin: .55rem 0 .45rem;
        color: var(--tree-950);
        font-size: clamp(2.3rem, 5vw, 4rem);
        font-weight: 800;
        letter-spacing: -.065em;
    }

    .dashboard-heading p {
        margin: 0;
        color: var(--muted);
    }

.dashboard-stat-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

.dashboard-stat-card {
    min-height: 139px;
    padding: 1.2rem;
    border: 1px solid var(--line);
    border-radius: 1rem;
    background: #fff;
}

    .dashboard-stat-card span, .dashboard-stat-card small {
        display: block;
        color: var(--muted);
    }

    .dashboard-stat-card span {
        font-size: .8rem;
        font-weight: 750;
    }

    .dashboard-stat-card strong {
        display: block;
        margin: .65rem 0 .35rem;
        color: var(--tree-950);
        font-size: clamp(1.4rem, 2.3vw, 2rem);
        font-weight: 850;
        letter-spacing: -.05em;
        line-height: 1;
    }

    .dashboard-stat-card small {
        font-size: .73rem;
        line-height: 1.35;
    }

.dashboard-stat-highlight {
    border-color: #b9ddbd;
    background: var(--tree-100);
}

.dashboard-action-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.3rem 1.5rem;
    border: 1px solid #c6e1c3;
    border-radius: 1rem;
    background: var(--tree-50);
}

    .dashboard-action-card h2, .dashboard-data-heading h2 {
        margin: 0;
        color: var(--tree-950);
        font-size: 1.1rem;
        font-weight: 800;
    }

    .dashboard-action-card p, .dashboard-data-heading p {
        margin: .25rem 0 0;
        color: var(--muted);
        font-size: .83rem;
    }

.dashboard-data-card {
    padding: 1.4rem;
    border: 1px solid var(--line);
    border-radius: 1rem;
    background: #fff;
}

.dashboard-data-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1.2rem;
}

.dashboard-table th {
    border-bottom-color: var(--line);
    color: var(--tree-800);
    font-size: .74rem;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.dashboard-table td {
    border-color: var(--line);
    font-size: .9rem;
}

@media (max-width: 1199.98px) {
    .dashboard-stat-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 767.98px) {
    .dashboard-page {
        padding-top: 2.25rem;
    }

    .dashboard-heading, .dashboard-action-card {
        align-items: flex-start;
        flex-direction: column;
        gap: 1rem;
    }

    .dashboard-stat-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

.farm-dashboard-page .dashboard-heading h1, .driver-dashboard-page .dashboard-heading h1 {
    margin-bottom: .45rem;
}

.farm-dashboard-page .card, .driver-dashboard-page .card {
    box-shadow: 0 10px 24px rgba(20, 84, 64, .04);
}

.farm-dashboard-page .card-header, .driver-dashboard-page .card-header {
    padding: 1rem 1.25rem;
}

.farm-dashboard-page table th, .driver-dashboard-page table th {
    color: var(--tree-800);
    font-size: .75rem;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.farm-dashboard-page table td, .driver-dashboard-page table td {
    border-color: var(--line);
}

.farm-dashboard-page .card-body, .driver-dashboard-page .card-body {
    padding: 1.25rem;
}

.farm-dashboard-page .row.g-3 > div > .card {
    min-height: 126px;
}

.farm-dashboard-page .row.g-3 h6 {
    color: var(--muted) !important;
    font-size: .78rem;
    font-weight: 750;
}

.farm-dashboard-page .row.g-3 h2 {
    color: var(--tree-950);
    font-size: 1.8rem;
    font-weight: 850;
    letter-spacing: -.05em;
}

.driver-profile-card {
    border-color: #c6e1c3;
    background: var(--tree-50);
}

.driver-dashboard-page .alert-light {
    border-color: var(--line);
    background: var(--tree-50);
    color: var(--tree-950);
}

@media (max-width: 767.98px) {
    .farm-dashboard-page .dashboard-heading, .driver-dashboard-page .dashboard-heading {
        align-items: flex-start;
        flex-direction: column;
        gap: 1rem;
    }
}

/* Customer account, notification centre, and orders */
.customer-dashboard-page .dashboard-heading h1,
.page-heading h1 {
    margin: .35rem 0 .55rem;
    font-size: clamp(2rem, 4vw, 3.1rem);
}

.customer-dashboard-page .dashboard-heading p,
.page-heading p {
    max-width: 680px;
    margin: 0;
    color: var(--muted);
}

.account-card,
.notification-card,
.order-history-card {
    border: 1px solid var(--line);
    border-radius: 1rem;
    box-shadow: 0 10px 28px rgba(34, 57, 45, .06);
    overflow: hidden;
}

    .account-card .card-header,
    .order-history-card .card-header {
        padding: 1.05rem 1.3rem;
        background: #fff;
        border-bottom: 1px solid var(--line);
        color: var(--ink);
        font-weight: 700;
    }

    .account-card .card-body {
        padding: 1.35rem;
    }

.account-stat {
    display: flex;
    min-height: 132px;
    flex-direction: column;
    justify-content: center;
    padding: 1.25rem;
    border: 1px solid var(--line);
    border-radius: 1rem;
    background: linear-gradient(145deg, #fff, #f1f7ef);
    box-shadow: 0 8px 22px rgba(34, 57, 45, .05);
}

    .account-stat span {
        color: var(--muted);
        font-size: .9rem;
    }

    .account-stat strong {
        margin-top: .3rem;
        color: var(--green-dark);
        font-size: 2rem;
        line-height: 1;
    }

.account-notification:last-child {
    margin-bottom: 0 !important;
    border-bottom: 0 !important;
    padding-bottom: 0 !important;
}

.simple-page {
    min-height: 68vh;
    padding: 4rem 0 5.5rem;
}

/* Customer profile */
.profile-page {
    padding: 1.5rem 0 2rem;
}

.profile-container {
    max-width: 1320px;
}

.profile-layout {
    display: grid;
    grid-template-columns: 250px minmax(0, 1fr);
    gap: 2rem;
    align-items: start;
}

.profile-sidebar {
    position: sticky;
    top: 96px;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 1.05rem;
    background: #fff;
    box-shadow: 0 10px 28px rgba(28, 67, 49, .06);
}

.profile-sidebar-user {
    display: flex;
    align-items: center;
    gap: .85rem;
    padding: 1.25rem 1.1rem;
    border-bottom: 1px solid var(--line);
}

    .profile-sidebar-user h2 {
        overflow: hidden;
        margin: 0 0 .15rem;
        color: var(--ink);
        font-size: .94rem;
        font-weight: 800;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .profile-sidebar-user p {
        overflow: hidden;
        margin: 0 0 .35rem;
        color: var(--muted);
        font-size: .73rem;
        font-weight: 600;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.profile-role, .profile-default-badge {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    background: #e8f6ed;
    color: #128547;
    font-size: .66rem;
    font-weight: 800;
    line-height: 1;
    padding: .32rem .52rem;
}

.profile-avatar {
    display: grid;
    flex: none;
    place-items: center;
    overflow: hidden;
    border: 4px solid #fff;
    border-radius: 50%;
    background: linear-gradient(145deg, #c7ead0, #237d5a);
    box-shadow: 0 5px 18px rgba(20, 84, 64, .16);
    color: #fff;
    font-weight: 850;
    letter-spacing: -.04em;
}

.profile-avatar-small {
    width: 57px;
    height: 57px;
    font-size: 1.05rem;
}

.profile-avatar-large {
    width: 128px;
    height: 128px;
    margin: 1rem auto .75rem;
    font-size: 2.5rem;
}

.profile-nav {
    padding: .75rem;
}

.profile-nav-link {
    display: flex;
    width: 100%;
    align-items: center;
    gap: .72rem;
    margin: .12rem 0;
    border: 0;
    border-radius: .65rem;
    background: transparent;
    color: #3e4b45;
    font: inherit;
    font-size: .86rem;
    font-weight: 700;
    line-height: 1.2;
    padding: .73rem .7rem;
    text-align: left;
    text-decoration: none;
}

    .profile-nav-link > span {
        width: 1.1rem;
        color: #56645e;
        font-size: .95rem;
        text-align: center;
    }

    .profile-nav-link:hover, .profile-nav-link:focus {
        background: var(--tree-50);
        color: var(--tree-800);
    }

    .profile-nav-link.active {
        background: linear-gradient(90deg, #e3f6e9, #f1faf3);
        color: #11814a;
    }

        .profile-nav-link.active > span {
            color: #11814a;
        }

.profile-logout {
    color: #5f6b65;
    cursor: pointer;
}

.profile-help-card {
    margin: .15rem .75rem .75rem;
    padding: 1rem;
    border-radius: .85rem;
    background: linear-gradient(135deg, #effaf1, #e5f3e8);
}

    .profile-help-card > span {
        display: block;
        margin-bottom: .35rem;
        color: var(--tree-700);
        font-size: 1.25rem;
    }

    .profile-help-card strong {
        display: block;
        color: var(--tree-950);
        font-size: .86rem;
    }

    .profile-help-card p {
        margin: .3rem 0 .85rem;
        color: var(--muted);
        font-size: .75rem;
        font-weight: 600;
    }

    .profile-help-card .btn {
        width: 100%;
        font-size: .75rem;
    }

.profile-heading {
    margin: .3rem 0 1.35rem;
}

    .profile-heading h1 {
        margin: 0 0 .35rem;
        color: var(--ink);
        font-size: clamp(2rem, 3.4vw, 2.7rem);
        font-weight: 850;
        letter-spacing: -.06em;
    }

    .profile-heading p {
        margin: 0;
        color: var(--muted);
        font-size: .98rem;
        font-weight: 500;
    }

.profile-card {
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 1rem;
    background: #fff;
    box-shadow: 0 9px 25px rgba(28, 67, 49, .045);
}

.profile-information-card {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(240px, .78fr);
    margin-bottom: 1.5rem;
}

.profile-form-section {
    padding: 1.45rem 1.55rem;
}

.profile-card-title {
    display: flex;
    align-items: center;
    gap: .6rem;
}

    .profile-card-title > span {
        color: var(--tree-700);
        font-size: 1.1rem;
    }

    .profile-card-title h2, .profile-photo-section h2 {
        margin: 0;
        color: var(--ink);
        font-size: 1rem;
        font-weight: 800;
    }

.profile-fields {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem 1.15rem;
    margin: 1.45rem 0 1.25rem;
}

    .profile-fields .form-label {
        margin-bottom: .35rem;
        color: #24312b;
        font-size: .73rem;
        font-weight: 800;
    }

    .profile-fields .form-control {
        min-height: 42px;
        background: #fff;
        color: var(--ink);
        font-size: .88rem;
        font-weight: 600;
    }

        .profile-fields .form-control[readonly] {
            background: #fafcfb;
            color: #53605a;
            cursor: default;
        }

.profile-save-button {
    font-size: .84rem;
}

.profile-photo-section {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border-left: 1px solid var(--line);
    background: linear-gradient(150deg, #fff, #f7fbf8);
    padding: 1.45rem;
    text-align: center;
}

    .profile-photo-section h2 {
        align-self: stretch;
        text-align: left;
    }

    .profile-photo-section p {
        max-width: 205px;
        margin: 0 0 .8rem;
        color: var(--muted);
        font-size: .72rem;
        font-weight: 600;
        line-height: 1.5;
    }

.profile-bottom-grid {
    display: grid;
    grid-template-columns: minmax(0, .93fr) minmax(0, 1.07fr);
    gap: 1.5rem;
}

.profile-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    min-height: 63px;
    padding: 1.05rem 1.35rem;
    border-bottom: 1px solid var(--line);
}

.profile-text-link {
    flex: none;
    color: #0b8a4b;
    font-size: .74rem;
    font-weight: 800;
    text-decoration: none;
}

    .profile-text-link:hover {
        color: var(--tree-950);
        text-decoration: underline;
    }

.saved-address-row {
    display: flex;
    gap: .95rem;
    padding: 1.35rem;
}

.address-icon {
    display: grid;
    flex: none;
    width: 43px;
    height: 43px;
    place-items: center;
    border-radius: 50%;
    background: #e8f6ed;
    color: var(--tree-700);
    font-size: 1.2rem;
}

.saved-address-row strong {
    color: var(--ink);
    font-size: .87rem;
}

.saved-address-row p {
    margin: .2rem 0;
    color: #5e6a64;
    font-size: .8rem;
    font-weight: 550;
    line-height: 1.45;
}

.profile-card-note {
    margin: 0 1.35rem 1.35rem 4.3rem;
    color: var(--muted);
    font-size: .73rem;
    line-height: 1.45;
}

.profile-empty-state {
    padding: 2rem 1.35rem;
    color: var(--muted);
    text-align: center;
}

    .profile-empty-state strong {
        display: block;
        color: var(--ink);
        font-size: .92rem;
    }

    .profile-empty-state p {
        max-width: 270px;
        margin: .5rem auto 1rem;
        font-size: .8rem;
        line-height: 1.5;
    }

.profile-orders-list {
    padding: 0 .85rem;
}

.profile-order-row {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr) auto 12px;
    align-items: center;
    gap: .75rem;
    border-bottom: 1px solid #edf1ee;
    color: inherit;
    padding: .82rem .4rem;
    text-decoration: none;
}

    .profile-order-row:last-child {
        border-bottom: 0;
    }

    .profile-order-row:hover {
        border-radius: .65rem;
        background: #f7fbf8;
        color: inherit;
    }

.profile-order-image {
    display: grid;
    width: 44px;
    height: 44px;
    place-items: center;
    overflow: hidden;
    border-radius: .55rem;
    background: var(--tree-50);
    color: var(--tree-700);
    font-size: 1.2rem;
}

    .profile-order-image img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

.profile-order-main {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: .25rem;
}

    .profile-order-main strong {
        color: var(--ink);
        font-size: .78rem;
    }

    .profile-order-main span {
        overflow: hidden;
        color: var(--muted);
        font-size: .7rem;
        font-weight: 600;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.profile-order-meta {
    display: flex;
    align-items: end;
    flex-direction: column;
    gap: .35rem;
}

    .profile-order-meta > strong {
        color: var(--ink);
        font-size: .75rem;
        white-space: nowrap;
    }

.order-status {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    font-size: .62rem;
    font-weight: 800;
    line-height: 1;
    padding: .3rem .46rem;
    white-space: nowrap;
}

    .order-status.is-delivered {
        background: #e5f7e9;
        color: #198549;
    }

    .order-status.is-shipped {
        background: #e3f0fe;
        color: #2876bb;
    }

    .order-status.is-cancelled {
        background: #f2f3f3;
        color: #64716a;
    }

    .order-status.is-processing {
        background: #fff3da;
        color: #aa720c;
    }

.profile-order-arrow {
    color: var(--tree-700);
    font-size: 1.4rem;
    line-height: 1;
}

@media (max-width: 991.98px) {
    .profile-layout {
        grid-template-columns: 1fr;
    }

    .profile-sidebar {
        position: static;
    }

    .profile-sidebar-user {
        padding-bottom: 1rem;
    }

    .profile-nav {
        display: flex;
        flex-wrap: wrap;
        gap: .25rem;
        padding: .65rem;
    }

    .profile-nav-link {
        width: auto;
        margin: 0;
    }

    .profile-help-card {
        display: none;
    }
}

@media (max-width: 767.98px) {
    .profile-page {
        padding-top: 1rem;
    }

    .profile-information-card, .profile-bottom-grid {
        grid-template-columns: 1fr;
    }

    .profile-photo-section {
        order: -1;
        border-bottom: 1px solid var(--line);
        border-left: 0;
    }

        .profile-photo-section h2 {
            display: none;
        }

    .profile-avatar-large {
        width: 86px;
        height: 86px;
        margin-top: 0;
        font-size: 1.75rem;
    }

    .profile-form-section {
        padding: 1.2rem;
    }

    .profile-fields {
        grid-template-columns: 1fr;
        gap: .8rem;
        margin-top: 1.1rem;
    }

    .profile-bottom-grid {
        gap: 1rem;
    }

    .profile-card-header {
        padding: .95rem 1rem;
    }

    .saved-address-row {
        padding: 1rem;
    }

    .profile-card-note {
        margin-left: 1rem;
    }

    .profile-order-row {
        grid-template-columns: 40px minmax(0, 1fr) 10px;
        gap: .55rem;
    }

    .profile-order-image {
        width: 40px;
        height: 40px;
    }

    .profile-order-meta {
        grid-column: 2;
        grid-row: 2;
        align-items: start;
        flex-direction: row;
        gap: .45rem;
    }

    .profile-order-arrow {
        grid-column: 3;
        grid-row: 1 / span 2;
    }
}

.page-heading {
    margin-bottom: 2rem;
}

.empty-panel {
    padding: 2.25rem;
    border: 1px dashed #b9cdb9;
    border-radius: 1rem;
    background: #f5faf3;
    color: var(--muted);
    text-align: center;
}

    .empty-panel h3 {
        margin-bottom: .5rem;
        color: var(--ink);
    }

    .empty-panel p {
        margin-bottom: 1.15rem;
    }

.notification-card .card-body {
    padding: 1.2rem 1.3rem;
}

.notification-card.unread {
    border-color: #98c2a2;
    background: #f9fdf7;
}

    .notification-card.unread .card-body::before {
        display: inline-block;
        width: .55rem;
        height: .55rem;
        margin-right: .55rem;
        border-radius: 50%;
        background: var(--green);
        content: "";
    }

.order-history-card .card-body {
    padding: 1.25rem 1.35rem;
}

.order-history-card h5 {
    margin-bottom: 1rem;
    color: var(--ink);
    font-size: 1rem;
}

.order-item-list {
    display: grid;
    gap: .65rem;
    padding: 0;
    margin: 0 0 1.25rem;
    list-style: none;
}

    .order-item-list li {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 1rem;
        padding-bottom: .65rem;
        border-bottom: 1px solid var(--line);
        color: var(--ink);
    }

        .order-item-list li span:last-child {
            color: var(--muted);
            font-size: .9rem;
        }

.status-pill {
    display: inline-flex;
    align-items: center;
    padding: .34rem .7rem;
    border-radius: 999px;
    background: #e8f0ff;
    color: #315ea8;
    font-size: .78rem;
    font-weight: 700;
}

    .status-pill.status-delivered {
        background: #dff3df;
        color: #24643c;
    }

@media (max-width: 575px) {
    .simple-page {
        padding-top: 2.5rem;
    }

    .order-item-list li {
        align-items: flex-start;
        flex-direction: column;
        gap: .15rem;
    }
}

/* Farm-owner forms and farm orders */
.plant-form-card {
    padding: clamp(1.25rem, 3vw, 2rem);
    border: 1px solid var(--line);
    border-radius: 1.1rem;
    background: #fff;
    box-shadow: 0 15px 36px rgba(34, 57, 45, .07);
}

    .plant-form-card .form-label {
        margin-bottom: .45rem;
        color: var(--ink);
        font-size: .88rem;
        font-weight: 750;
    }

    .plant-form-card textarea.form-control {
        min-height: 120px;
        resize: vertical;
    }

.plant-details-section {
    min-width: 0;
    margin: .2rem 0;
    padding: 1.25rem;
    border: 1px solid #cde2cf;
    border-radius: .95rem;
    background: linear-gradient(145deg, var(--tree-50), #fff);
}

    .plant-details-section legend {
        float: none;
        width: auto;
        margin: 0 0 .3rem;
        padding: 0;
        color: var(--tree-950);
        font-size: 1.02rem;
        font-weight: 800;
    }

    .plant-details-section > p {
        margin: 0 0 1rem;
        color: var(--muted);
        font-size: .84rem;
    }

    .plant-details-section textarea.form-control {
        min-height: 74px;
    }

.form-actions {
    display: flex;
    justify-content: flex-end;
    gap: .75rem;
    margin-top: 1.75rem;
    padding-top: 1.25rem;
    border-top: 1px solid var(--line);
}

.farm-order-list {
    display: grid;
    gap: 1rem;
}

.farm-order-card {
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 1rem;
    box-shadow: 0 10px 28px rgba(34, 57, 45, .06);
}

    .farm-order-card .card-header {
        padding: 1rem 1.25rem;
        border-bottom: 1px solid var(--line);
        background: #fff;
        color: var(--ink);
    }

    .farm-order-card .card-body {
        display: grid;
        grid-template-columns: minmax(190px, .7fr) minmax(0, 1.3fr);
        gap: 2rem;
        padding: 1.3rem 1.25rem;
    }

.farm-order-customer {
    display: grid;
    align-content: start;
    gap: .25rem;
    padding: 1rem;
    border-radius: .8rem;
    background: var(--tree-50);
}

    .farm-order-customer span {
        color: var(--muted);
        font-size: .75rem;
        font-weight: 750;
        text-transform: uppercase;
        letter-spacing: .05em;
    }

    .farm-order-customer strong {
        color: var(--tree-950);
    }

    .farm-order-customer small {
        color: var(--muted);
    }

.farm-order-card h5 {
    margin: .1rem 0 1rem;
    color: var(--ink);
    font-size: 1rem;
}

.farm-order-card .order-item-list {
    margin-bottom: 0;
}

@media (max-width: 767.98px) {
    .farm-order-card .card-body {
        grid-template-columns: 1fr;
        gap: 1.15rem;
    }

    .form-actions {
        justify-content: stretch;
    }

        .form-actions .btn {
            flex: 1;
        }
}

/* Admin management tables */
.management-page .page-heading {
    margin-bottom: 2rem;
}

    .management-page .page-heading > .btn {
        flex: 0 0 auto;
    }

.table-card {
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 1rem;
    background: #fff;
    box-shadow: 0 10px 28px rgba(34, 57, 45, .06);
}

.management-table th {
    padding: 1rem 1.25rem;
    border-bottom: 1px solid var(--line);
    background: var(--tree-50);
    color: var(--tree-800);
    font-size: .74rem;
    letter-spacing: .055em;
    text-transform: uppercase;
}

.management-table td {
    padding: 1rem 1.25rem;
    border-color: var(--line);
    color: var(--ink);
}

.management-table tbody tr:last-child td {
    border-bottom: 0;
}

.management-table tbody tr:hover {
    background: #fbfdfb;
}

.order-admin-total {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 1.25rem;
    padding: 1rem 0 0;
    border-top: 1px solid var(--line);
    color: var(--muted);
}

    .order-admin-total strong {
        color: var(--tree-950);
        font-size: 1.25rem;
    }

.farm-profile-card {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1.5rem;
    padding: clamp(1.4rem, 4vw, 2.25rem);
    border: 1px solid #c6e1c3;
    border-radius: 1.1rem;
    background: linear-gradient(135deg, var(--tree-50), #fff);
    box-shadow: 0 12px 30px rgba(34, 57, 45, .06);
}

    .farm-profile-card h2 {
        margin: .45rem 0 .4rem;
        color: var(--tree-950);
        font-size: clamp(1.6rem, 4vw, 2.35rem);
        font-weight: 850;
        letter-spacing: -.05em;
    }

    .farm-profile-card p {
        margin: 0;
        color: var(--muted);
    }

.farm-detail-value {
    color: var(--tree-950);
    font-size: 1.15rem;
    font-weight: 750;
    letter-spacing: 0;
    line-height: 1.35;
}

@media (max-width: 575px) {
    .farm-profile-card {
        flex-direction: column;
    }
}

/* Product type and variety management */
.classification-list {
    display: grid;
    gap: 1rem;
}

.classification-card {
    padding: 1.15rem;
    border: 1px solid var(--line);
    border-radius: 1rem;
    background: #fff;
    box-shadow: 0 10px 24px rgba(34, 57, 45, .05);
}

.classification-type-row, .classification-variety-row {
    display: flex;
    align-items: center;
    gap: .65rem;
}

.classification-edit-form, .classification-add-variety {
    display: flex;
    flex: 1;
    align-items: center;
    gap: .65rem;
}

.classification-varieties {
    display: grid;
    gap: .6rem;
    margin: 1rem 0;
    padding: 1rem 0;
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
}

    .classification-varieties h2 {
        margin: 0 0 .1rem;
        color: var(--tree-950);
        font-size: .9rem;
        font-weight: 800;
    }

.classification-add-variety {
    padding-top: .15rem;
}

@media (max-width: 575px) {
    .classification-type-row, .classification-variety-row {
        align-items: stretch;
        flex-direction: column;
    }

    .classification-edit-form, .classification-add-variety {
        width: 100%;
    }
}

/* Informational pages */
.info-card {
    display: grid;
    gap: 1.5rem;
    padding: clamp(1.4rem, 4vw, 2.5rem);
    border: 1px solid var(--line);
    border-radius: 1.1rem;
    background: #fff;
    box-shadow: 0 12px 30px rgba(34, 57, 45, .06);
}

    .info-card section + section {
        padding-top: 1.5rem;
        border-top: 1px solid var(--line);
    }

    .info-card h2 {
        margin-bottom: .55rem;
        color: var(--tree-950);
        font-size: 1.15rem;
        font-weight: 800;
    }

    .info-card p {
        max-width: 760px;
        margin-bottom: 0;
        color: var(--muted);
        line-height: 1.7;
    }

    .info-card .btn {
        margin-top: 1rem;
    }

.contact-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

.contact-card {
    display: grid;
    gap: .45rem;
    min-height: 190px;
    padding: 1.45rem;
    border: 1px solid var(--line);
    border-radius: 1rem;
    background: #fff;
    color: inherit;
    box-shadow: 0 10px 26px rgba(34, 57, 45, .06);
    text-decoration: none;
    transition: transform .2s ease, border-color .2s ease;
}

    .contact-card:hover {
        border-color: #9acb9a;
        color: inherit;
        transform: translateY(-3px);
    }

    .contact-card span {
        color: var(--muted);
        font-size: .8rem;
        font-weight: 750;
        text-transform: uppercase;
        letter-spacing: .06em;
    }

    .contact-card strong {
        color: var(--tree-950);
        font-size: 1.1rem;
    }

    .contact-card small {
        align-self: end;
        color: var(--muted);
    }

@media (max-width: 767.98px) {
    .contact-grid {
        grid-template-columns: 1fr;
    }
}

/* ASP.NET Identity account pages */
.identity-page {
    min-height: 74vh;
    padding: 4rem 0 5rem;
    background: linear-gradient(140deg, var(--tree-50), #fff 52%);
}

.identity-page-container {
    display: grid;
    grid-template-columns: minmax(0, .9fr) minmax(360px, 1fr);
    align-items: center;
    gap: clamp(2rem, 7vw, 7rem);
    max-width: 1080px;
}

.identity-intro h1 {
    max-width: 420px;
    margin: .6rem 0 1rem;
    color: var(--tree-950);
    font-size: clamp(2.6rem, 5vw, 4.25rem);
    font-weight: 850;
    letter-spacing: -.07em;
    line-height: .95;
}

.identity-intro p {
    max-width: 430px;
    margin: 0;
    color: var(--muted);
    font-size: 1.03rem;
    line-height: 1.7;
}

.identity-card {
    padding: clamp(1.5rem, 4vw, 2.5rem);
    border: 1px solid var(--line);
    border-radius: 1.25rem;
    background: #fff;
    box-shadow: 0 18px 45px rgba(34, 57, 45, .1);
}

    .identity-card h1 {
        margin-bottom: .4rem;
        color: var(--tree-950);
        font-size: 1.85rem;
        font-weight: 850;
        letter-spacing: -.04em;
    }

    .identity-card h2, .identity-card h3 {
        margin: .5rem 0 1.4rem;
        color: var(--muted);
        font-size: .9rem;
        font-weight: 500;
        line-height: 1.55;
    }

    .identity-card hr {
        margin: 1.25rem 0;
        border-color: var(--line);
    }

    .identity-card .form-floating {
        margin-bottom: .9rem;
    }

        .identity-card .form-floating > .form-control {
            min-height: 3.4rem;
            border-color: var(--line);
            border-radius: .7rem;
        }

    .identity-card .form-check {
        margin: 1rem 0;
    }

    .identity-card button[type="submit"] {
        width: 100%;
        padding: .72rem 1rem;
        border: 0;
        border-radius: .65rem;
        background: var(--tree-700);
        color: #fff;
        font-weight: 750;
    }

        .identity-card button[type="submit"]:hover {
            background: var(--tree-950);
        }

    .identity-card a {
        color: var(--green-dark);
        font-weight: 650;
    }

    .identity-card .text-danger {
        font-size: .84rem;
    }

    .identity-card .row {
        display: block;
    }

        .identity-card .row > [class*="col-"] {
            width: 100%;
            max-width: none;
        }

    .identity-card #external-account {
        display: none;
    }

    .identity-card .row > .col-md-6.col-md-offset-2 {
        display: none;
    }

@media (max-width: 767.98px) {
    .identity-page {
        padding: 2.75rem 0 4rem;
    }

    .identity-page-container {
        grid-template-columns: 1fr;
        gap: 2rem;
    }

    .identity-intro h1 {
        max-width: 520px;
    }
}

/* Green Stock opening mark */
.brand-intro {
    position: fixed;
    inset: 0;
    z-index: 2000;
    display: grid;
    place-items: center;
    padding: 1.5rem;
    background: rgba(255, 255, 255, .98);
    animation: brand-intro-finish .45s ease 2.65s forwards;
}

.brand-intro-card {
    width: min(92vw, 430px);
    text-align: center;
}

.brand-intro-logo {
    display: block;
    width: 100%;
    max-width: 400px;
    margin: 0 auto;
    overflow: visible;
}

.brand-intro-pillar {
    opacity: 0;
    transform-box: fill-box;
    transform-origin: center bottom;
    transform: translateY(94px);
    animation: brand-pillar-rise .56s cubic-bezier(.2, .8, .25, 1) forwards;
}

.brand-intro-pillar-one {
    animation-delay: .1s;
}

.brand-intro-pillar-two {
    animation-delay: .28s;
}

.brand-intro-pillar-three {
    animation-delay: .46s;
}

.brand-intro-pillar-four {
    animation-delay: .64s;
}

.brand-intro-bar {
    fill: #20b99d;
}

.brand-intro-stem {
    fill: none;
    stroke: #07876f;
    stroke-linecap: round;
    stroke-width: 4;
}

.brand-intro-leaf {
    fill: #079b7b;
}

.brand-intro-arrow {
    fill: none;
    stroke: #55565b;
    stroke-linecap: square;
    stroke-linejoin: miter;
    stroke-width: 12;
    stroke-dasharray: 510;
    stroke-dashoffset: 510;
    animation: brand-arrow-draw .55s linear 1.25s forwards;
}

.brand-intro-arrowhead {
    fill: #55565b;
    opacity: 0;
    transform-box: fill-box;
    transform-origin: 34% 57%;
    animation: brand-arrowhead-travel .45s linear 1.25s forwards;
}

.brand-intro-wordmark {
    display: grid;
    gap: .3rem;
    margin-top: -1.1rem;
    opacity: 0;
    transform: translateY(11px);
    animation: brand-wordmark-fade .52s ease 1.75s forwards;
}

    .brand-intro-wordmark strong {
        color: #55565b;
        font-size: clamp(1.75rem, 7.5vw, 2.75rem);
        font-weight: 500;
        letter-spacing: .035em;
        line-height: 1;
    }

    .brand-intro-wordmark span {
        color: #00a98b;
        font-size: clamp(.77rem, 3vw, 1.08rem);
        font-weight: 700;
        letter-spacing: .28em;
        text-transform: uppercase;
    }

@keyframes brand-pillar-rise {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes brand-arrow-draw {
    to {
        stroke-dashoffset: 0;
    }
}

@keyframes brand-wordmark-fade {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes brand-arrowhead-travel {
    0% {
        opacity: 1;
        transform: translate(-280px, 168px) rotate(-6deg);
    }

    36% {
        transform: translate(-190px, 75px) rotate(-6deg);
    }

    55.5% {
        transform: translate(-125px, 99px) rotate(60deg);
    }

    100% {
        opacity: 1;
        transform: translate(40px, -32px) rotate(0);
    }
}

@keyframes brand-intro-finish {
    to {
        opacity: 0;
        visibility: hidden;
    }
}

@media (prefers-reduced-motion: reduce) {
    .brand-intro {
        display: none;
    }
}


/* Product image upload / management */
.product-admin-thumb {
    width: 64px;
    height: 64px;
    border-radius: 14px;
    object-fit: cover;
    border: 1px solid rgba(31, 93, 65, .16);
    background: #eef6ef;
}

/* Storefront homepage */
.treehub-home-page {
    padding: .55rem 0 2.5rem;
}

.treehub-hero {
    position: relative;
    min-height: 400px;
    overflow: hidden;
    border-radius: .8rem;
    background: #f1f7f3;
}

.treehub-hero-image {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.treehub-hero::after {
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(248, 252, 249, .98) 0%, rgba(248, 252, 249, .92) 31%, rgba(248, 252, 249, .1) 62%, rgba(248, 252, 249, .02) 100%);
    content: "";
}

.treehub-hero-copy {
    position: relative;
    z-index: 1;
    width: min(100%, 450px);
    padding: clamp(2.5rem, 5vw, 4.3rem) 0 2rem clamp(2rem, 8.2vw, 7.2rem);
}

.treehub-hero-label {
    display: inline-block;
    padding: .38rem .75rem;
    border-radius: 999px;
    background: #e4f5e8;
    color: #168a4d;
    font-size: .74rem;
    font-weight: 800;
}

.treehub-hero h1 {
    margin: 1rem 0 .8rem;
    color: #161e1a;
    font-size: clamp(2.6rem, 4.1vw, 4.3rem);
    font-weight: 850;
    letter-spacing: -.065em;
    line-height: 1.04;
}

    .treehub-hero h1 span {
        color: #15914d;
    }

.treehub-hero p {
    max-width: 380px;
    margin: 0;
    color: #5c655f;
    font-size: 1.02rem;
    font-weight: 550;
    line-height: 1.5;
}

.treehub-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .85rem;
    margin-top: 1.55rem;
}

    .treehub-hero-actions .btn {
        padding: .72rem 1.5rem;
        border-radius: .5rem;
        font-size: .86rem;
    }

.treehub-learn-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 140px;
    padding: .72rem 1.2rem;
    border: 1px solid #e1e6e2;
    border-radius: .5rem;
    background: #fff;
    color: #606963;
    font-size: .83rem;
    font-weight: 750;
    text-decoration: none;
    box-shadow: 0 2px 6px rgba(21, 44, 31, .05);
}

    .treehub-learn-button:hover {
        color: var(--tree-700);
    }

.treehub-hero-stats {
    position: absolute;
    z-index: 2;
    right: 3%;
    bottom: 2rem;
    display: grid;
    grid-template-columns: repeat(3, minmax(94px, 1fr));
    overflow: hidden;
    min-width: min(360px, 33vw);
    border-radius: .85rem;
    background: rgba(255, 255, 255, .94);
    box-shadow: 0 10px 30px rgba(22, 41, 29, .14);
}

    .treehub-hero-stats > div {
        display: grid;
        place-items: center;
        gap: .2rem;
        min-height: 125px;
        padding: 1rem .7rem;
        border-right: 1px solid #edf0ed;
        text-align: center;
    }

        .treehub-hero-stats > div:last-child {
            border-right: 0;
        }

    .treehub-hero-stats span {
        display: grid;
        width: 2.3rem;
        height: 2.3rem;
        place-items: center;
        border-radius: .7rem;
        background: #e9f6ec;
        color: #12884a;
        font-size: 1.25rem;
    }

    .treehub-hero-stats strong {
        color: #17231d;
        font-size: 1.05rem;
        font-weight: 850;
    }

    .treehub-hero-stats small {
        color: #7b847e;
        font-size: .71rem;
    }

.treehub-benefits {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1.5rem;
    margin: 1.5rem 0 3rem;
    padding: .5rem clamp(.75rem, 5vw, 5rem);
}

    .treehub-benefits > div {
        display: grid;
        grid-template-columns: 2.5rem minmax(0, 1fr);
        gap: .8rem;
        align-items: center;
    }

        .treehub-benefits > div > span {
            display: grid;
            width: 2.4rem;
            height: 2.4rem;
            place-items: center;
            border-radius: .7rem;
            background: #e9f6ec;
            color: #168d4e;
            font-size: 1.05rem;
        }

    .treehub-benefits p {
        margin: 0;
    }

    .treehub-benefits strong, .treehub-benefits small {
        display: block;
    }

    .treehub-benefits strong {
        color: #212722;
        font-size: .79rem;
        font-weight: 850;
    }

    .treehub-benefits small {
        color: #767e78;
        font-size: .75rem;
    }

.treehub-catalogue-section {
    margin-top: 2.35rem;
}

.treehub-section-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
}

    .treehub-section-heading h2 {
        margin: 0;
        color: #202720;
        font-size: 1.15rem;
        font-weight: 850;
        letter-spacing: -.025em;
    }

    .treehub-section-heading a {
        color: #168c4c;
        font-size: .79rem;
        font-weight: 800;
        text-decoration: none;
    }

.treehub-category-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 1.6rem;
}

.treehub-category-card {
    min-width: 0;
    color: inherit;
    text-decoration: none;
}

.treehub-category-image {
    display: grid;
    height: 112px;
    place-items: center;
    overflow: hidden;
    border-radius: .55rem;
    background: #f4f6f3;
}

    .treehub-category-image img {
        width: 100%;
        height: 100%;
        object-fit: contain;
        padding: .35rem;
        transition: transform .22s ease;
    }

.treehub-category-card:hover img {
    transform: scale(1.06);
}

.treehub-category-image > span {
    color: #15904d;
    font-size: 2.2rem;
}

.treehub-category-card strong, .treehub-category-card small {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.treehub-category-card strong {
    margin-top: .7rem;
    color: #4c544f;
    font-size: .82rem;
    font-weight: 800;
}

.treehub-category-card small {
    margin-top: .12rem;
    color: #929893;
    font-size: .73rem;
}

.treehub-product-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: .85rem;
}

.treehub-product-card {
    min-width: 0;
    overflow: hidden;
    border: 1px solid #ebeeeb;
    border-radius: .65rem;
    background: #fff;
    box-shadow: 0 3px 11px rgba(24, 45, 32, .06);
    transition: transform .2s ease, box-shadow .2s ease;
}

    .treehub-product-card:hover {
        transform: translateY(-3px);
        box-shadow: 0 10px 18px rgba(24, 45, 32, .1);
    }

.treehub-product-image {
    position: relative;
    display: grid;
    height: 130px;
    place-items: center;
    overflow: hidden;
    background: #f5f6f4;
}

    .treehub-product-image img {
        width: 100%;
        height: 100%;
        object-fit: contain;
        padding: .4rem;
    }

.treehub-product-heart {
    position: absolute;
    z-index: 1;
    top: .55rem;
    right: .55rem;
    color: #818782;
    font-size: 1.25rem;
}

.treehub-image-placeholder {
    color: #89938c;
    font-size: .72rem;
}

.treehub-product-info {
    padding: .75rem;
}

    .treehub-product-info h3 {
        overflow: hidden;
        margin: 0 0 .35rem;
        color: #3e4941;
        font-size: .79rem;
        font-weight: 800;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

        .treehub-product-info h3 a {
            color: inherit;
            text-decoration: none;
        }

    .treehub-product-info > strong {
        display: block;
        color: #13924c;
        font-size: .8rem;
        font-weight: 850;
    }

.treehub-product-rating {
    display: block;
    overflow: hidden;
    margin-top: .35rem;
    color: #f2c300;
    font-size: .65rem;
    letter-spacing: .04rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

    .treehub-product-rating small {
        color: #858c87;
        font-size: .64rem;
        letter-spacing: 0;
    }

.treehub-empty-message {
    padding: 2rem;
    border: 1px dashed var(--line);
    border-radius: .8rem;
    color: var(--muted);
    text-align: center;
}

@media (max-width: 991.98px) {
    .treehub-category-grid, .treehub-product-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .treehub-benefits {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .treehub-hero-copy {
        padding-left: 3rem;
    }

    .treehub-hero-stats {
        min-width: 340px;
    }
}

@media (max-width: 575.98px) {
    .treehub-home-page {
        padding-top: 0;
    }

    .treehub-hero {
        min-height: 530px;
    }

    .treehub-hero-image {
        object-position: 65% center;
    }

    .treehub-hero::after {
        background: linear-gradient(180deg, rgba(248,252,249,.97), rgba(248,252,249,.83) 57%, rgba(248,252,249,.24));
    }

    .treehub-hero-copy {
        width: 100%;
        padding: 2rem 1.35rem;
    }

    .treehub-hero h1 {
        font-size: 2.65rem;
    }

    .treehub-hero-stats {
        right: 1rem;
        bottom: 1rem;
        left: 1rem;
        min-width: 0;
    }

        .treehub-hero-stats > div {
            min-height: 100px;
        }

    .treehub-benefits {
        grid-template-columns: 1fr 1fr;
        gap: 1rem;
        margin: 1.4rem 0 2.2rem;
        padding: 0;
    }

        .treehub-benefits > div {
            grid-template-columns: 2.25rem minmax(0,1fr);
            gap: .5rem;
        }

    .treehub-category-grid, .treehub-product-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: .8rem;
    }

    .treehub-category-image {
        height: 115px;
    }

    .treehub-product-image {
        height: 145px;
    }
}

/* All plants storefront */
.plants-store-page {
    padding: 2.6rem 0 3.5rem;
}

.plants-store-breadcrumb {
    display: flex;
    align-items: center;
    gap: .45rem;
    margin-bottom: 1.25rem;
    color: #768078;
    font-size: .78rem;
    font-weight: 700;
}

    .plants-store-breadcrumb a {
        color: inherit;
        text-decoration: none;
    }

    .plants-store-breadcrumb strong {
        color: #506057;
    }

.plants-store-layout {
    display: grid;
    grid-template-columns: 245px minmax(0, 1fr);
    gap: 2.4rem;
    align-items: start;
}

.plants-filter-sidebar {
    overflow: hidden;
    border: 1px solid #edf0ed;
    border-radius: .7rem;
    background: #fff;
    box-shadow: 0 3px 12px rgba(25, 47, 34, .04);
}

.plants-filter-section {
    padding: 1.5rem 1.1rem;
    border-bottom: 1px solid #edf0ed;
}

    .plants-filter-section h2 {
        margin: 0 0 1rem;
        color: #242b25;
        font-size: .88rem;
        font-weight: 850;
    }

.plants-category-filter {
    display: grid;
    gap: .35rem;
}

    .plants-category-filter h2 {
        margin-bottom: .65rem;
    }

    .plants-category-filter a {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: .5rem;
        padding: .55rem .7rem;
        border-radius: .45rem;
        color: #657068;
        font-size: .77rem;
        font-weight: 700;
        text-decoration: none;
    }

        .plants-category-filter a:hover, .plants-category-filter a.is-active {
            background: #ebf8ee;
            color: #15904c;
        }

    .plants-category-filter b {
        display: grid;
        min-width: 1.45rem;
        height: 1.45rem;
        place-items: center;
        border-radius: 999px;
        background: #f0f2f0;
        color: #79827b;
        font-size: .65rem;
    }

    .plants-category-filter a.is-active b {
        background: #dcf1e2;
        color: #198a4c;
    }

.plants-price-range {
    margin: 0 0 .75rem;
    color: #1a984f;
    font-size: .76rem;
    font-weight: 800;
}

.plants-price-inputs {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    gap: .3rem;
    align-items: center;
}

    .plants-price-inputs input {
        width: 100%;
        min-width: 0;
        height: 34px;
        padding: .35rem .5rem;
        border: 1px solid #dce5dd;
        border-radius: .4rem;
        color: #526057;
        font-size: .72rem;
    }

    .plants-price-inputs span {
        color: #8e9790;
    }

.plants-checkbox-option {
    display: flex;
    align-items: center;
    gap: .55rem;
    margin-bottom: .65rem;
    color: #657068;
    font-size: .76rem;
    font-weight: 650;
}

    .plants-checkbox-option:last-child {
        margin-bottom: 0;
    }

    .plants-checkbox-option input {
        width: 1rem;
        height: 1rem;
        margin: 0;
        accent-color: #178e4d;
    }

.plants-filter-submit {
    width: calc(100% - 2.2rem);
    margin: 1rem 1.1rem .6rem;
    padding: .58rem .8rem;
    border-radius: .45rem;
    font-size: .76rem;
}

.plants-clear-filters {
    display: block;
    padding: 0 0 1.2rem;
    color: #158e4c;
    font-size: .75rem;
    font-weight: 800;
    text-align: center;
    text-decoration: none;
}

.plants-store-content {
    min-width: 0;
}

.plants-store-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 2rem;
    margin-bottom: 1.55rem;
}

    .plants-store-heading h1 {
        margin: 0 0 .35rem;
        color: #171d18;
        font-size: clamp(2rem, 3.2vw, 2.55rem);
        font-weight: 850;
        letter-spacing: -.06em;
    }

    .plants-store-heading p {
        margin: 0;
        color: #657068;
        font-size: .88rem;
    }

.plants-store-sort {
    display: flex;
    align-items: center;
    gap: .7rem;
    color: #69736c;
    font-size: .78rem;
    font-weight: 750;
    white-space: nowrap;
}

    .plants-store-sort select {
        min-width: 145px;
        height: 42px;
        padding: 0 .8rem;
        border: 1px solid #dfe6df;
        border-radius: .45rem;
        background: #fff;
        color: #39433c;
        font-size: .78rem;
        font-weight: 750;
    }

.plants-search-form {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: .65rem;
    margin: -.25rem 0 1rem;
}

    .plants-search-form input[type="search"] {
        min-width: 0;
        height: 44px;
        padding: 0 .95rem;
        border: 1px solid #dfe6df;
        border-radius: .5rem;
        background: #fff;
        color: #334038;
        font-size: .82rem;
    }

        .plants-search-form input[type="search"]:focus {
            outline: 0;
            border-color: #259858;
            box-shadow: 0 0 0 .2rem rgba(37, 152, 88, .12);
        }

    .plants-search-form button {
        min-width: 108px;
        border-radius: .5rem;
        font-size: .78rem;
    }

.plants-results-summary {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1.7rem;
    color: #69736c;
    font-size: .78rem;
    font-weight: 700;
}

    .plants-results-summary span {
        padding: .65rem .9rem;
        border: 1px solid #e4e9e4;
        border-radius: .45rem;
        background: #fafcfb;
    }

    .plants-results-summary a {
        color: #168d4b;
        font-weight: 800;
        text-decoration: none;
    }

.plants-store-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1.25rem;
}

.plants-store-card {
    position: relative;
    min-width: 0;
    overflow: hidden;
    border: 1px solid #e9edeb;
    border-radius: .7rem;
    background: #fff;
    box-shadow: 0 3px 11px rgba(25, 47, 34, .06);
    transition: transform .2s ease, box-shadow .2s ease;
}

    .plants-store-card:hover {
        transform: translateY(-3px);
        box-shadow: 0 12px 22px rgba(25, 47, 34, .1);
    }

.plants-store-image {
    position: relative;
    display: grid;
    height: 205px;
    place-items: center;
    overflow: hidden;
    background: #f7f8f6;
}

    .plants-store-image img {
        width: 100%;
        height: 100%;
        object-fit: contain;
        padding: .55rem;
    }

.plants-store-favorite-form {
    position: absolute;
    z-index: 2;
    top: .4rem;
    right: .45rem;
}

.plants-store-heart {
    display: grid;
    width: 2rem;
    height: 2rem;
    place-items: center;
    border: 0;
    border-radius: 50%;
    background: rgba(255,255,255,.82);
    color: #667069;
    font-size: 1.35rem;
    line-height: 1;
}

    .plants-store-heart:hover, .plants-store-heart.is-favorite {
        background: #fff;
        color: #168e4c;
        box-shadow: 0 3px 10px rgba(17, 65, 40, .15);
    }

.plants-store-image-placeholder {
    color: #859088;
    font-size: .73rem;
}

.plants-store-card-info {
    padding: .85rem .8rem .8rem;
}

    .plants-store-card-info h2 {
        overflow: hidden;
        margin: 0 0 .4rem;
        color: #29332c;
        font-size: .79rem;
        font-weight: 850;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

        .plants-store-card-info h2 a {
            color: inherit;
            text-decoration: none;
        }

    .plants-store-card-info > strong {
        display: block;
        color: #15924d;
        font-size: .82rem;
        font-weight: 850;
    }

.plants-store-rating {
    display: block;
    overflow: hidden;
    margin: .4rem 0 .65rem;
    color: #f0c300;
    font-size: .7rem;
    letter-spacing: .035rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

    .plants-store-rating small {
        color: #7d857f;
        font-size: .65rem;
        letter-spacing: 0;
    }

.plants-store-cart-button {
    display: block;
    width: 100%;
    padding: .45rem .5rem;
    border: 1px solid #73c596;
    border-radius: .4rem;
    background: #fff;
    color: #168d4a;
    font-size: .71rem;
    font-weight: 850;
    text-align: center;
}

    .plants-store-cart-button:hover {
        border-color: #178e4d;
        background: #178e4d;
        color: #fff;
    }

.plants-store-pagination {
    display: flex;
    justify-content: center;
    gap: .35rem;
    margin-top: 2rem;
}

    .plants-store-pagination a {
        display: grid;
        width: 2.2rem;
        height: 2.2rem;
        place-items: center;
        border: 1px solid #e1e7e2;
        border-radius: .4rem;
        color: #657069;
        font-size: .78rem;
        font-weight: 800;
        text-decoration: none;
    }

        .plants-store-pagination a:hover, .plants-store-pagination a.is-current {
            border-color: #148c4b;
            background: #148c4b;
            color: #fff;
        }

@media (max-width: 1199.98px) {
    .plants-store-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 767.98px) {
    .plants-store-page {
        padding-top: 1.5rem;
    }

    .plants-store-layout {
        grid-template-columns: 1fr;
        gap: 1.25rem;
    }

    .plants-filter-sidebar {
        order: 2;
    }

    .plants-store-content {
        order: 1;
    }

    .plants-store-heading {
        align-items: flex-start;
        flex-direction: column;
        gap: 1rem;
    }
}

@media (max-width: 575.98px) {
    .plants-store-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: .75rem;
    }

    .plants-store-image {
        height: 145px;
    }

    .plants-store-card-info {
        padding: .7rem .6rem;
    }

    .plants-store-sort {
        width: 100%;
        justify-content: space-between;
    }

        .plants-store-sort select {
            min-width: 0;
            width: 68%;
        }

    .plants-search-form {
        grid-template-columns: 1fr;
    }

        .plants-search-form button {
            width: 100%;
        }
}

.product-admin-thumb-empty {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 6px;
    color: #6c757d;
    font-size: .68rem;
    text-align: center;
}

.product-form-preview {
    display: block;
    width: min(100%, 320px);
    max-height: 240px;
    object-fit: cover;
    border-radius: 16px;
    border: 1px solid rgba(31, 93, 65, .16);
    background: #eef6ef;
}


/* =====================================================
   FAVORITES
===================================================== */

.favorites-page {
    min-height: 70vh;
    background: #f7f9f6;
    padding: 50px 0 80px;
}

.favorites-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 32px;
}

.favorites-eyebrow {
    color: #278049;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1.4px;
}

.favorites-heading h1 {
    color: #18251c;
    font-size: 34px;
    margin: 5px 0;
}

.favorites-heading p {
    color: #768079;
    margin: 0;
}

.favorites-empty {
    background: white;
    border: 1px solid #e2e7e2;
    border-radius: 20px;
    padding: 70px 20px;
    text-align: center;
}

.favorites-empty-heart {
    width: 76px;
    height: 76px;
    border-radius: 50%;
    margin: 0 auto 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #eaf6ed;
    color: #247b44;
    font-size: 42px;
}

.favorites-empty h2 {
    color: #233029;
    margin-bottom: 8px;
}

.favorites-empty p {
    color: #78817a;
    margin-bottom: 20px;
}

.favorites-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 20px;
}

.favorite-card {
    background: white;
    border: 1px solid #e1e6e1;
    border-radius: 16px;
    overflow: hidden;
    transition: .2s ease;
}

    .favorite-card:hover {
        transform: translateY(-3px);
        box-shadow: 0 10px 30px rgba(0, 0, 0, .07);
    }

.favorite-image {
    height: 230px;
    background: #f1f5f1;
    display: block;
    overflow: hidden;
}

    .favorite-image img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

.favorite-image-placeholder {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 50px;
}

.favorite-info {
    padding: 17px;
}

.favorite-name {
    display: block;
    text-decoration: none;
    color: #273329;
    font-size: 16px;
    font-weight: 700;
    margin-bottom: 8px;
}

    .favorite-name:hover {
        color: #247841;
    }

.favorite-price {
    color: #19713a;
    display: block;
    margin-bottom: 16px;
}

.favorite-actions {
    display: flex;
    align-items: center;
    gap: 9px;
}

    .favorite-actions .btn {
        flex: 1;
    }

.favorite-remove {
    width: 41px;
    height: 38px;
    border-radius: 8px;
    border: 1px solid #e6caca;
    background: #fff;
    color: #d44343;
    font-size: 20px;
    cursor: pointer;
}

    .favorite-remove:hover {
        background: #fff1f1;
    }

@media (max-width: 1100px) {
    .favorites-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 800px) {
    .favorites-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 520px) {
    .favorites-grid {
        grid-template-columns: 1fr;
    }

    .favorites-heading {
        align-items: flex-start;
        flex-direction: column;
    }
}