﻿section.profile__hero {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    background-color: white;
    box-shadow: 2px 2px 5px -1px rgba(10, 10, 10, 0.2);
}

    section.profile__hero ul.flex__parent {
        display: flex;
        justify-content: center;
        align-items: center;
        margin: 0px;
    }

.customerTotalLabel h5, .customerTotalLabel h6 {
    font-weight: bolder;
    font-size: var(--fs-100);
    min-height: 3rem;
    margin: 0rem 0.8rem;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .6rem;
    display: -webkit-flex;
    -webkit-align-items: center;
    -webkit-justify-content: center;
    padding-right: 1rem;
}

.customerTotalLabel h6 {
    border-left: 1px solid transparent;
}

    .customerTotalLabel h5 span, .customerTotalLabel h6 span {
        font-weight: bolder;
        font-size: var(--fs-100);
        color: var(--pmm-primary-color);
    }

section.profile__hero ul.flex__parent .userChild:first-child {
    margin-right: 10px;
}

    section.profile__hero ul.flex__parent .userChild:first-child .initials__wrap {
        width: 45px;
        height: 45px;
        font-size: 18px;
    }

section.profile__hero ul.flex__parent .userChild:last-child .user__name {
    font-size: 17px;
    font-weight: bolder;
}

section.allowGeneric .profile__primer span,
section.medicationToPackContainer .profile__primer span {
    font-size: 14px;
}

section.medicationToPackContainer .selectionLabels {
    display: flex;
    justify-content: center;
    padding: 10px;
}

    section.medicationToPackContainer .selectionLabels .minWidthContainer {
        display: flex;
        justify-content: center;
        gap: 1.5rem;
        max-width: 65rem;
        width: 100%;
    }

        section.medicationToPackContainer .selectionLabels .minWidthContainer .labelContainer {
            display: flex;
            align-items: center;
        }

            section.medicationToPackContainer .selectionLabels .minWidthContainer .labelContainer .imgBlock {
                display: flex;
                justify-content: center;
                align-items: center;
                padding: .6rem;
                width: 3.5rem;
                height: 3.5rem;
                border-radius: 50%;
                margin-right: 5px;
            }

            section.medicationToPackContainer .selectionLabels .minWidthContainer .labelContainer:nth-of-type(1) .imgBlock {
                padding: .6rem .4rem;
            }

            section.medicationToPackContainer .selectionLabels .minWidthContainer .labelContainer span {
                font-weight: 600;
                font-size: 11px;
            }

            section.medicationToPackContainer .selectionLabels .minWidthContainer .labelContainer .imgBlock img {
                max-width: 100%;
                max-height: 100%;
                filter: brightness(0) invert(1);
                -webkit-filter: brightness(0) invert(1);
            }

        section.medicationToPackContainer .selectionLabels .minWidthContainer .packLabel .imgBlock {
            background-color: #35c27e;
        }

        section.medicationToPackContainer .selectionLabels .minWidthContainer .skipLabel .imgBlock {
            background-color: #ffbf00;
        }

        section.medicationToPackContainer .selectionLabels .minWidthContainer .stopLabel .imgBlock {
            background-color: #EA6565;
        }

section.medicationToPackContainer .profile__orders .medicationContainer {
    border: 0;
    padding: 2rem;
    display: flex;
    justify-content: space-between;
    grid-gap: 5px;
    align-items: center;
    flex-wrap: nowrap;
    height: 100%;
    min-height: 7rem;
    text-align: left;
    width: 100%;
    font-weight: var(--fw-600);
    background: #fff;
    position: relative;
    border-radius: 2rem;
}
section.medicationToPackContainer .profile__orders .familyMember--Parent  .medicationContainer {
    border-radius: 2rem;
}
section.medicationToPackContainer .profile__orders .medicationContainer .flex__child.fieldContainer {
    background: #FFFFFF;
}

