/**
 * Member panel sidebar — organized sections, responsive, touch-friendly
 */

.member-sidebar-v2 {
    --ms-bg: #ffffff;
    --ms-border: rgba(0, 0, 0, 0.06);
    --ms-radius: 14px;
    /* Match site theme (aiz-core --primary / --soft-primary) */
    --ms-primary: var(--primary);
    --ms-primary-soft: var(--soft-primary, rgba(128, 128, 128, 0.1));
    --ms-text: #1a1a2e;
    --ms-muted: #6b7280;
    --ms-section-gap: 1.25rem;
    --ms-nav-py: 0.65rem;
    background: var(--ms-bg);
    border: 1px solid var(--ms-border);
    border-radius: var(--ms-radius);
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.06);
    overflow: hidden;
    width: 100%;
    max-width: 100%;
}

@media (min-width: 1200px) {
    .member-sidebar-v2 {
        max-width: 280px;
        min-width: 260px;
    }
}

.member-sidebar-v2__header {
    background: linear-gradient(145deg, var(--ms-primary-soft) 0%, rgba(255, 255, 255, 0.95) 100%);
    padding: 1.25rem 1rem 1rem;
    text-align: center;
    border-bottom: 1px solid var(--ms-border);
}

.member-sidebar-v2__avatar-wrap {
    display: inline-block;
    position: relative;
}

.member-sidebar-v2__avatar-btn {
    cursor: pointer;
    transition: transform 0.15s ease;
    border-radius: 50% !important;
}

.member-sidebar-v2__avatar-btn:hover {
    transform: scale(1.03);
}

.member-sidebar-v2__avatar-btn:focus {
    outline: 2px solid var(--ms-primary);
    outline-offset: 2px;
}

/* Profile photo — clear tap target, icon + title + hint */
.member-sidebar-v2__photo-cta {
    display: block;
    margin-left: auto;
    margin-right: auto;
    max-width: 100%;
    padding: 0;
    border: none;
    background: transparent;
    cursor: pointer;
    text-align: left;
    -webkit-tap-highlight-color: transparent;
}

.member-sidebar-v2__photo-cta:focus {
    outline: none;
}

.member-sidebar-v2__photo-cta:focus-visible .member-sidebar-v2__photo-cta-inner {
    outline: 2px solid var(--ms-primary);
    outline-offset: 2px;
}

.member-sidebar-v2__photo-cta-inner {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.7rem 0.85rem;
    background: #fff;
    border: 1px solid var(--ms-border);
    border-radius: 12px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
    transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.15s ease;
}

.member-sidebar-v2__photo-cta:hover .member-sidebar-v2__photo-cta-inner {
    border-color: var(--primary);
    box-shadow: 0 4px 16px var(--soft-primary, rgba(0, 0, 0, 0.08));
}

.member-sidebar-v2__photo-cta:active .member-sidebar-v2__photo-cta-inner {
    transform: scale(0.98);
}

.member-sidebar-v2__photo-cta-icon {
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    border-radius: 11px;
    background: var(--ms-primary-soft);
    color: var(--ms-primary);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.35rem;
}

.member-sidebar-v2__photo-cta-copy {
    flex: 1;
    min-width: 0;
    text-align: left;
}

.member-sidebar-v2__photo-cta-title {
    display: block;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--ms-text);
    line-height: 1.25;
}

.member-sidebar-v2__photo-cta-sub {
    display: block;
    font-size: 0.6rem;
    color: var(--ms-muted);
    line-height: 1.35;
    margin-top: 0.15rem;
}

.member-sidebar-v2__photo-cta-chevron {
    flex-shrink: 0;
    color: var(--ms-muted);
    font-size: 1.25rem;
    opacity: 0.65;
}

[dir="rtl"] .member-sidebar-v2__photo-cta {
    text-align: right;
}

[dir="rtl"] .member-sidebar-v2__photo-cta-copy {
    text-align: right;
}

[dir="rtl"] .member-sidebar-v2__photo-cta-chevron {
    transform: scaleX(-1);
}

.member-sidebar-v2__avatar-badge {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background: var(--ms-primary);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.85rem;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
    pointer-events: none;
}

.member-sidebar-v2__photo-hint {
    line-height: 1.45;
    font-size: 0.72rem !important;
}

.member-sidebar-v2__avatar-wrap .avatar {
    width: 72px;
    height: 72px;
    border-radius: 50%;
    overflow: hidden;
    border: 3px solid #fff;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1);
}

.member-sidebar-v2__avatar-wrap img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.member-sidebar-v2__name {
    font-size: 1rem;
    font-weight: 600;
    color: var(--ms-text);
    margin: 0.75rem 0 0.25rem;
    line-height: 1.3;
    word-break: break-word;
}

.member-sidebar-v2__meta {
    font-size: 0.75rem;
    color: var(--ms-muted);
    line-height: 1.4;
}

.member-sidebar-v2__meta a {
    font-weight: 500;
}

.member-sidebar-v2__cta {
    margin-top: 0.875rem;
}

.member-sidebar-v2__cta .btn {
    border-radius: 10px;
    min-height: 44px;
    font-weight: 500;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
}

.member-sidebar-v2__nav {
    padding: 0.75rem 0 1rem;
    max-height: calc(100vh - 280px);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

@media (max-width: 1199.98px) {
    .member-sidebar-v2__nav {
        max-height: none;
    }
}

.member-sidebar-v2__section-head {
    list-style: none;
    margin: 0;
    padding: 0.85rem 0.75rem 0.35rem;
    pointer-events: none;
}

.member-sidebar-v2__section-head:first-child {
    padding-top: 0.35rem;
}

.member-sidebar-v2__section-title {
    font-size: 0.65rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--ms-muted);
    padding: 0.5rem 0.6rem 0.35rem;
    margin: 0;
    border-bottom: none;
}

.member-sidebar-v2 .aiz-side-nav-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.member-sidebar-v2 .aiz-side-nav-item {
    margin-bottom: 2px;
}

.member-sidebar-v2 .aiz-side-nav-link {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    padding: var(--ms-nav-py) 0.75rem;
    border-radius: 10px;
    color: var(--ms-text);
    font-size: 0.9rem;
    font-weight: 500;
    text-decoration: none;
    transition: background 0.15s ease, color 0.15s ease;
    min-height: 44px;
    border: none;
    background: transparent;
    width: 100%;
    text-align: left;
}

.member-sidebar-v2 .aiz-side-nav-link:hover {
    background: rgba(0, 0, 0, 0.04);
    color: var(--ms-primary);
}

.member-sidebar-v2 .aiz-side-nav-link.active,
.member-sidebar-v2 .aiz-side-nav-link.bg-primary-grad {
    background: var(--ms-primary-soft) !important;
    color: var(--ms-primary) !important;
}

.member-sidebar-v2 .aiz-side-nav-icon {
    font-size: 1.15rem !important;
    width: 1.5rem;
    text-align: center;
    flex-shrink: 0;
    opacity: 0.9;
}

.member-sidebar-v2 .aiz-side-nav-text {
    flex: 1;
    line-height: 1.35;
}

.member-sidebar-v2 .aiz-side-nav-arrow {
    flex-shrink: 0;
    opacity: 0.5;
}

.member-sidebar-v2 .aiz-side-nav-list.level-2 {
    padding: 0.25rem 0 0.35rem 0.35rem;
    margin: 0 0 0 0.25rem;
    border-left: 2px solid var(--ms-border);
}

.member-sidebar-v2 .level-2 .aiz-side-nav-link {
    font-size: 0.85rem;
    font-weight: 400;
    min-height: 40px;
    padding-top: 0.45rem;
    padding-bottom: 0.45rem;
    padding-left: 1rem;
}

.member-sidebar-v2__footer {
    padding: 0.75rem 1rem 1.25rem;
    border-top: 1px solid var(--ms-border);
    background: #fafafa;
}

.member-sidebar-v2__footer .btn {
    border-radius: 10px;
    min-height: 46px;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
}

.member-sidebar-v2 .badge {
    font-size: 0.65rem;
    margin-left: auto;
}

/* Mobile drawer: full width comfortable padding */
.aiz-mobile-side-nav .member-sidebar-v2 {
    border-radius: 0;
    border: none;
    box-shadow: none;
    max-width: none;
}

/* RTL */
[dir="rtl"] .member-sidebar-v2 .aiz-side-nav-list.level-2 {
    margin-left: 0;
    margin-right: 0.25rem;
    border-left: none;
    border-right: 2px solid var(--ms-border);
    padding-left: 0;
    padding-right: 0.35rem;
}

[dir="rtl"] .member-sidebar-v2 .level-2 .aiz-side-nav-link {
    padding-left: 0.75rem;
    padding-right: 1rem;
}

[dir="rtl"] .member-sidebar-v2 .aiz-side-nav-link {
    text-align: right;
}

/* —— Profile photo modal (user-friendly) —— */
.member-sidebar-photo-modal .modal-content {
    --ms-primary: var(--primary);
    --ms-primary-soft: var(--soft-primary, rgba(128, 128, 128, 0.09));
}

.member-sidebar-photo-modal__dialog {
    max-width: 440px;
}

.member-sidebar-photo-modal__content {
    border-radius: 18px;
    overflow: hidden;
}

