/* Major/Other_Base contains all other major modifications that are located under Discord's BaseLayer */

[class^="peopleList_"] { container-name: var(--Flashcord-Module_Friends, FCM-FlexGrid); }
#rp-plugins-tab, #rp-themes-tab { container-name: var(--Flashcord-Module_Replugged-Addons, FCM-FlexGrid); }
[class^="userPopoutOverlayBackground-"]:has([class^="role_"]) { container-name: var(--Flashcord-Module_Role-Grid, FCM-FlexGrid); }
[class^="peopleList_"], #rp-plugins-tab, #rp-themes-tab, [class^="userPopoutOverlayBackground-"]:has([class^="role_"]) { container-type: inline-size;}
@container FCM-FlexGrid (min-width: 0) {
    [class^="peopleList_"] > div,
    [class="replugged-addon-cards"],
    [class^="section_"]:nth-child(4) {
        display: flex; flex-wrap: wrap; align-content: center; flex-direction: row; justify-content: center;
        align-items: center;width: 95%; margin: auto;
    }
    [class^="role_"],
    [class^="peopleListItem_"],
    [class="replugged-addon-card"] {
        min-width: 386px; min-height: 64px;
        margin: 0; padding: 8px;
        flex-grow: 1; flex-basis: 1px;
        transition-property: scale; transition-duration: var(--Flashcord-Transition_Normal);
        scale: 0.95; border-radius: var(--Flashcord-UI_Border-Radius);
      }
    [class^="role_"]:hover,
    [class^="peopleListItem_"]:hover,
    [class="replugged-addon-card"]:hover {
        margin: 0 !important; padding: 8px !important;
        scale: 1.05; border-radius: var(--Flashcord-UI_Border-Radius);
    }
    [class^="role_"] {
        min-width: fit-content !important; min-height: 24px !important;
        scale: 1 !important; border-radius: 0px !important;
    } h2 { width: 100%; }
}