:root {
    --navy:#142536;
    --navy2:#1d3449;
    --blue:#486b85;
    --light:#f3f5f7;
    --border:#dce2e7;
    --text:#263642;
    --muted:#75828d;
    --white:#fff;
    --green:#36775d;
}

* {
    box-sizing:border-box;
}

.client-login {
    min-height:100vh;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:24px;
    background:
        linear-gradient(rgba(15,32,47,.90),rgba(15,32,47,.94)),
        linear-gradient(135deg,#415f75,#142536);
}

.login-card {
    width:440px;
    max-width:100%;
    background:#fff;
    padding:42px;
    border-radius:8px;
    box-shadow:0 25px 70px rgba(0,0,0,.30);
}

.logo {
    text-align:center;
    margin-bottom:30px;
}

.logo h1 {
    margin:0;
    font-family:Georgia,serif;
    color:var(--navy);
    font-size:28px;
}

.logo p {
    color:#7c8993;
    font-size:11px;
    letter-spacing:1.5px;
    text-transform:uppercase;
    margin-top:8px;
}

.field {
    margin-bottom:18px;
}

.field label {
    display:block;
    font-size:11px;
    font-weight:bold;
    letter-spacing:.6px;
    margin-bottom:7px;
    color:#5e6c76;
}

.field input {
    width:100%;
    padding:13px;
    border:1px solid #cad4dc;
    border-radius:5px;
    font-size:15px;
}

.btn {
    border:0;
    background:var(--navy);
    color:#fff;
    padding:12px 17px;
    border-radius:5px;
    text-decoration:none;
    cursor:pointer;
    display:inline-block;
    font-weight:600;
}

.btn-full {
    width:100%;
}

.error {
    background:#faeeee;
    border:1px solid #e1bbbb;
    color:#8d3030;
    padding:12px;
    border-radius:5px;
    margin-bottom:18px;
    font-size:13px;
}

.security-note {
    margin-top:24px;
    color:#89959e;
    font-size:11px;
    text-align:center;
    line-height:1.6;
}

.portal-header {
    background:var(--navy);
    color:#fff;
    height:72px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:0 32px;
}

.portal-brand {
    font-family:Georgia,serif;
    font-size:21px;
}

.portal-brand small {
    display:block;
    font-family:Arial,sans-serif;
    font-size:10px;
    text-transform:uppercase;
    letter-spacing:1.4px;
    opacity:.65;
    margin-top:3px;
}

.portal-container {
    max-width:1200px;
    margin:auto;
    padding:32px;
}

.case-head {
    margin-bottom:25px;
}

.case-head h1 {
    margin:0 0 7px;
    color:var(--navy);
    font-family:Georgia,serif;
    font-size:30px;
}

.case-head p {
    margin:0;
    color:var(--muted);
}

.grid {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:18px;
}

.card {
    background:#fff;
    border:1px solid var(--border);
    border-radius:7px;
    padding:23px;
    box-shadow:0 2px 7px rgba(0,0,0,.03);
}

.card.full {
    grid-column:1/-1;
}

.card h2 {
    font-family:Georgia,serif;
    color:var(--navy);
    margin:0 0 18px;
    font-size:19px;
}

.info-row {
    border-bottom:1px solid #edf0f2;
    padding:11px 0;
    display:flex;
    justify-content:space-between;
    gap:20px;
}

.info-row:last-child {
    border-bottom:0;
}

.info-label {
    color:var(--muted);
    font-size:12px;
}

.info-value {
    font-weight:600;
    text-align:right;
}

.amount {
    font-size:25px;
    font-family:Georgia,serif;
    color:var(--navy);
}

.amount-note {
    color:var(--muted);
    font-size:11px;
    margin-top:6px;
}

.progress {
    display:grid;
    grid-template-columns:repeat(5,1fr);
    gap:5px;
    margin-top:20px;
}

.step {
    text-align:center;
    position:relative;
}

.step-line {
    height:5px;
    background:#dce3e8;
    margin-bottom:9px;
}

.step.done .step-line,
.step.current .step-line {
    background:#496d87;
}

.step-name {
    font-size:10px;
    color:#89959e;
    text-transform:uppercase;
    letter-spacing:.4px;
}

.step.done .step-name,
.step.current .step-name {
    color:#2b475d;
    font-weight:bold;
}

.status-pill {
    background:#e7edf2;
    color:#3d5c72;
    padding:7px 11px;
    border-radius:15px;
    display:inline-block;
    font-size:12px;
    font-weight:bold;
}

.item {
    border-bottom:1px solid #edf0f2;
    padding:13px 0;
}

.item:last-child {
    border-bottom:0;
}

.item-title {
    font-weight:bold;
    margin-bottom:4px;
}

.item-meta {
    color:var(--muted);
    font-size:11px;
}

.logout {
    background:transparent;
    border:1px solid rgba(255,255,255,.35);
    color:#fff;
    padding:8px 13px;
    border-radius:5px;
    cursor:pointer;
}

@media(max-width:720px) {
    .grid {
        grid-template-columns:1fr;
    }

    .card.full {
        grid-column:auto;
    }

    .portal-container {
        padding:20px;
    }

    .progress {
        grid-template-columns:1fr;
    }

    .step {
        text-align:left;
    }
}


/* CLIENT PORTAL + PUBLIC WEBSITE HEADER START */


/*
 * El body ya NO centra toda la página,
 * porque ahora tenemos el header real arriba.
 */
body.client-portal-site-page {
    margin: 0;
    min-height: 100%;
    background: #f3f5f7;
}


/*
 * El login comienza después del header.
 */
.client-portal-main {
    width: 100%;
}


.client-portal-login-section {
    position: relative;

    display: flex;
    align-items: center;
    justify-content: center;

    width: 100%;

    min-height: 620px;

    padding: 70px 24px;

    background:
        linear-gradient(
            rgba(15,32,47,.88),
            rgba(15,32,47,.93)
        ),
        linear-gradient(
            135deg,
            #415f75,
            #142536
        );
}


.client-portal-login-wrap {
    width: 100%;
    max-width: 440px;

    margin: 0 auto;
}


/*
 * La tarjeta sigue siendo la del portal,
 * pero ahora visualmente pertenece al sitio.
 */
.client-portal-site-page .login-card {
    width: 100%;
    max-width: 440px;

    margin: 0;

    padding: 42px;

    background: #ffffff;

    border-radius: 8px;

    box-shadow:
        0 25px 70px
        rgba(0,0,0,.28);
}


/*
 * El botón principal del formulario
 * NO debe heredar las dimensiones
 * de los botones pequeños del header.
 */
.client-portal-site-page
.login-card
.btn-full {

    display: flex;

    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;

    height: auto !important;
    min-height: 46px !important;

    padding: 12px 18px !important;

    font-size: 12px !important;
}


/*
 * Resaltar de forma muy discreta que
 * estamos en Client Portal.
 */
.client-portal-current {
    pointer-events: auto;
}


@media (max-width: 760px) {

    .client-portal-login-section {
        min-height: 520px;
        padding: 45px 18px;
    }

    .client-portal-site-page .login-card {
        padding: 30px 24px;
    }
}


/* CLIENT PORTAL + PUBLIC WEBSITE HEADER END */

/* CLIENT PORTAL CONTENT SCOPE START */

/*
 * Los estilos propios del portal se limitan al contenido.
 * Header y footer conservan exactamente los estilos
 * originales de Newman Law Firm.
 */

.client-portal-main,
.client-portal-main input,
.client-portal-main select,
.client-portal-main textarea,
.client-portal-main button {
    font-family: Arial, Helvetica, sans-serif;
}


/* CLIENT PORTAL CONTENT SCOPE END */


/* CLIENT PORTAL MOBILE TITLE FIX START */

@media (max-width: 760px) {

    .client-portal-site-page
    .login-card
    .logo h1 {
        font-size: clamp(22px, 6.3vw, 31px) !important;
        line-height: 1.08 !important;
        letter-spacing: 0 !important;

        white-space: nowrap !important;

        margin-left: -8px !important;
        margin-right: -8px !important;
    }

}


/* teléfonos muy angostos */
@media (max-width: 390px) {

    .client-portal-site-page
    .login-card
    .logo h1 {
        font-size: 21px !important;
    }

}

/* CLIENT PORTAL MOBILE TITLE FIX END */



/* CLIENT ACCOUNT ADMIN UI START */


.client-account-shell {

    --client-sidebar-width:258px;

    margin:0;

    min-height:100vh;

    background:#f3f5f7;

    color:#263746;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

}


/* ============================================================
   SIDEBAR
============================================================ */

.client-sidebar {

    position:fixed;

    z-index:1100;

    top:0;
    bottom:0;
    left:0;

    width:
        var(--client-sidebar-width);

    display:flex;

    flex-direction:column;

    background:
        linear-gradient(
            180deg,
            #172433,
            #111c28
        );

    color:#fff;

    box-shadow:
        8px 0 30px
        rgba(17,31,44,.12);

    overflow-y:auto;

}


.client-sidebar-brand {

    min-height:82px;

    display:flex;

    align-items:center;

    gap:12px;

    padding:18px 17px;

    border-bottom:
        1px solid
        rgba(255,255,255,.08);

}


.client-sidebar-logo {

    width:43px;
    height:43px;

    flex:0 0 43px;

    display:flex;

    align-items:center;
    justify-content:center;

    border-radius:11px;

    background:#fff;

    color:#1a3246;

    font-size:20px;

    font-weight:800;

    box-shadow:
        0 5px 15px
        rgba(0,0,0,.18);

}


.client-sidebar-brand-text {

    min-width:0;

}


.client-sidebar-brand-text strong {

    display:block;

    color:#fff;

    font-size:14px;

    line-height:1.15;

}


.client-sidebar-brand-text small {

    display:block;

    margin-top:4px;

    color:#91a4b4;

    font-size:11px;

}


.client-sidebar-nav {

    flex:1;

    padding:
        14px 10px 25px;

}


.client-menu-section-title {

    padding:
        16px 12px 7px;

    color:#8293a4;

    font-size:10px;

    font-weight:700;

    letter-spacing:1.15px;

}


.client-menu-link {

    min-height:43px;

    display:flex;

    align-items:center;

    gap:11px;

    width:100%;

    box-sizing:border-box;

    margin:2px 0;

    padding:9px 11px;

    border-radius:7px;

    color:#cbd5df;

    font-size:13px;

    font-weight:600;

    text-decoration:none;

    transition:
        background .16s ease,
        color .16s ease;

}


.client-menu-link:hover {

    background:
        rgba(255,255,255,.075);

    color:#fff;

}


.client-menu-link.current {

    background:
        linear-gradient(
            90deg,
            #315f82,
            #3e7297
        );

    color:#fff;

    box-shadow:
        0 5px 14px
        rgba(20,54,79,.28);

}


.client-menu-icon {

    width:25px;
    height:25px;

    flex:0 0 25px;

    display:flex;

    align-items:center;
    justify-content:center;

    border-radius:6px;

    background:
        rgba(255,255,255,.075);

    color:#dce7ef;

    font-size:11px;

    font-weight:800;

}


.client-sidebar-footer {

    padding:14px;

    border-top:
        1px solid
        rgba(255,255,255,.08);

}


.client-sidebar-account {

    display:flex;

    align-items:center;

    gap:10px;

    padding:10px;

    background:
        rgba(255,255,255,.045);

    border-radius:9px;

}


.client-account-avatar {

    width:34px;
    height:34px;

    flex:0 0 34px;

    display:flex;

    align-items:center;
    justify-content:center;

    border-radius:50%;

    background:#dbeaf4;

    color:#214762;

    font-weight:800;

}


.client-sidebar-account strong {

    display:block;

    color:#fff;

    font-size:12px;

}


.client-sidebar-account small {

    display:block;

    margin-top:2px;

    color:#8fa3b3;

    font-size:10px;

}


.client-sidebar-logout {

    margin:9px 0 0;

}


.client-sidebar-logout button {

    width:100%;

    min-height:38px;

    display:flex;

    align-items:center;

    gap:9px;

    padding:8px 11px;

    border:
        1px solid
        rgba(255,255,255,.10);

    border-radius:7px;

    background:
        rgba(255,255,255,.045);

    color:#cbd5df;

    font-size:11px;

    font-weight:600;

    cursor:pointer;

}


.client-sidebar-logout button:hover {

    background:
        rgba(255,255,255,.09);

    color:#fff;

}


/* ============================================================
   TOPBAR
============================================================ */

.client-topbar {

    position:fixed;

    z-index:1000;

    top:0;

    left:
        var(--client-sidebar-width);

    right:0;

    height:66px;

    display:flex;

    align-items:center;

    justify-content:space-between;

    box-sizing:border-box;

    padding:
        0 30px;

    background:
        rgba(255,255,255,.98);

    border-bottom:
        1px solid #dfe5ea;

    box-shadow:
        0 2px 12px
        rgba(20,40,55,.04);

}


.client-topbar-brand strong {

    display:block;

    color:#203646;

    font-size:14px;

}


.client-topbar-brand small {

    display:block;

    margin-top:2px;

    color:#84939e;

    font-size:10px;

}


.client-topbar-context {

    padding:
        7px 11px;

    border:
        1px solid #dce4e9;

    border-radius:7px;

    background:#f7f9fa;

    color:#637581;

    font-size:10px;

    font-weight:700;

}


/* ============================================================
   MAIN
============================================================ */

.client-admin-main {

    width:auto;

    max-width:none;

    box-sizing:border-box;

    margin:
        0 0 0
        var(--client-sidebar-width);

    padding:
        92px 30px 42px;

}


.client-admin-main > .card.full:first-child {

    padding:24px 25px;

    background:
        linear-gradient(
            135deg,
            #ffffff,
            #f8fafb
        );

}


.client-admin-main > .card.full:first-child h1 {

    margin:
        0 0 6px !important;

    color:#213746;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size:26px;

    line-height:1.15;

    letter-spacing:-.4px;

}


.client-admin-main
.grid {

    display:grid;

    grid-template-columns:
        repeat(
            2,
            minmax(0,1fr)
        );

    gap:18px;

    margin-top:18px;

}


/* ============================================================
   CARDS
============================================================ */

.client-admin-main
.card {

    background:#fff;

    border:
        1px solid #dfe5ea;

    border-radius:10px;

    padding:21px;

    box-shadow:
        0 7px 24px
        rgba(25,45,60,.065);

}


.client-admin-main
.card.full {

    grid-column:
        1 / -1;

}


.client-admin-main
.card h2 {

    margin:
        0 0 17px;

    color:#263b4a;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size:15px;

    line-height:1.2;

}


/* ============================================================
   PROFILE / CASE DETAILS
============================================================ */

.client-admin-main
.info-row {

    min-height:42px;

    display:flex;

    align-items:center;

    justify-content:space-between;

    gap:20px;

    padding:
        10px 0;

    border-bottom:
        1px solid #edf1f3;

}


.client-admin-main
.info-row:last-child {

    border-bottom:0;

}


.client-admin-main
.info-label {

    color:#71808d;

    font-size:11px;

}


.client-admin-main
.info-value {

    color:#304653;

    font-size:11px;

    font-weight:600;

    text-align:right;

}


/* ============================================================
   CASE LIST / DOCUMENTS / UPDATES
============================================================ */

.client-admin-main
.item {

    padding:
        13px 0;

    border-bottom:
        1px solid #edf1f3;

}


.client-admin-main
.item:last-child {

    border-bottom:0;

}


.client-admin-main
.item-title {

    color:#2c4250;

    font-size:12px;

    font-weight:700;

}


.client-admin-main
.item-meta {

    margin-top:4px;

    color:#7d8b96;

    font-size:10px;

    line-height:1.45;

}


/* ============================================================
   BUTTON
============================================================ */

.client-admin-main
.btn {

    min-height:34px;

    display:inline-flex;

    align-items:center;
    justify-content:center;

    box-sizing:border-box;

    padding:
        7px 12px;

    border:
        1px solid #315f82;

    border-radius:7px;

    background:#315f82;

    color:#fff;

    font-size:10px;

    font-weight:700;

    line-height:1;

    text-decoration:none;

    box-shadow:
        0 3px 9px
        rgba(40,79,108,.12);

}


.client-admin-main
.btn:hover {

    background:#274f6e;

    border-color:#274f6e;

}


/* ============================================================
   STATUS / AMOUNT
============================================================ */

.client-admin-main
.status-pill {

    display:inline-flex;

    align-items:center;

    padding:
        6px 10px;

    border-radius:14px;

    background:#e8f0f5;

    color:#315b78;

    font-size:10px;

    font-weight:700;

}


.client-admin-main
.amount {

    color:#213f54;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size:25px;

    font-weight:700;

}


.client-admin-main
.amount-note {

    margin-top:5px;

    color:#7a8994;

    font-size:10px;

}


/* ============================================================
   ANCHORS
============================================================ */

#my-profile,
#my-cases {

    scroll-margin-top:86px;

}


