/* _content/BizNiche/Components/Layout/MainLayout.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════════════════════════
   UYB SHELL — matches unlockyourbizniche.com: cream ground, horizontal nav,
   full-width content. Replaces the Blazor template's 250px dark sidebar and its
   "About → learn.microsoft.com" top row.
   ⛔ Colours here are the live site's own values. Do not invent new ones.
   ═══════════════════════════════════════════════════════════════════════════ */

.uyb-shell[b-3mnup2vdan] {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    min-height: 100dvh;   /* ⚠️ phones count the address bar in vh — dvh is the live height */
    background: #faf2e1;
}

.uyb-main[b-3mnup2vdan] {
    flex: 1;
}

/*  Full width, with a comfortable gutter. ⭐ The games are iframed inside this and were
    previously squeezed by a 250px rail; they get that width back on every screen. */
.uyb-content[b-3mnup2vdan] {
    padding: 0 16px 40px;
}

@media (min-width: 900px) {
    .uyb-content[b-3mnup2vdan] {
        padding: 0 28px 56px;
    }
}

/* ── Footer ───────────────────────────────────────────────────────────────── */
.uyb-foot[b-3mnup2vdan] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 22px 16px 30px;
    border-top: 1px solid #ece0c8;
    margin-top: 20px;
    font-size: 12.5px;
    color: #8a7357;
}

.uyb-foot-brand[b-3mnup2vdan] {
    font-family: "Playfair Display", "Iowan Old Style", Georgia, serif;
    font-weight: 700;
    color: #7a4700;
}

    .uyb-foot-brand b[b-3mnup2vdan] {
        color: #c0703f;
    }

.uyb-foot-sep[b-3mnup2vdan] {
    color: #d9c9ab;
}

.uyb-foot a[b-3mnup2vdan] {
    color: #8a7357;
    text-decoration: none;
    font-weight: 600;
}

    .uyb-foot a:hover[b-3mnup2vdan] {
        color: #965800;
        text-decoration: underline;
    }

.uyb-foot-quiet[b-3mnup2vdan] {
    flex-basis: 100%;
    text-align: center;
    color: #a8977f;
    font-size: 11.5px;
    margin-top: 2px;
}

/* ── Blazor's error strip, kept but brought into brand ────────────────────── */
#blazor-error-ui[b-3mnup2vdan] {
    background: #fbf6e8;
    border-top: 3px solid #c0703f;
    color: #3d2817;
    bottom: 0;
    box-shadow: 0 -1px 12px rgba(61, 40, 23, .18);
    display: none;
    left: 0;
    padding: 0.7rem 1.25rem 0.8rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
    font-weight: 600;
}

    #blazor-error-ui .reload[b-3mnup2vdan] {
        color: #965800;
        font-weight: 800;
    }

    #blazor-error-ui .dismiss[b-3mnup2vdan] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
        color: #8a7357;
    }
/* _content/BizNiche/Components/Layout/NavMenu.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════════════════════════
   UYB NAV BAR — the lockup and links from unlockyourbizniche.com.
   Replaces the Blazor template's dark sidebar rail.
   ⛔ Every colour here is the live site's own value.
   ═══════════════════════════════════════════════════════════════════════════ */

/*  ⭐ THE COVER'S FIELD ACROSS THE TOP OF EVERY PAGE. Mary, 2026-09-04: "need my more blue back
    on every page". This is the app's most repeated surface, so it is where the book's blue does
    the most work — the same gradient that edges the Discovery cards, sitting under the lockup. */
.uyb-bar[b-hyj1j91qkb] {
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 14px 16px 12px;
    background: #faf2e1;
    /*  ⛔ var(--bk-rule) from app.css — ONE definition of the brand rule, never a retyped copy.
        Four hand-typed copies is what let the login card quietly keep the old amber→teal strip
        while everywhere else went blue. (Mary: "blue in branding is fading… set to NOT CHANGE.") */
    border-bottom: 3px solid transparent;
    border-image: var(--bk-rule) 1;
    position: sticky;
    top: 0;
    z-index: 20;
}

@media (min-width: 900px) {
    .uyb-bar[b-hyj1j91qkb] {
        padding: 16px 28px 14px;
        gap: 26px;
    }
}

/* ── The lockup: stacked, Playfair, amber on the second line ─────────────── */
.uyb-lock[b-hyj1j91qkb] {
    flex: none;
    text-decoration: none;
    font-family: "Playfair Display", "Iowan Old Style", Georgia, serif;
    font-weight: 700;
    line-height: 1.02;
    letter-spacing: .005em;
    font-size: 15px;
}

    .uyb-lock span[b-hyj1j91qkb] {
        display: block;
        color: #3d2817;
    }

    .uyb-lock b[b-hyj1j91qkb] {
        display: block;
        color: #965800;
    }

    .uyb-lock:hover b[b-hyj1j91qkb] {
        color: #c0703f;
    }

@media (min-width: 900px) {
    .uyb-lock[b-hyj1j91qkb] { font-size: 17px; }
}

/* ── Links. ⚠️ SCROLLS SIDEWAYS on narrow screens instead of collapsing behind a
      burger — a hand-rolled toggle is a thing that silently breaks; this cannot. ── */
.uyb-links[b-hyj1j91qkb] {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 14px;
    min-width: 0;
    overflow-x: auto;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
}

    .uyb-links[b-hyj1j91qkb]::-webkit-scrollbar { display: none; }

@media (min-width: 900px) {
    .uyb-links[b-hyj1j91qkb] { gap: 20px; }
}

.uyb-link[b-hyj1j91qkb] {
    flex: none;
    white-space: nowrap;
    text-decoration: none;
    color: #5a4029;
    font-weight: 600;
    font-size: 13.5px;
    padding: 5px 0;
    border-bottom: 2px solid transparent;
}

    .uyb-link:hover[b-hyj1j91qkb] {
        color: #965800;
    }

/* Blazor adds .active to the NavLink for the current route */
/*  Blue marks WHERE YOU ARE; amber is reserved for what you can press. */
.uyb-link.active[b-hyj1j91qkb] {
    color: #006cb5;
    font-weight: 800;
    border-bottom-color: #0094d6;
}

.uyb-linkbtn[b-hyj1j91qkb] {
    background: none;
    border: 0;
    cursor: pointer;
    font-family: inherit;
}

/* ── Right-hand auth cluster ─────────────────────────────────────────────── */
.uyb-auth-row[b-hyj1j91qkb] {
    flex: none;
    display: flex;
    align-items: center;
    gap: 12px;
}

.uyb-who[b-hyj1j91qkb] {
    display: none;
    text-decoration: none;
    color: #8a7357;
    font-size: 12.5px;
    font-weight: 700;
    max-width: 16ch;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

@media (min-width: 700px) {
    .uyb-who[b-hyj1j91qkb] { display: block; }
}

.uyb-logout[b-hyj1j91qkb] {
    display: flex;
    margin: 0;
}

/*  ⭐ ONE BUTTON, BOTH SURFACES. Amber #965800, white text — the same control as the site's
    "Enroll — $97". ⛔ Do not restyle this per-page; a button must stay recognisably a button. */
.uyb-cta[b-hyj1j91qkb] {
    flex: none;
    white-space: nowrap;
    text-decoration: none;
    background: #965800;
    color: #fff;
    font-weight: 800;
    font-size: 12.5px;
    padding: 8px 14px;
    border-radius: 9px;
}

    .uyb-cta:hover[b-hyj1j91qkb] {
        background: #7a4700;
        color: #fff;
    }