/*-----------------------
    BUTTONS
-----------------------*/

.app-empty-state {
    align-items: center;
    box-sizing: border-box;
    color: var(--bs-secondary-color);
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
    justify-content: center;
    margin-inline: auto;
    max-width: min(100%, 28rem);
    min-height: 120px;
    padding: 1.5rem;
    text-align: center;
    width: min(100%, 28rem);
}

/* Vue mounts do not inherit the text-centering wrapper used by Blade empty states. */
.app-empty-state.app-empty-state-vue {
    display: flex;
}

.app-empty-state-full {
    height: 100%;
}

.app-empty-state-compact {
    min-height: 76px;
    padding: 1rem;
}

.app-empty-state-tall {
    min-height: 220px;
    padding: 2rem 1.5rem;
}

.app-empty-state-panel-grid {
    background-color: var(--bs-body-bg);
    background-image:
        linear-gradient(rgba(var(--mangofit-color-rgb), 0.07) 1px, transparent 1px),
        linear-gradient(90deg, rgba(var(--mangofit-color-rgb), 0.07) 1px, transparent 1px),
        radial-gradient(circle at 0 0, rgba(var(--mangofit-color-rgb), 0.1), transparent 42%),
        radial-gradient(circle at 100% 100%, rgba(var(--mangofit-color-rgb), 0.07), transparent 42%);
    background-repeat: repeat, repeat, no-repeat, no-repeat;
    background-size: 2.25rem 2.25rem, 2.25rem 2.25rem, 100% 100%, 100% 100%;
    border: 1px solid rgba(var(--mangofit-color-rgb), 0.22);
    border-radius: 1rem;
    box-shadow: var(--bs-box-shadow-sm);
    display: flex;
    max-width: 42rem;
    min-height: 0;
    overflow: hidden;
    padding: 2rem clamp(1.25rem, 3vw, 2.5rem);
    width: min(100%, 42rem);
}

.app-empty-state-panel-grid .app-empty-state-icon {
    align-items: center;
    background: rgba(var(--mangofit-color-rgb), 0.1);
    border: 1px solid rgba(var(--mangofit-color-rgb), 0.4);
    border-radius: 50%;
    color: var(--mangofit-color);
    font-size: 1.9rem;
    height: 4rem;
    margin-bottom: 0.4rem;
    width: 4rem;
}

.app-empty-state-panel-grid .app-empty-state-icon > svg {
    height: 2rem;
    width: 2rem;
}

.app-empty-state-panel-grid .app-empty-state-description {
    max-width: 46rem;
}

.app-empty-state-icon {
    color: var(--bs-secondary-color);
    display: inline-flex;
    font-size: 3rem;
    justify-content: center;
    line-height: 1;
    margin-bottom: 0.35rem;
}

.app-empty-state-icon > svg {
    height: 3.15rem;
    width: 3.15rem;
}

.app-empty-state-title {
    color: var(--bs-body-color);
    font-size: 1.08rem;
    font-weight: 700;
    line-height: 1.3;
}

.app-empty-state-description {
    color: var(--bs-secondary-color);
    font-size: 0.94rem;
    line-height: 1.45;
    min-width: 0;
}

/* ms circle button */
.ms-circle-button-small {
    width: 20px !important;
    height: 20px !important;
    border-radius: 50% !important;
    padding: 0px !important;
    display: flex;
    justify-content: center;
    align-items: center;
}

.ms-circle-button {
    width: 28px !important;
    height: 28px !important;
    border-radius: 50% !important;
    padding: 0px !important;
    display: flex;
    justify-content: center;
    align-items: center;
}

.ms-circle-button-xl {
    width: 45px !important;
    height: 45px !important;
    border-radius: 50% !important;
    padding: 0px !important;
    display: flex;
    justify-content: center;
    align-items: center;
}

.ms-circle-button-2xl {
    width: 60px !important;
    height: 60px !important;
    border-radius: 50% !important;
    padding: 0px !important;
    display: flex;
    justify-content: center;
    align-items: center;
}

/* ms mangofit button */
.btn-mangofit {
    color: #fff !important;
    border-color: var(--mangofit-color) !important;
    background-color: var(--mangofit-color) !important;
}

.btn-mangofit:hover {
    border-color: var(--mangofit-color-hovered) !important;
    background-color: var(--mangofit-color-hovered) !important;
}

.btn-outline-mangofit {
    color: var(--contrast-theme-color) !important;
    border-color: var(--mangofit-color) !important;
}

.btn-outline-mangofit:hover {
    color: #fff !important;
    background-color: var(--mangofit-color) !important;
    border-color: var(--mangofit-color) !important;
}

.btn-check:checked + .btn-outline-mangofit {
    color: #fff !important;
    background-color: var(--mangofit-color) !important;
    border-color: var(--contrast-theme-color) !important;
}

.mg-action-button {
    --mg-action-rgb: var(--mg-action-mangofit-rgb);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    border-radius: 0.55rem !important;
    font-weight: 600 !important;
    text-align: center;
    white-space: nowrap;
    transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease;
}

.mg-action-button-content {
    display: inline-flex;
    max-width: 100%;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
}

.mg-action-button-content > span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

.mg-action-button-content i {
    font-size: 1em;
    line-height: 1;
}

.mg-action-button-mangofit {
    --mg-action-rgb: var(--mg-action-mangofit-rgb);
}

.mg-action-button-success {
    --mg-action-rgb: var(--mg-action-success-rgb);
}

.mg-action-button-danger {
    --mg-action-rgb: var(--mg-action-danger-rgb);
}

.mg-action-button-secondary {
    --mg-action-rgb: var(--mg-action-secondary-rgb);
}

.mg-action-button-warning {
    --mg-action-rgb: var(--mg-action-warning-rgb);
}

.mg-action-button-pill {
    border-radius: 999px !important;
}

.input-group > .mg-action-button {
    position: relative;
    z-index: 2;
    border-radius: var(--bs-border-radius) !important;
}

.input-group-sm > .mg-action-button,
.input-group > .mg-action-button.btn-sm {
    border-radius: var(--bs-border-radius-sm) !important;
}

.input-group-lg > .mg-action-button,
.input-group > .mg-action-button.btn-lg {
    border-radius: var(--bs-border-radius-lg) !important;
}

.input-group > .mg-action-button:focus {
    z-index: 5;
}

.input-group:has(> .mg-action-button):hover > .form-control:not(:disabled),
.input-group:has(> .mg-action-button):focus-within > .form-control:not(:disabled),
.input-group:has(> .mg-action-button):hover > .mg-action-button,
.input-group:has(> .mg-action-button):focus-within > .mg-action-button {
    border-color: var(--mangofit-color) !important;
}

.input-group > .mg-action-button:not(:first-child) {
    margin-left: calc(var(--bs-border-width) * -1);
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
}

.input-group > .mg-action-button:not(:last-child) {
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}

.btn-group > .mg-action-button {
    position: relative;
    z-index: 1;
    border-radius: var(--bs-border-radius) !important;
}