.member-sidebar-photo-modal__top {
    padding: 1.25rem 1.25rem 1rem;
    background: linear-gradient(160deg, var(--soft-primary, rgba(0, 0, 0, 0.04)) 0%, #ffffff 72%);
    border-bottom: 1px solid var(--ms-border);
}

.member-sidebar-photo-modal__lead {
    line-height: 1.45;
    max-width: 95%;
}

.member-sidebar-photo-modal__close {
    font-size: 1.75rem;
    line-height: 1;
    opacity: 0.45;
    background: none;
    border: none;
    min-width: 2rem;
}

.member-sidebar-photo-modal__close:hover {
    opacity: 0.85;
}

/* Same angle as .bg-primary-grad in aiz-core */
.member-sidebar-photo-modal__avatar-ring {
    width: 112px;
    height: 112px;
    border-radius: 50%;
    padding: 4px;
    background: linear-gradient(36deg, var(--primary), var(--secondary, var(--primary)));
    box-shadow: 0 8px 24px var(--soft-primary, rgba(0, 0, 0, 0.12));
}

.member-sidebar-photo-modal__preview-img {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
    display: block;
    background: #f3f4f6;
    border: 3px solid #fff;
}

.member-sidebar-photo-modal__pill {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.72rem;
    font-weight: 600;
    padding: 0.35rem 0.75rem;
    border-radius: 999px;
}

.member-sidebar-photo-modal__pill--pending {
    background: #fff8e6;
    color: #b45309;
}

.member-sidebar-photo-modal__pill--ok {
    background: #ecfdf5;
    color: #047857;
}

.member-sidebar-photo-modal__pill--no {
    background: #fef2f2;
    color: #b91c1c;
}

.member-sidebar-photo-modal__pill--upload {
    background: var(--ms-primary-soft, rgba(0, 0, 0, 0.06));
    color: var(--primary, #1a1a2e);
}

.member-sidebar-photo-modal__body {
    padding: 1.15rem 1.25rem 1.25rem;
}

.member-sidebar-photo-modal__reject {
    background: #fef2f2;
    border: 1px solid rgba(185, 28, 28, 0.15);
    border-radius: 12px;
    padding: 0.75rem 1rem;
    color: #7f1d1d;
    font-size: 0.875rem;
}

.member-sidebar-photo-modal__reject--simple {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    font-size: 0.8125rem;
}

.member-sidebar-photo-modal__reject--simple i {
    font-size: 1.25rem;
    flex-shrink: 0;
    margin-top: 0.05rem;
}

.member-sidebar-photo-modal__tip {
    display: flex;
    gap: 0.6rem;
    align-items: flex-start;
    font-size: 0.75rem;
    color: var(--ms-muted);
    line-height: 1.45;
    padding: 0.65rem 0.85rem;
    background: #f9fafb;
    border-radius: 10px;
    border: 1px solid var(--ms-border);
}

.member-sidebar-photo-modal__tip i {
    font-size: 1.1rem;
    flex-shrink: 0;
    margin-top: 0.05rem;
}

.member-sidebar-photo-modal__step-label {
    font-size: 0.65rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    color: var(--ms-muted);
    margin-bottom: 0.75rem;
}

.member-sidebar-photo-modal__option {
    background: #fff;
    border: 1px solid var(--ms-border);
    border-radius: 14px;
    padding: 1rem 1rem 1.05rem;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.member-sidebar-photo-modal__option:hover {
    border-color: var(--primary);
    box-shadow: 0 4px 16px var(--soft-primary, rgba(0, 0, 0, 0.06));
}

.member-sidebar-photo-modal__option-head {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    margin-bottom: 0.25rem;
}

.member-sidebar-photo-modal__option-num {
    width: 26px;
    height: 26px;
    border-radius: 8px;
    background: var(--ms-primary-soft);
    color: var(--ms-primary);
    font-size: 0.8rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.member-sidebar-photo-modal__option-title {
    font-weight: 600;
    font-size: 0.9rem;
    color: var(--ms-text);
}

.member-sidebar-photo-modal__option-desc {
    margin-left: 2.25rem;
    line-height: 1.35;
}

/* Match site primary CTA gradient (aiz-core) */
.member-sidebar-photo-modal__upload-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 0.5rem;
    width: 100%;
    padding: 0.75rem 1rem;
    margin-left: 0;
    margin-top: 0.35rem;
    border-radius: 12px;
    background: linear-gradient(36deg, var(--primary), var(--secondary, var(--primary)));
    font-weight: 600;
    font-size: 0.95rem;
    line-height: 1.35;
    cursor: pointer;
    border: none;
    box-shadow: 0 4px 16px var(--soft-primary, rgba(0, 0, 0, 0.15));
    transition: transform 0.12s ease, box-shadow 0.2s ease, filter 0.2s ease;
}

.member-sidebar-photo-modal__upload-btn,
.member-sidebar-photo-modal__upload-btn span,
.member-sidebar-photo-modal__upload-btn i {
    color: #ffffff !important;
    -webkit-text-fill-color: #fff;
}

.member-sidebar-photo-modal__upload-btn:hover {
    filter: brightness(1.06);
    box-shadow: 0 6px 22px var(--soft-primary, rgba(0, 0, 0, 0.18));
}

.member-sidebar-photo-modal__upload-btn:hover span,
.member-sidebar-photo-modal__upload-btn:hover i {
    color: #ffffff !important;
    -webkit-text-fill-color: #fff;
}

.member-sidebar-photo-modal__upload-btn:active {
    transform: scale(0.98);
}

.member-sidebar-photo-modal__file-name {
    color: #047857;
    font-weight: 500;
}

.member-sidebar-photo-modal__divider {
    text-align: center;
    position: relative;
    /* margin: 1rem 0; */
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--ms-muted);
}

.member-sidebar-photo-modal__divider::before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    height: 1px;
    background: var(--ms-border);
    z-index: 0;
}

.member-sidebar-photo-modal__divider span {
    position: relative;
    z-index: 1;
    background: #fff;
    padding: 0 0.75rem;
}

.member-sidebar-photo-modal__uploader {
    border: 1px dashed rgba(0, 0, 0, 0.12);
    border-radius: 10px;
    overflow: hidden;
    background: #fafafa;
    margin-left: 2.25rem;
    max-width: calc(100% - 2.25rem);
}

.member-sidebar-photo-modal__uploader .input-group-text {
    background: transparent;
}

.member-sidebar-photo-modal__preview-box {
    margin-left: 2.25rem;
    max-width: calc(100% - 2.25rem);
    border-radius: 8px;
}

.member-sidebar-photo-modal__footer {
    /* margin-top: 1.35rem; */
    padding-top: 1rem;
    border-top: 1px solid var(--ms-border);
}

.member-sidebar-photo-modal__footer .btn-lg {
    min-height: 48px;
    font-size: 0.95rem;
}

/* Crop modal (second modal) — container for Cropper.js, stack above first modal */
.member-sidebar-photo-modal__crop-modal {
    z-index: 1060;
}

.member-sidebar-photo-modal__crop-modal-dialog {
    max-width: 90%;
}

.member-sidebar-photo-modal__crop-container {
    max-height: 70vh;
    min-height: 280px;
    overflow: hidden;
    background: #f3f4f6;
    border-radius: 12px;
}

.member-sidebar-photo-modal__crop-img {
    display: block;
    max-width: 100%;
    max-height: 70vh;
    width: 100%;
}

@media (max-width: 575.98px) {
    .member-sidebar-photo-modal__dialog {
        margin: 0.4rem;
    }

    .member-sidebar-photo-modal__top,
    .member-sidebar-photo-modal__body {
        padding-left: 1rem;
        padding-right: 1rem;
    }

    .member-sidebar-photo-modal__option-desc,
    .member-sidebar-photo-modal__uploader,
    .member-sidebar-photo-modal__preview-box {
        margin-left: 0;
        max-width: 100%;
    }

    .member-sidebar-photo-modal__option-head {
        flex-wrap: wrap;
    }

    .member-sidebar-photo-modal__crop-modal-dialog {
        margin: 0.5rem;
        max-width: calc(100% - 1rem);
    }

    .member-sidebar-photo-modal__crop-container {
        min-height: 220px;
    }
}

/* —— My Interests: minimal, modern, responsive (mi-*) —— */
.mi-wrap {
    --mi-bg: #fff;
    --mi-border: rgba(0, 0, 0, 0.08);
    --mi-text: #111827;
    --mi-muted: #6b7280;
    --mi-surface: #f9fafb;
    --mi-radius: 12px;
    --mi-radius-sm: 8px;
    background: var(--mi-bg);
    border-radius: var(--mi-radius);
    border: 1px solid var(--mi-border);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
    overflow: hidden;
}

.mi-wrap--loading {
    opacity: 0.85;
    pointer-events: none;
    transition: opacity 0.2s ease;
}

/* Tabs: minimal segment control */
.mi-tabs {
    display: flex;
    gap: 0;
    padding: 0.5rem;
    background: var(--mi-surface);
    border-bottom: 1px solid var(--mi-border);
}

.mi-tabs__item {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    flex: 1;
    justify-content: center;
    padding: 0.65rem 1rem;
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--mi-muted);
    text-decoration: none;
    border-radius: var(--mi-radius-sm);
    transition: color 0.2s ease, background 0.2s ease;
}

