/*
|--------------------------------------------------------------------------
| Locaris – Desktopdarstellung
|--------------------------------------------------------------------------
| Wird ausschließlich ab 769 px geladen.
*/

html,
body {
    min-height: 100%;
}

body {
    background: linear-gradient(
        90deg,
        rgba(30, 144, 255, 0.30) 0%,
        rgba(70,105,255, 0.70) 20%,
        rgba(65, 105, 225, 0.80) 50%,
        rgba(70,105,255, 0.70) 80%,
        rgba(30, 144, 255, 0.30) 100%
    );
    background-attachment: fixed;
    font-family: var(--locaris-font-body, Arial, Helvetica, sans-serif);
    color: #222;
}

.app-header {
    margin: 1rem auto 0;
    width: min(1500px, calc(100% - 2rem));
    border: 1px solid rgba(255, 255, 255, 0.72);
    border-bottom-color: rgba(47, 74, 60, 0.22);
    border-radius: 1.15rem 1.15rem 0 0;
    background: linear-gradient(
        135deg,
        rgba(255, 255, 255, 0.96),
        rgba(241, 245, 242, 0.90)
    );
    box-shadow:
        0 1.25rem 3rem rgba(20, 35, 28, 0.20),
        inset 0 1px 0 rgba(255, 255, 255, 0.95);
}

.app-main {
    width: min(1500px, calc(100% - 2rem));
    min-height: calc(100vh - 10rem);
    padding: 2rem;
    border: 1px solid rgba(255, 255, 255, 0.66);
    border-top: 0;
    border-radius: 0 0 1.3rem 1.3rem;
    background: linear-gradient(
        145deg,
        rgba(255, 255, 255, 0.90),
        rgba(244, 247, 245, 0.82)
    );
    box-shadow:
        0 1.5rem 4rem rgba(20, 35, 28, 0.22),
        inset 0 1px 0 rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(10px);
}

.app-main--narrow {
    width: min(720px, calc(100% - 2rem));
}

.category-tile,
.place-tile,
.card,
.form-card,
.place-detail {
    border-color: rgba(47, 74, 60, 0.22);
    box-shadow:
        0 0.9rem 2.2rem rgba(22, 38, 30, 0.18),
        0 0.15rem 0.45rem rgba(22, 38, 30, 0.12),
        inset 0 1px 0 rgba(255, 255, 255, 0.92);
}

.category-tile:hover,
.place-tile:hover,
.card:hover {
    transform: translateY(-4px);
    box-shadow:
        0 1.35rem 3rem rgba(22, 38, 30, 0.25),
        0 0.2rem 0.65rem rgba(22, 38, 30, 0.14),
        inset 0 1px 0 rgba(255, 255, 255, 0.96);
}

.card-grid {
    gap: 1.35rem;
}

.place-tile__navigation-links,
.place-detail-navigation-icons {
    gap: 1.25rem;
}

.app-footer {
    color: rgba(255, 255, 255, 0.92);
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.38);
}