/* ============================================================
   MOBILE
============================================================ */

.client-sidebar-toggle {

    display:none;

    position:fixed;

    z-index:1300;

    top:12px;
    left:12px;

    width:40px;
    height:40px;

    padding:0;

    border:0;

    border-radius:8px;

    background:#20394c;

    color:#fff;

    font-size:20px;

    cursor:pointer;

}


@media (max-width:900px) {

    .client-sidebar {

        transform:
            translateX(-100%);

        transition:
            transform .2s ease;

    }


    body.client-sidebar-open
    .client-sidebar {

        transform:
            translateX(0);

    }


    .client-sidebar-toggle {

        display:block;

    }


    .client-topbar {

        left:0;

        padding-left:64px;

    }


    .client-admin-main {

        margin-left:0;

        padding:
            86px 18px 35px;

    }

}


@media (max-width:700px) {

    .client-admin-main
    .grid {

        grid-template-columns:1fr;

    }


    .client-admin-main
    .card.full {

        grid-column:auto;

    }


    .client-admin-main
    .info-row {

        align-items:flex-start;

        flex-direction:column;

        gap:4px;

    }


    .client-admin-main
    .info-value {

        text-align:left;

    }

}


/* CLIENT ACCOUNT ADMIN UI END */



/* CLIENT PORTAL FINAL PAGES START */