.mi-tabs__item:hover {
    color: var(--mi-text);
    background: rgba(255, 255, 255, 0.8);
}

.mi-tabs__item--active {
    color: var(--primary, #1a1a2e);
    background: var(--mi-bg);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
}

.mi-tabs__icon {
    font-size: 1.125rem;
    opacity: 0.85;
}

.mi-tabs__count {
    font-size: 0.75rem;
    min-width: 1.25rem;
    padding: 0.15rem 0.4rem;
    border-radius: 999px;
    background: rgba(0, 0, 0, 0.06);
    color: var(--mi-text);
}

.mi-tabs__item--active .mi-tabs__count {
    background: var(--primary, #1a1a2e);
    color: #fff;
}

.mi-tabs__count--pending {
    background: #fef3c7;
    color: #b45309;
}

.mi-tabs__item--active .mi-tabs__count--pending {
    background: #d97706;
    color: #fff;
}

/* Pane: section + content */
.mi-pane {
    padding: 1rem 1.25rem 1.25rem;
}

.mi-pane__head {
    margin-bottom: 1rem;
}

.mi-pane__title {
    font-size: 1rem;
    font-weight: 600;
    color: var(--mi-text);
    margin: 0 0 0.25rem;
    line-height: 1.35;
}

.mi-pane__desc {
    font-size: 0.8125rem;
    color: var(--mi-muted);
    margin: 0;
    line-height: 1.45;
}

/* List: table on desktop, cards on mobile */
.mi-list {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.mi-list__head {
    grid-template-columns: 1fr 80px 100px 80px;
    padding: 0.5rem 0 0.75rem;
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--mi-muted);
    border-bottom: 1px solid var(--mi-border);
}

.mi-list__head-cell--action {
    text-align: right;
}

/* Item: grid row on desktop, card on mobile */
.mi-item {
    display: grid;
    grid-template-columns: 1fr 80px 100px 80px;
    align-items: center;
    gap: 0.75rem 1rem;
    padding: 0.75rem 0;
    border-bottom: 1px solid var(--mi-border);
    transition: background 0.15s ease;
}

.mi-item:last-child {
    border-bottom: none;
}

.mi-item:hover {
    background: var(--mi-surface);
}

.mi-item__member {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    min-width: 0;
    text-decoration: none;
}

.mi-item__member:hover .mi-item__name {
    color: var(--primary, #1a1a2e);
}

.mi-item__avatar {
    flex-shrink: 0;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    overflow: hidden;
    background: var(--mi-surface);
}

.mi-item__avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.mi-item__name {
    /* font-size: 0.9375rem; */
    font-weight: 500;
    color: var(--mi-text);
    transition: color 0.15s ease;
}

.mi-item__age {
    font-size: 0.875rem;
    color: var(--mi-muted);
}

.mi-item__status {
    font-size: 0.8125rem;
}

.mi-item__action {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.35rem;
}

.mi-item__action--group {
    justify-content: flex-end;
}

/* Badges: minimal */
.mi-badge {
    display: inline-block;
    font-size: 0.75rem;
    font-weight: 500;
    padding: 0.25rem 0.6rem;
    border-radius: 999px;
}

.mi-badge--success {
    background: #ecfdf5;
    color: #047857;
}

.mi-badge--pending {
    background: #fef3c7;
    color: #b45309;
}

/* Buttons: minimal icon + primary/danger */
.mi-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.4rem 0.85rem;
    font-size: 0.8125rem;
    font-weight: 500;
    border-radius: var(--mi-radius-sm);
    border: 1px solid transparent;
    cursor: pointer;
    transition: opacity 0.15s ease, background 0.15s ease;
}

.mi-btn--icon {
    width: 36px;
    height: 36px;
    padding: 0;
    border-radius: 50%;
}

.mi-btn--primary {
    background: var(--primary, #1a1a2e);
    color: #fff;
    border-color: var(--primary, #1a1a2e);
}

.mi-btn--primary:hover {
    opacity: 0.92;
}

.mi-btn--secondary {
    background: var(--mi-surface);
    color: var(--mi-text);
    border-color: var(--mi-border);
}

.mi-btn--secondary:hover {
    background: #f3f4f6;
}

.mi-btn--success {
    background: #ecfdf5;
    color: #047857;
}

.mi-btn--success:hover {
    background: #d1fae5;
}

.mi-btn--danger {
    background: #fef2f2;
    color: #b91c1c;
}

.mi-btn--danger:hover {
    background: #fee2e2;
}

/* Empty state */
.mi-empty {
    text-align: center;
    padding: 2.5rem 1.5rem;
}

.mi-empty__icon {
    display: block;
    font-size: 2.5rem;
    color: var(--mi-muted);
    opacity: 0.5;
    margin-bottom: 1rem;
}

.mi-empty__text {
    font-size: 0.9375rem;
    font-weight: 500;
    color: var(--mi-text);
    margin: 0 0 0.35rem;
}

.mi-empty__hint {
    font-size: 0.8125rem;
    color: var(--mi-muted);
    margin: 0 0 1.25rem;
    line-height: 1.45;
}

.mi-empty .mi-btn {
    margin-top: 0.25rem;
}

/* Pagination */
.mi-pagination {
    margin-top: 1.25rem;
    display: flex;
    justify-content: center;
}

.mi-pagination .pagination {
    margin: 0;
}

/* Modals: minimal */
.mi-modal .modal-header {
    padding: 1rem 1.25rem 0;
}

.mi-modal__title {
    font-size: 1rem;
    font-weight: 600;
    color: var(--mi-text);
}

.mi-modal .modal-body {
    padding: 0 1.25rem 1.25rem;
}

.mi-modal__text {
    font-size: 0.875rem;
    color: var(--mi-muted);
    line-height: 1.5;
    margin: 0;
}

/* Mobile: clear header; tabs stay horizontal; compact card layout */
@media (max-width: 767.98px) {
    .mi-wrap {
        margin-top: 1rem;
    }

    .mi-tabs {
        padding: 0.35rem 0.5rem;
        flex-direction: row;
        flex-wrap: nowrap;
    }

    .mi-tabs__item {
        flex: 1;
        min-width: 0;
        padding: 0.5rem 0.5rem;
        font-size: 0.8125rem;
        justify-content: center;
    }

    .mi-tabs__text {
        white-space: normal;
        text-align: center;
        line-height: 1.25;
    }

    .mi-tabs__icon {
        font-size: 1rem;
    }

    .mi-tabs__count {
        font-size: 0.7rem;
        min-width: 1.1rem;
        padding: 0.1rem 0.35rem;
    }

    .mi-pane {
        padding: 0.75rem 0.75rem 1rem;
    }

    .mi-pane__head {
        margin-bottom: 0.75rem;
    }

    .mi-pane__title {
        font-size: 0.9375rem;
    }

    .mi-pane__desc {
        font-size: 0.75rem;
    }

    /* Compact interest card */
    .mi-item {
        grid-template-columns: 1fr auto;
        grid-template-rows: auto auto;
        gap: 0.35rem 0.75rem;
        padding: 0.65rem 0.5rem;
        margin: 0 -0.25rem;
        margin-bottom: 0.35rem;
        border-radius: var(--mi-radius-sm);
        border: 1px solid var(--mi-border);
        border-bottom: 1px solid var(--mi-border);
    }

    .mi-item:hover {
        background: var(--mi-surface);
    }

    .mi-item__member {
        grid-column: 1;
        grid-row: 1;
        gap: 0.5rem;
    }

    .mi-item__avatar {
        width: 40px;
        height: 40px;
    }

    .mi-item__name {
        font-size: 0.875rem;
    }

    .mi-item__age {
        grid-column: 1;
        grid-row: 2;
        padding-left: calc(40px + 0.5rem);
        font-size: 0.75rem;
        color: var(--mi-muted);
    }

    .mi-item__status {
        grid-column: 2;
        grid-row: 1;
        align-self: center;
    }

    .mi-item__action {
        grid-column: 2;
        grid-row: 2;
        align-self: center;
    }

    .mi-badge {
        font-size: 0.7rem;
        padding: 0.2rem 0.45rem;
    }

    .mi-btn--icon {
        width: 32px;
        height: 32px;
        font-size: 0.9rem;
    }

    .mi-pagination {
        margin-top: 0.75rem;
    }
}

@media (max-width: 575.98px) {
    .mi-tabs {
        flex-direction: row;
        flex-wrap: nowrap;
        padding: 0.3rem 0.4rem;
    }

    .mi-tabs__item {
        flex: 1;
        min-width: 0;
        padding: 0.45rem 0.35rem;
        font-size: 0.75rem;
        justify-content: center;
    }

    .mi-tabs__text {
        white-space: normal;
        text-align: center;
    }

    .mi-empty {
        padding: 1.5rem 1rem;
    }
}

/* —— My Shortlists: minimal shell (aligned with mi-*), table + mobile cards —— */
.msl-shell {
    --msl-bg: #fff;
    --msl-border: rgba(0, 0, 0, 0.08);
    --msl-text: #111827;
    --msl-muted: #6b7280;
    --msl-surface: #f9fafb;
    --msl-radius: 12px;
    background: var(--msl-bg);
    border-radius: var(--msl-radius);
    border: 1px solid var(--msl-border);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
    overflow: hidden;
}

.msl-head {
    padding: 1rem 1.25rem 1rem;
    background: linear-gradient(160deg, var(--soft-primary, rgba(0, 0, 0, 0.03)) 0%, var(--msl-bg) 65%);
    border-bottom: 1px solid var(--msl-border);
}

.msl-head__row {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem 1rem;
}

.msl-head__text {
    flex: 1;
    min-width: 0;
}

.msl-title {
    font-size: 1.0625rem;
    font-weight: 600;
    color: var(--msl-text);
    margin: 0 0 0.25rem;
    line-height: 1.35;
}

.msl-desc {
    font-size: 0.8125rem;
    color: var(--msl-muted);
    margin: 0;
    line-height: 1.45;
    max-width: 36rem;
}

.msl-badge {
    flex-shrink: 0;
    font-size: 0.75rem;
    font-weight: 600;
    padding: 0.35rem 0.75rem;
    border-radius: 999px;
    background: var(--msl-surface);
    color: var(--msl-text);
    border: 1px solid var(--msl-border);
}

.msl-body {
    padding: 0.75rem 0.75rem 1rem;
}

.msl-empty {
    text-align: center;
    padding: 2.5rem 1.5rem 2.75rem;
}

.msl-empty__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 3.5rem;
    height: 3.5rem;
    border-radius: 50%;
    background: var(--msl-surface);
    color: var(--primary, #1a1a2e);
    font-size: 1.75rem;
    margin-bottom: 1rem;
}

.msl-empty__title {
    font-size: 1rem;
    font-weight: 600;
    color: var(--msl-text);
    margin: 0 0 0.35rem;
}

.msl-empty__hint {
    font-size: 0.8125rem;
    color: var(--msl-muted);
    margin: 0 0 1.25rem;
    line-height: 1.45;
    max-width: 22rem;
    margin-left: auto;
    margin-right: auto;
}

.msl-empty__cta {
    font-weight: 600;
    font-size: 0.875rem;
}

.msl-table .msl-avatar {
    width: 48px;
    height: 48px;
    object-fit: cover;
    vertical-align: middle;
}

.msl-table tbody td {
    vertical-align: middle;
}

.msl-th {
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--msl-muted);
    border-bottom: 1px solid var(--msl-border) !important;
    padding-top: 0.65rem !important;
    padding-bottom: 0.65rem !important;
    white-space: nowrap;
}

.msl-th--action {
    text-align: right;
}

.msl-actions-inner .mi-btn + .mi-btn,
.msl-actions-inner .mi-btn + a.mi-btn,
.msl-actions-inner a.mi-btn + .mi-btn,
.msl-actions-inner a.mi-btn + a.mi-btn {
    margin-left: 0.35rem;
}

.msl-pagination {
    padding: 0.75rem 0.75rem 0;
}

@media (min-width: 768px) {
    .msl-head {
        padding: 1.15rem 1.35rem 1.1rem;
    }

    .msl-body {
        padding: 0.5rem 1.25rem 1rem;
    }

    .msl-table-responsive {
        border: none;
    }

    .msl-table tbody tr.msl-row {
        transition: background 0.15s ease;
    }

    .msl-table tbody tr.msl-row:hover {
        background: var(--msl-surface);
    }

    .msl-table tbody td {
        padding-top: 0.65rem;
        padding-bottom: 0.65rem;
        border-bottom: 1px solid var(--msl-border);
    }

    .msl-table tbody tr:last-child td {
        border-bottom: none;
    }

    .msl-cell--num {
        width: 3rem;
        color: var(--msl-muted);
    }

    .msl-cell--photo {
        width: 4.5rem;
    }

    .msl-cell--name {
        min-width: 8rem;
        color: var(--msl-text);
    }

    .msl-cell--age {
        color: var(--msl-muted);
    }

    .msl-cell--actions {
        width: 1%;
        white-space: nowrap;
    }

    /* Keep heart + remove on one line (mobile keeps flex-wrap) */
    .msl-cell--actions .msl-actions-inner {
        flex-wrap: nowrap;
    }

    .msl-pagination {
        padding-left: 0;
        padding-right: 0;
    }
}

@media (max-width: 767.98px) {
    .msl-head {
        padding: 0.85rem 1rem 0.9rem;
    }

    .msl-title {
        font-size: 1rem;
    }

    .msl-desc {
        font-size: 0.75rem;
    }

    .msl-body {
        padding: 0.5rem 0.5rem 0.75rem;
    }

    .msl-table-responsive {
        border: none;
        background: transparent;
    }

    .msl-table thead {
        display: none !important;
    }

    .msl-table tbody tr.msl-row {
        display: block;
        border: 1px solid var(--msl-border);
        border-radius: var(--msl-radius);
        margin: 0 0 0.65rem;
        padding: 0;
        background: var(--msl-bg);
        box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
    }

    .msl-table tbody tr.msl-row td.msl-cell {
        display: grid;
        grid-template-columns: minmax(88px, 32%) 1fr;
        align-items: center;
        gap: 0.35rem 0.65rem;
        padding: 0.5rem 0.85rem;
        border: none;
        border-bottom: 1px solid var(--msl-border);
    }

    .msl-table tbody tr.msl-row td.msl-cell:last-child {
        border-bottom: none;
        padding-bottom: 0.75rem;
        padding-top: 0.55rem;
    }

    .msl-table tbody tr.msl-row td.msl-cell::before {
        content: attr(data-label);
        font-size: 0.65rem;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.05em;
        color: var(--msl-muted);
    }

    .msl-table tbody tr.msl-row td.msl-cell--actions {
        display: block;
        text-align: right;
    }

    .msl-table tbody tr.msl-row td.msl-cell--actions::before {
        display: none;
    }

    .msl-table tbody tr.msl-row td.msl-cell--actions .d-flex {
        justify-content: flex-end;
    }

    .msl-table tbody tr.msl-row td.msl-cell--actions .mi-btn,
    .msl-table tbody tr.msl-row td.msl-cell--actions a.mi-btn {
        margin-left: 0.35rem !important;
    }

    .msl-table tbody tr.msl-row td.msl-cell--actions .mi-btn:first-child,
    .msl-table tbody tr.msl-row td.msl-cell--actions a.mi-btn:first-child {
        margin-left: 0 !important;
    }

    .msl-pagination {
        padding-left: 0.25rem;
        padding-right: 0.25rem;
    }
}

/* —— Confirm modal (shared): minimal, sectioned, responsive —— */
.cm-modal .cm-modal__dialog {
    max-width: 420px;
    width: calc(100% - 1.5rem);
    margin: 0.75rem auto;
}

.cm-modal .cm-modal__sheet {
    border-radius: 14px;
    overflow: hidden;
    border: 1px solid rgba(0, 0, 0, 0.08);
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.12), 0 2px 8px rgba(0, 0, 0, 0.06);
}

.cm-modal .cm-modal__head {
    padding: 1.1rem 1.25rem 0.35rem;
}

.cm-modal .cm-modal__title {
    font-size: 1.0625rem;
    font-weight: 600;
    color: #111827;
    line-height: 1.35;
    padding-right: 0.5rem;
    margin: 0;
}

.cm-modal .cm-modal__close {
    opacity: 0.45;
    font-size: 1.5rem;
    line-height: 1;
    padding: 0.25rem;
    margin: -0.25rem -0.35rem 0 0;
}

/* Theme already draws × via .modal-header .close:before (Line Awesome); hide any inner markup */
.cm-modal .cm-modal__close > * {
    display: none !important;
}

.cm-modal .cm-modal__close:hover {
    opacity: 0.85;
}

.cm-modal .cm-modal__body {
    padding: 0.65rem 1.25rem 1rem;
}

.cm-modal .cm-modal__content {
    min-height: 0;
}

.cm-modal .cm-modal__foot {
    padding: 0 1.25rem 1.15rem;
    gap: 0.5rem;
}

@media (min-width: 576px) {
    .cm-modal .cm-modal__foot {
        flex-direction: row !important;
        justify-content: flex-end;
        align-items: center !important;
    }

    .cm-modal .cm-modal__foot .cm-modal__btn {
        min-width: 7rem;
    }

    .cm-modal .cm-modal__foot .cm-modal__btn--secondary {
        margin-right: auto;
    }
}

.cm-modal .cm-modal__btn {
    font-weight: 600;
    font-size: 0.875rem;
    border-radius: 10px;
    padding: 0.55rem 1.15rem;
    transition: opacity 0.15s ease, background 0.15s ease, border-color 0.15s ease;
}

.cm-modal .cm-modal__btn--primary {
    background: var(--primary, #1a1a2e);
    border-color: var(--primary, #1a1a2e);
    color: #fff;
}

.cm-modal .cm-modal__btn--primary:hover {
    opacity: 0.92;
    color: #fff;
}

.cm-modal .cm-modal__btn--secondary {
    background: #f3f4f6;
    border: 1px solid rgba(0, 0, 0, 0.08);
    color: #374151;
}

.cm-modal .cm-modal__btn--secondary:hover {
    background: #e5e7eb;
    color: #111827;
}

/* Structured body: stat + note (inject via JS) */
.cm-modal .cm-stack {
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
}

.cm-modal .cm-panel {
    border-radius: 12px;
    border: 1px solid rgba(0, 0, 0, 0.07);
    background: #f9fafb;
    padding: 0.85rem 1rem;
}

.cm-modal .cm-panel--stat {
    text-align: center;
    background: linear-gradient(165deg, #fafafa 0%, #f3f4f6 100%);
}

.cm-modal .cm-panel__label {
    margin: 0 0 0.35rem;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #6b7280;
}

.cm-modal .cm-panel__value {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    color: #111827;
    line-height: 1.3;
}

.cm-modal .cm-panel__value .cm-num {
    font-size: 1.75rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: var(--primary, #1a1a2e);
    margin-right: 0.25rem;
    vertical-align: -0.05em;
}

.cm-modal .cm-panel__value .cm-unit {
    font-size: 0.9375rem;
    font-weight: 600;
    color: #4b5563;
}

.cm-modal .cm-panel--note {
    display: flex;
    gap: 0.65rem;
    align-items: flex-start;
    text-align: left;
    background: #fff;
    border-color: rgba(0, 0, 0, 0.06);
    border-left: 3px solid rgba(0, 0, 0, 0.12);
}

.cm-modal .cm-panel__note-icon {
    flex-shrink: 0;
    color: #6b7280;
    font-size: 1.35rem;
    line-height: 1;
    margin-top: 0.05rem;
}

.cm-modal .cm-panel__note-text {
    margin: 0;
    font-size: 0.8125rem;
    line-height: 1.5;
    color: #4b5563;
}

/* Legacy: plain <p> + <small> still look acceptable */
.cm-modal .cm-modal__content > p {
    margin: 0 0 0.5rem;
    font-size: 0.9375rem;
    color: #374151;
}

.cm-modal .cm-modal__content > small {
    display: block;
    font-size: 0.8125rem;
    line-height: 1.45;
    color: #6b7280;
}

@media (max-width: 575.98px) {
    .cm-modal .cm-modal__foot .cm-modal__btn {
        width: 100%;
    }

    .cm-modal .cm-modal__title {
        font-size: 1rem;
    }

    .cm-modal .cm-panel__value .cm-num {
        font-size: 1.5rem;
    }
}

/* —— My Profile Viewers: minimal shell, table + mobile cards —— */
.mpv-shell {
    --mpv-bg: #fff;
    --mpv-border: rgba(0, 0, 0, 0.08);
    --mpv-text: #111827;
    --mpv-muted: #6b7280;
    --mpv-surface: #f9fafb;
    --mpv-radius: 12px;
    background: var(--mpv-bg);
    border-radius: var(--mpv-radius);
    border: 1px solid var(--mpv-border);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
    overflow: hidden;
}

.mpv-head {
    padding: 1rem 1.25rem 1rem;
    background: linear-gradient(160deg, var(--soft-primary, rgba(0, 0, 0, 0.03)) 0%, var(--mpv-bg) 65%);
    border-bottom: 1px solid var(--mpv-border);
}

.mpv-head__row {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem 1rem;
}

.mpv-head__text {
    flex: 1;
    min-width: 0;
}

.mpv-title {
    font-size: 1.0625rem;
    font-weight: 600;
    color: var(--mpv-text);
    margin: 0 0 0.25rem;
    line-height: 1.35;
}

.mpv-desc {
    font-size: 0.8125rem;
    color: var(--mpv-muted);
    margin: 0;
    line-height: 1.45;
    max-width: 36rem;
}

.mpv-badge {
    flex-shrink: 0;
    font-size: 0.75rem;
    font-weight: 600;
    padding: 0.35rem 0.75rem;
    border-radius: 999px;
    background: var(--mpv-surface);
    color: var(--mpv-text);
    border: 1px solid var(--mpv-border);
}

.mpv-body {
    padding: 0.75rem 0.75rem 1rem;
}

.mpv-empty {
    text-align: center;
    padding: 2.5rem 1.5rem 2.75rem;
}

.mpv-empty__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 3.5rem;
    height: 3.5rem;
    border-radius: 50%;
    background: var(--mpv-surface);
    color: var(--primary, #1a1a2e);
    font-size: 1.75rem;
    margin-bottom: 1rem;
}

.mpv-empty__title {
    font-size: 1rem;
    font-weight: 600;
    color: var(--mpv-text);
    margin: 0 0 0.35rem;
}

.mpv-empty__hint {
    font-size: 0.8125rem;
    color: var(--mpv-muted);
    margin: 0 0 1.25rem;
    line-height: 1.45;
    max-width: 22rem;
    margin-left: auto;
    margin-right: auto;
}

.mpv-empty__cta {
    font-weight: 600;
    font-size: 0.875rem;
}

.mpv-avatar {
    width: 48px;
    height: 48px;
    object-fit: cover;
    border-radius: 50%;
    vertical-align: middle;
}

.mpv-table tbody td {
    vertical-align: middle;
}

.mpv-th {
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--mpv-muted);
    border-bottom: 1px solid var(--mpv-border) !important;
    padding-top: 0.65rem !important;
    padding-bottom: 0.65rem !important;
    white-space: nowrap;
}

.mpv-th--action {
    text-align: right;
}

.mpv-actions-inner .mi-btn + .mi-btn,
.mpv-actions-inner .mi-btn + a.mi-btn,
.mpv-actions-inner a.mi-btn + .mi-btn,
.mpv-actions-inner a.mi-btn + a.mi-btn {
    margin-left: 0.35rem;
}

.mpv-pagination {
    padding: 0.75rem 0.75rem 0;
}

.mpv-date-time {
    display: inline-block;
    white-space: nowrap;
}

/* —— Happy Story (index wrapper): modern minimal shell, keeps existing flow —— */
.hsi-shell {
    --hsi-bg: #fff;
    --hsi-border: rgba(0, 0, 0, 0.08);
    --hsi-text: #111827;
    --hsi-muted: #6b7280;
    --hsi-surface: #f9fafb;
    --hsi-radius: 12px;
    background: var(--hsi-bg);
    border-radius: var(--hsi-radius);
    border: 1px solid var(--hsi-border);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
    overflow: hidden;
}

.hsi-head {
    padding: 1rem 1.25rem 1rem;
    background: linear-gradient(160deg, var(--soft-primary, rgba(0, 0, 0, 0.03)) 0%, var(--hsi-bg) 65%);
    border-bottom: 1px solid var(--hsi-border);
}

.hsi-head__row {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem 1rem;
}

.hsi-head__text {
    flex: 1;
    min-width: 0;
}

.hsi-title {
    font-size: 1.0625rem;
    font-weight: 600;
    color: var(--hsi-text);
    margin: 0 0 0.25rem;
    line-height: 1.35;
}

.hsi-desc {
    font-size: 0.8125rem;
    color: var(--hsi-muted);
    margin: 0;
    line-height: 1.45;
    max-width: 36rem;
}

.hsi-badge {
    flex-shrink: 0;
    font-size: 0.75rem;
    font-weight: 600;
    padding: 0.35rem 0.75rem;
    border-radius: 999px;
    background: var(--hsi-surface);
    color: var(--hsi-text);
    border: 1px solid var(--hsi-border);
}

.hsi-body {
    padding: 0.75rem;
}

.hsi-shell .card {
    border: 1px solid var(--hsi-border);
    border-radius: 12px;
    box-shadow: none;
    margin-bottom: 0;
}

.hsi-shell .card-header {
    background: transparent;
    border-bottom: 1px solid var(--hsi-border);
    padding: 0.9rem 1rem;
}

.hsi-shell .card-header .h6,
.hsi-shell .card-header h5 {
    margin: 0;
    font-weight: 600;
    color: var(--hsi-text);
}

.hsi-shell .card-body {
    padding: 1rem;
}

.hsi-shell .form-label,
.hsi-shell .from-label {
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--hsi-text);
}

.hsi-shell .form-control,
.hsi-shell .input-group-text,
.hsi-shell .aiz-selectpicker {
    border-radius: 10px;
}

.hsi-shell .btn.btn-sm {
    min-height: 36px;
    border-radius: 10px;
    padding-left: 1rem;
    padding-right: 1rem;
}

.hsi-card {
    background: #fff;
}

.hsi-card__head {
    padding-top: 0.95rem;
    padding-bottom: 0.85rem;
}

.hsi-card__body {
    padding-top: 1rem;
}

.hsi-form__group {
    margin-bottom: 0.9rem;
}

.hsi-form .aiz-text-editor + .note-editor.note-frame {
    border-radius: 10px;
}

.hsi-uploader .input-group-text,
.hsi-uploader .file-amount {
    border-radius: 10px;
}

.hsi-form__actions {
    margin-top: 0.25rem;
}

.hsi-btn-primary {
    min-width: 92px;
    font-weight: 600;
}

.hsi-story-meta {
    border-bottom: 1px solid var(--hsi-border);
    padding-bottom: 0.65rem;
}

.hsi-story-title {
    font-size: 1rem;
    font-weight: 600;
    color: var(--hsi-text);
    line-height: 1.4;
}

.hsi-story-author {
    display: inline-block;
    font-size: 0.8125rem;
    color: var(--hsi-muted);
}

.hsi-shell .aiz-carousel .carousel-box img {
    border-radius: 10px;
}

.hsi-story-time {
    margin-top: 0.9rem;
    font-size: 0.8125rem;
    color: var(--hsi-muted);
}

.hsi-story-content {
    font-size: 0.9rem;
    line-height: 1.65;
}

.hsi-story-video-wrap {
    border-top: 1px solid var(--hsi-border);
    margin-top: 1rem;
    padding-top: 1rem !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    padding-bottom: 0 !important;
}

.hsi-upgrade {
    text-align: center;
    padding: 2.5rem 1.5rem 2.75rem;
    border: 1px solid var(--hsi-border);
    border-radius: 12px;
    background: #fff;
}

.hsi-upgrade__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 3.5rem;
    height: 3.5rem;
    border-radius: 50%;
    background: var(--hsi-surface);
    color: var(--primary, #1a1a2e);
    font-size: 1.75rem;
    margin-bottom: 1rem;
}

.hsi-upgrade__title {
    font-size: 1rem;
    font-weight: 600;
    color: var(--hsi-text);
    margin: 0 0 0.35rem;
}

.hsi-upgrade__hint {
    font-size: 0.8125rem;
    color: var(--hsi-muted);
    margin: 0 0 1.25rem;
    line-height: 1.45;
}

.hsi-upgrade__cta {
    font-weight: 600;
    font-size: 0.875rem;
}

@media (max-width: 767.98px) {
    .hsi-head {
        padding: 0.85rem 1rem 0.9rem;
    }

    .hsi-title {
        font-size: 1rem;
    }

    .hsi-desc {
        font-size: 0.75rem;
    }

    .hsi-body {
        padding: 0.5rem;
    }

    .hsi-shell .card-header,
    .hsi-shell .card-body {
        padding-left: 0.85rem;
        padding-right: 0.85rem;
    }

    .hsi-form__actions {
        text-align: left !important;
    }

    .hsi-form__actions .hsi-btn-primary {
        width: 100%;
    }

    .hsi-story-title {
        font-size: 0.95rem;
    }

    .hsi-story-video-wrap {
        margin-top: 0.75rem;
    }
}

@media (min-width: 768px) {
    .mpv-head {
        padding: 1.15rem 1.35rem 1.1rem;
    }

    .mpv-body {
        padding: 0.5rem 1.25rem 1rem;
    }

    .mpv-table-responsive {
        border: none;
    }

    .mpv-table tbody tr.mpv-row {
        transition: background 0.15s ease;
    }

    .mpv-table tbody tr.mpv-row:hover {
        background: var(--mpv-surface);
    }

    .mpv-table tbody td {
        padding-top: 0.65rem;
        padding-bottom: 0.65rem;
        border-bottom: 1px solid var(--mpv-border);
    }

    .mpv-table tbody tr:last-child td {
        border-bottom: none;
    }

    .mpv-cell--num {
        width: 3rem;
        color: var(--mpv-muted);
    }

    .mpv-cell--photo {
        width: 4.5rem;
    }

    .mpv-cell--name {
        min-width: 10rem;
        color: var(--mpv-text);
    }

    .mpv-cell--age,
    .mpv-cell--date {
        color: var(--mpv-muted);
    }

    .mpv-cell--date {
        white-space: nowrap;
    }

    .mpv-cell--actions {
        width: 1%;
        white-space: nowrap;
    }

    .mpv-cell--actions .mpv-actions-inner {
        flex-wrap: nowrap;
    }

    .mpv-pagination {
        padding-left: 0;
        padding-right: 0;
    }
}

@media (max-width: 767.98px) {
    .mpv-head {
        padding: 0.85rem 1rem 0.9rem;
    }

    .mpv-title {
        font-size: 1rem;
    }

    .mpv-desc {
        font-size: 0.75rem;
    }

    .mpv-body {
        padding: 0.5rem 0.5rem 0.75rem;
    }

    .mpv-table-responsive {
        border: none;
        background: transparent;
    }

    .mpv-table thead {
        display: none !important;
    }

    .mpv-table tbody tr.mpv-row {
        display: block;
        border: 1px solid var(--mpv-border);
        border-radius: var(--mpv-radius);
        margin: 0 0 0.65rem;
        padding: 0;
        background: var(--mpv-bg);
        box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
    }

    .mpv-table tbody tr.mpv-row td.mpv-cell {
        display: grid;
        grid-template-columns: minmax(88px, 34%) 1fr;
        align-items: center;
        gap: 0.35rem 0.65rem;
        padding: 0.5rem 0.85rem;
        border: none;
        border-bottom: 1px solid var(--mpv-border);
    }

    .mpv-table tbody tr.mpv-row td.mpv-cell:last-child {
        border-bottom: none;
        padding-bottom: 0.75rem;
        padding-top: 0.55rem;
    }

    .mpv-table tbody tr.mpv-row td.mpv-cell::before {
        content: attr(data-label);
        font-size: 0.65rem;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.05em;
        color: var(--mpv-muted);
    }

    .mpv-table tbody tr.mpv-row td.mpv-cell--actions {
        display: block;
        text-align: right;
    }

    .mpv-table tbody tr.mpv-row td.mpv-cell--actions::before {
        display: none;
    }

    .mpv-table tbody tr.mpv-row td.mpv-cell--actions .d-flex {
        justify-content: flex-end;
    }

    .mpv-table tbody tr.mpv-row td.mpv-cell--actions .mi-btn,
    .mpv-table tbody tr.mpv-row td.mpv-cell--actions a.mi-btn {
        margin-left: 0.35rem !important;
    }

    .mpv-table tbody tr.mpv-row td.mpv-cell--actions .mi-btn:first-child,
    .mpv-table tbody tr.mpv-row td.mpv-cell--actions a.mi-btn:first-child {
        margin-left: 0 !important;
    }

    .mpv-table tbody tr.mpv-row td.mpv-cell--date {
        white-space: nowrap;
    }

    .mpv-pagination {
        padding-left: 0.25rem;
        padding-right: 0.25rem;
    }
}

/* —— Member Events index: shell, cards, filter modal —— */
.mev-shell {
    --mev-bg: #fff;
    --mev-border: rgba(0, 0, 0, 0.08);
    --mev-text: #111827;
    --mev-muted: #6b7280;
    --mev-surface: #f9fafb;
    --mev-radius: 12px;
    background: var(--mev-bg);
    border-radius: var(--mev-radius);
    border: 1px solid var(--mev-border);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
    overflow: hidden;
}

.mev-head {
    padding: 1rem 1.25rem 1rem;
    background: linear-gradient(160deg, var(--soft-primary, rgba(0, 0, 0, 0.03)) 0%, var(--mev-bg) 65%);
    border-bottom: 1px solid var(--mev-border);
}

.mev-head__row {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem 1rem;
}

.mev-head__text {
    flex: 1;
    min-width: 0;
}

.mev-title {
    font-size: 1.0625rem;
    font-weight: 600;
    color: var(--mev-text);
    margin: 0 0 0.25rem;
    line-height: 1.35;
}

.mev-desc {
    font-size: 0.8125rem;
    color: var(--mev-muted);
    margin: 0;
    line-height: 1.45;
    max-width: 36rem;
}

.mev-badge {
    flex-shrink: 0;
    font-size: 0.75rem;
    font-weight: 600;
    padding: 0.35rem 0.75rem;
    border-radius: 999px;
    background: var(--mev-surface);
    color: var(--mev-text);
    border: 1px solid var(--mev-border);
}

.mev-body {
    padding: 0.75rem 0.75rem 1rem;
}

.mev-toolbar {
    margin-bottom: 1rem;
}

.mev-filter-btn {
    border-radius: 10px;
    font-weight: 600;
    font-size: 0.875rem;
}

.mev-grid {
    margin-left: -0.5rem;
    margin-right: -0.5rem;
}

.mev-grid > [class*='col-'] {
    padding-left: 0.5rem;
    padding-right: 0.5rem;
}

.mev-event-card {
    border-radius: 12px !important;
    border: 1px solid var(--mev-border) !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06) !important;
    transition: box-shadow 0.2s ease, transform 0.2s ease;
    overflow: hidden;
}

.mev-event-card:hover {
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08) !important;
    transform: translateY(-2px);
}

.mev-event-card__media {
    overflow: hidden;
}

.mev-event-card__img,
.mev-event-card__placeholder {
    height: 200px;
    object-fit: cover;
    border-radius: 0 !important;
}

.mev-event-card__placeholder {
    background: var(--mev-surface);
}

.mev-event-card__status {
    top: 10px;
    right: 10px;
    font-size: 0.7rem;
    font-weight: 600;
    padding: 0.35rem 0.55rem;
    border-radius: 999px;
}

.mev-event-card__body {
    padding: 1rem 1rem 1.1rem !important;
}

.mev-event-card__title {
    font-size: 1rem !important;
    font-weight: 600 !important;
    color: var(--mev-text) !important;
    line-height: 1.35 !important;
    margin-bottom: 0.35rem !important;
}

.mev-event-card__meta {
    font-size: 0.8125rem !important;
    line-height: 1.4;
}

.mev-event-card__excerpt {
    font-size: 0.875rem;
    line-height: 1.5;
    color: #4b5563;
}

.mev-event-card__reg small {
    font-size: 0.75rem;
}

.mev-event-card__footer {
    padding-top: 0.5rem;
    border-top: 1px solid var(--mev-border);
    margin-top: 0.25rem;
}

.mev-event-card__fee {
    font-weight: 600;
    font-size: 0.75rem;
    padding: 0.35rem 0.6rem;
    border-radius: 8px;
}

.mev-btn-details {
    border-radius: 10px;
    font-weight: 600;
    padding: 0.4rem 0.9rem;
}

.mev-empty {
    text-align: center;
    padding: 2.5rem 1.5rem;
    border: 1px dashed var(--mev-border);
    border-radius: var(--mev-radius);
    background: var(--mev-surface);
}

.mev-empty__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 3.25rem;
    height: 3.25rem;
    border-radius: 50%;
    background: #fff;
    color: var(--mev-muted);
    font-size: 1.75rem;
    margin-bottom: 1rem;
    border: 1px solid var(--mev-border);
}

.mev-empty__title {
    font-size: 1rem;
    font-weight: 600;
    color: var(--mev-text);
    margin: 0 0 0.35rem;
}

.mev-empty__hint {
    font-size: 0.875rem;
    color: var(--mev-muted);
    margin: 0;
    line-height: 1.45;
    max-width: 22rem;
    margin-left: auto;
    margin-right: auto;
}

/* Filter modal (minimal, aligned with cm-modal) */
.mev-modal .mev-modal__dialog {
    max-width: 420px;
    width: calc(100% - 1.5rem);
}

.mev-modal .mev-modal__sheet {
    border-radius: 14px;
    overflow: hidden;
    border: 1px solid var(--mev-border);
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.12);
}

