/* Адаптивная раскладка публичных страниц конференций.
   Подключается в conferences/base.html ПОСЛЕ css_file конференции,
   поэтому перекрывает кастомные правила. Все классы уникальны (.conf-*). */

.conf-shell {
    max-width: 1080px;
    margin: 0 auto;
    padding: 0 10px 20px;
    box-sizing: border-box;
}

.conf-topbar {
    text-align: right;
    padding: 10px;
}

.conf-header {
    line-height: 0; /* убрать нижний зазор под картинкой */
}

.conf-hat {
    display: block;
    width: 100%;
    max-width: 1080px;
    margin: 0 auto;
    aspect-ratio: 1080 / 350; /* сохраняет letterbox-вид баннера */
    object-fit: contain;
    height: auto;
}

.conf-layout {
    display: grid;
    /* Меню 220px + зазор 12px; контент занимает ВСЮ свободную область
       справа от меню — и центрируется внутри неё, а не по ширине экрана */
    grid-template-columns: 220px 12px minmax(0, 1fr);
    margin-top: 10px;
}

.conf-gap {
    min-width: 0;
}

.conf-content-col {
    min-width: 0;
}

.conf-menu summary {
    display: none; /* меню раскрыто всегда; коллапс только на мобильных */
}

/* Логотип в дефолтном контенте */
.conf-logo {
    max-width: 250px !important;
    width: 100%;
    height: auto;
}

/* Универсальные правила контента: покрывают и поля БЕЗ .ck-content
   (contacts, sponsors, fee_info, accomodation_info, received_fees,
   transportation_info, program_file, easy_abstract_submission_info) */
.conf-content img,
.conf-content table {
    max-width: 100%;
}

.conf-content img {
    height: auto;
}

.conf-content pre {
    max-width: 100%;
    overflow-x: auto;
}

/* ---------- Мобильные устройства ---------- */
@media (max-width: 767.98px) {
    .conf-shell {
        padding: 0 8px 16px;
    }

    .conf-layout {
        grid-template-columns: 1fr;
    }

    .conf-gap {
        display: none;
    }

    .conf-menu summary {
        display: block;
        cursor: pointer;
        padding: 10px 14px;
        font-weight: bold;
        background: #f9f9f9;
        border-radius: 8px;
        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    }

    .conf-menu[open] summary {
        margin-bottom: 8px;
    }

    .sidebar {
        padding: 12px;
    }

    .sidebar a {
        padding: 8px !important;
        display: block;
    }

    .conf-content h1 {
        font-size: 18px;
    }

    .conf-content h2 {
        font-size: 16px;
    }

    .conf-content table {
        display: block;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .conf-content td,
    .conf-content th {
        padding: 6px;
        font-size: 13px;
    }
}