/* C'BEZT MX9.5.5.5 — shared /member/* UI contract (OPT-IN, LOCK).
   Reference: frozen /member/riwayat-poin and accepted transaction MX9.5.5.4.
   Loaded after base Member/auth CSS and before page-specific @stack('styles').
   NO global input, select, button, a, nav, modal or frozen-page overrides.
   Apply member-ui-* classes explicitly to newly adopted controls/components. */
body.member-portal,
body.member-auth-body {
    --m-control-height:40px;
    --m-ui-filter-title-size:.72rem;
    --m-ui-filter-help-size:.6rem;
    --m-ui-filter-label-size:.58rem;
    --m-ui-control-font-size:.7rem;
    --m-ui-filter-reset-size:.62rem;
    --m-ui-surface:var(--m-card,var(--ma-surface,#fff));
    --m-ui-subtle-surface:var(--m-sk1,var(--ma-surface-muted,#f8fafc));
    --m-ui-border:var(--m-bdr,var(--ma-border,#e2e8f0));
    --m-ui-text:var(--m-txt,var(--ma-text,#0a1929));
    --m-ui-muted:var(--m-mut,var(--ma-muted,#607d8b));
    --m-ui-accent:var(--m-orange,var(--ma-orange,#f57c00));
    --m-ui-shadow:var(--m-shd,rgba(0,0,0,.06));
}

/* Filter family: spacing, typography, dropdown-first GET forms. */
:where(body.member-portal,body.member-auth-body) .member-ui-filter-panel {
    min-width:0;padding:.8rem;border:1px solid var(--m-ui-border);
    border-radius:1.15rem;background:var(--m-ui-surface);
    box-shadow:0 1px 12px var(--m-ui-shadow);color:var(--m-ui-text);
}
:where(body.member-portal,body.member-auth-body) .member-ui-filter-title {
    color:var(--m-ui-text);font-size:var(--m-ui-filter-title-size);
    font-weight:950;line-height:1.2;
}
:where(body.member-portal,body.member-auth-body) .member-ui-filter-help {
    margin-top:.18rem;color:var(--m-ui-muted);
    font-size:var(--m-ui-filter-help-size);font-weight:650;line-height:1.4;
}
:where(body.member-portal,body.member-auth-body) .member-ui-filter-form {
    display:flex;align-items:flex-end;flex-wrap:wrap;gap:.55rem;min-width:0;
}
:where(body.member-portal,body.member-auth-body) .member-ui-filter-field {
    display:flex;flex:1 1 9rem;min-width:0;flex-direction:column;gap:.32rem;
    color:var(--m-ui-muted);font-size:var(--m-ui-filter-label-size);
    font-weight:900;line-height:1.3;
}

/* Single-line controls only: 40px outer visual box on mobile and desktop.
   Textareas, file inputs, radio/checkbox/toggle, nav, badges and dialogs excluded.
   Keep native select and month/date-picker interaction; wrap in <label> where apt. */
:where(body.member-portal,body.member-auth-body) :is(
    .member-ui-control,.member-ui-action,.member-ui-icon-action
) {
    box-sizing:border-box;height:var(--m-control-height);
    min-height:var(--m-control-height);max-height:var(--m-control-height);
    font-family:inherit;line-height:1.2;
}
:where(body.member-portal,body.member-auth-body) .member-ui-control {
    display:block;width:100%;min-width:0;max-width:100%;
    border:1px solid var(--m-ui-border);border-radius:.85rem;
    background:var(--m-ui-subtle-surface);color:var(--m-ui-text);
    padding:0 .7rem;font-size:var(--m-ui-control-font-size);
    font-weight:850;outline:0;
}
:where(body.member-portal,body.member-auth-body) select.member-ui-control {
    padding-right:1.35rem;cursor:pointer;
}
:where(body.member-portal,body.member-auth-body) :is(.member-ui-action,.member-ui-icon-action) {
    position:relative;display:inline-flex;align-items:center;justify-content:center;
    gap:.4rem;border-radius:.85rem;padding:0 .8rem;
    font-size:var(--m-ui-control-font-size);font-weight:900;
    text-decoration:none;white-space:nowrap;cursor:pointer;
    background:var(--m-ui-surface);color:var(--m-ui-text);
    border:1px solid var(--m-ui-border);
}
:where(body.member-portal,body.member-auth-body) .member-ui-action--primary {
    color:#fff;border-color:transparent;background:var(--m-ui-accent);
}
:where(body.member-portal,body.member-auth-body) .member-ui-action--reset {
    font-size:var(--m-ui-filter-reset-size);font-weight:900;
}
:where(body.member-portal,body.member-auth-body) .member-ui-icon-action {
    width:var(--m-control-height);min-width:var(--m-control-height);
    max-width:var(--m-control-height);padding:0;
}
/* Transparent 2px action hit extension; non-button inputs keep native label target. */
:where(body.member-portal,body.member-auth-body) :is(.member-ui-action,.member-ui-icon-action)::after {
    content:"";position:absolute;inset:-2px;border-radius:inherit;
}
:where(body.member-portal,body.member-auth-body) :is(.member-ui-control,.member-ui-action,.member-ui-icon-action):focus-visible {
    outline:2px solid var(--m-ui-accent);outline-offset:2px;
}
:where(body.member-portal,body.member-auth-body) :is(.member-ui-control,.member-ui-action,.member-ui-icon-action):disabled,
:where(body.member-portal,body.member-auth-body) :is(.member-ui-action,.member-ui-icon-action)[aria-disabled="true"] {
    opacity:.6;cursor:not-allowed;
}

/* Reusable points-family summary and list primitives; opt in per reviewed page. */
:where(body.member-portal,body.member-auth-body) .member-ui-summary-grid--three {
    display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem;
}
:where(body.member-portal,body.member-auth-body) .member-ui-summary-card {
    min-width:0;padding:.85rem;border-radius:1.15rem;
    background:var(--m-ui-surface);border:1px solid var(--m-ui-border);
    color:var(--m-ui-text);box-shadow:0 2px 10px var(--m-ui-shadow);
}
:where(body.member-portal,body.member-auth-body) .member-ui-summary-label {
    font-size:.56rem;font-weight:950;letter-spacing:.07em;text-transform:uppercase;
    color:var(--m-ui-muted);line-height:1.2;
}
:where(body.member-portal,body.member-auth-body) .member-ui-summary-value {
    margin-top:.42rem;font-size:1.18rem;font-weight:950;line-height:1.1;
    overflow-wrap:anywhere;color:var(--m-ui-text);
}
:where(body.member-portal,body.member-auth-body) .member-ui-list {
    overflow:hidden;border:1px solid var(--m-ui-border);border-radius:1.15rem;
    background:var(--m-ui-surface);
}
:where(body.member-portal,body.member-auth-body) .member-ui-list-row {
    min-width:0;display:grid;grid-template-columns:2.45rem minmax(0,1fr) auto;
    align-items:center;gap:.7rem;padding:.82rem .9rem;
    border-bottom:1px solid var(--m-ui-border);color:var(--m-ui-text);
}
:where(body.member-portal,body.member-auth-body) .member-ui-list-row:last-child {border-bottom:0}
:where(body.member-portal,body.member-auth-body) .member-ui-list-copy {min-width:0;overflow-wrap:anywhere}
:where(body.member-portal,body.member-auth-body) .member-ui-list-icon {
    display:flex;width:2.45rem;height:2.45rem;align-items:center;justify-content:center;
    background:color-mix(in srgb,var(--m-ui-accent) 9%,transparent);
    border-radius:.85rem;color:var(--m-ui-accent);
}
@media (max-width:520px) {
    :where(body.member-portal,body.member-auth-body) .member-ui-summary-grid--three {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
    :where(body.member-portal,body.member-auth-body) .member-ui-summary-grid--three > :last-child:nth-child(odd) {
        grid-column:1 / -1;
    }
    :where(body.member-portal,body.member-auth-body) .member-ui-list-row {
        grid-template-columns:2.2rem minmax(0,1fr);align-items:start;gap:.55rem;
    }
    :where(body.member-portal,body.member-auth-body) .member-ui-list-row > :last-child:nth-child(3) {
        grid-column:2;
    }
}