.client-page-heading {

    margin-bottom:18px;

}


.client-page-heading h1 {

    margin:
        0 0 5px !important;

    color:#213746;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size:26px;

    line-height:1.15;

}


.client-page-heading p {

    margin:0;

    color:#75848f;

    font-size:11px;

}


/* ============================================================
   MY CASES
============================================================ */

.client-case-list {

    width:100%;

}


.client-case-row {

    min-height:76px;

    display:grid;

    grid-template-columns:
        minmax(220px,2fr)
        minmax(140px,1fr)
        minmax(160px,1fr)
        auto;

    align-items:center;

    gap:18px;

    padding:
        14px 5px;

    border-bottom:
        1px solid #edf1f3;

}


.client-case-row:last-child {

    border-bottom:0;

}


.client-case-id {

    color:#273f50;

    font-size:12px;

    font-weight:800;

}


.client-case-meta {

    margin-top:5px;

    color:#7d8b96;

    font-size:10px;

}


.client-case-status {

    text-align:left;

}


.client-case-amount strong {

    display:block;

    color:#294658;

    font-size:12px;

}


.client-case-amount small {

    display:block;

    margin-top:3px;

    color:#85929c;

    font-size:9px;

}


.client-case-action {

    text-align:right;

}


/* ============================================================
   MY PROFILE
============================================================ */

.client-profile-grid {

    display:grid;

    grid-template-columns:
        repeat(
            2,
            minmax(0,1fr)
        );

    gap:18px;

    margin-top:18px;

}


.client-profile-note {

    margin-top:18px;

}


.client-profile-note strong {

    color:#304858;

    font-size:12px;

}


.client-profile-note p {

    margin:
        6px 0 0;

    color:#7a8994;

    font-size:10px;

    line-height:1.5;

}


/* ============================================================
   RESPONSIVE
============================================================ */

@media (max-width:900px) {

    .client-case-row {

        grid-template-columns:
            1fr 1fr;

    }


    .client-case-action {

        text-align:left;

    }

}


@media (max-width:700px) {

    .client-profile-grid {

        grid-template-columns:
            1fr;

    }


    .client-case-row {

        grid-template-columns:
            1fr;

        gap:9px;

    }


    .client-case-action {

        padding-top:4px;

    }

}


/* CLIENT PORTAL FINAL PAGES END */



/* CLIENT DASHBOARD SUMMARY START */


/* ============================================================
   WELCOME
============================================================ */

.client-dashboard-welcome {

    display:flex;

    align-items:center;

    justify-content:space-between;

    gap:25px;

    padding:25px;

    margin-bottom:18px;

    background:#fff;

    border:1px solid #dfe5ea;

    border-radius:10px;

    box-shadow:
        0 7px 24px
        rgba(25,45,60,.055);

}


.client-dashboard-eyebrow {

    margin-bottom:8px;

    color:#718493;

    font-size:9px;

    font-weight:800;

    letter-spacing:1.2px;

}


