﻿
.foz-main-content {
    background: var(--foz-bg);
    min-height: 70vh;
    padding-top: 72px;
}

.foz-header {
    background: rgba(247, 244, 239, 0.96) !important;
    backdrop-filter: blur(18px);
    border-bottom: 1px solid rgba(229, 223, 214, 0.85);
    color: var(--foz-text) !important;
}

.foz-header-container {
    display: flex;
    align-items: center;
    gap: 22px;
    width: 100%;
    height: 72px;
}

.foz-brand-link {
    text-decoration: none;
}

.foz-brand-wrap {
    display: flex;
    align-items: center;
    gap: 10px;
}

.foz-logo {
    width: 34px;
    height: 34px;
    border-radius: 12px;
}

.foz-brand {
    font-family: var(--foz-font-heading);
    font-weight: 700 !important;
    color: var(--foz-primary);
    letter-spacing: -0.03em;
}

.foz-nav {
    display: flex;
    align-items: center;
    gap: 18px;
}

.foz-nav-link {
    color: var(--foz-text) !important;
    font-size: 0.92rem;
    font-weight: 500;
    text-decoration: none;
    white-space: nowrap;
    opacity: 0.84;
}

    .foz-nav-link:hover {
        color: var(--foz-primary) !important;
        opacity: 1;
    }

.foz-nav-menu .mud-button-root {
    color: var(--foz-text) !important;
    font-size: 0.92rem;
    font-weight: 500;
    text-transform: none !important;
    opacity: 0.84;
    padding: 0;
    min-width: auto;
}

    .foz-nav-menu .mud-button-root:hover {
        color: var(--foz-primary) !important;
        opacity: 1;
        background: transparent !important;
    }

.foz-header-actions {
    display: flex;
    align-items: center;
    gap: 12px;
}

.foz-header-cta {
    margin-left: 2px;
}

.foz-mobile-menu-button {
    display: none !important;
}

.foz-mobile-drawer {
    width: min(86vw, 380px);
}

.foz-mobile-drawer-inner {
    padding: 24px;
    background: var(--foz-bg);
    min-height: 100%;
}

.foz-mobile-drawer-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 28px;
}

.foz-mobile-language {
    margin-bottom: 22px;
}

.foz-mobile-nav {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.foz-mobile-nav-link {
    padding: 14px 0;
    color: var(--foz-text) !important;
    font-size: 1.05rem;
    font-weight: 600;
    border-bottom: 1px solid var(--foz-border);
}

.foz-mobile-cta {
    width: 100%;
    margin-top: 28px;
}

.foz-footer {
    background: var(--foz-footer-bg);
    color: var(--foz-footer-text);
    border-top: 1px solid var(--foz-border);
    padding: 48px 0;
}

    .foz-footer .foz-muted,
    .foz-footer-muted {
        color: var(--foz-footer-muted);
    }

@media (max-width: 1040px) {
    .foz-nav,
    .foz-header-actions {
        display: none;
    }

    .foz-mobile-menu-button {
        display: inline-flex !important;
    }
}

@media (max-width: 600px) {
    .foz-main-content {
        padding-top: 64px;
    }

    .foz-header-container {
        height: 64px;
    }

    .foz-logo {
        width: 32px;
        height: 32px;
    }
}

/*Language selector: This removes the ugly box/border and makes it feel like part of the menu.*/

.foz-language {
    min-width: 72px;
}

    .foz-language .mud-input-control {
        margin: 0;
    }

    .foz-language .mud-input {
        font-size: 0.9rem;
        font-weight: 500;
        color: var(--foz-text);
    }

    .foz-language .mud-input-underline:before,
    .foz-language .mud-input-underline:after {
        border-bottom: none !important;
    }