.mev-modal .mev-modal__head {
    padding: 1.1rem 1.25rem 0.35rem;
}

.mev-modal .mev-modal__title {
    font-size: 1.0625rem;
    font-weight: 600;
    color: var(--mev-text);
    margin: 0;
}

.mev-modal .mev-modal__close {
    opacity: 0.45;
    padding: 0.25rem;
    margin: -0.25rem -0.35rem 0 0;
}

.mev-modal .mev-modal__close:hover {
    opacity: 0.85;
}

.mev-modal .mev-modal__close > * {
    display: none !important;
}

.mev-modal .mev-modal__body {
    padding: 0.5rem 1.25rem 1rem;
}

.mev-modal .mev-modal__label {
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--mev-text);
}

.mev-modal .mev-modal__foot {
    padding: 0 1.25rem 1.15rem;
    gap: 0.5rem;
}

@media (min-width: 576px) {
    .mev-modal .mev-modal__foot {
        flex-direction: row !important;
        justify-content: flex-end;
        align-items: center !important;
    }

    .mev-modal .mev-modal__foot .mev-modal__btn--secondary {
        margin-right: auto;
    }

    .mev-modal .mev-modal__foot .mev-modal__btn {
        min-width: 7rem;
    }
}

.mev-modal .mev-modal__btn {
    font-weight: 600;
    font-size: 0.875rem;
    border-radius: 10px;
    padding: 0.55rem 1.15rem;
}