.btn-group-sm > .mg-action-button,
.btn-group > .mg-action-button.btn-sm {
    border-radius: var(--bs-border-radius-sm) !important;
}

.btn-group-lg > .mg-action-button,
.btn-group > .mg-action-button.btn-lg {
    border-radius: var(--bs-border-radius-lg) !important;
}

.btn-group > .mg-action-button:hover,
.btn-group > .mg-action-button:focus,
.btn-group > .mg-action-button:active,
.btn-group > .mg-action-button.active {
    z-index: 2;
}

.btn-group > .mg-action-button:not(:first-child) {
    margin-left: calc(var(--bs-border-width) * -1);
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
}

.btn-group > .mg-action-button:not(:last-child):not(.dropdown-toggle) {
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}

.btn-group > .mg-action-button.dropdown-toggle-split {
    min-width: 2.35rem;
    padding-left: 0.6rem !important;
    padding-right: 0.6rem !important;
}

.mg-action-button-soft {
    color: rgb(var(--mg-action-rgb)) !important;
    border: 1px solid rgba(var(--mg-action-rgb), 0.24) !important;
    background:
        linear-gradient(180deg, rgba(var(--mg-action-rgb), 0.1), rgba(var(--mg-action-rgb), 0.045)),
        rgba(var(--bs-body-bg-rgb), 0.78) !important;
    box-shadow: none;
}

.mg-action-button-soft:hover {
    color: rgb(var(--mg-action-rgb)) !important;
    border-color: rgba(var(--mg-action-rgb), 0.34) !important;
    background:
        linear-gradient(180deg, rgba(var(--mg-action-rgb), 0.14), rgba(var(--mg-action-rgb), 0.07)),
        rgba(var(--bs-body-bg-rgb), 0.86) !important;
}

.mg-action-button-solid {
    color: #fff !important;
    border: 1px solid rgb(var(--mg-action-rgb)) !important;
    background: rgb(var(--mg-action-rgb)) !important;
    box-shadow: none;
}

.mg-action-button-solid:hover {
    color: #fff !important;
    border-color: rgba(var(--mg-action-rgb), 0.92) !important;
    background: rgba(var(--mg-action-rgb), 0.92) !important;
}

:root[data-bs-theme="dark"] .mg-action-button-secondary.mg-action-button-solid {
    color: var(--ms-black-color) !important;
}

.mg-action-button-ghost {
    color: rgba(var(--contrast-theme-color-rgb), 0.84) !important;
    border: 1px solid rgba(var(--contrast-theme-color-rgb), 0.12) !important;
    background: transparent !important;
}

.mg-action-button-ghost:hover {
    color: var(--contrast-theme-color) !important;
    border-color: rgba(var(--contrast-theme-color-rgb), 0.2) !important;
    background: rgba(var(--contrast-theme-color-rgb), 0.05) !important;
}

.mg-action-button:disabled,
.mg-action-button.disabled {
    opacity: 0.58;
    pointer-events: none;
    box-shadow: none;
}

.mg-action-button:focus-visible {
    outline: 2px solid rgba(var(--mg-action-rgb), 0.34);
    outline-offset: 2px;
    box-shadow: none !important;
}

.mg-segmented-action-group {
    display: inline-flex;
    align-items: stretch;
    flex-wrap: wrap;
    gap: 0.25rem !important;
    max-width: 100%;
    width: fit-content;
    padding: 0.25rem !important;
    border: 1px solid var(--bs-border-color) !important;
    border-radius: 0.7rem !important;
    background: var(--bs-tertiary-bg) !important;
}

.mg-segmented-action-group > .btn {
    display: inline-flex;
    flex: 1 1 auto;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    min-height: 2.35rem;
    padding: 0.4rem 0.8rem;
    border: 1px solid transparent !important;
    border-radius: 0.5rem !important;
    background: transparent !important;
    box-shadow: none !important;
    color: var(--bs-secondary-color) !important;
    font-weight: 560 !important;
}

.mg-segmented-action-group > .btn:hover {
    background: rgba(var(--bs-body-bg-rgb), 0.66) !important;
    color: var(--bs-body-color) !important;
}

.mg-segmented-action-group > .btn:focus-visible {
    outline: 2px solid rgba(var(--contrast-theme-color-rgb), 0.24);
    outline-offset: 1px;
}

.mg-segmented-action-group > .btn.active,
.mg-segmented-action-group > .btn.is-active,
.mg-segmented-action-group > .btn[aria-pressed="true"],
.mg-segmented-action-group > .btn[aria-selected="true"] {
    border-color: rgba(var(--contrast-theme-color-rgb), 0.3) !important;
    background: var(--bs-body-bg) !important;
    box-shadow: 0 0.2rem 0.55rem rgba(var(--contrast-theme-color-rgb), 0.14) !important;
    color: var(--bs-body-color) !important;
    font-weight: 700 !important;
}

.mg-dropdown {
    display: inline-flex;
    position: relative;
}

.mg-dropdown:has(> .mg-dropdown-menu.show) {
    z-index: 1081;
}

.mg-dropdown-toggle.mg-action-button-icon-only {
    min-height: 2rem;
    min-width: 2rem;
    padding: 0 !important;
}

.mg-dropdown.show > .mg-dropdown-toggle.mg-action-button,
.mg-dropdown-toggle.mg-action-button.show {
    background:
        linear-gradient(180deg, rgba(var(--mg-action-rgb), 0.13), rgba(var(--mg-action-rgb), 0.06)),
        rgb(var(--bs-body-bg-rgb)) !important;
    border-color: rgba(var(--mg-action-rgb), 0.34) !important;
    color: rgb(var(--mg-action-rgb)) !important;
}

.mg-dropdown-menu {
    background-color: rgb(var(--bs-body-bg-rgb)) !important;
    background-image: none !important;
    background-clip: padding-box;
    border: 1px solid var(--bs-border-color) !important;
    border-radius: 0.45rem !important;
    box-shadow: 0 0.35rem 0.9rem rgba(var(--contrast-theme-color-rgb), 0.08) !important;
    color: var(--bs-body-color) !important;
    isolation: isolate;
    max-width: calc(100vw - 1rem);
    min-width: 12rem;
    opacity: 1 !important;
    overflow-x: hidden;
    padding: 0 !important;
    z-index: 1080;
}

.mg-dropdown-menu > li {
    display: block;
    margin: 0;
}

.mg-dropdown-menu > li > .mg-dropdown-item {
    box-sizing: border-box;
    min-width: 0;
    white-space: nowrap;
}

.mg-dropdown-menu > li:first-child > .mg-dropdown-item {
    border-top-left-radius: 0.35rem !important;
    border-top-right-radius: 0.35rem !important;
}

.mg-dropdown-menu > li:last-child > .mg-dropdown-item {
    border-bottom-left-radius: 0.35rem !important;
    border-bottom-right-radius: 0.35rem !important;
}

.mg-dropdown-menu.position-fixed,
.mg-dropdown-menu.nutrition-fixed-dropdown-menu {
    bottom: auto !important;
    max-height: var(--nutrition-fixed-panel-max-height, calc(100vh - 1rem));
    overflow-x: hidden;
    overflow-y: auto;
    position: fixed !important;
    right: auto !important;
    scrollbar-gutter: auto;
    transform: none !important;
    z-index: 1080;
}