.client-dashboard-welcome h1 {

    margin:0 0 7px;

    color:#213746;

    font-size:27px;

    line-height:1.1;

    letter-spacing:-.45px;

}


.client-dashboard-welcome p {

    max-width:620px;

    margin:0;

    color:#71808d;

    font-size:11px;

    line-height:1.55;

}


.client-dashboard-account-badge {

    flex:0 0 auto;

    display:flex;

    align-items:center;

    gap:7px;

    padding:8px 11px;

    background:#f4f8f6;

    border:1px solid #d9e7df;

    border-radius:18px;

    color:#4f6e5d;

    font-size:10px;

    font-weight:700;

}


.client-dashboard-account-dot {

    width:7px;

    height:7px;

    display:block;

    border-radius:50%;

    background:#6c9279;

}


/* ============================================================
   STATS
============================================================ */

.client-dashboard-stats {

    display:grid;

    grid-template-columns:
        repeat(
            4,
            minmax(0,1fr)
        );

    gap:15px;

    margin-bottom:18px;

}


.client-stat-card {

    min-height:120px;

    box-sizing:border-box;

    padding:18px;

    background:#fff;

    border:1px solid #dfe5ea;

    border-radius:10px;

    box-shadow:
        0 5px 18px
        rgba(25,45,60,.045);

}


.client-stat-label {

    color:#768692;

    font-size:9.5px;

    font-weight:700;

    text-transform:uppercase;

    letter-spacing:.65px;

}


.client-stat-value {

    margin-top:12px;

    color:#29475a;

    font-size:27px;

    font-weight:800;

    line-height:1;

}


.client-stat-value-text {

    font-size:20px;

}


.client-stat-value-date {

    font-size:18px;

}


.client-stat-note {

    margin-top:9px;

    color:#8a969f;

    font-size:9.5px;

    line-height:1.4;

}


/* ============================================================
   MAIN COLUMNS
============================================================ */

.client-dashboard-columns {

    display:grid;

    grid-template-columns:
        minmax(0,.85fr)
        minmax(0,1.15fr);

    gap:18px;

}


.client-dashboard-section {

    padding:0 !important;

    overflow:hidden;

}


.client-dashboard-section-head {

    min-height:67px;

    display:flex;

    align-items:center;

    justify-content:space-between;

    gap:15px;

    padding:16px 19px;

    box-sizing:border-box;

    border-bottom:
        1px solid #edf1f3;

}


.client-dashboard-section-head h2 {

    margin:0 0 4px !important;

    font-size:14px !important;

}


.client-dashboard-section-head p {

    margin:0;

    color:#84919b;

    font-size:9.5px;

}


.client-dashboard-view-all {

    flex:0 0 auto;

    color:#315f82;

    font-size:10px;

    font-weight:700;

    text-decoration:none;

}


/* ============================================================
   QUICK LINKS
============================================================ */

.client-quick-links {

    padding:8px 18px 14px;

}


.client-quick-link {

    display:grid;

    grid-template-columns:
        38px
        minmax(0,1fr)
        auto;

    align-items:center;

    gap:12px;

    padding:14px 5px;

    border-bottom:
        1px solid #edf1f3;

    color:#304653;

    text-decoration:none;

}


.client-quick-link:last-child {

    border-bottom:0;

}


.client-quick-link:hover strong {

    color:#315f82;

}


.client-quick-icon {

    width:36px;

    height:36px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:8px;

    background:#edf3f7;

    color:#315f82;

    font-size:12px;

    font-weight:800;

}


.client-quick-link strong {

    display:block;

    font-size:11px;

}


.client-quick-link span {

    display:block;

    margin-top:3px;

    color:#82909a;

    font-size:9.5px;

    line-height:1.4;

}


.client-quick-arrow {

    color:#9aa7b0;

    font-size:20px;

}


/* ============================================================
   RECENT CASES
============================================================ */

.client-dashboard-case-list {

    padding:
        5px 18px 12px;

}


.client-dashboard-case-row {

    min-height:61px;

    display:grid;

    grid-template-columns:
        minmax(0,1fr)
        auto
        auto;

    align-items:center;

    gap:13px;

    padding:10px 4px;

    border-bottom:
        1px solid #edf1f3;

}


.client-dashboard-case-row:last-child {

    border-bottom:0;

}


.client-dashboard-case-main strong {

    display:block;

    color:#304653;

    font-size:10.5px;

}


.client-dashboard-case-main span {

    display:block;

    margin-top:4px;

    color:#83919b;

    font-size:9px;

}


.client-dashboard-empty {

    min-height:180px;

    display:flex;

    flex-direction:column;

    align-items:center;

    justify-content:center;

    box-sizing:border-box;

    padding:25px;

    text-align:center;

}


.client-dashboard-empty-icon {

    width:42px;

    height:42px;

    display:flex;

    align-items:center;

    justify-content:center;

    margin-bottom:10px;

    border-radius:10px;

    background:#edf3f7;

    color:#486b82;

    font-weight:800;

}


.client-dashboard-empty strong {

    color:#445b6a;

    font-size:11px;

}


.client-dashboard-empty p {

    max-width:300px;

    margin:6px 0 0;

    color:#87939c;

    font-size:9.5px;

    line-height:1.45;

}


/* ============================================================
   HELP
============================================================ */

.client-dashboard-help {

    margin-top:18px;

    padding:15px 18px;

    background:#fff;

    border:1px solid #dfe5ea;

    border-radius:9px;

}


.client-dashboard-help strong {

    color:#3d5362;

    font-size:10.5px;

}


.client-dashboard-help span {

    margin-left:6px;

    color:#7c8993;

    font-size:9.5px;

}


/* ============================================================
   RESPONSIVE
============================================================ */

@media (max-width:1050px) {

    .client-dashboard-stats {

        grid-template-columns:
            repeat(
                2,
                minmax(0,1fr)
            );

    }


    .client-dashboard-columns {

        grid-template-columns:1fr;

    }

}


@media (max-width:650px) {

    .client-dashboard-welcome {

        align-items:flex-start;

        flex-direction:column;

    }


    .client-dashboard-stats {

        grid-template-columns:1fr;

    }


    .client-dashboard-case-row {

        grid-template-columns:1fr;

        align-items:start;

    }


    .client-dashboard-help span {

        display:block;

        margin:
            5px 0 0;

    }

}


/* CLIENT DASHBOARD SUMMARY END */



/* CLIENT CASES POLISH START */

.client-cases-hero {

    min-height:115px;

    display:flex;

    align-items:center;

    justify-content:space-between;

    gap:25px;

    box-sizing:border-box;

    margin-bottom:18px;

    padding:24px 25px;

    background:#fff;

    border:1px solid #dfe5ea;

    border-radius:10px;

    box-shadow:
        0 7px 24px
        rgba(25,45,60,.055);

}


.client-cases-hero h1 {

    margin:0 0 7px;

    color:#213746;

    font-size:26px;

    line-height:1.1;

}


.client-cases-hero p {

    margin:0;

    color:#768590;

    font-size:11px;

}