section.medicationToPackContainer .profile__orders .medicationContainer .fieldContainer h3 {
    margin: 0px;
    background: #ffffff;
}

    section.medicationToPackContainer .profile__orders .medicationContainer .fieldContainer {
        width: 60%;
    }

    section.medicationToPackContainer .profile__orders .medicationContainer .optionsContainer {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 4px;
    }

        section.medicationToPackContainer .profile__orders .medicationContainer .optionsContainer .select__button, .Img_Check {
            width: 4rem;
            height: 4rem;
            padding: .3rem;
            border-radius: 50%;
            background-size: contain;
            background-position: center;
            display: flex;
            justify-content: center;
            align-items: center;
            background-color: var(--Gray);
            transition: all .25s ease-in;
        }

        section.medicationToPackContainer .profile__orders .medicationContainer .optionsContainer div:nth-of-type(2) .select__button {
            padding: .1rem;
        }

        section.medicationToPackContainer .profile__orders .medicationContainer .optionsContainer div:nth-of-type(3) .select__button, span.Img_Cross, .LastChild_Space .familyMember--Parent .medicationContainer div.optionsContainer div.OTCChild div.Img_Cross {
            padding: .3rem;
        }

        section.medicationToPackContainer .profile__orders .medicationContainer .optionsContainer .packChildSelf .select__button.active,
        section.medicationToPackContainer .profile__orders .medicationContainer .optionsContainer .packChildMedicalAid .select__button.active {
            background-color: #35c27e;
        }

        section.medicationToPackContainer .profile__orders .medicationContainer .optionsContainer .skipChild .select__button.active {
            background-color: #FFBF00;
        }

        section.medicationToPackContainer .profile__orders .medicationContainer .optionsContainer .stopChild .select__button.active {
            background-color: #EA6565;
        }

            .Img_Check.active img,
            .Img_Cross.active img,
            section.medicationToPackContainer .profile__orders .medicationContainer .optionsContainer .packChild .select__button.active img,
            section.medicationToPackContainer .profile__orders .medicationContainer .optionsContainer .packChildSelf .select__button.active img,
            section.medicationToPackContainer .profile__orders .medicationContainer .optionsContainer .packChildMedicalAid .select__button.active img,
            section.medicationToPackContainer .profile__orders .medicationContainer .optionsContainer .skipChild .select__button.active img,
            section.medicationToPackContainer .profile__orders .medicationContainer .optionsContainer .stopChild .select__button.active img {
                filter: brightness(0) invert(1);
                -webkit-filter: brightness(0) invert(1);
            }

        section.medicationToPackContainer .profile__orders .medicationContainer .optionsContainer .flex__child:not(:last-child) {
            margin-right: 8px;
        }

section.allowGeneric .profile__select {
    display: flex;
    justify-content: center;
}

    section.allowGeneric .profile__select .buttonsContainer {
        width: 100%;
        max-width: 600px;
        min-width: 300px;
        display: flex;
        justify-content: space-evenly
    }

        section.allowGeneric .profile__select .buttonsContainer .select__button {
            width: 30%;
            max-width: 300px;
            min-width: 100px;
            background-color: white;
            padding: 10px;
            border-radius: 5px;
            box-shadow: 2px 2px 5px -1px rgba(10, 10, 10, 0.2);
            font-weight: bolder;
        }

            section.allowGeneric .profile__select .buttonsContainer .select__button.active {
                background-color: var(--pmm-primary-color);
                color: white;
            }

.PackAllDiv {
    margin: 2rem;
    text-align: center;
    cursor: pointer;
}

.ArrowIs_Check.active {
    background-color: #35c27e;
}

.XIs_Check.active {
    background-color: #EA6565;
}

    .ArrowIs_Check.active .fa-check,
    .XIs_Check.active .fa-remove {
        color: #ffff;
    }

.Card_paddingX {
    padding: 1rem 2.2rem;
    padding-left: 0;
}

.optionsContainer .flex__child {
    background: #fff;
}

@media (max-width: 600px) {
    section.medicationToPackContainer .profile__orders .medicationContainer .fieldContainer {
        width: 100%;
    }

    section.medicationToPackContainer .profile__orders .medicationContainer {
        display: grid;
    }
}