.mg-dropdown-item {
    align-items: center;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    color: var(--bs-body-color) !important;
    display: flex !important;
    font-size: 0.92rem;
    font-weight: 600;
    gap: 0.7rem;
    justify-content: flex-start;
    line-height: 1.2;
    min-height: 2.35rem;
    padding: 0.58rem 0.85rem !important;
    text-align: left;
    width: 100%;
}

.mg-dropdown-item:hover,
.mg-dropdown-item:focus {
    background: var(--bs-tertiary-bg) !important;
    color: var(--bs-body-color) !important;
}

.mg-dropdown-item.text-danger {
    color: var(--bs-danger) !important;
}

.mg-dropdown-item.text-danger:hover,
.mg-dropdown-item.text-danger:focus {
    background: rgba(var(--bs-danger-rgb), 0.08) !important;
    color: var(--bs-danger) !important;
}

.mg-dropdown-item i {
    color: var(--bs-secondary-color);
    flex: 0 0 auto;
    line-height: 1;
    text-align: center;
    width: 1.1rem;
}

.mg-dropdown-item.text-danger i {
    color: currentColor;
}

.metric-log-all-btn {
    min-height: 32px;
    padding-inline: 0.85rem !important;
    white-space: nowrap;
}

.metric-log-all-btn i {
    font-size: 0.9em;
    line-height: 1;
}

/* ms theme button */
.btn-outline-contrast-theme {
    color: var(--contrast-theme-color) !important;
    border-color: rgba(var(--contrast-theme-color-rgb), 0.2) !important;
}
.btn-check:checked + .btn-outline-contrast-theme {
    background-color: rgba(var(--contrast-theme-color-rgb), 0.1) !important;
}
.btn-group .btn-outline-contrast-theme.active {
    background-color: rgba(var(--contrast-theme-color-rgb), 0.2) !important;
}

@media screen and (width <= 768px) { /* breakpoints “sm” and lower in Bootstrap */
    .btn-outline-contrast-theme:hover:not(.form-check .btn-outline-contrast-theme){
        background-color: rgba(var(--contrast-theme-color-rgb), 0.1) !important;
    }
}

@media screen and (width > 768px) { /* breakpoint “md” and above in Bootstrap */
    .btn-outline-contrast-theme:hover {
        background-color: rgba(var(--contrast-theme-color-rgb), 0.1) !important;
    }
}

/*-----------------------
    BORDERS
-----------------------*/
.border-mangofit-color {
    --bs-border-width: 1px;
    --bs-border-style: solid;
    border-width: var(--bs-border-width) !important;
    border-style: var(--bs-border-style) !important;
    border-color: var(--mangofit-color) !important;
}

.dotted-border-bottom {
    background: linear-gradient(to right, black 50%, transparent 50%);
    background-size: 3px 1px;
    background-repeat: repeat-x;
    background-position: bottom;
}

.border-contrast-theme-color {
    --bs-border-width: 1px;
    border: var(--bs-border-width) solid var(--contrast-theme-color) !important
}

.bootstrap-modal-border {
    border: var(--bs-modal-border-width) solid var(--bs-modal-border-color);
}

.custom-dotted-border {
    background-image: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' rx='10' ry='10' stroke='%23333' stroke-width='1' stroke-dasharray='5' stroke-dashoffset='0' stroke-linecap='round'/%3e%3c/svg%3e");
    background-size: calc(100% - 1px) calc(100% - 1px);
    background-repeat: no-repeat;
    border-radius: .625rem;
    padding: .625rem;
    --bs-bg-opacity: 0.1;
}

.custom-dotted-border.custom-dotted-border-droppable {
    background-image: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' rx='10' ry='10' stroke='%23999' stroke-width='3' stroke-dasharray='5' stroke-dashoffset='0' stroke-linecap='round'/%3e%3c/svg%3e");
}

/*-----------------------
    BORDER RADIUS
-----------------------*/
@media screen and (width > 768px) { /* breakpoint “md” and above in Bootstrap */
    .rounded-md-3 {
        border-radius: var(--bs-border-radius-lg) !important;
    }
}

/*-----------------------
    INPUT FILE PREVIEW
-----------------------*/
.input-file-preview-container,
.input-file-preview-video-container {
    background-image: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' rx='10' ry='10' stroke='%23333' stroke-width='1' stroke-dasharray='5' stroke-dashoffset='0' stroke-linecap='round'/%3e%3c/svg%3e");
	background-size: calc(100% - 1px) calc(100% - 1px);
    background-repeat: no-repeat;
    border-radius: .625rem;
    padding: .3125rem;
    --bs-bg-opacity: 0.1;
    background-color: rgba(var(--bs-secondary-rgb), var(--bs-bg-opacity)) !important;
    min-height: 10rem;
}

.input-file-preview-container img {
    max-height: 10rem !important;
}

.input-file-preview-video-container {
    min-height: 8rem !important;
}

/*-----------------------
    BACKGROUND COLORS
-----------------------*/
.bg-mangofit-color {
    --bs-bg-opacity: 1;
    background-color: rgba(var(--mangofit-color-rgb), var(--bs-bg-opacity)) !important;
}

.bg-gradient-color {
    background: var(--gray-gradient) !important;
}

.bg-current-theme-color {
    --bs-bg-opacity: 1;
    background-color: rgba(var(--current-theme-color-rgb), var(--bs-bg-opacity)) !important;
}

.bg-current-theme-secondary-color {
    --bs-bg-opacity: 1;
    background-color: rgba(var(--current-theme-secondary-color-rgb), var(--bs-bg-opacity)) !important;
}

.bg-contrast-theme-color {
    --bs-bg-opacity: 1;
    background-color: rgba(var(--contrast-theme-color-rgb), var(--bs-bg-opacity)) !important;
}

/*-----------
    TEXT
------------*/
.text-mangofit-color {
    color: var(--mangofit-color) !important;
}

.text-contrast-theme-color {
    color: var(--contrast-theme-color) !important;
}

.text-current-theme-color {
    color: var(--current-theme-color) !important;
}

.truncate-text {
    max-width: 200px;
    width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-block;
}

.two-line-text {
    display: inline-block;
    white-space: pre-wrap;
    width: min-content;
}

.no-text-select {
	user-select: none;
	-moz-user-select: none;    /* Firefox */
	-webkit-user-select: none; /* Chrome, Safari */
	-ms-user-select: none;     /* IE/Edge legacy */
}

.extra-small-text {
    font-size: 0.65rem !important;
}

/*-----------------------
    PROFILE IMAGE
-----------------------*/
.profile_image {
    object-position: center;
    object-fit: cover;
    border-radius: var(--bs-border-radius-xxl) !important;
    border: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color) !important;
}

.profile_image.size-150 {
    width: 150px;
    height: 150px;
}

.profile_image.size-60 {
    width: 60px;
    height: 60px;
}

