namespace FreyaShopManager.wwwroot.css
{
    public class layout_modern
    {
    }
}
/* ====== Layout modern Freya ====== */
:root {
    --bg: #f6f7fb;
    --card: #ffffff;
    --text: #0b1220;
    --muted: #6b7280;
    --brand: #2563eb;
    --brand-2: #4f46e5;
    --ring: #93c5fd;
    --border: rgba(148,163,184,.28);
    --shadow: 0 10px 32px rgba(17,24,39,.08);
}

@media (prefers-color-scheme: dark) {
    :root {
        --bg: #0b1220;
        --card: #0f172a;
        --text: #e5e7eb;
        --muted: #9ca3af;
        --brand: #60a5fa;
        --brand-2: #818cf8;
        --ring: #3b82f6;
        --border: rgba(148,163,184,.22);
        --shadow: 0 12px 40px rgba(0,0,0,.45);
    }
}

/* base */
html, body {
    height: 100%;
}

body {
    background: radial-gradient(1200px 600px at 85% -10%, #e8f0ff 0%, transparent 60%), var(--bg);
    color: var(--text);
    font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans";
}

.fw-800 {
    font-weight: 800;
}

.text-brand {
    color: var(--brand);
}

/* navbar (glass) */
.app-navbar {
    backdrop-filter: blur(10px);
    background: linear-gradient(180deg, rgba(255,255,255,.65), rgba(255,255,255,.35));
    border-bottom: 1px solid var(--border);
    box-shadow: var(--shadow);
}

@media (prefers-color-scheme: dark) {
    .app-navbar {
        background: linear-gradient(180deg, rgba(15,23,42,.75), rgba(15,23,42,.55));
    }
}

.navbar .navbar-brand {
    font-weight: 800;
    letter-spacing: .2px;
}

.navbar .nav-link {
    color: var(--text);
    opacity: .85;
    padding: .5rem .75rem;
    border-radius: 10px;
    transition: background .16s ease, opacity .16s ease;
}

    .navbar .nav-link:hover {
        background: rgba(99,102,241,.08);
        opacity: 1;
    }

    .navbar .nav-link:focus-visible {
        outline: 2px solid var(--ring);
        outline-offset: 2px;
    }

/* main */
.app-main {
    min-height: calc(100vh - 72px - 64px);
}
/* header + footer approx */

/* footer */
.app-footer {
    border-top: 1px solid var(--border);
    padding: 16px 0;
    background: linear-gradient(180deg, rgba(255,255,255,.35), rgba(255,255,255,.25));
}

@media (prefers-color-scheme: dark) {
    .app-footer {
        background: linear-gradient(180deg, rgba(15,23,42,.65), rgba(15,23,42,.45));
    }
}

/* buttons */
.btn-primary {
    --bs-btn-bg: var(--brand);
    --bs-btn-border-color: var(--brand);
    --bs-btn-hover-bg: var(--brand-2);
    --bs-btn-hover-border-color: var(--brand-2);
    --bs-btn-focus-shadow-rgb: 147, 197, 253;
    box-shadow: 0 6px 16px rgba(37,99,235,.25);
}

    .btn-primary:focus-visible {
        outline: 2px solid var(--ring);
        outline-offset: 2px;
    }

/* links */
a {
    color: var(--brand);
}

    a:hover {
        color: var(--brand-2);
    }

/* forms */
.form-control, .form-select {
    border-color: var(--border);
    background-color: var(--card);
    color: var(--text);
}

    .form-control:focus, .form-select:focus {
        border-color: var(--brand-2);
        box-shadow: 0 0 0 .15rem rgba(99,102,241,.25);
    }

/* utility */
.border-bottom {
    border-bottom: 1px solid var(--border) !important;
}

.border-top {
    border-top: 1px solid var(--border) !important;
}

.box-shadow {
    box-shadow: var(--shadow);
}
/* when .force-light is applied, keep nav/footer bright */
.force-light .app-navbar {
    background: linear-gradient(180deg, rgba(255,255,255,.85), rgba(255,255,255,.6));
    border-bottom: 1px solid rgba(203,213,225,.6);
}

.force-light .app-footer {
    background: linear-gradient(180deg, rgba(255,255,255,.6), rgba(255,255,255,.45));
    border-top: 1px solid rgba(203,213,225,.6);
}