.mev-modal .mev-modal__btn--primary {
    background: var(--primary, #1a1a2e);
    border-color: var(--primary, #1a1a2e);
    color: #fff;
}

.mev-modal .mev-modal__btn--primary:hover {
    opacity: 0.92;
    color: #fff;
}

.mev-modal .mev-modal__btn--secondary {
    background: #f3f4f6;
    border: 1px solid var(--mev-border);
    color: #374151;
}

.mev-modal .mev-modal__btn--secondary:hover {
    background: #e5e7eb;
    color: #111827;
}

@media (max-width: 767.98px) {
    .mev-head {
        padding: 0.85rem 1rem 0.9rem;
    }

    .mev-title {
        font-size: 1rem;
    }

    .mev-desc {
        font-size: 0.75rem;
    }

    .mev-body {
        padding: 0.5rem 0.5rem 0.75rem;
    }

    .mev-event-card__img,
    .mev-event-card__placeholder {
        height: 180px;
    }
}

@media (max-width: 575.98px) {
    .mev-modal .mev-modal__foot .mev-modal__btn {
        width: 100%;
    }
}

/* —— Member Event show: shell, meta bar, tabs, requirements —— */
.mes-show-shell {
    --mes-bg: #fff;
    --mes-border: rgba(0, 0, 0, 0.08);
    --mes-text: #111827;
    --mes-muted: #6b7280;
    --mes-surface: #f9fafb;
    --mes-radius: 12px;
}

.mes-show-card {
    border-radius: var(--mes-radius) !important;
    border: 1px solid var(--mes-border) !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05) !important;
    overflow: hidden;
    margin-bottom: 0;
}

.mes-show-card__header {
    background: linear-gradient(165deg, var(--mes-surface) 0%, #fff 55%) !important;
    border-bottom: 1px solid var(--mes-border) !important;
    padding: 1rem 1.15rem !important;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.mes-show-card__header h5 {
    font-size: 1.0625rem;
    font-weight: 600;
    color: var(--mes-text);
    line-height: 1.35;
}

.mes-show-card__header .btn {
    border-radius: 10px;
    font-weight: 600;
}

.mes-show-card__body {
    background: #fff;
}

.mes-show-meta--desktop {
    flex-wrap: wrap;
    gap: 0.75rem 1rem;
    background: var(--mes-surface);
    border: 1px solid var(--mes-border);
    border-radius: 10px;
}

/* Default flexible cells (non-grid desktop bar) */
.mes-show-meta--desktop:not(.mes-show-meta--desktop-cols) > div {
    flex: 1 1 140px;
    min-width: 0;
}

/* Desktop event bar: column widths 30% | 30% | 20% | 20% (3fr 3fr 2fr 2fr) */
@media (min-width: 768px) {
    .mes-show-meta--desktop-cols.d-none {
        display: grid !important;
        grid-template-columns: 3fr 3fr 2fr 2fr;
        align-items: center;
        column-gap: 1rem;
        row-gap: 0.75rem;
    }

    .mes-show-meta--desktop-cols .mes-show-meta__cell {
        min-width: 0;
    }

    .mes-show-meta--desktop-cols .large,
    .mes-show-meta--desktop-cols span.large {
        word-break: break-word;
    }
}

.mes-show-meta--desktop .large,
.mes-show-meta--desktop span.large {
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--mes-text);
}

.mes-show-meta--mobile .col-12 > div {
    padding: 0.5rem 0.65rem;
    background: var(--mes-surface);
    border-radius: 10px;
    border: 1px solid var(--mes-border);
}

.mes-show-shell .alert {
    border-radius: 10px;
    border-width: 1px;
}

.mes-show-shell .requirement-card {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 0.75rem 0.85rem;
    background: #fff;
    border: 1px solid var(--mes-border);
    border-radius: 10px;
    height: 100%;
    transition: box-shadow 0.2s ease;
}

.mes-show-shell .requirement-card:hover {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

.mes-show-shell .requirement-icon {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-size: 1.15rem;
}

.mes-show-shell .requirement-content h6 {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--mes-muted);
    margin-bottom: 0.2rem;
}

.mes-show-shell .requirement-content p {
    margin: 0;
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--mes-text);
}

.mes-show-tabs {
    margin-top: 1.25rem !important;
}

.mes-show-nav {
    border-bottom: 1px solid var(--mes-border);
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    gap: 0.25rem;
    scrollbar-width: thin;
}

.mes-show-nav .nav-link {
    border: none !important;
    border-radius: 10px 10px 0 0 !important;
    color: var(--mes-muted) !important;
    font-weight: 600;
    font-size: 0.8125rem;
    padding: 0.65rem 1rem !important;
    white-space: nowrap;
}

.mes-show-nav .nav-link.active {
    color: var(--mes-text) !important;
    background: var(--mes-surface) !important;
    border-bottom: 2px solid var(--primary, #1a1a2e) !important;
}

.mes-show-tab-content {
    border: 1px solid var(--mes-border);
    border-top: none;
    border-radius: 0 0 var(--mes-radius) var(--mes-radius);
    background: var(--mes-bg);
    overflow: hidden;
}

.mes-show-tab-card {
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

.mes-show-tab-card .card-body {
    padding: 1.15rem 1.25rem !important;
}

.mes-show-shell .attendee-card {
    border-radius: 12px !important;
    border: 1px solid var(--mes-border) !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05) !important;
}

.mes-show-shell .btn {
    border-radius: 10px;
}

@media (max-width: 767.98px) {
    .mes-show-card__header {
        padding: 0.85rem 1rem !important;
    }

    .mes-show-nav .nav-link {
        font-size: 0.75rem;
        padding: 0.55rem 0.75rem !important;
    }

    .mes-show-tab-card .card-body {
        padding: 1rem !important;
    }
}

/* —— Event show: Attendees + Gallery tab panels —— */
.mes-attendees-tab-body,
.mes-gallery-tab-body {
    padding-top: 1.15rem !important;
}

.mes-attendees__toolbar,
.mes-gallery__toolbar {
    gap: 0.75rem 1rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

.mes-attendees__title,
.mes-gallery__title {
    font-size: 1rem;
    font-weight: 600;
    color: #111827;
}

.mes-attendees__subtitle {
    max-width: 28rem;
    line-height: 1.4;
}

.mes-attendees__count-badge,
.mes-gallery__badge {
    font-weight: 600;
    font-size: 0.75rem;
    padding: 0.35rem 0.65rem;
    border-radius: 999px;
}

.mes-attendees__view-toggle .btn,
.mes-gallery__filters .btn {
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.8125rem;
}

.mes-attendees__view-toggle .btn:first-child {
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
}

.mes-attendees__view-toggle .btn:last-child {
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
}

.mes-gallery__filters {
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
}

.mes-gallery__filters .btn {
    border-color: rgba(0, 0, 0, 0.1);
}

.mes-gallery__filters .btn.active {
    background: #f3f4f6;
    color: #111827;
    border-color: rgba(0, 0, 0, 0.12);
}

.mes-attendees__grid {
    margin-left: -0.35rem;
    margin-right: -0.35rem;
}

.mes-attendees__grid > .mes-attendees__col {
    padding-left: 0.3rem;
    padding-right: 0.3rem;
    margin-bottom: 0.75rem !important;
}

.mes-show-shell .mes-attendees__card {
    border-radius: 10px !important;
    border: 1px solid rgba(0, 0, 0, 0.08) !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04) !important;
    transition: box-shadow 0.2s ease, transform 0.2s ease;
}

.mes-show-shell .mes-attendees__card:hover {
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.07) !important;
    transform: translateY(-1px);
}

.mes-attendees__card-body {
    padding: 0.85rem 0.9rem !important;
}

/* Compact avatars inside attendee cards (overrides page-local .avatar-lg rules) */
.mes-show-shell .mes-attendees__card .avatar.avatar-lg {
    width: 52px !important;
    height: 52px !important;
    min-width: 52px;
    margin-right: 0.65rem !important;
}

.mes-show-shell .mes-attendees__card .avatar.avatar-lg img.rounded-circle,
.mes-show-shell .mes-attendees__card .avatar.avatar-lg .avatar-initial {
    width: 52px !important;
    height: 52px !important;
    line-height: 52px;
    font-size: 1rem !important;
}

.mes-show-shell .mes-attendees__card .avatar.avatar-lg .rounded-circle {
    object-fit: cover;
}

.mes-show-shell .mes-attendees__card h6 {
    font-size: 0.9rem !important;
    margin-bottom: 0.2rem !important;
    line-height: 1.3;
}

.mes-show-shell .mes-attendees__card .text-muted.small,
.mes-show-shell .mes-attendees__card small {
    font-size: 0.75rem !important;
}

.mes-show-shell .mes-attendees__card .badge {
    font-size: 0.65rem !important;
    padding: 0.2rem 0.45rem;
}

.mes-show-shell .mes-attendees__card .d-flex.justify-content-between.align-items-center .btn {
    padding: 0.3rem 0.55rem;
    font-size: 0.75rem;
}

.mes-show-shell .mes-attendees__card .info-row {
    font-size: 0.75rem;
    padding: 0.25rem 0;
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
}

.mes-show-shell .mes-attendees__card .info-row:last-of-type {
    border-bottom: none;
}

.mes-attendees__list-card {
    border-radius: 12px !important;
    border: 1px solid rgba(0, 0, 0, 0.08) !important;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05) !important;
}

