/*
 * Alugo identity layer
 * This file intentionally overrides the vendor theme without changing its
 * upgrade-sensitive core stylesheet.
 */
:root {
    --alugo-green: #07883f;
    --alugo-green-dark: #056b33;
    --alugo-green-soft: #eaf7ef;
    --alugo-yellow: #ffbf00;
    --alugo-ink: #151b20;
    --alugo-muted: #5f6b66;
    --alugo-surface: #ffffff;
    --alugo-canvas: #f7faf8;
    --alugo-border: #dce9e1;
    --alugo-radius-sm: 12px;
    --alugo-radius-md: 20px;
    --alugo-radius-lg: 28px;
    --alugo-shadow: 0 18px 50px rgba(7, 75, 37, .10);
}

body {
    color: var(--alugo-ink);
    background: var(--alugo-surface);
}

.header__logo img,
.offcanvas__topbar img {
    width: 168px;
    height: auto;
}

.dashboard__logo img {
    width: 154px;
    height: auto;
}

.btn--base {
    background: var(--alugo-green) !important;
    border-color: var(--alugo-green) !important;
}

.btn--base:hover,
.btn--base:focus {
    background: var(--alugo-green-dark) !important;
    border-color: var(--alugo-green-dark) !important;
}

.highlight,
.text--base {
    color: var(--alugo-green) !important;
}

/*
 * Open Frame: an asymmetric card with a deliberate opening in its border.
 * The opening represents access; the curved terminal represents circulation.
 */
.alugo-open-frame {
    position: relative;
    isolation: isolate;
    border: 1px solid transparent;
    border-radius: var(--alugo-radius-lg);
    background:
        linear-gradient(var(--alugo-surface), var(--alugo-surface)) padding-box,
        conic-gradient(
            from 20deg,
            var(--alugo-border) 0 72%,
            transparent 72% 82%,
            var(--alugo-green) 82% 100%
        ) border-box;
    box-shadow: var(--alugo-shadow);
}

.alugo-open-frame::after {
    content: "";
    position: absolute;
    right: 15%;
    bottom: -4px;
    width: 34px;
    height: 8px;
    border-radius: 999px;
    background: var(--alugo-yellow);
}

.hero__form {
    border-radius: var(--alugo-radius-lg);
}

.hero__form.alugo-open-frame {
    overflow: visible;
}

.category__item {
    border-radius: var(--alugo-radius-md);
    border-color: var(--alugo-border);
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

.category__item:hover {
    transform: translateY(-4px);
    border-color: var(--alugo-green);
    box-shadow: var(--alugo-shadow);
}

.form-control,
.form-select {
    border-radius: var(--alugo-radius-sm);
}

@media (max-width: 575.98px) {
    .header__logo img,
    .offcanvas__topbar img {
        width: 138px;
    }

    .alugo-open-frame::after {
        width: 24px;
    }
}