/*
 * MuslimProfessional — practical interface refinement
 * Shared application & authentication layouts, October 2026.
 * Maintain the existing component system. Prefer hierarchy, legibility
 * and predictable interactions over additional surfaces or decoration.
 */

/* The navigation hierarchy should be discernible without more badges. */
body.mvn-ui-v3 .mvn-side-nav .mvn-nav-heading {
    font-size: 10.5px;
    font-weight: 730;
    letter-spacing: .095em;
    line-height: 1.45;
    opacity: .84;
}
body.mvn-ui-v3 .mvn-side-nav .mvn-nav-link {
    min-height: 40px;
    font-size: 13px;
    line-height: 1.4;
    font-weight: 590;
    border-radius: 8px;
}
body.mvn-ui-v3 .mvn-side-nav .mvn-nav-link.active {
    font-weight: 700;
    background: rgba(255,255,255,.105);
}
body.mvn-ui-v3 .mvn-side-nav .mvn-nav-link:focus-visible {
    outline: 2px solid #d0b57f;
    outline-offset: -1px;
}
body.mvn-ui-v3 .mvn-side-nav .mvn-nav-link:hover:not(.active) {
    background: rgba(255,255,255,.055);
}

/* Quiet top bar and consistent page identity across modules. */
body.mvn-ui-v3 .mvn-top-v3 {
    border-bottom: 1px solid var(--mvn-v3-border);
}
body.mvn-ui-v3 .mvn-page-context strong {
    font-size: 14.5px;
    font-weight: 740;
    line-height: 1.38;
    letter-spacing: -.012em;
}
body.mvn-ui-v3 .mvn-page-context small {
    font-size: 11px;
    line-height: 1.4;
    letter-spacing: .005em;
}
body.mvn-ui-v3 .mvn-global-search {
    border-radius: 9px;
}
body.mvn-ui-v3 .mvn-global-search:focus-within {
    border-color: #5b9b78;
    box-shadow: 0 0 0 3px rgba(36,119,81,.12);
}
body.mvn-ui-v3 .mvn-content-v3 {
    max-width: 1470px;
}
body.mvn-ui-v3 .mvn-content-v3 .page-head {
    margin-bottom: 25px;
}
body.mvn-ui-v3 .mvn-content-v3 .page-head h1 {
    font-size: clamp(26px, 2.35vw, 34px);
    font-weight: 750;
    line-height: 1.18;
    letter-spacing: -.034em;
    text-wrap: balance;
}
body.mvn-ui-v3 .mvn-content-v3 .page-head p {
    max-width: 67ch;
    font-size: 13.5px;
    line-height: 1.65;
    text-wrap: pretty;
}

/* Strong typographic scaffolding instead of a larger number of cards. */
body.mvn-ui-v3 .mvn-content-v3 :is(.card, .mvn-card) {
    border-radius: 11px;
    box-shadow: none;
}
body.mvn-ui-v3 .mvn-content-v3 :is(.card, .mvn-card) > header > h2,
body.mvn-ui-v3 .mvn-content-v3 .mvn-admin5-card-head h2 {
    font-weight: 730;
    letter-spacing: -.012em;
}
body.mvn-ui-v3 .mvn-content-v3 :where(.card p, .mvn-card p) {
    line-height: 1.62;
}
body.mvn-ui-v3 .mvn-content-v3 .mvn-admin5-head h1 {
    letter-spacing: -.035em;
    text-wrap: balance;
}
body.mvn-ui-v3 .mvn-content-v3 .mvn-admin5-kpis strong {
    font-variant-numeric: tabular-nums lining-nums;
}
body.mvn-ui-v3 .mvn-content-v3 .mvn-admin5-head p {
    max-width: 62ch;
    line-height: 1.58;
}

/* Real operational tables: stable columns, scannable headings and rows. */
body.mvn-ui-v3 .mvn-content-v3 .table-wrap {
    border-radius: 11px;
    scrollbar-width: thin;
}
body.mvn-ui-v3 .mvn-content-v3 .table-wrap :is(th, td) {
    vertical-align: middle;
}
body.mvn-ui-v3 .mvn-content-v3 .table-wrap th {
    font-size: 12px;
    line-height: 1.45;
    letter-spacing: .014em;
    font-weight: 730;
    text-transform: none;
}
body.mvn-ui-v3 .mvn-content-v3 .table-wrap td {
    line-height: 1.55;
}
body.mvn-ui-v3 .mvn-content-v3 .table-wrap tbody tr:hover {
    background: rgba(30,102,70,.03);
}
body.mvn-ui-v3 .mvn-content-v3 :where(.mvn-ux-count, .mvn-ux-list-heading strong, .mvn-admin5-total strong) {
    font-variant-numeric: tabular-nums lining-nums;
}

/* A small, consistent interaction standard across forms. */
body.mvn-ui-v3 .mvn-content-v3 .field > label {
    font-weight: 670;
    line-height: 1.4;
}
body.mvn-ui-v3 .mvn-content-v3 :where(input:not([type="checkbox"]):not([type="radio"]), select, textarea):focus-visible {
    outline: 2px solid #5f9d77;
    outline-offset: 1px;
}
body.mvn-ui-v3 .mvn-content-v3 :where(input, textarea)::placeholder {
    opacity: 1;
    color: var(--mvn-v3-muted);
}
body.mvn-ui-v3 .mvn-content-v3 :where(a.btn, button.btn, .btn) {
    border-radius: 9px;
    box-shadow: none;
}
body.mvn-ui-v3 .mvn-content-v3 :where(a.btn, button.btn):focus-visible {
    outline: 3px solid #b3d8b8;
    outline-offset: 2px;
}
body.mvn-ui-v3 .mvn-content-v3 :where(.mvn-ux-empty, .empty) {
    line-height: 1.65;
}