/*-----------------------
    AUTOMATIC LINKS
-----------------------*/
.auto-links {
    word-break: break-word;
}

/*-----------------------
    HEIGHT SIZES
-----------------------*/
.h-30-px {
    height: 30px !important;
}

.h-45-px {
    height: 45px !important;
}

.h-50-px {
    height: 50px !important;
}

.h-75-px {
    height: 75px !important;
}

.h-100-px {
    height: 6.25rem !important;
}

.max-h-250-px {
    max-height: 250px !important;
}

.max-h-350-px {
    max-height: 350px !important;
}

.h-450-px {
    height: 450px !important
}

.max-h-450-px {
    max-height: 450px !important;
}

.min-h-100 {
    min-height: 100% !important;
}

.min-h-100px {
    min-height: 6.25rem !important;
}

.h-96 {
    height: 96% !important;
}

.h-48 {
    height: 48% !important;
}

.h-24 {
    height: 24% !important;
}

/*-----------------------
    WIDTH SIZES
-----------------------*/
.w-20-px {
    width: 20px !important;
}

.w-30-px {
    width: 30px !important;
}

.w-45-px {
    width: 45px !important;
}

.w-50-px {
    width: 50px !important;
}

.w-75-px {
    width: 75px !important;
}

.w-100-px {
    width: 6.25rem !important;
}

.min-w-0 {
    min-width: 0 !important;
}

.max-w-200-px {
    max-width: 200px !important;
}

@media screen and (width > 768px) { /* breakpoint “md” and above in Bootstrap */
    .max-w-md-95-percent {
        max-width: 95% !important;
    }
}

/*-----------------------
    MARGIN
-----------------------*/
.mt-40p {
    margin-top: 40%;
}

/*-----------------------
    LAYOUT
-----------------------*/
.layout-container {
    position: absolute;
    top: 0;
    left: 0;
    border-end-end-radius: 0;
    height: 100%;
    width: 100%;
}

/*-----------------------
    Z-INDEX
-----------------------*/
.z-1100 {
    z-index: 1100 !important;
}

.z-1056 {
    z-index: 1056 !important;
}

/*-----------------------
    CURSORS
-----------------------*/
.cursor-pointer {
    cursor: pointer !important;
}

.cursor-move {
    cursor: move !important;
}

.cursor-grab {
    cursor: grab !important;
}

.cursor-zoom-in {
    cursor: zoom-in !important;
}

/*-----------------------
    IMAGE
-----------------------*/
[data-bs-theme="light"] img[data-img-color-light-theme="dark"],
[data-bs-theme="dark"] img[data-img-color-dark-theme="light"] {
    filter: invert(1);
}

/*-----------------------------------
    OL/UL LIST STYLES
------------------------------------*/
.list-style-type-disclosure-closed {
    list-style-type: disclosure-closed;
}
.list-style-type-disclosure-closed li::marker {
    color: var(--mangofit-color) !important;
}

/*-----------------------------------
    FLEXBOX LAYOUT
------------------------------------*/
.flex-vertical-list {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

/*-----------------------------------
    HOVER
------------------------------------*/
.stateless-hoverable-item:hover,
.hoverable-container > .hoverable-item:hover,
.hoverable-container > .hoverable-item.hoverable-active,
.hoverable-container > .hoverable-item.active {
    background-color: rgba(var(--current-theme-secondary-color-rgb), var(--bs-bg-opacity)) !important;
}
[data-bs-theme="dark"] .stateless-hoverable-item:hover,
[data-bs-theme="dark"] .hoverable-container > .hoverable-item:hover,
[data-bs-theme="dark"] .hoverable-container > .hoverable-item.hoverable-active,
[data-bs-theme="dark"] .hoverable-container > .hoverable-item.active {
    --bs-bg-opacity: 0.9 !important;
}
[data-bs-theme="light"] .stateless-hoverable-item:hover,
[data-bs-theme="light"] .hoverable-container > .hoverable-item:hover,
[data-bs-theme="light"] .hoverable-container > .hoverable-item.hoverable-active,
[data-bs-theme="light"] .hoverable-container > .hoverable-item.active {
    --bs-bg-opacity: 0.5 !important;
}

.text-decoration-hover-underline {
    text-decoration: none !important;
}

.text-decoration-hover-underline:hover {
    text-decoration: underline !important;
}

/*-----------------------------------
    SHADOW
------------------------------------*/
.right-shadow-box {
	box-shadow: 4px 0 8px -2px rgba(var(--contrast-theme-color-rgb), 0.2);
}

/*-----------------------------------
    SURFACE GLOW UTILITIES
------------------------------------*/
.ms-surface-glow {
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(var(--contrast-theme-color-rgb), 0.14);
    background: linear-gradient(
        160deg,
        rgba(var(--contrast-theme-color-rgb), 0.045),
        rgba(var(--contrast-theme-color-rgb), 0.02)
    );
}

.ms-surface-glow::before,
.ms-surface-glow::after {
    content: "";
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
    z-index: 0;
}

.ms-surface-glow::before {
    width: 260px;
    height: 260px;
    top: -150px;
    left: -110px;
    background: radial-gradient(
        circle at center,
        rgba(var(--mangofit-color-rgb), 0.16),
        transparent 70%
    );
}

.ms-surface-glow::after {
    width: 260px;
    height: 260px;
    right: -110px;
    bottom: -150px;
    background: radial-gradient(
        circle at center,
        rgba(var(--mangofit-color-rgb), 0.13),
        transparent 72%
    );
}

.ms-surface-glow-grid {
    background-image:
        linear-gradient(
            160deg,
            rgba(var(--contrast-theme-color-rgb), 0.045),
            rgba(var(--contrast-theme-color-rgb), 0.02)
        ),
        linear-gradient(rgba(var(--mangofit-color-rgb), 0.06) 1px, transparent 1px),
        linear-gradient(90deg, rgba(var(--mangofit-color-rgb), 0.06) 1px, transparent 1px);
    background-size: auto, 26px 26px, 26px 26px;
}

.ms-surface-glow > * {
    position: relative;
    z-index: 1;
}

/*-----------------------------------
    COACH BANNER  (registration page)
------------------------------------*/
.mf-coach-banner {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 14px;
    border: 1px solid rgba(var(--contrast-theme-color-rgb), 0.15);
    border-radius: 10px;
}

.mf-coach-banner__label {
    position: absolute;
    top: -9px;
    left: 12px;
    padding: 0 6px;
    font-size: 0.7rem;
    font-weight: 500;
    letter-spacing: 0.02em;
    color: rgba(var(--contrast-theme-color-rgb), 0.5);
    background: var(--current-theme-color);
    line-height: 1.2;
}

.mf-coach-banner__avatar {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    object-fit: cover;
}

.mf-coach-banner__name {
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--contrast-theme-color);
}

.mf-coach-banner__quiz-badge {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 0.75rem;
    font-weight: 500;
    color: #22c55e;
    white-space: nowrap;
}

.mf-custom-select-native {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0 0 0 0) !important;
    clip-path: inset(50%) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

