/*
 * my_cassiopeia — user.css
 */

/* ══════════════════════════════════════════════════════
   1. УБРАТЬ СИНИЙ ФОН ШАПКИ И МЕНЮ
   ══════════════════════════════════════════════════════ */
.header {
    background: transparent !important;
    padding-top: 1px !important;
    padding-bottom: 1px !important;
    row-gap: 0 !important;
    gap: 0 !important;
}

/* Синяя полоса меню */
.container-nav,
.container-nav .navbar,
.container-nav > *,
.navbar-nav,
#navbar-collapse {
    background: transparent !important;
}

/* Цветовые переменные Cassiopeia для шапки */
:root {
    --cassiopeia-color-primary: transparent;
}

/* Прямая отмена фона через атрибут style если задан инлайном */
.header[style],
.container-nav[style] {
    background: transparent !important;
}

/* ══════════════════════════════════════════════════════
   2. УБРАТЬ СИНИЙ ФОН ФУТЕРА
   ══════════════════════════════════════════════════════ */
.footer,
.container-footer {
    background: transparent !important;
}

/* ══════════════════════════════════════════════════════
   3. МИНИМАЛЬНЫЕ ОТСТУПЫ У ЛОГОТИПА
   ══════════════════════════════════════════════════════ */
.navbar-brand {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: space-between;
    width: 100%;
    padding-top: 1px !important;
    padding-bottom: 1px !important;
    margin: 0 !important;
}

/* ══════════════════════════════════════════════════════
   3b. УБРАТЬ ОТСТУП МЕЖДУ ЛОГОТИПОМ И МЕНЮ
   ══════════════════════════════════════════════════════ */
.header .grid-child {
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
}

.header .grid-child + .grid-child {
    padding-top: 0 !important;
    margin-top: 0 !important;
}

/* ══════════════════════════════════════════════════════
   4. МИНИМАЛЬНЫЕ ОТСТУПЫ У МЕНЮ
   ══════════════════════════════════════════════════════ */
.container-nav {
    padding-top: 1px !important;
    padding-bottom: 1px !important;
}

.nav-item,
.nav-link {
    padding-top: 2px !important;
    padding-bottom: 2px !important;
}

/* ══════════════════════════════════════════════════════
   5. УБРАТЬ РАМКИ И ТЕНИ У МОДУЛЕЙ (стиль card)
   ══════════════════════════════════════════════════════ */
.card {
    border: none !important;
    box-shadow: none !important;
    background-color: transparent !important;
    margin-bottom: 0 !important;
}

.card-header {
    background-color: transparent !important;
    border-bottom: none !important;
    padding-top: 2px !important;
    padding-bottom: 2px !important;
}

.card-body {
    padding-top: 2px !important;
    padding-bottom: 2px !important;
}

/* ══════════════════════════════════════════════════════
   6. МИНИМАЛЬНЫЙ ОТСТУП СНИЗУ У top-a И ДРУГИХ ПОЗИЦИЙ
   ══════════════════════════════════════════════════════ */
.container-top-a,
.container-top-b,
.container-bottom-a,
.container-bottom-b,
.container-mid {
    padding-top: 1px !important;
    padding-bottom: 1px !important;
}

/* ══════════════════════════════════════════════════════
   7. lang-switcher: флажки справа в строке логотипа
   ══════════════════════════════════════════════════════ */
.container-lang-switcher {
    display: flex;
    align-items: flex-start;
    padding-top: 2px;
    flex-shrink: 0;
}

/* ══════════════════════════════════════════════════════
   8. mid-row: позиция в CSS Grid
   ══════════════════════════════════════════════════════ */
@supports (display: grid) {

    .site-grid {
        grid-template-areas:
            ". banner banner banner banner ."
            ". top-a  top-a  top-a  top-a  ."
            ". top-b  top-b  top-b  top-b  ."
            ". comp   comp   comp   comp   ."
            ". side-r side-r side-r side-r ."
            ". side-l side-l side-l side-l ."
            ". mid    mid    mid    mid    ."
            ". bot-a  bot-a  bot-a  bot-a  ."
            ". bot-b  bot-b  bot-b  bot-b  .";
    }

    @media (min-width: 992px) {
        .site-grid {
            grid-template-areas:
                ". banner banner banner banner ."
                ". top-a  top-a  top-a  top-a  ."
                ". top-b  top-b  top-b  top-b  ."
                ". side-l comp   comp   side-r ."
                ". mid    mid    mid    mid    ."
                ". bot-a  bot-a  bot-a  bot-a  ."
                ". bot-b  bot-b  bot-b  bot-b  .";
        }
    }

    .container-mid {
        grid-area: mid;
    }

}