.mes-attendees-table {
    font-size: 13px;
}

.mes-attendees-table__head th {
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: #6b7280;
    padding-top: 0.65rem !important;
    padding-bottom: 0.65rem !important;
    background: #f9fafb !important;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08) !important;
}

.mes-attendees-table tbody td {
    vertical-align: middle;
    font-size: 13px;
    padding-top: 0.55rem !important;
    padding-bottom: 0.55rem !important;
    line-height: 1.35;
}

.mes-attendees-table tbody td .h6,
.mes-attendees-table tbody td h6 {
    font-size: 13px !important;
    font-weight: 600;
    margin-bottom: 0.1rem !important;
}

.mes-attendees-table tbody td small,
.mes-attendees-table tbody td .text-muted {
    font-size: 13px !important;
}

.mes-attendees-table .badge {
    font-size: 13px;
}

.mes-attendees-table .btn-sm {
    border-radius: 8px;
    font-size: 13px;
    padding: 0.25rem 0.5rem;
}

/* List view avatars slightly smaller */
.mes-attendees-table .avatar.avatar-sm {
    width: 36px !important;
    height: 36px !important;
}

.mes-attendees-table .avatar.avatar-sm img,
.mes-attendees-table .avatar.avatar-sm .avatar-initial {
    width: 36px !important;
    height: 36px !important;
    line-height: 36px;
    font-size: 0.8rem !important;
}