.client-cases-count {

    min-width:115px;

    padding:14px 17px;

    box-sizing:border-box;

    text-align:center;

    background:#f6f9fb;

    border:1px solid #e1e7eb;

    border-radius:9px;

}


.client-cases-count span {

    display:block;

    color:#82909a;

    font-size:8px;

    font-weight:800;

    letter-spacing:.8px;

}


.client-cases-count strong {

    display:block;

    margin-top:6px;

    color:#315f82;

    font-size:24px;

}


.client-cases-empty {

    min-height:300px;

    display:flex;

    flex-direction:column;

    align-items:center;

    justify-content:center;

    text-align:center;

}


.client-cases-empty-icon {

    width:56px;

    height:56px;

    display:flex;

    align-items:center;

    justify-content:center;

    margin-bottom:14px;

    background:#edf3f7;

    border-radius:14px;

    color:#315f82;

    font-size:17px;

    font-weight:800;

}


.client-cases-empty h2 {

    margin:0 0 7px !important;

    color:#314a5a;

    font-size:16px !important;

}


.client-cases-empty p {

    max-width:430px;

    margin:0;

    color:#7b8993;

    font-size:10.5px;

    line-height:1.55;

}


.client-cases-empty-note {

    margin-top:15px;

    padding:9px 13px;

    background:#f7f9fa;

    border:1px solid #e4e9ec;

    border-radius:7px;

    color:#84919a;

    font-size:9.5px;

}


@media (max-width:650px) {

    .client-cases-hero {

        align-items:flex-start;

        flex-direction:column;

    }


    .client-cases-count {

        width:100%;

        text-align:left;

    }

}

/* CLIENT CASES POLISH END */

/* CLIENT PROFILE PREMIUM START */

.client-profile-hero {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:28px;

    min-height:150px;

    padding:28px 30px !important;

    overflow:hidden;
    position:relative;

    background:
        linear-gradient(
            135deg,
            #ffffff 0%,
            #ffffff 66%,
            #f4f7f9 100%
        ) !important;
}


.client-profile-hero::before {
    content:"";
    position:absolute;

    top:0;
    left:0;
    bottom:0;

    width:5px;

    background:#1f6fa9;
}


.client-profile-hero::after {
    content:"";

    position:absolute;
    right:-45px;
    top:-55px;

    width:190px;
    height:190px;

    border-radius:50%;

    border:
        30px solid
        rgba(31,111,169,.045);

    pointer-events:none;
}


.client-profile-hero-main {
    display:flex;
    align-items:center;
    gap:20px;

    position:relative;
    z-index:1;
}


.client-profile-avatar {
    width:64px;
    height:64px;

    flex:0 0 64px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:16px;

    background:#172b3d;

    color:#ffffff;

    font-size:25px;
    font-weight:750;

    box-shadow:
        0 8px 24px
        rgba(23,43,61,.16);
}


.client-profile-kicker {
    margin-bottom:6px;

    color:#658096;

    font-size:11px;
    line-height:1;

    font-weight:800;

    letter-spacing:1.25px;
}


.client-profile-hero h1 {
    margin:0 0 7px !important;

    color:#172b3d;

    font-size:27px;
    line-height:1.15;
}


.client-profile-hero p {
    max-width:570px;

    margin:0;

    color:#71808c;

    font-size:14px;
    line-height:1.55;
}


.client-profile-account-state {
    min-width:170px;

    position:relative;
    z-index:1;

    padding:
        16px
        18px;

    border:
        1px solid
        #dce5eb;

    border-radius:12px;

    background:
        rgba(255,255,255,.90);

    text-align:left;
}


.client-profile-account-state span {
    display:block;

    margin-bottom:5px;

    color:#7c8b96;

    font-size:10px;
    font-weight:800;

    letter-spacing:1px;
}


.client-profile-account-state strong {
    display:block;

    color:#19734a;

    font-size:19px;
    line-height:1.15;
}


.client-profile-account-state small {
    display:block;

    margin-top:5px;

    color:#7b8994;

    font-size:11px;
}


.client-profile-grid {
    display:grid;

    grid-template-columns:
        repeat(
            2,
            minmax(0,1fr)
        );

    gap:20px;

    align-items:start;
}


.client-profile-card {
    padding:0 !important;

    overflow:hidden;

    border:
        1px solid
        #dce4e9 !important;

    box-shadow:
        0 5px 18px
        rgba(21,45,62,.045);
}


.client-profile-card h2 {
    margin:0 !important;

    padding:
        18px
        21px;

    color:#172b3d;

    background:#f7f9fa;

    border-bottom:
        1px solid
        #e2e8ec;

    font-size:15px;
    line-height:1.25;
}


.client-profile-card h2::before {
    display:inline-flex;

    width:25px;
    height:25px;

    align-items:center;
    justify-content:center;

    margin-right:9px;

    border-radius:7px;

    background:#eaf2f7;

    color:#1f6fa9;

    font-size:12px;
    font-weight:800;

    vertical-align:middle;
}


.client-profile-personal h2::before {
    content:"P";
}


.client-profile-account h2::before {
    content:"A";
}


.client-profile-card .info-row {
    min-height:57px;

    margin:0 !important;

    padding:
        14px
        21px !important;

    display:grid;

    grid-template-columns:
        145px
        minmax(0,1fr);

    align-items:center;

    gap:16px;

    border-bottom:
        1px solid
        #edf1f3 !important;
}


.client-profile-card .info-row:last-child {
    border-bottom:0 !important;
}


.client-profile-card .info-label {
    color:#778691 !important;

    font-size:12px !important;

    font-weight:650 !important;
}


.client-profile-card .info-value {
    color:#243746 !important;

    font-size:13px !important;

    font-weight:650 !important;

    text-align:right;

    overflow-wrap:anywhere;
}


.client-profile-card .status-pill {
    display:inline-flex;

    align-items:center;

    gap:6px;

    padding:
        5px
        10px;

    border-radius:999px;

    background:#eaf7f0;

    color:#19734a !important;

    font-size:11px !important;

    font-weight:750 !important;
}


.client-profile-card .status-pill::before {
    content:"";

    width:6px;
    height:6px;

    border-radius:50%;

    background:#2b9964;
}


.client-profile-note {
    position:relative;

    padding:
        20px
        22px
        20px
        62px !important;

    overflow:hidden;

    background:
        linear-gradient(
            90deg,
            #f7fafc,
            #ffffff
        ) !important;

    border:
        1px solid
        #dbe5eb !important;
}


.client-profile-note::before {
    content:"i";

    position:absolute;

    left:21px;
    top:20px;

    width:27px;
    height:27px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:50%;

    background:#172b3d;

    color:#ffffff;

    font-family:Georgia,serif;

    font-size:16px;
    font-weight:bold;
}


.client-profile-note strong {
    display:block;

    margin:0 0 5px;

    color:#172b3d !important;

    font-size:13px;
}


.client-profile-note p {
    margin:0 !important;

    color:#71808b !important;

    font-size:12.5px;

    line-height:1.55;
}


@media (max-width:900px) {

    .client-profile-hero {
        align-items:flex-start;
        flex-direction:column;
    }


    .client-profile-account-state {
        width:100%;
        box-sizing:border-box;
    }


    .client-profile-grid {
        grid-template-columns:1fr;
    }
}