.mf-custom-select {
    position: relative;
    min-width: 0;
}

.mf-custom-select-control {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .65rem;
    width: 100%;
    min-height: calc(1.5em + .75rem + 2px);
    padding: .375rem .75rem;
    border: 1px solid var(--bs-border-color);
    border-radius: var(--bs-border-radius);
    background: var(--current-theme-color);
    color: var(--contrast-theme-color);
    text-align: left;
    cursor: pointer;
    transition: border-color .15s ease, box-shadow .15s ease;
}

.mf-custom-select--sm .mf-custom-select-control {
    min-height: calc(1.5em + .5rem + 2px);
    padding: .25rem .5rem;
    font-size: .875rem;
}

.mf-custom-select-control:hover,
.mf-custom-select.is-open .mf-custom-select-control {
    border-color: rgba(var(--mangofit-color-rgb), .7);
}

.mf-custom-select.is-open .mf-custom-select-control {
    box-shadow: 0 0 0 .2rem rgba(var(--mangofit-color-rgb), .08);
}

.mf-custom-select.is-disabled {
    opacity: .65;
    pointer-events: none;
}

.mf-custom-select-selection {
    display: flex;
    align-items: center;
    min-width: 0;
    flex: 1 1 auto;
}

.mf-custom-select-placeholder {
    color: rgba(var(--contrast-theme-color-rgb), .55);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.mf-custom-select-clear,
.mf-custom-select-caret {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    color: rgba(var(--contrast-theme-color-rgb), .72);
}

.mf-custom-select-clear {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    color: var(--mangofit-color);
    background: transparent !important;
}

.mf-custom-select-clear:hover,
.mf-custom-select-clear:focus {
    color: var(--mangofit-color) !important;
    background: transparent !important;
}

.mf-custom-select-caret {
    transition: transform .15s ease;
}

.mf-custom-select.is-open .mf-custom-select-caret {
    transform: rotate(180deg);
}

.mf-custom-select-dropdown {
    position: fixed;
    z-index: 1085;
    display: flex;
    flex-direction: column;
    max-height: var(--mf-custom-select-dropdown-height, 320px);
    padding: .75rem;
    border: 1px solid rgba(var(--contrast-theme-color-rgb), .13);
    border-radius: var(--bs-border-radius);
    background: var(--current-theme-color);
    box-shadow: 0 10px 24px rgba(15, 23, 42, .08);
}

.mf-custom-select-dropdown.d-none {
    display: none !important;
}

.mf-custom-select-search-wrapper {
    position: relative;
    margin-bottom: .65rem;
}

.mf-custom-select-search-wrapper i {
    position: absolute;
    top: 50%;
    left: .8rem;
    transform: translateY(-50%);
    color: rgba(var(--contrast-theme-color-rgb), .48);
    pointer-events: none;
}

.mf-custom-select-search-wrapper .form-control {
    padding-left: 2.25rem;
}

.mf-custom-select-options {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    padding-right: .25rem;
}

.mf-custom-select-option-group:not(:last-child) {
    margin-bottom: .7rem;
}

.mf-custom-select-option-group-title {
    margin-bottom: .35rem;
    color: rgba(var(--contrast-theme-color-rgb), .58);
    font-size: .82rem;
    font-weight: 700;
    letter-spacing: .02em;
}

.mf-custom-select-option {
    display: flex;
    align-items: center;
    width: 100%;
    min-height: 34px;
    padding: .3rem .5rem;
    border: 0;
    border-radius: .45rem;
    background: transparent;
    color: rgba(var(--contrast-theme-color-rgb), .86);
    text-align: left;
    transition: background .15s ease, color .15s ease;
}

.mf-custom-select-option:hover,
.mf-custom-select-option.is-selected {
    background: rgba(var(--contrast-theme-color-rgb), .08);
    color: var(--contrast-theme-color);
}

.mf-custom-select-option-content {
    display: flex;
    align-items: center;
    gap: .5rem;
    min-width: 0;
    width: 100%;
}

.mf-custom-select-avatar {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    object-fit: cover;
    border: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color);
    flex: 0 0 auto;
}

.mf-custom-select-user-option {
    display: flex;
    align-items: center;
    gap: .5rem;
    max-width: 100%;
}

.mf-custom-select-user-avatar {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    object-fit: cover;
    border: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color);
    flex: 0 0 auto;
}

.mf-custom-select-user-name {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.exercise-filters-dropdown-menu {
    max-width: min(500px, calc(100vw - 1rem));
    height: auto !important;
    max-height: none !important;
}

.exercise-filters-dropdown-shell {
    height: 80vh;
    max-height: calc(100vh - 2rem);
    height: 80dvh;
    max-height: calc(100dvh - 2rem);
    min-height: 0;
}

.exercise-filters-panel-body {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
}

.exercise-filters-panel-footer {
    flex: 0 0 auto;
    position: sticky;
    bottom: 0;
    z-index: 1;
    background: var(--current-theme-color);
}

.exercise-filter-section {
    padding: .9rem 1rem;
    border-bottom: 1px solid rgba(var(--contrast-theme-color-rgb), .12);
}

.exercise-filter-section:last-child {
    border-bottom: 0;
}

.exercise-filter-section-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    width: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--contrast-theme-color);
    font-size: 1.05rem;
    font-weight: 600;
    text-align: left;
}

.exercise-filter-section-toggle i {
    flex: 0 0 auto;
    color: rgba(var(--contrast-theme-color-rgb), .7);
    transition: transform .15s ease;
}

.exercise-filter-section-toggle[aria-expanded="false"] i {
    transform: rotate(-90deg);
}

.exercise-filter-section-body {
    padding-top: .8rem;
}

.exercise-filter-pill {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    min-height: 36px;
    padding: .35rem .75rem;
    border: 1px solid rgba(var(--contrast-theme-color-rgb), .12);
    border-radius: 999px;
    background: var(--current-theme-color);
    color: rgba(var(--contrast-theme-color-rgb), .82);
    font-size: .9rem;
    font-weight: 500;
    cursor: pointer;
    transition: border-color .15s ease, color .15s ease, background .15s ease;
}

.exercise-filter-pill:hover {
    border-color: rgba(var(--contrast-theme-color-rgb), .24);
    color: var(--contrast-theme-color);
}

.exercise-filter-pill img,
.exercise-filter-pill i {
    width: 20px;
    height: 20px;
    object-fit: contain;
    color: rgba(var(--contrast-theme-color-rgb), .7);
}

.exercise-table-category-filter:checked + .exercise-filter-pill,
.exercise-table-equipment-filter:checked + .exercise-filter-pill {
    border-color: rgba(var(--mangofit-color-rgb), .42);
    background: rgba(var(--mangofit-color-rgb), .08);
    color: var(--mangofit-color);
}

.exercise-table-equipment-filter:disabled + .exercise-filter-pill {
    opacity: .45;
    cursor: not-allowed;
}

.workout-card-equipment-summary {
    margin: .25rem 0 1.15rem;
}

