Шаблон:ModernFrame/Сollapsible/styles.css

.modern-frame--сollapsible {
    display: grid;
}

.modern-frame--сollapsible__header {
    display: flex;
    align-items: center;
    min-height: 32px;
    padding: 3px;
    color: #e5e5e5;
    font-size: 15px;
    font-family: "Noto Sans", sans-serif;
    border-radius: 0.3em 0.3em 0 0;
    border-bottom: 2px solid #00000039 !important;
    overflow-wrap: anywhere;
    box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.4);
    
    grid-row: 1;
    grid-column: 1 / 3;
}

.modern-frame--сollapsible__header-img {
    background: #00000027;
    padding: 2px;
    border-radius: 0.2em;
}

.modern-frame--сollapsible__content {
    border-radius: 0 0 0.3em 0.3em;
    box-shadow: inset 0px 0px 6px 0px rgba(0, 0, 0, 0.4);
    
    grid-column: 1 / 3;
    grid-row: 2;
}

.modern-frame--сollapsible > .mw-collapsible-toggle {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding: 8px;
    
    top: 0;
    right: 0;
    
    grid-row: 1;
    grid-column: 1 / 3;
}

.modern-frame--сollapsible__sub-content {
    background-color: #d7d7ff07;
    border-radius: 0 0 0.4em 0.4em;
    box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.2), inset 0px 0px 2px 0px rgba(0, 0, 0, 0.2);
    padding: 10px 8px;
    
    grid-column: 1 / 3;
}

@media (max-width: 800px) {
    .modern-frame--сollapsible__content {
        gap: 6px;
        padding: 8px;
    }
}