/* Palette is driven by brand variables (defined in branding/<brand>/core.css).
   Fallbacks keep reasonable defaults if brand variables are missing. */
:root {
    --fa-bg: var(--fa-bg, #F2F8FF);
    --fa-nav-bg: var(--fa-nav-bg, rgba(242,248,255,0.85));
    --fa-green: var(--fa-primary, #0E4AA0);
    --fa-green-soft: var(--fa-green-soft, #e9f2ff);
    --fa-green-soft-hover: var(--fa-green-soft-hover, #dbeaff);
    --fa-green-soft-active: var(--fa-green-soft-active, #d1e3ff);
    --fa-border: var(--fa-border-soft, #bcd3f1);
    --fa-border-strong: var(--fa-border-strong, #9fbde6);
    --fa-shadow: 0 4px 10px -4px rgba(0,0,0,.12);
    --fa-nav-height: 100px;
    --fa-transition: .18s ease;
}

body {
    background: var(--fa-bg);
    font-family: 'Unbounded', system-ui, sans-serif;
}

/* Общий topbar (для admin и default) */
.navbar.fa-topbar {
    position: fixed;
    top: 0;
    width: 100%;
    background: var(--fa-nav-bg);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border-bottom: 1px solid var(--fa-border);
    height: var(--fa-nav-height);
    z-index: 1000;
    box-shadow: var(--fa-shadow);
    padding: .45rem 0;
}

.fa-topbar .navbar-inner {
    display: flex;
    align-items: center;
    width: 100%;
    max-width: 1720px;
    margin: 0 auto;
    padding: 0 24px;
    gap: 28px;
}

.fa-topbar .navbar-brand {
    display: flex;
    align-items: center;
    font-size: 26px;
    font-weight: 700;
    color: var(--fa-green);
    text-decoration: none;
    letter-spacing: .4px;
    white-space: nowrap;
}

.fa-topbar .navbar-brand img {
    width: 70px;
    height: auto;
    margin-right: 10px;
    border-radius: 12px;
}

.fa-topbar .nav-center {
    flex: 1 1 auto;
    display: flex;
    justify-content: center;
}

.fa-topbar .navbar-nav {
    display: flex;
    flex-direction: row !important;
    flex-wrap: nowrap;
    align-items: center;
    gap: 10px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.fa-topbar .nav-link {
    color: #10171C;
    font-size: 15.5px;
    font-weight: 500;
    padding: .60rem 1.05rem;
    border-radius: 14px;
    border: 1px solid transparent; /* рамка по умолчанию скрыта */
    display: flex;
    align-items: center;
    gap: .40rem;
    line-height: 1;
    transition: background var(--fa-transition), color var(--fa-transition), border-color var(--fa-transition), box-shadow var(--fa-transition), transform var(--fa-transition);
    position: relative;
    text-decoration: none;
    white-space: nowrap;
}

.fa-topbar .nav-link i {
    font-size: 1.05rem;
    line-height: 1;
}

/* Hover/focus: мягкий фон + брендовая рамка с округлением */
.fa-topbar .nav-link:hover,
.fa-topbar .nav-link:focus {
    background: var(--fa-green-soft);
    color: var(--fa-green);
    border-color: var(--fa-border-strong); /* Disney — голубая, Food — зелёная */
    box-shadow: none;
    text-decoration: none;
}

/* Active: фиксируем рамку и чуть усиленный мягкий фон */
.fa-topbar .nav-link.active {
    background: var(--fa-green-soft-active);
    color: var(--fa-green);
    border-color: var(--fa-border-strong);
    font-weight: 600;
    box-shadow: 0 2px 5px -2px rgba(0,0,0,.12);
}

/* Enforce visible outline even if other CSS resets interfere */
.fa-topbar .nav-link.active {
    border-width: 1px !important;
    border-style: solid !important;
}

/* Убираем старое подчёркивание */
.fa-topbar .nav-link.active::after { content: none; }

.fa-topbar .right-block {
    display: flex;
    align-items: center;
    gap: 10px;
}

.fa-topbar .btn-main {
    background: var(--fa-green);
    color: #fff;
    font-weight: 600;
    border: 1px solid var(--fa-green);
    padding: .55rem 1.1rem;
    border-radius: 14px;
    display: flex;
    align-items: center;
    gap: .45rem;
    font-size: .9rem;
    text-decoration: none;
    box-shadow: 0 2px 6px -2px rgba(var(--fa-primary-rgb, 14,74,160), .5);
    transition: background var(--fa-transition), transform var(--fa-transition), box-shadow var(--fa-transition);
}

.fa-topbar .btn-main:hover {
    background: var(--fa-primary-dark, #083b80);
    border-color: var(--fa-primary-dark, #083b80);
    transform: translateY(-1px);
    text-decoration: none;
}

.fa-topbar .btn-main:active {
    transform: translateY(0);
}

.fa-topbar .user-badge {
    color: #4b5a51;
    font-size: .82rem;
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: .35rem;
    background: var(--fa-green-soft);
    padding: .45rem .7rem;
    border-radius: 12px;
    border: 1px solid var(--fa-border);
}

main.fa-layout-main {
    margin-top: calc(var(--fa-nav-height) + 10px);
}

/* FOOTER (общий) */
.footer-light {
    border-top: 1px solid var(--fa-border);
    background: #ffffff;
    font-size: .72rem;
    color: #5d6a61;
    padding: .9rem 0;
}

/* Адаптив */
@media (max-width:1320px) {
    .fa-topbar .nav-link { padding: .55rem .9rem; }
}
@media (max-width:1100px) {
    .fa-topbar .navbar-inner { gap: 18px; }
    .fa-topbar .nav-link { font-size: 14.5px; }
}
@media (max-width:991.98px) {
    .navbar.fa-topbar { height: auto; padding: .4rem 0 .8rem; }
    .fa-topbar .navbar-inner { flex-wrap: wrap; gap: 14px; }
    .fa-topbar .nav-center { order: 3; flex: 0 0 100%; justify-content: flex-start; }
    .fa-topbar .navbar-nav { flex-wrap: wrap; row-gap: 6px; }
    .fa-topbar .nav-link { padding: .55rem .85rem; font-size: .9rem; }
    main.fa-layout-main { margin-top: 100px; }
}
@media (max-width:575.98px) {
    .fa-topbar .navbar-brand img { width: 56px; }
    .fa-topbar .navbar-brand { font-size: 20px; }
}