/* Useful footer without competing with real tasks. */
body.mvn-ui-v3 .mvn-main-footer-v3 {
    padding-block: 15px;
    gap: 16px;
    border-top: 1px solid var(--mvn-v3-border);
}
body.mvn-ui-v3 .mvn-main-footer-v3 span {
    font-size: 12px;
    line-height: 1.5;
}

/* Sign-in, account recovery and OTP screens belong to the same product. */
body.mvn-humanized:not(.mvn-app-body):not(.mvn-public-v2) .auth-brand-title {
    letter-spacing: -.018em;
}
body.mvn-humanized:not(.mvn-app-body):not(.mvn-public-v2) .auth-card {
    border-radius: 13px !important;
    box-shadow: none !important;
}
body.mvn-humanized:not(.mvn-app-body):not(.mvn-public-v2) .auth-card :where(input, select, textarea):focus-visible {
    outline: 2px solid #5f9d77;
    outline-offset: 2px;
}
body.mvn-humanized:not(.mvn-app-body):not(.mvn-public-v2) .auth-card label {
    font-weight: 675;
}
body.mvn-humanized:not(.mvn-app-body):not(.mvn-public-v2) .auth-powered {
    line-height: 1.5;
}

/* Dark mode relies on the existing tokens, never a fixed white surface. */
html[data-mvn-theme="dark"] body.mvn-ui-v3 .mvn-content-v3 .table-wrap tbody tr:hover {
    background: rgba(182,238,198,.065);
}
html[data-mvn-theme="dark"] body.mvn-ui-v3 .mvn-global-search:focus-within {
    box-shadow: 0 0 0 3px rgba(165,223,182,.17);
}

@media (max-width: 760px) {
    body.mvn-ui-v3 .mvn-content-v3 .page-head {
        align-items: flex-start;
        gap: 13px;
    }
    body.mvn-ui-v3 .mvn-content-v3 .page-head h1 {
        font-size: clamp(25px, 6.4vw, 30px);
    }
    body.mvn-ui-v3 .mvn-content-v3 .card {
        border-radius: 10px;
    }
    body.mvn-ui-v3 .mvn-main-footer-v3 {
        padding-inline: 17px;
    }
}

@media (prefers-reduced-motion: reduce) {
    body.mvn-ui-v3 .mvn-side-nav .mvn-nav-link,
    body.mvn-ui-v3 .mvn-content-v3 :where(a.btn,button.btn) {
        transition: none !important;
        transform: none !important;
    }
}

/* October 16: shared navigation, error recovery and scroll discovery. */
body.mvn-ui-v3 .mvn-top-left { flex: 1 1 0; min-width: 0; }
body.mvn-ui-v3 .mvn-page-context { flex: 1 1 auto; min-width: 0; }
body.mvn-ui-v3 .mvn-page-context strong { max-width: 100% !important; min-width: 0; }
body.mvn-ui-v3 .mvn-top-actions-v3 { flex: 0 0 auto; }
.mvn-humanized .mvn-validation-summary { scroll-margin-block-start: 90px; }
.mvn-humanized .mvn-validation-summary > strong { display: block; margin-bottom: 8px; line-height: 1.5; }
.mvn-humanized .mvn-validation-summary a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
.mvn-humanized .mvn-validation-summary li + li { margin-top: 8px; }
.mvn-humanized .mvn-validation-summary:focus { outline: 2px solid currentColor; outline-offset: 3px; }
.mvn-humanized :is(input,select,textarea)[aria-invalid="true"] { border-color: #a52828 !important; border-width: 2px; }
.mvn-humanized .mvn-validation-summary a:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }
body.mvn-ui-v3 .mvn-table-scroll-tools { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px 16px; margin: 10px 0; }
body.mvn-ui-v3 .mvn-table-scroll-tools[hidden] { display: none !important; }
body.mvn-ui-v3 .mvn-table-scroll-tools > span { color: var(--mvn-v3-muted); font-size: 12.5px; line-height: 1.5; }
body.mvn-ui-v3 .mvn-table-scroll-tools > div { display: flex; flex-wrap: wrap; gap: 8px; }
body.mvn-ui-v3 .mvn-table-scroll-tools button { min-height: 44px; padding: 8px 12px; font-size: 12.5px; white-space: normal; }
body.mvn-ui-v3 .mvn-table-scroll-tools button:disabled { opacity: .55; cursor: default; }
html[data-mvn-theme="dark"] .mvn-humanized :is(input,select,textarea)[aria-invalid="true"] { border-color: #ffaaaa !important; }
@media (max-width: 360px) {
    body.mvn-ui-v3 .mvn-page-context { display: none !important; }
    body.mvn-ui-v3 .mvn-top-left { flex: 0 0 auto; }
}

/* Contain absolutely positioned screen-reader labels inside the scroll region. */
body.mvn-ui-v3 .mvn-content-v3 .table-wrap { position: relative; }
body.mvn-ui-v3 .mvn-ux-table-hint[hidden] { display: none !important; }
.mvn-humanized .mvn-validation-summary :is(strong,li,a) { font-size: 14px; line-height: 1.6; }