/* Attendees tab: pagination footer */
.mes-attendees__footer {
    margin-top: 0.5rem !important;
    padding-top: 0.85rem !important;
}

.mes-attendees__per-page {
    width: auto !important;
    min-width: 4.25rem;
    max-width: 5.5rem;
    display: inline-block;
}

.mes-attendees__pagination .pagination {
    flex-wrap: wrap;
    justify-content: center;
    margin-bottom: 0;
    gap: 0.25rem;
}

.mes-attendees__pagination .page-link {
    padding: 0.35rem 0.55rem;
    font-size: 0.8125rem;
    border-radius: 8px;
}

.mes-gallery__grid {
    margin-left: -0.35rem;
    margin-right: -0.35rem;
}

.mes-gallery__col {
    padding-left: 0.35rem;
    padding-right: 0.35rem;
}

.mes-gallery__trigger {
    height: 200px;
    border-radius: 12px;
    overflow: hidden;
    cursor: pointer;
    background: #f3f4f6;
    border: 1px solid rgba(0, 0, 0, 0.08);
    transition: box-shadow 0.2s ease, transform 0.2s ease;
}

.mes-gallery__trigger:hover {
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
    transform: translateY(-2px);
}

.mes-gallery__img {
    object-fit: cover;
    transition: transform 0.3s ease;
    display: block;
}