@media (max-width:620px) {

    .client-profile-hero {
        padding:22px 20px !important;
    }


    .client-profile-hero-main {
        align-items:flex-start;
    }


    .client-profile-avatar {
        width:52px;
        height:52px;

        flex-basis:52px;

        font-size:21px;
    }


    .client-profile-card .info-row {
        grid-template-columns:1fr;
        gap:5px;
    }


    .client-profile-card .info-value {
        text-align:left;
    }

}

/* CLIENT PROFILE PREMIUM END */

/* CLIENT CASE PREMIUM START */

.client-case-page {
    max-width:1450px;
}


.client-case-hero {
    position:relative;

    overflow:hidden;

    padding:30px !important;

    border:
        1px solid
        #dce5eb !important;

    background:
        linear-gradient(
            135deg,
            #ffffff 0%,
            #ffffff 67%,
            #f1f6f9 100%
        ) !important;
}


.client-case-hero::before {
    content:"";

    position:absolute;

    left:0;
    top:0;
    bottom:0;

    width:5px;

    background:#1f6fa9;
}


.client-case-hero::after {
    content:"";

    position:absolute;

    width:260px;
    height:260px;

    right:-90px;
    top:-120px;

    border-radius:50%;

    border:
        40px solid
        rgba(31,111,169,.045);
}


.client-case-hero-top {
    position:relative;
    z-index:1;

    display:flex;

    align-items:flex-start;
    justify-content:space-between;

    gap:35px;
}


.client-case-back {
    display:inline-flex;

    margin-bottom:20px;

    color:#597487;

    font-size:12px;
    font-weight:650;

    text-decoration:none;
}


.client-case-back:hover {
    color:#1f6fa9;
}


.client-case-kicker {
    margin-bottom:7px;

    color:#698297;

    font-size:10px;
    font-weight:800;

    letter-spacing:1.25px;
}


.client-case-hero h1 {
    margin:0 0 9px !important;

    color:#172b3d;

    font-size:29px;
    line-height:1.15;

    letter-spacing:-.45px;
}


.client-case-hero p {
    max-width:650px;

    margin:0;

    color:#6d7d89;

    font-size:13.5px;
    line-height:1.55;
}


.client-case-status-box {
    position:relative;
    z-index:2;

    min-width:190px;

    padding:
        17px
        19px;

    border:
        1px solid
        #d7e1e7;

    border-radius:12px;

    background:
        rgba(255,255,255,.92);
}


.client-case-status-box > span {
    display:block;

    margin-bottom:6px;

    color:#7a8b96;

    font-size:9px;
    font-weight:800;

    letter-spacing:1.1px;
}


.client-case-status-box strong {
    display:block;

    color:#172b3d;

    font-size:17px;
    line-height:1.25;
}


.client-case-status-box small {
    display:block;

    margin-top:5px;

    color:#87949e;

    font-size:10.5px;
}


.client-case-facts {
    position:relative;
    z-index:2;

    display:grid;

    grid-template-columns:
        repeat(
            4,
            minmax(0,1fr)
        );

    margin-top:27px;

    border:
        1px solid
        #e1e8ec;

    border-radius:10px;

    overflow:hidden;

    background:#ffffff;
}


.client-case-facts > div {
    padding:
        14px
        17px;

    border-right:
        1px solid
        #e8edf0;
}


.client-case-facts > div:last-child {
    border-right:0;
}


.client-case-facts span {
    display:block;

    margin-bottom:4px;

    color:#84919a;

    font-size:9px;
    font-weight:800;

    letter-spacing:.8px;
}


.client-case-facts strong {
    display:block;

    color:#263a49;

    font-size:12.5px;
}


/*
 * WORKFLOW
 */

.client-case-progress-card {
    padding:
        23px
        26px
        27px !important;

    overflow:hidden;
}


.client-case-section-head {
    display:flex;

    justify-content:space-between;
    align-items:flex-end;

    gap:20px;

    margin-bottom:25px;
}


.client-case-section-head span {
    display:block;

    margin-bottom:4px;

    color:#81909b;

    font-size:9px;
    font-weight:800;

    letter-spacing:1px;
}


.client-case-section-head h2 {
    margin:0 !important;

    color:#172b3d;

    font-size:18px;
}


.client-case-progress-current {
    color:#1f6fa9;

    font-size:12px;
}


.client-case-progress {
    display:grid;

    grid-template-columns:
        repeat(
            6,
            minmax(0,1fr)
        );

    position:relative;

    gap:0;
}


.client-case-progress::before {
    content:"";

    position:absolute;

    left:7%;
    right:7%;
    top:17px;

    height:2px;

    background:#e2e8ec;
}


.client-case-phase {
    position:relative;
    z-index:1;

    text-align:center;
}


.client-case-phase-dot {
    width:34px;
    height:34px;

    margin:
        0
        auto
        9px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:50%;

    border:
        2px solid
        #d6dfe5;

    background:#ffffff;

    color:#8b98a1;

    font-size:11px;
    font-weight:800;
}


.client-case-phase.complete .client-case-phase-dot {
    border-color:#2f9567;
    background:#2f9567;
    color:#ffffff;
}


.client-case-phase.current .client-case-phase-dot {
    border-color:#1f6fa9;
    background:#1f6fa9;
    color:#ffffff;

    box-shadow:
        0 0 0 5px
        rgba(31,111,169,.10);
}


.client-case-phase > span {
    display:block;

    color:#344b5b;

    font-size:11px;
    font-weight:700;
}


.client-case-phase > small {
    display:block;

    margin-top:3px;

    color:#8a969f;

    font-size:9px;
}


.client-case-phase.complete > small {
    color:#2f9567;
}


.client-case-phase.current > small {
    color:#1f6fa9;
    font-weight:700;
}


/*
 * MAIN CASE CARDS
 */

.client-case-page > .grid {
    gap:20px;
}


.client-case-info-card,
.client-case-amount-card,
.client-case-documents-card,
.client-case-updates-card {
    overflow:hidden;

    padding:0 !important;

    border:
        1px solid
        #dce5ea !important;

    box-shadow:
        0 5px 18px
        rgba(22,47,65,.045);
}


.client-case-info-card > h2,
.client-case-amount-card > h2,
.client-case-documents-card > h2,
.client-case-updates-card > h2 {
    margin:0 !important;

    padding:
        18px
        21px;

    color:#172b3d;

    background:#f7f9fa;

    border-bottom:
        1px solid
        #e3e9ed;

    font-size:15px;
}


.client-case-info-card > h2::before,
.client-case-amount-card > h2::before,
.client-case-documents-card > h2::before,
.client-case-updates-card > h2::before {
    display:inline-flex;

    width:26px;
    height:26px;

    align-items:center;
    justify-content:center;

    margin-right:9px;

    border-radius:7px;

    background:#eaf2f7;

    color:#1f6fa9;

    font-size:11px;
    font-weight:800;

    vertical-align:middle;
}


.client-case-info-card > h2::before {
    content:"C";
}


.client-case-amount-card > h2::before {
    content:"$";
}


.client-case-documents-card > h2::before {
    content:"D";
}