.workout-card-equipment-summary__label {
    display: flex;
    align-items: center;
    gap: .4rem;
    margin-bottom: .5rem;
    color: rgba(var(--contrast-theme-color-rgb), .62);
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .02em;
    text-transform: uppercase;
}

.workout-card-equipment-summary__chips {
    display: flex;
    flex-wrap: wrap;
    gap: .45rem;
}

.workout-card-equipment-chip {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    min-height: 28px;
    max-width: 100%;
    padding: .22rem .6rem;
    border: 1px solid rgba(var(--contrast-theme-color-rgb), .12);
    border-radius: 999px;
    background: rgba(var(--mangofit-color-rgb), .06);
    color: rgba(var(--contrast-theme-color-rgb), .84);
    font-size: .85rem;
    font-weight: 600;
}

.workout-card-equipment-chip img,
.workout-card-equipment-chip i {
    width: 18px;
    height: 18px;
    flex: 0 0 auto;
    object-fit: contain;
    color: rgba(var(--contrast-theme-color-rgb), .7);
}

.workout-card-equipment-chip span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.workout-card-equipment-deck {
    display: inline-flex;
    align-items: center;
    flex-wrap: nowrap;
    min-width: 0;
}

.workout-card-equipment-deck__item,
.workout-card-equipment-deck__more {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    flex: 0 0 24px;
    border: 1px solid rgba(var(--contrast-theme-color-rgb), .12);
    border-radius: 999px;
    background: var(--current-theme-color);
    color: rgba(var(--contrast-theme-color-rgb), .72);
}

.workout-card-equipment-deck__item + .workout-card-equipment-deck__item,
.workout-card-equipment-deck__item + .workout-card-equipment-deck__more {
    margin-left: -.35rem;
}

.workout-card-equipment-deck__item img,
.workout-card-equipment-deck__item i {
    width: 15px;
    height: 15px;
    object-fit: contain;
}

.workout-card-equipment-deck__more {
    background: rgba(var(--contrast-theme-color-rgb), .08);
    font-size: .72rem;
    font-weight: 700;
}

.workout-card-equipment-summary--compact {
    margin: .4rem 0 .8rem;
}

.workout-card-equipment-summary--compact .workout-card-equipment-summary__label {
    margin-bottom: .4rem;
    font-size: .72rem;
}

.workout-card-equipment-summary--compact .workout-card-equipment-summary__chips {
    gap: .35rem;
}

.workout-card-equipment-summary--compact .workout-card-equipment-chip {
    min-height: 24px;
    padding: .16rem .5rem;
    font-size: .78rem;
}

.workout-card-equipment-summary--compact .workout-card-equipment-chip img,
.workout-card-equipment-summary--compact .workout-card-equipment-chip i {
    width: 16px;
    height: 16px;
}

.workout-card-equipment-summary--chips-only {
    margin-bottom: .8rem;
}

.calendar-selection-equipment-summary,
.preloaded-workout-equipment-summary,
.program-card-equipment-summary,
.assisted-workout-detail-equipment-summary,
.training-completed-equipment-summary,
.tp-equipment-summary {
    margin-top: .55rem;
    margin-bottom: .95rem;
}

.calendar-selection-equipment-summary,
.preloaded-workout-equipment-summary,
.program-card-equipment-summary {
    margin-bottom: 0;
}

.calendar-selection-equipment-deck {
    margin-top: .55rem;
}

.calendar-selection-item-meta-row .calendar-selection-equipment-deck {
    margin-top: 0;
}

.preloaded-workout-equipment-deck {
    margin-left: .15rem;
}

.program-card-equipment-deck {
    margin-left: .15rem;
}

.tp-result-equipment-deck {
    width: fit-content;
}

.tp-equipment-deck-section {
    margin: .75rem 0 1rem;
}

.tp-equipment-deck-section .workout-card-equipment-summary__label {
    margin-bottom: .45rem;
}

.training-completed-equipment-summary {
    margin-top: .35rem;
    margin-bottom: 1.35rem;
}

.training-completed-equipment-summary .workout-card-equipment-summary__label,
.training-completed-equipment-summary .workout-card-equipment-summary__chips {
    justify-content: center;
}

.training-completed-equipment-summary .workout-card-equipment-summary__label {
    text-align: center;
}

.training-exercise-info-equipment-summary {
    margin: 0;
}

.training-section-equipment-deck {
    margin: .35rem 0 .85rem;
}

.exercise-equipment-selector {
    position: relative;
}

.exercise-equipment-control {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .65rem;
    min-height: calc(3rem + 2px);
    padding: .45rem .75rem;
    border: 1px solid var(--bs-border-color);
    border-radius: var(--bs-border-radius);
    background: var(--current-theme-color);
    color: var(--contrast-theme-color);
    cursor: pointer;
    transition: border-color .15s ease, box-shadow .15s ease;
}

.exercise-equipment-control:hover,
.exercise-equipment-selector.is-open .exercise-equipment-control {
    border-color: rgba(var(--mangofit-color-rgb), .7);
}

.exercise-equipment-selector.is-open .exercise-equipment-control {
    box-shadow: 0 0 0 .2rem rgba(var(--mangofit-color-rgb), .08);
}

.exercise-equipment-selector.is-invalid .exercise-equipment-control {
    border-color: var(--bs-danger);
}

.exercise-equipment-selector.is-invalid .invalid-feedback {
    display: block;
}

.exercise-equipment-selected-items {
    display: flex;
    flex: 1 1 auto;
    flex-wrap: wrap;
    gap: .4rem;
    min-width: 0;
}

.exercise-equipment-placeholder {
    color: rgba(var(--contrast-theme-color-rgb), .55);
    line-height: 2rem;
}

.exercise-equipment-caret {
    flex: 0 0 auto;
    color: rgba(var(--contrast-theme-color-rgb), .72);
    transition: transform .15s ease;
}

.exercise-equipment-selector.is-open .exercise-equipment-caret {
    transform: rotate(180deg);
}

.exercise-equipment-selected-chip {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    max-width: 100%;
    min-height: 28px;
    padding: .18rem .25rem .18rem .45rem;
    border-radius: 6px;
    background: rgba(var(--mangofit-color-rgb), .09);
    color: var(--contrast-theme-color);
    font-size: .9rem;
    font-weight: 600;
}

.exercise-equipment-selected-chip img,
.exercise-equipment-selected-chip > i {
    width: 16px;
    height: 16px;
    object-fit: contain;
    flex: 0 0 auto;
}

.exercise-equipment-selected-chip-remove {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: transparent !important;
    color: var(--mangofit-color) !important;
    font-size: 1rem;
    line-height: 1;
}

.exercise-equipment-selected-chip-remove:hover,
.exercise-equipment-selected-chip-remove:focus {
    background: transparent !important;
    color: var(--mangofit-color) !important;
}

.exercise-equipment-dropdown {
    position: fixed;
    z-index: 1080;
    display: flex;
    flex-direction: column;
    max-height: var(--exercise-equipment-dropdown-height, 360px);
    padding: .75rem;
    border: 1px solid rgba(var(--contrast-theme-color-rgb), .13);
    border-radius: var(--bs-border-radius);
    background: var(--current-theme-color);
    box-shadow: 0 10px 24px rgba(15, 23, 42, .08);
}

