@import "../../--meeting__date.css";

/**
 * Header
 */

.meeting__header {
    margin-bottom: var(--marginLarge);
}

.meeting__metaWrapper {
    display: flex;
    flex-direction: column;
    gap: var(--marginSmall);
    justify-content: flex-start;
    align-items: flex-start;
}

.meeting__metaWrapper > div {
    display: flex;
    align-items: center;
    gap: var(--marginExtraSmall);
}

.meeting__metaWrapper > div::before {
    aspect-ratio: 1;
}

.mmt-mdp-location a {
    text-decoration: none;
    color: initial;
}

/**
 * Content wrapper
 */

@media (min-width: 768px) {
    .meeting__contentWrapper {
        display: grid;
        grid-template-columns: 1fr clamp(250px, 30vw, 400px);
        gap: var(--marginLarge);
    }
}

/**
 * Sidebar
 */

.mmt-mdp-sidebar {
    display: flex;
    flex-direction: column;
    gap: var(--marginSmall);
}

.mmt-mdp-section-tickets,
.mmt-mdp-section-registration {
    padding: var(--marginMedium);
    border-bottom-right-radius: var(--borderRadiusMedium);
    background-color: var(--tertiaryColor100);
}

/**
 * Register block in sidebar
 */

.mmt-mdp-section-registration {
    background-color: var(--primaryColor100);
}

.mmt-mdp-ticketsTable {
    width: 100%;
    text-align: left;
}

/**
 * Navigation
 */

.nav.--meeting {
    margin-bottom: var(--marginLarge);
}

.nav.--meeting > ul {
    display: flex;
    border-bottom: 1px solid #ccc;
}

.nav.--meeting li a {
    padding: var(--marginExtraSmall) var(--marginMedium);
    border-bottom: 3px solid transparent;
}

.nav.--meeting .--active a {
    border-color: var(--primaryColor500);
}

.nav.--meeting li:not(.--active) a:hover {
    border-color: var(--primaryColor400);
}