.client-case-updates-card > h2::before {
    content:"U";
}


/*
 * CASE DATA
 */

.client-case-info-card .info-row {
    min-height:54px;

    margin:0 !important;

    padding:
        13px
        21px !important;

    border-bottom:
        1px solid
        #edf1f3 !important;
}


.client-case-info-card .info-row:last-child {
    border-bottom:0 !important;
}


/*
 * AMOUNT
 */

.client-case-amount-card {
    position:relative;

    background:
        linear-gradient(
            145deg,
            #172b3d,
            #213f55
        ) !important;

    color:#ffffff;
}


.client-case-amount-card > h2 {
    color:#ffffff;

    background:
        rgba(255,255,255,.035);

    border-bottom-color:
        rgba(255,255,255,.10);
}


.client-case-amount-card > h2::before {
    background:
        rgba(255,255,255,.12);

    color:#d6c187;
}


.client-case-amount-card .amount {
    padding:
        28px
        22px
        4px;

    color:#ffffff !important;

    font-size:31px !important;

    letter-spacing:-.6px;
}


.client-case-amount-card .amount-note {
    padding:
        0
        22px
        27px;

    color:#d6c187 !important;

    font-size:11px !important;

    font-weight:700;

    letter-spacing:.25px;
}


/*
 * DOCUMENT CENTER
 */

.client-case-documents-card .item {
    position:relative;

    margin:0 !important;

    padding:
        17px
        20px
        17px
        58px !important;

    border:0 !important;

    border-bottom:
        1px solid
        #edf1f3 !important;

    border-radius:0 !important;

    background:#ffffff !important;
}


.client-case-documents-card .item:last-child {
    border-bottom:0 !important;
}


.client-case-documents-card .item::before {
    content:"PDF";

    position:absolute;

    left:18px;
    top:18px;

    width:29px;
    height:35px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:5px;

    background:#eef3f6;

    color:#526b7c;

    font-size:8px;
    font-weight:800;
}


.client-case-documents-card .item-title {
    color:#263b4a;

    font-size:12.5px;

    overflow-wrap:anywhere;
}


.client-case-documents-card .item-meta {
    margin-top:4px;

    font-size:10px;
}


.client-case-documents-card .btn {
    padding:
        7px
        11px !important;

    font-size:
        10.5px !important;
}


/*
 * UPDATE TIMELINE
 */

.client-case-updates-card {
    position:relative;
}


.client-case-updates-card .item {
    position:relative;

    margin:0 !important;

    padding:
        18px
        20px
        18px
        50px !important;

    border:0 !important;

    border-bottom:
        1px solid
        #edf1f3 !important;

    border-radius:0 !important;

    background:#ffffff !important;
}


.client-case-updates-card .item:last-child {
    border-bottom:0 !important;
}


.client-case-updates-card .item::before {
    content:"";

    position:absolute;

    left:22px;
    top:24px;

    width:9px;
    height:9px;

    border-radius:50%;

    background:#1f6fa9;

    box-shadow:
        0 0 0 5px
        rgba(31,111,169,.09);
}


.client-case-updates-card .item::after {
    content:"";

    position:absolute;

    left:26px;
    top:39px;
    bottom:-10px;

    width:1px;

    background:#e0e7eb;
}


.client-case-updates-card .item:last-child::after {
    display:none;
}


.client-case-updates-card .item-title {
    color:#314755;

    font-size:12px;

    line-height:1.55;
}


.client-case-updates-card .item-meta {
    margin-top:6px;

    color:#86939c;

    font-size:9.5px;
}


/*
 * RESPONSIVE
 */

@media (max-width:900px) {

    .client-case-hero-top {
        flex-direction:column;
    }


    .client-case-status-box {
        width:100%;
        box-sizing:border-box;
    }


    .client-case-facts {
        grid-template-columns:
            repeat(
                2,
                minmax(0,1fr)
            );
    }


    .client-case-facts > div:nth-child(2) {
        border-right:0;
    }


    .client-case-facts > div:nth-child(-n+2) {
        border-bottom:
            1px solid
            #e8edf0;
    }


    .client-case-progress {
        grid-template-columns:
            repeat(
                3,
                minmax(0,1fr)
            );

        row-gap:24px;
    }


    .client-case-progress::before {
        display:none;
    }

}


@media (max-width:620px) {

    .client-case-hero {
        padding:
            23px
            20px !important;
    }


    .client-case-hero h1 {
        font-size:22px;
        overflow-wrap:anywhere;
    }


    .client-case-facts {
        grid-template-columns:1fr;
    }


    .client-case-facts > div {
        border-right:0 !important;

        border-bottom:
            1px solid
            #e8edf0;
    }


    .client-case-facts > div:last-child {
        border-bottom:0;
    }


    .client-case-progress {
        grid-template-columns:
            repeat(
                2,
                minmax(0,1fr)
            );
    }


    .client-case-section-head {
        align-items:flex-start;
        flex-direction:column;
    }

}

/* CLIENT CASE PREMIUM END */




/* CLIENT CASE COMPLETE INFORMATION START */

.client-case-complete-card,
.client-case-status-history-card {
    grid-column:1 / -1;
}

.client-case-complete-card > h2,
.client-case-status-history-card > h2 {
    margin-bottom:18px;
}

.client-case-complete-grid {
    display:grid;
    grid-template-columns:
        repeat(
            3,
            minmax(0,1fr)
        );
    gap:0 22px;
}

.client-case-complete-item {
    min-width:0;
    padding:13px 0;
    border-bottom:
        1px solid
        #e8edf1;
}

.client-case-complete-item span {
    display:block;
    margin-bottom:5px;
    color:#82909a;
    font-size:10px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.45px;
}

.client-case-complete-item strong {
    display:block;
    color:#253747;
    font-size:12px;
    line-height:1.55;
    overflow-wrap:anywhere;
}

.client-case-summary-item {
    grid-column:1 / -1;
}

.client-case-summary-item strong {
    font-weight:500;
    max-width:1050px;
}

.client-document-original-name {
    margin-top:5px;
    color:#8a98a3;
    font-size:10px;
    overflow-wrap:anywhere;
}

.client-status-history-list {
    display:flex;
    flex-direction:column;
}

.client-status-history-row {
    display:grid;
    grid-template-columns:
        155px
        minmax(0,1fr)
        28px
        minmax(0,1fr);
    align-items:center;
    gap:12px;

    padding:13px 0;

    border-bottom:
        1px solid
        #e8edf1;
}

.client-status-history-row:last-child {
    border-bottom:0;
}

.client-status-history-date {
    color:#7d8b96;
    font-size:10px;
}

.client-status-history-state span {
    display:block;
    margin-bottom:3px;

    color:#87949e;
    font-size:9px;
    font-weight:700;

    text-transform:uppercase;
    letter-spacing:.4px;
}

.client-status-history-state strong {
    color:#253747;
    font-size:11px;
}

.client-status-history-arrow {
    text-align:center;
    color:#7f93a3;
    font-size:14px;
}


@media(max-width:900px) {

    .client-case-complete-grid {
        grid-template-columns:
            repeat(
                2,
                minmax(0,1fr)
            );
    }

}