.exercise-equipment-dropdown.d-none {
    display: none !important;
}

.exercise-equipment-search-wrapper {
    position: relative;
    margin-bottom: .65rem;
}

.exercise-equipment-search-wrapper i {
    position: absolute;
    top: 50%;
    left: .8rem;
    transform: translateY(-50%);
    color: rgba(var(--contrast-theme-color-rgb), .48);
    pointer-events: none;
}

.exercise-equipment-search-wrapper .form-control {
    padding-left: 2.25rem;
}

.exercise-equipment-groups {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    padding-right: .25rem;
}

.exercise-equipment-group:not(:last-child) {
    margin-bottom: .9rem;
}

.exercise-equipment-group-title {
    margin-bottom: .45rem;
    color: rgba(var(--contrast-theme-color-rgb), .58);
    font-size: .82rem;
    font-weight: 700;
    letter-spacing: .02em;
}

.exercise-equipment-chip-list {
    display: flex;
    flex-wrap: wrap;
    gap: .45rem;
}

.exercise-equipment-chip {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    min-height: 38px;
    padding: .35rem .75rem;
    border: 1px solid rgba(var(--contrast-theme-color-rgb), .12);
    border-radius: 999px;
    background: rgba(var(--current-theme-color-rgb), .72);
    color: rgba(var(--contrast-theme-color-rgb), .82);
    font-size: .9rem;
    cursor: pointer;
    transition: border-color .15s ease, color .15s ease, background .15s ease;
}

.exercise-equipment-chip img,
.exercise-equipment-chip i {
    width: 20px;
    height: 20px;
    object-fit: contain;
    color: rgba(var(--contrast-theme-color-rgb), .7);
}

:root[data-bs-theme="dark"] img[src*="/equipment-icons/"],
:root[data-bs-theme="dark"] .workout-card-equipment-chip img,
:root[data-bs-theme="dark"] .workout-card-equipment-deck__item img,
:root[data-bs-theme="dark"] .exercise-equipment-selected-chip img,
:root[data-bs-theme="dark"] .exercise-equipment-chip img {
    filter: invert(1) brightness(1.2) contrast(.95);
}

.exercise-equipment-checkbox:checked + .exercise-equipment-chip {
    border-color: rgba(var(--mangofit-color-rgb), .42);
    background: rgba(var(--mangofit-color-rgb), .08);
    color: var(--mangofit-color);
}

.exercise-equipment-checkbox:disabled + .exercise-equipment-chip {
    opacity: .45;
    cursor: not-allowed;
}

.exercise-filter-equipment-groups {
    display: flex;
    flex-direction: column;
    gap: .8rem;
}

.exercise-filter-equipment-group-title {
    margin-bottom: .45rem;
    color: rgba(var(--contrast-theme-color-rgb), .58);
    font-size: .82rem;
    font-weight: 700;
    letter-spacing: .02em;
}

.exercise-filter-equipment-chip-list {
    display: flex;
    flex-wrap: wrap;
    gap: .45rem;
}

.exercise-filter-equipment-chip-list .form-check {
    margin-bottom: 0;
}

.mavo-icon {
    --mavo-icon-size: 1.25rem;
    align-items: center;
    background: #14191c;
    border-radius: 999px;
    box-shadow: 0 0.35rem 0.9rem rgba(var(--contrast-theme-color-rgb), 0.14);
    display: inline-flex;
    flex: 0 0 var(--mavo-icon-size);
    height: var(--mavo-icon-size);
    justify-content: center;
    overflow: hidden;
    width: var(--mavo-icon-size);
}

.mavo-icon-xs {
    --mavo-icon-size: 1rem;
}

.mavo-icon-sm {
    --mavo-icon-size: 1.35rem;
}

.mavo-icon-md {
    --mavo-icon-size: 1.75rem;
}

.mavo-icon-lg {
    --mavo-icon-size: 4rem;
}

.mavo-icon-xl {
    --mavo-icon-size: 4.75rem;
}

.mavo-icon-image {
    display: block;
    height: 100%;
    object-fit: cover;
    width: 100%;
}

.mg-pdf-preview {
    background: var(--bs-body-bg);
    border: 1px solid var(--bs-border-color);
    border-radius: 0.55rem;
    box-shadow: var(--bs-box-shadow-sm);
    overflow: hidden;
}

.mg-pdf-preview-toolbar {
    align-items: center;
    background: var(--bs-tertiary-bg);
    border-bottom: 1px solid var(--bs-border-color);
    display: flex;
    gap: 0.75rem;
    justify-content: space-between;
    min-height: 3.2rem;
    padding: 0.58rem 0.72rem;
}

.mg-pdf-preview-heading {
    display: grid;
    gap: 0.1rem;
}

.mg-pdf-preview-title {
    color: var(--bs-body-color);
    font-size: 0.86rem;
    font-weight: 760;
    line-height: 1.2;
}