.mes-gallery__video-bg {
    background-size: cover;
    background-position: center;
}

.mes-gallery__play-icon {
    font-size: 3rem;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
    filter: drop-shadow(0 2px 6px rgba(0, 0, 0, 0.35));
}

.mes-gallery__load-btn {
    border-radius: 10px;
    font-weight: 600;
    padding: 0.5rem 1.25rem;
}

@media (max-width: 767.98px) {
    .mes-attendees__toolbar .mes-attendees__actions {
        width: 100%;
        justify-content: space-between;
    }

    .mes-attendees__view-toggle {
        flex: 1;
        justify-content: flex-end;
    }

    .mes-gallery__filters {
        width: 100%;
        justify-content: stretch;
    }

    .mes-gallery__filters .btn {
        flex: 1 1 auto;
        text-align: center;
    }

    .mes-gallery__trigger {
        height: 160px;
        border-radius: 10px;
    }

    .mes-gallery__play-icon {
        font-size: 2.5rem;
    }

    .mes-attendees-table-wrap {
        margin: 0 -0.25rem;
    }

    .mes-attendees__card-body {
        padding: 0.65rem 0.7rem !important;
    }

    .mes-show-shell .mes-attendees__card .avatar.avatar-lg {
        width: 44px !important;
        height: 44px !important;
        min-width: 44px;
    }

    .mes-show-shell .mes-attendees__card .avatar.avatar-lg img.rounded-circle,
    .mes-show-shell .mes-attendees__card .avatar.avatar-lg .avatar-initial {
        width: 44px !important;
        height: 44px !important;
        line-height: 44px;
        font-size: 0.9rem !important;
    }

    .mes-show-shell .mes-attendees__card h6 {
        font-size: 0.8125rem !important;
    }

    .mes-attendees__grid > .mes-attendees__col {
        margin-bottom: 0.5rem !important;
    }

    /* Extra-compact attendee cards on small phones */
    .mes-show-shell .mes-attendees__card .card-body.mes-attendees__card-body {
        padding: 0.5rem 0.55rem !important;
    }

    .mes-show-shell .mes-attendees__card .d-flex.align-items-center.mb-3 {
        margin-bottom: 0.5rem !important;
    }

    .mes-show-shell .mes-attendees__card .avatar.avatar-lg {
        width: 40px !important;
        height: 40px !important;
        min-width: 40px;
        margin-right: 0.5rem !important;
    }

    .mes-show-shell .mes-attendees__card .avatar.avatar-lg img.rounded-circle,
    .mes-show-shell .mes-attendees__card .avatar.avatar-lg .avatar-initial {
        width: 40px !important;
        height: 40px !important;
        line-height: 40px;
        font-size: 0.8rem !important;
    }

    .mes-show-shell .mes-attendees__card h6 {
        font-size: 0.78rem !important;
    }

    .mes-show-shell .mes-attendees__card .text-muted.small,
    .mes-show-shell .mes-attendees__card small {
        font-size: 0.7rem !important;
    }

    .mes-show-shell .mes-attendees__card .info-row {
        font-size: 0.7rem;
        padding: 0.15rem 0;
    }

    .mes-show-shell .mes-attendees__card .d-flex.justify-content-between.align-items-center .btn {
        padding: 0.25rem 0.45rem;
        font-size: 0.7rem;
    }

    .mes-attendees__footer .mes-attendees__range {
        font-size: 0.75rem;
    }

    .mes-attendees__footer .mes-attendees__per-page {
        font-size: 0.8125rem;
        padding-top: 0.2rem;
        padding-bottom: 0.2rem;
        height: auto;
    }
}