@media(max-width:620px) {

    .client-case-complete-grid {
        grid-template-columns:1fr;
    }

    .client-case-summary-item {
        grid-column:auto;
    }

    .client-status-history-row {
        grid-template-columns:1fr;
        gap:7px;
    }

    .client-status-history-arrow {
        display:none;
    }

}

/* CLIENT CASE COMPLETE INFORMATION END */




/* CLIENT CASE HERO AMOUNT DARK START */

.client-case-hero-amount-fact {
    background:
        linear-gradient(
            135deg,
            #142b3d 0%,
            #1e4058 100%
        ) !important;

    border:
        1px solid
        #19384d !important;

    border-radius:
        6px !important;

    box-shadow:
        0 4px 12px
        rgba(15,38,55,.16) !important;

    padding:
        10px 14px !important;

    min-height:
        48px !important;

    display:
        flex !important;

    flex-direction:
        column !important;

    justify-content:
        center !important;
}


/* LABEL AMOUNT */

.client-case-hero-amount-fact span {
    color:
        rgba(255,255,255,.70) !important;

    font-size:
        8px !important;

    font-weight:
        700 !important;

    letter-spacing:
        .65px !important;

    text-transform:
        uppercase !important;
}


/* VALOR */

.client-case-hero-amount-fact strong {
    color:
        #ffffff !important;

    font-size:
        13px !important;

    font-weight:
        800 !important;

    line-height:
        1.15 !important;

    margin-top:
        4px !important;

    white-space:
        nowrap !important;
}


/* PEQUEÑO DETALLE VISUAL */

.client-case-hero-amount-fact::before {
    content:
        "" !important;

    position:
        absolute !important;

    width:
        3px !important;

    height:
        24px !important;

    left:
        0 !important;

    top:
        50% !important;

    transform:
        translateY(-50%) !important;

    background:
        rgba(255,255,255,.55) !important;

    border-radius:
        0 3px 3px 0 !important;
}

.client-case-hero-amount-fact {
    position:
        relative !important;

    overflow:
        hidden !important;
}

/* CLIENT CASE HERO AMOUNT DARK END */




/* CLIENT CASE HERO ONE ROW START */

/* contenedor de métricas del hero */
.client-case-hero-metrics,
.client-case-hero-stats,
.client-case-hero-facts,
.client-case-top-stats,
.client-case-summary-stats {
    display: grid !important;
    grid-template-columns: 1.18fr repeat(4, minmax(0, 1fr)) !important;
    gap: 8px !important;
    align-items: stretch !important;
}

/* todas las cajas de la fila */
.client-case-hero-metrics > *,
.client-case-hero-stats > *,
.client-case-hero-facts > *,
.client-case-top-stats > *,
.client-case-summary-stats > * {
    min-width: 0 !important;
    padding: 8px 10px !important;
    border-radius: 6px !important;
}

/* monto primero */
.client-case-hero-amount-fact {
    order: -10 !important;
}

/* las cajas normales más compactas */
.client-case-hero-metrics > *:not(.client-case-hero-amount-fact),
.client-case-hero-stats > *:not(.client-case-hero-amount-fact),
.client-case-hero-facts > *:not(.client-case-hero-amount-fact),
.client-case-top-stats > *:not(.client-case-hero-amount-fact),
.client-case-summary-stats > *:not(.client-case-hero-amount-fact) {
    min-height: 48px !important;
}

/* textos pequeños para que quepan */
.client-case-hero-metrics span,
.client-case-hero-stats span,
.client-case-hero-facts span,
.client-case-top-stats span,
.client-case-summary-stats span {
    font-size: 8px !important;
    line-height: 1.15 !important;
    letter-spacing: .55px !important;
}

.client-case-hero-metrics strong,
.client-case-hero-stats strong,
.client-case-hero-facts strong,
.client-case-top-stats strong,
.client-case-summary-stats strong {
    font-size: 12px !important;
    line-height: 1.15 !important;
    margin-top: 3px !important;
}

/* el monto sigue destacado pero más compacto */
.client-case-hero-amount-fact {
    min-height: 48px !important;
    padding: 8px 12px !important;
}

.client-case-hero-amount-fact span {
    font-size: 8px !important;
    color: rgba(255,255,255,.72) !important;
}

.client-case-hero-amount-fact strong {
    font-size: 13px !important;
    color: #fff !important;
    white-space: nowrap !important;
}

/* desktop: asegurar una sola línea */
@media (min-width: 1100px) {
    .client-case-hero-metrics,
    .client-case-hero-stats,
    .client-case-hero-facts,
    .client-case-top-stats,
    .client-case-summary-stats {
        grid-template-columns: 1.18fr repeat(4, minmax(0, 1fr)) !important;
    }
}

/* tablet: si ocupa, 3 + 2 */
@media (max-width: 1099px) {
    .client-case-hero-metrics,
    .client-case-hero-stats,
    .client-case-hero-facts,
    .client-case-top-stats,
    .client-case-summary-stats {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }
}

/* móvil: una por fila */
@media (max-width: 700px) {
    .client-case-hero-metrics,
    .client-case-hero-stats,
    .client-case-hero-facts,
    .client-case-top-stats,
    .client-case-summary-stats {
        grid-template-columns: 1fr !important;
    }
}

/* CLIENT CASE HERO ONE ROW END */




/* SETTLEMENT AGREEMENT EMPHASIS START */
.client-case-hero-amount-fact span,
.client-case-hero-amount-fact small {
    font-size: 9px !important;
    font-weight: 800 !important;
    letter-spacing: .85px !important;
    line-height: 1.15 !important;
    text-transform: uppercase !important;
}

.client-case-hero-amount-fact strong,
.client-case-hero-amount-fact .amount {
    font-size: 18px !important;
    font-weight: 900 !important;
    line-height: 1.05 !important;
    white-space: nowrap !important;
    display: block !important;
    margin-top: 4px !important;
}

@media (min-width: 1100px) {
    .client-case-hero-amount-fact strong,
    .client-case-hero-amount-fact .amount {
        font-size: 20px !important;
    }
}
/* SETTLEMENT AGREEMENT EMPHASIS END */




/* CASE HERO COMPACT BOXES START */
@media (min-width: 1180px) {

    .client-case-facts {
        display: grid !important;
        grid-template-columns: 1fr 1fr 0.72fr 0.72fr 0.95fr !important;
        gap: 10px !important;
        align-items: stretch !important;
    }

    .client-case-facts > * {
        min-width: 0 !important;
        width: auto !important;
        max-width: none !important;
        margin: 0 !important;
    }

    .client-case-facts .client-case-amount-card,
    .client-case-facts .client-case-hero-amount-fact,
    .client-case-facts .client-case-fact--amount {
        grid-column: auto !important;
        width: auto !important;
        max-width: none !important;
    }
}

@media (min-width: 900px) and (max-width: 1179px) {
    .client-case-facts {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 10px !important;
    }

    .client-case-facts > * {
        min-width: 0 !important;
        width: auto !important;
        max-width: none !important;
        margin: 0 !important;
    }
}
/* CASE HERO COMPACT BOXES END */