.mg-pdf-preview-filename {
    color: var(--bs-secondary-color);
    display: block;
    font-size: 0.72rem;
    line-height: 1.25;
    min-height: 0.9rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.mg-pdf-preview-actions {
    align-items: center;
    display: flex;
    flex: 0 0 auto;
    gap: 0.35rem;
}

.mg-pdf-preview-page-status {
    color: var(--bs-secondary-color);
    font-size: 0.76rem;
    font-weight: 650;
    min-width: 5.5rem;
    text-align: right;
    white-space: nowrap;
}

.mg-pdf-preview-action {
    --bs-btn-padding-x: 0;
    --bs-btn-padding-y: 0;
    align-items: center;
    background: var(--bs-body-bg);
    border: 1px solid var(--bs-border-color);
    border-radius: 0.45rem;
    box-sizing: border-box;
    color: var(--bs-body-color);
    display: inline-flex;
    flex: 0 0 2rem;
    height: 2rem;
    justify-content: center;
    line-height: 1;
    padding: 0;
    position: relative;
    width: 2rem;
}

.mg-pdf-preview-action .bi {
    align-items: center;
    display: inline-flex;
    font-size: 1rem;
    height: 100%;
    inset: 0;
    justify-content: center;
    line-height: 1;
    position: absolute;
    width: 100%;
}

.mg-pdf-preview-action .bi::before {
    display: block;
    line-height: 1;
}

.mg-pdf-preview-action:hover,
.mg-pdf-preview-action:focus-visible {
    background: rgba(var(--mangofit-color-rgb), 0.08);
    border-color: rgba(var(--mangofit-color-rgb), 0.28);
    color: var(--mangofit-color);
}

.mg-pdf-preview-action.disabled,
.mg-pdf-preview-action:disabled {
    opacity: 0.45;
    pointer-events: none;
}

.mg-pdf-preview-body {
    background: var(--bs-secondary-bg);
    max-height: min(72vh, 48rem);
    min-height: 20rem;
    overflow: auto;
    position: relative;
}

.mg-pdf-preview-pages {
    align-items: center;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    min-width: max-content;
    padding: 1rem;
}

.mg-pdf-preview-page {
    align-items: center;
    background: var(--bs-body-bg);
    border: 1px solid var(--bs-border-color);
    border-radius: 0.42rem;
    box-shadow: 0 0.55rem 1.25rem rgba(var(--contrast-theme-color-rgb), 0.12);
    display: inline-flex;
    justify-content: center;
    min-height: 18rem;
    min-width: min(100%, 18rem);
    overflow: hidden;
}

.mg-pdf-preview-page canvas {
    background: #fff;
    display: block;
    max-width: none;
}

.mg-pdf-preview-state,
.mg-pdf-preview-page-placeholder,
.mg-pdf-preview-page-error {
    align-items: center;
    color: var(--bs-secondary-color);
    display: flex;
    gap: 0.5rem;
    justify-content: center;
    min-height: 18rem;
    padding: 1rem;
    text-align: center;
}

.mg-pdf-preview-state {
    min-height: 20rem;
}

.mg-pdf-preview-error,
.mg-pdf-preview-page-error {
    color: var(--bs-danger);
}

.nutrition-client-macro-rich-select {
    margin-bottom: 0 !important;
    position: relative;
}

.nutrition-client-macro-rich-select::after {
    border-bottom: 1px solid currentColor;
    border-right: 1px solid currentColor;
    color: var(--bs-secondary-color);
    content: "";
    height: 0.5rem;
    pointer-events: none;
    position: absolute;
    right: 1.1rem;
    top: 50%;
    transform: translateY(-65%) rotate(45deg);
    width: 0.5rem;
}

.nutrition-client-macro-rich-select.show::after {
    transform: translateY(-30%) rotate(225deg);
}

.nutrition-client-macro-rich-select [data-mf-rich-select-display] {
    background: var(--bs-body-bg);
    border-color: var(--bs-border-color);
    border-radius: 0.7rem;
    cursor: pointer;
    min-height: 4.65rem;
    padding: 0.65rem 2.8rem 0.65rem 0.95rem;
    text-overflow: ellipsis;
}

.nutrition-client-macro-rich-select.has-rich-value [data-mf-rich-select-display] {
    color: transparent;
}

.nutrition-client-macro-rich-select [data-mf-rich-select-rich-display] {
    align-items: center;
    bottom: 1px;
    display: flex;
    left: 1px;
    min-width: 0;
    overflow: hidden;
    padding: 0.45rem 0.75rem;
    pointer-events: none;
    position: absolute;
    right: 2.7rem;
    top: 1px;
    z-index: 2;
}

.nutrition-client-macro-rich-select.show [data-mf-rich-select-display],
.nutrition-client-macro-rich-select [data-mf-rich-select-display]:focus-visible {
    border-color: rgba(var(--mangofit-color-rgb), 0.55);
    box-shadow: 0 0 0 0.2rem rgba(var(--mangofit-color-rgb), 0.12);
    outline: 0;
}

.nutrition-client-macro-rich-select-menu {
    border: 1px solid var(--bs-border-color) !important;
    border-radius: 0.75rem;
    box-shadow: 0 0.8rem 2rem rgba(var(--bs-dark-rgb), 0.12);
    max-height: min(24rem, 50vh);
    padding: 0.45rem;
}

.nutrition-client-macro-rich-select-menu > li + li {
    margin-top: 0.2rem;
}

.nutrition-client-macro-rich-select-option {
    align-items: center;
    border-radius: 0.58rem !important;
    display: flex !important;
    gap: 0.8rem;
    min-height: 4rem;
    padding: 0.65rem 0.75rem !important;
    white-space: normal !important;
}

.nutrition-client-macro-choice-content {
    align-items: center;
    display: flex;
    flex: 1 1 auto;
    gap: 0.8rem;
    min-width: 0;
}

.nutrition-client-macro-rich-select-option:hover,
.nutrition-client-macro-rich-select-option:focus-visible,
.nutrition-client-macro-rich-select-option.active {
    background: rgba(var(--mangofit-color-rgb), 0.08) !important;
    color: var(--bs-body-color) !important;
}

.nutrition-client-macro-choice-visual {
    align-items: center;
    background: var(--bs-tertiary-bg);
    border: 1px solid var(--bs-border-color);
    border-radius: 0.6rem;
    color: var(--mangofit-color);
    display: inline-flex;
    flex: 0 0 auto;
    font-size: 1.15rem;
    height: 2.75rem;
    justify-content: center;
    width: 2.75rem;
}

.nutrition-client-macro-choice-check {
    color: var(--mangofit-color);
    opacity: 0;
}

.nutrition-client-macro-rich-select-option.active .nutrition-client-macro-choice-check {
    opacity: 1;
}

.nutrition-client-macro-rich-select--compact [data-mf-rich-select-display] {
    min-height: 3.5rem;
}

.nutrition-client-macro-rich-select--compact [data-mf-rich-select-rich-display] {
    padding-block: 0.35rem;
}

.nutrition-client-macro-rich-select--compact .nutrition-client-macro-choice-visual {
    width: 2.25rem;
    height: 2.25rem;
    font-size: 1rem;
}

.nutrition-client-macro-rich-select-menu--compact {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.25rem;
    margin-bottom: 0;
    max-height: none;
    padding: 0.3rem;
}

.nutrition-client-macro-rich-select-menu--compact.show {
    display: grid !important;
}

.nutrition-client-macro-rich-select-menu--compact > li + li {
    margin-top: 0;
}

.nutrition-client-macro-rich-select-menu--compact .nutrition-client-macro-rich-select-option {
    gap: 0.5rem;
    min-height: 3rem;
    padding: 0.35rem 0.5rem !important;
}

.nutrition-client-macro-rich-select-menu--compact .nutrition-client-macro-choice-content {
    gap: 0.5rem;
}

.nutrition-client-activity-bars {
    align-items: end;
    display: inline-flex;
    gap: 0.12rem;
    height: 1.25rem;
}

.nutrition-client-activity-bars > i {
    background: var(--bs-border-color);
    border-radius: 0.08rem 0.08rem 0 0;
    display: block;
    width: 0.18rem;
}

.nutrition-client-activity-bars > i:nth-child(1) { height: 28%; }
.nutrition-client-activity-bars > i:nth-child(2) { height: 44%; }
.nutrition-client-activity-bars > i:nth-child(3) { height: 60%; }
.nutrition-client-activity-bars > i:nth-child(4) { height: 78%; }
.nutrition-client-activity-bars > i:nth-child(5) { height: 100%; }

.nutrition-client-activity-bars > i.is-active {
    background: var(--mangofit-color);
}

@media (max-width: 767.98px) {
    .mg-pdf-preview-toolbar {
        align-items: stretch;
        flex-direction: column;
    }

    .mg-pdf-preview-actions {
        justify-content: space-between;
    }

    .mg-pdf-preview-page-status {
        margin-right: auto;
        min-width: 0;
        text-align: left;
    }

    .mg-pdf-preview-body {
        max-height: 64vh;
        min-height: 18rem;
    }
}