/* =========================================================
   LAW FOUNDATION UP
   LAWYER PANEL
   MAIN CSS
========================================================= */


/* =========================================================
   ROOT
========================================================= */

:root {

    --lawyer-primary: #011837;
    --lawyer-dark: #00152F;
    --lawyer-blue: #3772E5;
    --lawyer-light-blue: #EAF1FF;

    --lawyer-bg: #F5F7FB;
    --lawyer-white: #FFFFFF;

    --lawyer-text: #344B5D;
    --lawyer-text-dark: #1E293B;
    --lawyer-muted: #94A3B8;

    --lawyer-border: #E6EBF0;
    --lawyer-border-light: #EDF1F5;

    --lawyer-success: #16A34A;
    --lawyer-success-bg: #ECFDF3;

    --lawyer-warning: #EA580C;
    --lawyer-warning-bg: #FFF7ED;

    --lawyer-danger: #DC2626;
    --lawyer-danger-bg: #FEF2F2;

    --lawyer-purple: #7C3AED;
    --lawyer-purple-bg: #F5F3FF;

    --lawyer-sidebar-width: 245px;
    --lawyer-topbar-height: 68px;

}


/* =========================================================
   RESET
========================================================= */

*,
*::before,
*::after {
    box-sizing: border-box;
}


html {
    margin: 0;
    padding: 0;
    min-height: 100%;
}


body {
    margin: 0;
    padding: 0;
    min-height: 100vh;

    background: var(--lawyer-bg);
    color: var(--lawyer-text);

    font-family:
        Inter,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        Roboto,
        Arial,
        sans-serif;

    font-size: 14px;
}


body.lawyer-sidebar-open {
    overflow: hidden;
}


a {
    color: inherit;
    text-decoration: none;
}


button,
input,
select,
textarea {
    font-family: inherit;
}


button {
    cursor: pointer;
}


img {
    max-width: 100%;
}


.text-right {
    text-align: right;
}


/* =========================================================
   LAYOUT
========================================================= */

.lawyer-layout {
    width: 100%;
    min-height: 100vh;

    display: flex;

    background: var(--lawyer-bg);
}


.lawyer-main {
    width: calc(
        100% - var(--lawyer-sidebar-width)
    );

    min-width: 0;
    min-height: 100vh;

    margin-left: var(--lawyer-sidebar-width);
}


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

.lawyer-sidebar {
    position: fixed;

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

    z-index: 1000;

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

    display: flex;
    flex-direction: column;

    background:
        linear-gradient(
            180deg,
            var(--lawyer-primary) 0%,
            var(--lawyer-dark) 100%
        );

    color: #fff;

    box-shadow:
        5px 0 25px rgba(1, 24, 55, .08);

    transition:
        transform .25s ease;
}


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

.lawyer-sidebar-brand {
    height: 76px;

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

    padding: 0 17px;

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


.lawyer-brand-link {
    min-width: 0;

    display: flex;
    align-items: center;

    gap: 10px;
}


.lawyer-brand-icon {
    width: 36px;
    height: 36px;

    min-width: 36px;

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

    border-radius: 9px;

    background: var(--lawyer-blue);

    color: #fff;

    font-size: 14px;

    box-shadow:
        0 7px 18px rgba(55,114,229,.25);
}


.lawyer-brand-text {
    min-width: 0;
}


.lawyer-brand-text strong {
    display: block;

    overflow: hidden;

    color: #fff;

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

    text-overflow: ellipsis;
    white-space: nowrap;
}


.lawyer-brand-text span {
    display: block;

    margin-top: 3px;

    color: #91A4BB;

    font-size: 10px;
}


.lawyer-sidebar-close {
    display: none;

    width: 28px;
    height: 28px;

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

    padding: 0;

    border: 0;
    border-radius: 7px;

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

    color: #fff;

    font-size: 10px;
}


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

.lawyer-sidebar-profile {
    display: flex;
    align-items: center;

    gap: 9px;

    margin: 15px 13px;
    padding: 10px;

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

    border-radius: 10px;

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


.lawyer-sidebar-avatar {
    width: 34px;
    height: 34px;

    min-width: 34px;

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

    border-radius: 9px;

    background:
        rgba(55,114,229,.85);

    color: #fff;

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


.lawyer-sidebar-profile-info {
    min-width: 0;
}


.lawyer-sidebar-profile-info strong {
    display: block;

    overflow: hidden;

    color: #fff;

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

    text-overflow: ellipsis;
    white-space: nowrap;
}


.lawyer-sidebar-profile-info span {
    display: block;

    margin-top: 3px;

    color: #8EA1B8;

    font-size: 12px;
}


/* =========================================================
   NAVIGATION
========================================================= */

.lawyer-sidebar-nav {
    flex: 1;

    overflow-y: auto;

    padding: 2px 11px 15px;
}


.lawyer-sidebar-nav::-webkit-scrollbar {
    width: 4px;
}


.lawyer-sidebar-nav::-webkit-scrollbar-track {
    background: transparent;
}


.lawyer-sidebar-nav::-webkit-scrollbar-thumb {
    border-radius: 5px;
    background: rgba(255,255,255,.08);
}


.lawyer-nav-section {
    margin-bottom: 18px;
}


.lawyer-nav-title {
    display: block;

    padding:
        0 9px 7px;

    color: #647A92;

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

    letter-spacing: .9px;
}


.lawyer-nav-item {
    position: relative;

    min-height: 39px;

    display: flex;
    align-items: center;

    gap: 9px;

    margin-bottom: 3px;
    padding: 0 9px;

    border-radius: 8px;

    color: #9EB0C4;

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

    transition:
        background .18s ease,
        color .18s ease;
}


.lawyer-nav-item:hover {
    background:
        rgba(255,255,255,.055);

    color: #fff;
}


.lawyer-nav-item.active {
    background:
        rgba(55,114,229,.18);

    color: #fff;
}


.lawyer-nav-item.active::before {
    content: "";

    position: absolute;

    left: 0;
    top: 8px;
    bottom: 8px;

    width: 3px;

    border-radius: 0 3px 3px 0;

    background: var(--lawyer-blue);
}


.lawyer-nav-icon {
    width: 25px;
    height: 25px;

    min-width: 25px;

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

    border-radius: 6px;

    font-size: 9px;
}


.lawyer-nav-item.active
.lawyer-nav-icon {
    background:
        rgba(55,114,229,.16);

    color: #7FA7FF;
}


.lawyer-nav-label {
    flex: 1;
}


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

.lawyer-sidebar-footer {
    padding: 11px;

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


.lawyer-logout-link {
    min-height: 38px;

    display: flex;
    align-items: center;

    gap: 9px;

    padding: 0 9px;

    border-radius: 8px;

    color: #9EB0C4;

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

    transition: .18s ease;
}


.lawyer-logout-link:hover {
    background:
        rgba(220,38,38,.10);

    color: #FCA5A5;
}


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

.lawyer-sidebar-overlay {
    display: none;

    position: fixed;

    inset: 0;

    z-index: 999;

    background:
        rgba(1,24,55,.45);

    opacity: 0;

    transition: opacity .25s ease;
}


.lawyer-sidebar-overlay.show {
    display: block;
    opacity: 1;
}


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

.lawyer-topbar {
    position: sticky;

    top: 0;

    z-index: 900;

    height: var(--lawyer-topbar-height);

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

    padding: 0 22px;

    border-bottom:
        1px solid var(--lawyer-border);

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

    backdrop-filter:
        blur(10px);
}


.lawyer-topbar-left {
    min-width: 0;

    display: flex;
    align-items: center;

    gap: 12px;
}


.lawyer-menu-toggle {
    display: none;

    width: 34px;
    height: 34px;

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

    padding: 0;

    border:
        1px solid var(--lawyer-border);

    border-radius: 8px;

    background: #fff;

    color: var(--lawyer-text);

    font-size: 13px;
}


.lawyer-menu-toggle:hover {
    color: var(--lawyer-blue);
    border-color: #C9D8F5;
}


.lawyer-topbar-title {
    min-width: 0;
}


.lawyer-topbar-title span {
    display: block;

    margin-bottom: 3px;

    color: var(--lawyer-muted);

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

    letter-spacing: .8px;
}


.lawyer-topbar-title h2 {
    margin: 0;

    overflow: hidden;

    color: var(--lawyer-text);

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

    text-overflow: ellipsis;
    white-space: nowrap;
}


.lawyer-topbar-right {
    display: flex;
    align-items: center;

    gap: 10px;
}


.lawyer-topbar-icon-btn {
    position: relative;

    width: 32px;
    height: 32px;

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

    padding: 0;

    border: 0;
    border-radius: 8px;

    background: transparent;

    color: #64748B;

    font-size: 12px;
}


.lawyer-topbar-icon-btn:hover {
    background: #F1F5F9;
    color: var(--lawyer-blue);
}


.lawyer-notification-dot {
    position: absolute;

    top: 7px;
    right: 7px;

    width: 5px;
    height: 5px;

    border-radius: 50%;

    background: #EF4444;

    border: 1px solid #fff;
}


.lawyer-topbar-divider {
    width: 1px;
    height: 25px;

    background: var(--lawyer-border);
}


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

.lawyer-topbar-profile {
    position: relative;
}


.lawyer-topbar-profile-btn {
    display: flex;
    align-items: center;

    gap: 7px;

    padding: 3px;

    border: 0;

    background: transparent;

    color: var(--lawyer-text);
}


.lawyer-topbar-avatar {
    width: 32px;
    height: 32px;

    min-width: 32px;

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

    border-radius: 8px;

    background: var(--lawyer-primary);

    color: #fff;

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


.lawyer-topbar-profile-info {
    min-width: 0;

    text-align: left;
}


.lawyer-topbar-profile-info strong {
    display: block;

    max-width: 130px;

    overflow: hidden;

    color: #475569;

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

    text-overflow: ellipsis;
    white-space: nowrap;
}


.lawyer-topbar-profile-info small {
    display: block;

    margin-top: 2px;

    color: var(--lawyer-muted);

    font-size: 12px;
}


.lawyer-profile-chevron {
    margin-left: 2px;

    color: #94A3B8;

    font-size: 10px;
}


/* =========================================================
   PROFILE DROPDOWN
========================================================= */

.lawyer-profile-dropdown {
    position: absolute;

    top: calc(
        100% + 10px
    );

    right: 0;

    width: 220px;

    padding: 7px;

    border:
        1px solid var(--lawyer-border);

    border-radius: 11px;

    background: #fff;

    box-shadow:
        0 18px 45px rgba(15,23,42,.12);

    opacity: 0;
    visibility: hidden;

    transform:
        translateY(-5px);

    transition:
        opacity .18s ease,
        visibility .18s ease,
        transform .18s ease;
}


.lawyer-profile-dropdown.show {
    opacity: 1;
    visibility: visible;

    transform:
        translateY(0);
}


.lawyer-dropdown-user {
    display: flex;
    align-items: center;

    gap: 9px;

    padding: 8px;
}


.lawyer-dropdown-avatar {
    width: 33px;
    height: 33px;

    min-width: 33px;

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

    border-radius: 8px;

    background: var(--lawyer-light-blue);

    color: var(--lawyer-blue);

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


.lawyer-dropdown-user strong {
    display: block;

    overflow: hidden;

    color: #475569;

    font-size: 12px;

    text-overflow: ellipsis;
    white-space: nowrap;
}


.lawyer-dropdown-user span {
    display: block;

    max-width: 145px;

    margin-top: 3px;

    overflow: hidden;

    color: var(--lawyer-muted);

    font-size: 12px;

    text-overflow: ellipsis;
    white-space: nowrap;
}


.lawyer-dropdown-divider {
    height: 1px;

    margin: 5px 2px;

    background: var(--lawyer-border-light);
}


.lawyer-dropdown-item {
    min-height: 34px;

    display: flex;
    align-items: center;

    gap: 8px;

    padding: 0 9px;

    border-radius: 7px;

    color: #64748B;

    font-size: 12px;
    font-weight: 600;
}


.lawyer-dropdown-item i {
    width: 16px;

    color: #94A3B8;

    font-size: 10px;
}


.lawyer-dropdown-item:hover {
    background: #F8FAFC;
    color: var(--lawyer-blue);
}


.lawyer-dropdown-item:hover i {
    color: var(--lawyer-blue);
}


.lawyer-dropdown-item.logout:hover {
    background: #FEF2F2;
    color: var(--lawyer-danger);
}


.lawyer-dropdown-item.logout:hover i {
    color: var(--lawyer-danger);
}


/* =========================================================
   PAGE CONTENT
========================================================= */

.lawyer-page-content {
    width: 100%;

    min-height:
        calc(
            100vh -
            var(--lawyer-topbar-height)
        );

    padding: 22px;
}


/* =========================================================
   GENERIC CARD
========================================================= */

.lawyer-dashboard-card {
    border:
        1px solid var(--lawyer-border);

    border-radius: 14px;

    background: #fff;

    box-shadow:
        0 2px 7px rgba(15,23,42,.015);
}


/* =========================================================
   FOOTER
========================================================= */

.lawyer-footer {
    min-height: 50px;

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

    gap: 15px;

    padding: 0 22px;

    border-top:
        1px solid var(--lawyer-border);

    background: #fff;

    color: var(--lawyer-muted);

    font-size: 10px;
}


.lawyer-footer-left,
.lawyer-footer-right {
    display: flex;
    align-items: center;

    gap: 7px;
}


.lawyer-footer-separator {
    color: #CBD5E1;
}


.lawyer-footer-right i {
    color: var(--lawyer-success);

    font-size: 10px;
}


/* =========================================================
   COMMON FORM ELEMENTS
========================================================= */

.lawyer-form-group {
    margin-bottom: 15px;
}


.lawyer-form-label {
    display: block;

    margin-bottom: 6px;

    color: #475569;

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


.lawyer-form-control {
    width: 100%;

    min-height: 40px;

    padding:
        0 11px;

    border:
        1px solid #DCE4EC;

    border-radius: 8px;

    outline: none;

    background: #fff;

    color: #334155;

    font-size: 9px;

    transition:
        border-color .2s ease,
        box-shadow .2s ease;
}


.lawyer-form-control:focus {
    border-color: var(--lawyer-blue);

    box-shadow:
        0 0 0 3px
        rgba(55,114,229,.08);
}


.lawyer-form-control::placeholder {
    color: #B1BCC8;
}


.lawyer-form-control:disabled {
    background: #F8FAFC;
    color: #94A3B8;
}


/* =========================================================
   BUTTONS
========================================================= */

.lawyer-btn {
    min-height: 36px;

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

    gap: 6px;

    padding:
        0 13px;

    border: 0;

    border-radius: 8px;

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

    cursor: pointer;

    transition:
        background .18s ease,
        transform .18s ease;
}


.lawyer-btn-primary {
    background: var(--lawyer-blue);
    color: #fff;
}


.lawyer-btn-primary:hover {
    background: #2862D0;

    transform:
        translateY(-1px);
}


.lawyer-btn-light {
    border:
        1px solid var(--lawyer-border);

    background: #fff;

    color: #64748B;
}


.lawyer-btn-light:hover {
    background: #F8FAFC;
    color: var(--lawyer-blue);
}


.lawyer-btn-danger {
    background: var(--lawyer-danger-bg);
    color: var(--lawyer-danger);
}


.lawyer-btn-success {
    background: var(--lawyer-success-bg);
    color: var(--lawyer-success);
}


/* =========================================================
   ALERTS
========================================================= */

.lawyer-alert {
    display: flex;
    align-items: flex-start;

    gap: 8px;

    margin-bottom: 15px;

    padding: 11px 12px;

    border-radius: 8px;

    font-size: 12px;
    line-height: 1.5;
}


.lawyer-alert-success {
    border:
        1px solid #BBF7D0;

    background:
        var(--lawyer-success-bg);

    color:
        #15803D;
}


.lawyer-alert-danger {
    border:
        1px solid #FECACA;

    background:
        var(--lawyer-danger-bg);

    color:
        #B91C1C;
}


.lawyer-alert-warning {
    border:
        1px solid #FED7AA;

    background:
        var(--lawyer-warning-bg);

    color:
        #C2410C;
}


/* =========================================================
   RESPONSIVE - TABLET
========================================================= */

@media (max-width: 1000px) {

    :root {
        --lawyer-sidebar-width: 225px;
    }


    .lawyer-main {
        width:
            calc(
                100% -
                var(--lawyer-sidebar-width)
            );
    }

}


/* =========================================================
   RESPONSIVE - MOBILE
========================================================= */

@media (max-width: 900px) {

    .lawyer-sidebar {
        transform:
            translateX(-100%);

        box-shadow:
            12px 0 35px
            rgba(1,24,55,.18);
    }


    .lawyer-sidebar.open {
        transform:
            translateX(0);
    }


    .lawyer-sidebar-close {
        display: flex;
    }


    .lawyer-main {
        width: 100%;

        margin-left: 0;
    }


    .lawyer-menu-toggle {
        display: flex;
    }


    .lawyer-topbar {
        padding: 0 15px;
    }


    .lawyer-page-content {
        padding: 15px;
    }

}


/* =========================================================
   RESPONSIVE - SMALL MOBILE
========================================================= */

@media (max-width: 550px) {

    .lawyer-topbar-profile-info,
    .lawyer-profile-chevron {
        display: none;
    }


    .lawyer-topbar {
        height: 62px;
    }


    .lawyer-topbar-title h2 {
        font-size: 12px;
    }


    .lawyer-footer {
        align-items: flex-start;
        flex-direction: column;

        padding:
            12px 15px;

        gap: 5px;
    }


    .lawyer-footer-right {
        display: none;
    }


    .lawyer-profile-dropdown {
        right: -5px;
        width: 205px;
    }

}


/* =========================================================
   PRINT
========================================================= */

@media print {

    .lawyer-sidebar,
    .lawyer-topbar,
    .lawyer-footer,
    .lawyer-sidebar-overlay {
        display: none !important;
    }


    .lawyer-main {
        width: 100% !important;
        margin: 0 !important;
    }


    .lawyer-page-content {
        padding: 0 !important;
    }

}

/* =========================================================
   LAWYER LOGIN PAGE
========================================================= */

.lawyer-login-page {
    min-height: 100vh;
    margin: 0;
    padding: 30px;

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

    background: #f5f7fb;
}


/* =========================================================
   LOGIN WRAPPER
========================================================= */

.lawyer-login-wrapper {
    width: 100%;
    max-width: 950px;
    min-height: 560px;

    display: grid;
    grid-template-columns: 1fr 1fr;

    overflow: hidden;

    background: #ffffff;

    border: 1px solid #e5eaf0;
    border-radius: 20px;

    box-shadow:
        0 20px 60px rgba(1, 24, 55, 0.10);
}


/* =========================================================
   LEFT BRAND SECTION
========================================================= */

.lawyer-login-brand {
    position: relative;

    display: flex;
    align-items: center;

    padding: 55px;

    overflow: hidden;

    background:
        linear-gradient(
            145deg,
            #011837 0%,
            #00152f 100%
        );

    color: #ffffff;
}


/* Decorative Circle */

.lawyer-login-brand::before {
    content: "";

    position: absolute;

    width: 360px;
    height: 360px;

    top: -170px;
    right: -160px;

    border-radius: 50%;

    background:
        rgba(55, 114, 229, 0.13);
}


.lawyer-login-brand::after {
    content: "";

    position: absolute;

    width: 240px;
    height: 240px;

    bottom: -130px;
    left: -100px;

    border-radius: 50%;

    background:
        rgba(55, 114, 229, 0.08);
}


.lawyer-login-brand-content {
    position: relative;

    z-index: 2;

    max-width: 390px;
}


/* =========================================================
   LOGO
========================================================= */

.lawyer-login-logo {
    width: 56px;
    height: 56px;

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

    margin-bottom: 28px;

    border-radius: 14px;

    background: #3772e5;

    color: #ffffff;

    font-size: 22px;

    box-shadow:
        0 12px 30px rgba(55, 114, 229, 0.30);
}


/* =========================================================
   EYEBROW
========================================================= */

.lawyer-login-eyebrow {
    display: block;

    margin-bottom: 10px;

    color: #82a9f5;

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

    letter-spacing: 1.5px;
}


/* =========================================================
   BRAND HEADING
========================================================= */

.lawyer-login-brand h1 {
    margin: 0;

    color: #ffffff;

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

    line-height: 1.15;
}


.lawyer-login-brand p {
    max-width: 370px;

    margin: 18px 0 30px;

    color: #aebed2;

    font-size: 12px;

    line-height: 1.8;
}


/* =========================================================
   FEATURES
========================================================= */

.lawyer-login-features {
    display: flex;
    flex-direction: column;

    gap: 13px;
}


.lawyer-login-feature {
    display: flex;
    align-items: center;

    gap: 11px;

    color: #d0d9e5;

    font-size: 10px;
    font-weight: 500;
}


.lawyer-login-feature i {
    width: 32px;
    height: 32px;

    flex-shrink: 0;

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

    border-radius: 8px;

    background:
        rgba(255, 255, 255, 0.07);

    color: #7da5f5;

    font-size: 12px;
}


/* =========================================================
   RIGHT LOGIN PANEL
========================================================= */

.lawyer-login-panel {
    display: flex;
    align-items: center;
    justify-content: center;

    padding: 55px;

    background: #ffffff;
}


.lawyer-login-form {
    width: 100%;
    max-width: 365px;
}


/* =========================================================
   LOGIN HEADING
========================================================= */

.lawyer-login-heading {
    margin-bottom: 27px;
}


.lawyer-login-heading span {
    display: block;

    margin-bottom: 7px;

    color: #3772e5;

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

    letter-spacing: 1.4px;
}


.lawyer-login-heading h2 {
    margin: 0;

    color: #011837;

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

    line-height: 1.25;
}


.lawyer-login-heading p {
    margin: 7px 0 0;

    color: #94a3b8;

    font-size: 10px;

    line-height: 1.6;
}


/* =========================================================
   ERROR MESSAGE
========================================================= */

.lawyer-login-error {
    width: 100%;

    display: flex;
    align-items: flex-start;

    gap: 9px;

    margin-bottom: 18px;
    padding: 11px 12px;

    border: 1px solid #fecaca;
    border-radius: 9px;

    background: #fef2f2;

    color: #b91c1c;

    font-size: 9px;

    line-height: 1.5;
}


.lawyer-login-error i {
    flex-shrink: 0;

    margin-top: 1px;

    font-size: 11px;
}


/* =========================================================
   FORM FIELD
========================================================= */

.lawyer-login-field {
    margin-bottom: 18px;
}


.lawyer-login-field label {
    display: block;

    margin-bottom: 7px;

    color: #334155;

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


/* =========================================================
   INPUT WRAPPER
========================================================= */

.lawyer-login-input {
    position: relative;

    width: 100%;
}


/* Left Icon */

.lawyer-login-input > i {
    position: absolute;

    left: 13px;
    top: 50%;

    z-index: 2;

    color: #94a3b8;

    font-size: 12px;

    transform:
        translateY(-50%);

    pointer-events: none;
}


/* Input */

.lawyer-login-input input {
    width: 100%;
    height: 45px;

    padding:
        0 42px 0 38px;

    border: 1px solid #dce4ec;
    border-radius: 9px;

    outline: none;

    background: #ffffff;

    color: #334155;

    font-size: 10px;

    transition:
        border-color .2s ease,
        box-shadow .2s ease,
        background .2s ease;
}


.lawyer-login-input input:hover {
    border-color: #c8d4e2;
}


.lawyer-login-input input:focus {
    border-color: #3772e5;

    background: #ffffff;

    box-shadow:
        0 0 0 3px rgba(55, 114, 229, 0.09);
}


.lawyer-login-input input::placeholder {
    color: #aab5c1;
}


/* =========================================================
   PASSWORD TOGGLE
========================================================= */

.lawyer-password-toggle {
    position: absolute;

    right: 7px;
    top: 50%;

    width: 31px;
    height: 31px;

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

    padding: 0;

    border: 0;
    border-radius: 7px;

    background: transparent;

    color: #94a3b8;

    transform:
        translateY(-50%);

    transition:
        background .2s ease,
        color .2s ease;
}


.lawyer-password-toggle:hover {
    background: #f1f5f9;

    color: #3772e5;
}


.lawyer-password-toggle i {
    font-size: 12px;
}


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

.lawyer-login-submit {
    width: 100%;
    height: 45px;

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

    gap: 8px;

    margin-top: 6px;

    border: 0;
    border-radius: 9px;

    background:
        linear-gradient(
            135deg,
            #3772e5,
            #2862d0
        );

    color: #ffffff;

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

    cursor: pointer;

    box-shadow:
        0 9px 20px rgba(55, 114, 229, 0.20);

    transition:
        transform .2s ease,
        box-shadow .2s ease,
        background .2s ease;
}


.lawyer-login-submit:hover {
    background:
        linear-gradient(
            135deg,
            #2862d0,
            #1f55bb
        );

    box-shadow:
        0 12px 25px rgba(55, 114, 229, 0.26);

    transform:
        translateY(-1px);
}


.lawyer-login-submit:active {
    transform:
        translateY(0);
}


.lawyer-login-submit i {
    font-size: 12px;
}


/* =========================================================
   LOGIN FOOTER
========================================================= */

.lawyer-login-footer {
    display: flex;
    align-items: center;
    justify-content: center;

    gap: 6px;

    margin-top: 23px;
    padding-top: 16px;

    border-top:
        1px solid #edf1f5;

    color: #9aa6b4;

    font-size: 12px;
}


.lawyer-login-footer i {
    color: #16a34a;

    font-size: 10px;
}


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

@media (max-width: 800px) {

    .lawyer-login-page {
        padding: 18px;
    }


    .lawyer-login-wrapper {
        max-width: 470px;

        grid-template-columns: 1fr;

        min-height: auto;
    }


    .lawyer-login-brand {
        min-height: 280px;

        padding: 35px;
    }


    .lawyer-login-brand h1 {
        font-size: 28px;
    }


    .lawyer-login-brand p {
        margin-bottom: 20px;
    }


    .lawyer-login-panel {
        padding: 40px 35px;
    }

}


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

@media (max-width: 500px) {

    .lawyer-login-page {
        padding: 10px;
    }


    .lawyer-login-wrapper {
        border-radius: 15px;
    }


    .lawyer-login-brand {
        min-height: 220px;

        padding: 28px;
    }


    .lawyer-login-logo {
        width: 45px;
        height: 45px;

        margin-bottom: 18px;

        font-size: 18px;
    }


    .lawyer-login-brand h1 {
        font-size: 24px;
    }


    .lawyer-login-brand p {
        display: none;
    }


    .lawyer-login-features {
        display: none;
    }


    .lawyer-login-panel {
        padding: 30px 22px;
    }


    .lawyer-login-heading h2 {
        font-size: 22px;
    }


    .lawyer-login-input input {
        height: 43px;
    }


    .lawyer-login-submit {
        height: 43px;
    }

}


/* =========================================================
   VERY SMALL SCREEN
========================================================= */

@media (max-width: 350px) {

    .lawyer-login-brand {
        padding: 22px;
    }


    .lawyer-login-panel {
        padding: 25px 17px;
    }


    .lawyer-login-heading h2 {
        font-size: 20px;
    }

}

/* =========================================================
   LAWYER DASHBOARD
========================================================= */

.lawyer-page-content {
    padding: 24px;
    background: #f6f8fc;
}


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

.lawyer-dashboard-welcome {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;

    margin-bottom: 20px;
    padding: 24px;

    background: #ffffff;
    border: 1px solid #e7ebf1;
    border-radius: 14px;

    box-shadow: 0 4px 18px rgba(15, 23, 42, 0.04);
}

.lawyer-dashboard-welcome > div:first-child > span {
    display: block;

    margin-bottom: 6px;

    color: #3772e5;

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

    letter-spacing: 1.4px;
}

.lawyer-dashboard-welcome h1 {
    margin: 0;

    color: #011837;

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

    line-height: 1.3;
}

.lawyer-dashboard-welcome p {
    margin: 7px 0 0;

    color: #8a98aa;

    font-size: 10px;
    line-height: 1.6;
}


/* =========================================================
   PROFILE MINI
========================================================= */

.lawyer-profile-mini {
    display: flex;
    align-items: center;

    gap: 10px;

    padding: 8px 12px;

    border: 1px solid #edf1f5;
    border-radius: 10px;

    background: #fafbfc;
}

.lawyer-avatar {
    width: 42px;
    height: 42px;

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

    flex-shrink: 0;

    border-radius: 11px;

    background: #011837;

    color: #ffffff;

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

.lawyer-profile-mini strong {
    display: block;

    color: #334155;

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

.lawyer-profile-mini span {
    display: block;

    max-width: 180px;

    margin-top: 3px;

    overflow: hidden;

    color: #94a3b8;

    font-size: 10px;

    text-overflow: ellipsis;
    white-space: nowrap;
}


/* =========================================================
   STATISTICS
========================================================= */

.lawyer-stat-grid {
    display: grid;

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

    gap: 14px;

    margin-bottom: 18px;
}

.lawyer-stat-card {
    display: flex;
    align-items: center;

    gap: 13px;

    min-width: 0;

    padding: 18px;

    background: #ffffff;

    border: 1px solid #e7ebf1;
    border-radius: 13px;

    box-shadow:
        0 4px 18px rgba(15, 23, 42, 0.035);

    transition:
        transform .2s ease,
        box-shadow .2s ease;
}

.lawyer-stat-card:hover {
    transform: translateY(-2px);

    box-shadow:
        0 8px 25px rgba(15, 23, 42, 0.07);
}

.lawyer-stat-icon {
    width: 42px;
    height: 42px;

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

    flex-shrink: 0;

    border-radius: 11px;

    font-size: 14px;
}

.lawyer-stat-icon.blue {
    background: #eaf1ff;
    color: #3772e5;
}

.lawyer-stat-icon.green {
    background: #ecfdf3;
    color: #16a34a;
}

.lawyer-stat-icon.orange {
    background: #fff7ed;
    color: #ea580c;
}

.lawyer-stat-icon.purple {
    background: #f5f3ff;
    color: #7c3aed;
}

.lawyer-stat-card > div:last-child {
    min-width: 0;
}

.lawyer-stat-card span {
    display: block;

    color: #94a3b8;

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

    letter-spacing: .5px;
}

.lawyer-stat-card strong {
    display: block;

    margin: 3px 0;

    color: #172033;

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

    line-height: 1.2;
}

.lawyer-stat-card small {
    display: block;

    color: #a0aaba;

    font-size: 10px;
}


/* =========================================================
   DASHBOARD GRID
========================================================= */

.lawyer-dashboard-grid {
    display: grid;

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

    gap: 18px;

    margin-bottom: 18px;
}


/* =========================================================
   DASHBOARD CARD
========================================================= */

.lawyer-dashboard-card {
    min-width: 0;

    background: #ffffff;

    border: 1px solid #e7ebf1;
    border-radius: 14px;

    box-shadow:
        0 4px 18px rgba(15, 23, 42, 0.035);
}

.lawyer-card-header {
    min-height: 67px;

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

    gap: 15px;

    padding: 14px 18px;

    border-bottom: 1px solid #edf1f5;
}

.lawyer-card-header > div {
    min-width: 0;
}

.lawyer-card-header span {
    display: block;

    color: #3772e5;

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

    letter-spacing: 1px;
}

.lawyer-card-header h2 {
    margin: 4px 0 0;

    color: #1e293b;

    font-size: 14px;
    font-weight: 750;
}

.lawyer-card-header > a {
    display: inline-flex;
    align-items: center;

    gap: 5px;

    flex-shrink: 0;

    color: #3772e5;

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

    text-decoration: none;
}

.lawyer-card-header > a:hover {
    color: #1d4ed8;
}


/* =========================================================
   EMPTY STATE
========================================================= */

.lawyer-empty-state {
    padding: 50px 25px;

    text-align: center;
}

.lawyer-empty-icon {
    width: 48px;
    height: 48px;

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

    margin: 0 auto 12px;

    border-radius: 12px;

    background: #eaf1ff;

    color: #3772e5;

    font-size: 17px;
}

.lawyer-empty-state h3 {
    margin: 0 0 5px;

    color: #475569;

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

.lawyer-empty-state p {
    margin: 0;

    color: #94a3b8;

    font-size: 12px;
}


/* =========================================================
   INTERNSHIP LIST
========================================================= */

.lawyer-internship-list {
    padding: 4px 18px;
}

.lawyer-internship-item {
    min-height: 66px;

    display: flex;
    align-items: center;

    gap: 10px;

    border-bottom: 1px solid #f1f5f9;
}

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

.lawyer-internship-icon {
    width: 35px;
    height: 35px;

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

    flex-shrink: 0;

    border-radius: 9px;

    background: #eaf1ff;

    color: #3772e5;

    font-size: 11px;
}

.lawyer-internship-info {
    min-width: 0;

    flex: 1;
}

.lawyer-internship-info strong {
    display: block;

    overflow: hidden;

    color: #475569;

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

    text-overflow: ellipsis;
    white-space: nowrap;
}

.lawyer-internship-meta {
    display: flex;
    align-items: center;

    gap: 10px;

    margin-top: 5px;

    color: #a0aaba;

    font-size: 12px;
}

.lawyer-internship-meta span {
    display: inline-flex;
    align-items: center;

    gap: 3px;
}

.lawyer-status {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    flex-shrink: 0;

    min-width: 55px;

    padding: 5px 7px;

    border-radius: 6px;

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

.lawyer-status.pending {
    background: #fff7ed;
    color: #ea580c;
}

.lawyer-status.active {
    background: #eaf1ff;
    color: #3772e5;
}

.lawyer-status.completed {
    background: #ecfdf3;
    color: #16a34a;
}

.lawyer-item-arrow {
    width: 25px;
    height: 25px;

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

    flex-shrink: 0;

    border-radius: 6px;

    color: #94a3b8;

    text-decoration: none;

    transition:
        background .2s ease,
        color .2s ease;
}

.lawyer-item-arrow:hover {
    background: #f1f5f9;
    color: #3772e5;
}


/* =========================================================
   QUICK ACTIONS
========================================================= */

.lawyer-quick-list {
    padding: 7px 13px;
}

.lawyer-quick-item {
    min-height: 65px;

    display: flex;
    align-items: center;

    gap: 10px;

    padding: 8px;

    border-bottom: 1px solid #f1f5f9;

    color: inherit;

    text-decoration: none;

    transition:
        background .2s ease,
        transform .2s ease;
}

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

.lawyer-quick-item:hover {
    background: #fafcff;

    transform: translateX(2px);
}

.lawyer-quick-icon {
    width: 35px;
    height: 35px;

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

    flex-shrink: 0;

    border-radius: 9px;

    font-size: 11px;
}

.lawyer-quick-icon.blue {
    background: #eaf1ff;
    color: #3772e5;
}

.lawyer-quick-icon.green {
    background: #ecfdf3;
    color: #16a34a;
}

.lawyer-quick-icon.purple {
    background: #f5f3ff;
    color: #7c3aed;
}

.lawyer-quick-item > div:nth-child(2) {
    min-width: 0;

    flex: 1;
}

.lawyer-quick-item strong {
    display: block;

    color: #475569;

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

.lawyer-quick-item span {
    display: block;

    margin-top: 3px;

    overflow: hidden;

    color: #94a3b8;

    font-size: 12px;

    text-overflow: ellipsis;
    white-space: nowrap;
}

.lawyer-quick-item > i {
    flex-shrink: 0;

    color: #c0c9d4;

    font-size: 12px;
}


/* =========================================================
   COMPLETION OVERVIEW
========================================================= */

.lawyer-overview-card {
    margin-bottom: 20px;
}

.lawyer-progress-overview {
    display: flex;
    align-items: center;

    gap: 45px;

    padding: 25px;
}


/* =========================================================
   PROGRESS CIRCLE
========================================================= */

.lawyer-progress-circle {
    width: 125px;
    height: 125px;

    position: relative;

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

    flex-shrink: 0;

    border-radius: 50%;

    background:
        conic-gradient(
            #3772e5 var(--progress),
            #eaf1ff var(--progress)
        );
}

.lawyer-progress-circle::after {
    content: "";

    position: absolute;

    width: 91px;
    height: 91px;

    border-radius: 50%;

    background: #ffffff;
}

.lawyer-progress-circle > div {
    position: relative;

    z-index: 2;

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

    flex-direction: column;
}

.lawyer-progress-circle strong {
    color: #011837;

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

    line-height: 1;
}

.lawyer-progress-circle span {
    margin-top: 5px;

    color: #94a3b8;

    font-size: 10px;
}


/* =========================================================
   PROGRESS DETAILS
========================================================= */

.lawyer-progress-details {
    width: 100%;
    max-width: 400px;
}

.lawyer-progress-row {
    min-height: 40px;

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

    gap: 15px;

    border-bottom: 1px solid #f1f5f9;

    color: #64748b;

    font-size: 12px;
}

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

.lawyer-progress-row > span {
    display: flex;
    align-items: center;

    gap: 7px;
}

.lawyer-progress-row strong {
    color: #334155;

    font-size: 9px;
}

.lawyer-progress-row .dot {
    width: 7px;
    height: 7px;

    display: inline-block;

    border-radius: 50%;
}

.lawyer-progress-row .dot.completed {
    background: #16a34a;
}

.lawyer-progress-row .dot.active {
    background: #3772e5;
}

.lawyer-progress-row .dot.pending {
    background: #ea580c;
}


/* =========================================================
   RESPONSIVE - TABLET
========================================================= */

@media (max-width: 1100px) {

    .lawyer-stat-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .lawyer-dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* =========================================================
   RESPONSIVE - MOBILE
========================================================= */

@media (max-width: 700px) {

    .lawyer-page-content {
        padding: 15px;
    }

    .lawyer-dashboard-welcome {
        align-items: flex-start;
        flex-direction: column;
    }

    .lawyer-profile-mini {
        width: 100%;
    }

    .lawyer-stat-grid {
        grid-template-columns: 1fr;
    }

    .lawyer-progress-overview {
        align-items: flex-start;
        flex-direction: column;
    }

    .lawyer-progress-details {
        max-width: 100%;
    }
}


/* =========================================================
   RESPONSIVE - SMALL MOBILE
========================================================= */

@media (max-width: 480px) {

    .lawyer-page-content {
        padding: 10px;
    }

    .lawyer-dashboard-welcome {
        padding: 18px;
    }

    .lawyer-dashboard-welcome h1 {
        font-size: 18px;
    }

    .lawyer-dashboard-welcome p {
        font-size: 12px;
    }

    .lawyer-stat-card {
        padding: 15px;
    }

    .lawyer-stat-card strong {
        font-size: 18px;
    }

    .lawyer-card-header {
        padding: 13px;
    }

    .lawyer-internship-list {
        padding: 4px 12px;
    }

    .lawyer-status {
        display: none;
    }

    .lawyer-progress-overview {
        padding: 20px;
    }

}

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

.lawyer-topbar {
    position: sticky;
    top: 0;
    z-index: 100;

    height: 68px;

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

    padding: 0 24px;

    background: #ffffff;

    border-bottom: 1px solid #e7ebf1;

    box-shadow:
        0 2px 12px rgba(15, 23, 42, 0.035);
}


/* =========================================================
   LEFT SIDE
========================================================= */

.lawyer-topbar-left {
    display: flex;
    align-items: center;

    gap: 16px;

    min-width: 0;
}


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

.lawyer-sidebar-toggle {
    width: 36px;
    height: 36px;

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

    padding: 0;

    border: 1px solid #e6ebf1;
    border-radius: 9px;

    background: #ffffff;

    color: #475569;

    font-size: 16px;

    cursor: pointer;

    transition:
        background .2s ease,
        border-color .2s ease,
        color .2s ease;
}

.lawyer-sidebar-toggle:hover {
    background: #f5f8ff;

    border-color: #dbe5f5;

    color: #3772e5;
}


/* =========================================================
   BREADCRUMB
========================================================= */

.lawyer-breadcrumb {
    display: flex;
    align-items: center;

    gap: 8px;

    min-width: 0;

    color: #94a3b8;

    font-size: 12px;
}

.lawyer-breadcrumb span {
    white-space: nowrap;
}

.lawyer-breadcrumb i {
    color: #cbd5e1;

    font-size: 12px;
}

.lawyer-breadcrumb strong {
    overflow: hidden;

    color: #334155;

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

    text-overflow: ellipsis;
    white-space: nowrap;
}


/* =========================================================
   RIGHT SIDE
========================================================= */

.lawyer-topbar-right {
    display: flex;
    align-items: center;

    gap: 16px;
}


/* =========================================================
   ONLINE STATUS
========================================================= */

.lawyer-online-status {
    display: flex;
    align-items: center;

    gap: 6px;

    color: #64748b;

    font-size: 12px;
    font-weight: 600;
}

.lawyer-online-dot {
    width: 7px;
    height: 7px;

    display: inline-block;

    border-radius: 50%;

    background: #16a34a;

    box-shadow:
        0 0 0 3px rgba(22, 163, 74, 0.10);
}


/* =========================================================
   DIVIDER
========================================================= */

.lawyer-topbar-divider {
    width: 1px;
    height: 28px;

    background: #e9edf2;
}


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

.lawyer-topbar-profile {
    position: relative;

    display: flex;
    align-items: center;

    gap: 9px;
}


/* =========================================================
   AVATAR
========================================================= */

.lawyer-topbar-avatar {
    width: 36px;
    height: 36px;

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

    flex-shrink: 0;

    border-radius: 10px;

    background: #011837;

    color: #ffffff;

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


/* =========================================================
   USER INFO
========================================================= */

.lawyer-topbar-user {
    min-width: 100px;
    max-width: 170px;
}

.lawyer-topbar-user strong {
    display: block;

    overflow: hidden;

    color: #334155;

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

    text-overflow: ellipsis;
    white-space: nowrap;
}

.lawyer-topbar-user span {
    display: block;

    margin-top: 3px;

    overflow: hidden;

    color: #94a3b8;

    font-size: 12px;

    text-overflow: ellipsis;
    white-space: nowrap;
}


/* =========================================================
   PROFILE MENU BUTTON
========================================================= */

.lawyer-profile-menu-btn {
    width: 26px;
    height: 26px;

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

    padding: 0;

    border: 0;
    border-radius: 6px;

    background: transparent;

    color: #94a3b8;

    cursor: pointer;

    transition:
        background .2s ease,
        color .2s ease;
}

.lawyer-profile-menu-btn:hover {
    background: #f1f5f9;

    color: #3772e5;
}

.lawyer-profile-menu-btn i {
    font-size: 9px;
}


/* =========================================================
   PROFILE DROPDOWN
========================================================= */

.lawyer-profile-dropdown {
    position: absolute;

    top: calc(100% + 10px);
    right: 0;

    width: 175px;

    padding: 7px;

    border: 1px solid #e6ebf1;
    border-radius: 10px;

    background: #ffffff;

    box-shadow:
        0 15px 35px rgba(15, 23, 42, 0.12);

    opacity: 0;
    visibility: hidden;

    transform:
        translateY(-5px);

    transition:
        opacity .18s ease,
        visibility .18s ease,
        transform .18s ease;
}

.lawyer-profile-dropdown.show {
    opacity: 1;

    visibility: visible;

    transform:
        translateY(0);
}


/* =========================================================
   DROPDOWN LINKS
========================================================= */

.lawyer-profile-dropdown a {
    display: flex;
    align-items: center;

    gap: 9px;

    padding: 9px 10px;

    border-radius: 7px;

    color: #475569;

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

    text-decoration: none;

    transition:
        background .2s ease,
        color .2s ease;
}

.lawyer-profile-dropdown a:hover {
    background: #f5f8ff;

    color: #3772e5;
}

.lawyer-profile-dropdown a i {
    width: 15px;

    color: #94a3b8;

    font-size: 11px;

    text-align: center;
}

.lawyer-profile-dropdown a:hover i {
    color: #3772e5;
}


/* =========================================================
   LOGOUT
========================================================= */

.lawyer-profile-dropdown
.lawyer-dropdown-logout {
    margin-top: 4px;

    border-top: 1px solid #f1f5f9;

    border-radius: 0 0 7px 7px;

    color: #dc2626;
}

.lawyer-profile-dropdown
.lawyer-dropdown-logout:hover {
    background: #fef2f2;

    color: #dc2626;
}

.lawyer-profile-dropdown
.lawyer-dropdown-logout:hover i {
    color: #dc2626;
}


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

.lawyer-sidebar {
    transition:
        width .25s ease,
        transform .25s ease;
}

.lawyer-main {
    transition:
        margin-left .25s ease;
}

.lawyer-sidebar.collapsed {
    width: 76px;
}

.lawyer-sidebar.collapsed
.lawyer-brand-text,
.lawyer-sidebar.collapsed
.lawyer-nav-title,
.lawyer-sidebar.collapsed
.lawyer-nav-item span,
.lawyer-sidebar.collapsed
.lawyer-sidebar-footer {
    display: none;
}

.lawyer-sidebar.collapsed
.lawyer-sidebar-brand {
    justify-content: center;
}

.lawyer-sidebar.collapsed
.lawyer-nav-item {
    justify-content: center;

    padding-left: 0;
    padding-right: 0;
}

.lawyer-sidebar.collapsed
.lawyer-nav-item i {
    margin: 0;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 900px) {

    .lawyer-topbar {
        padding: 0 18px;
    }

    .lawyer-topbar-user {
        max-width: 120px;
    }

    .lawyer-online-status {
        display: none;
    }

}


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

@media (max-width: 650px) {

    .lawyer-topbar {
        height: 60px;

        padding: 0 12px;
    }

    .lawyer-topbar-left {
        gap: 9px;
    }

    .lawyer-sidebar-toggle {
        width: 34px;
        height: 34px;
    }

    .lawyer-breadcrumb span,
    .lawyer-breadcrumb i {
        display: none;
    }

    .lawyer-breadcrumb strong {
        font-size: 12px;
    }

    .lawyer-topbar-right {
        gap: 7px;
    }

    .lawyer-topbar-divider {
        display: none;
    }

    .lawyer-topbar-user {
        display: none;
    }

    .lawyer-topbar-avatar {
        width: 34px;
        height: 34px;
    }

    .lawyer-profile-menu-btn {
        width: 22px;
        height: 22px;
    }

}


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

@media (max-width: 400px) {

    .lawyer-topbar {
        padding: 0 9px;
    }

    .lawyer-breadcrumb strong {
        max-width: 120px;
    }

    .lawyer-profile-dropdown {
        right: -5px;
    }

}

/* =========================================================
   LAWYER PROFILE
========================================================= */

.lawyer-page-header {
    margin-bottom: 20px;
}

.lawyer-page-header > div > span {
    display: block;

    margin-bottom: 5px;

    color: #3772e5;

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

    letter-spacing: 1.2px;
}

.lawyer-page-header h1 {
    margin: 0;

    color: #011837;

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

.lawyer-page-header p {
    margin: 6px 0 0;

    color: #94a3b8;

    font-size: 9px;
}


/* =========================================================
   ALERTS
========================================================= */

.lawyer-alert {
    display: flex;
    align-items: flex-start;

    gap: 9px;

    margin-bottom: 18px;

    padding: 12px 14px;

    border-radius: 9px;

    font-size: 8px;
    line-height: 1.5;
}

.lawyer-alert-success {
    border: 1px solid #bbf7d0;

    background: #f0fdf4;

    color: #15803d;
}

.lawyer-alert-error {
    border: 1px solid #fecaca;

    background: #fef2f2;

    color: #b91c1c;
}

.lawyer-alert i {
    font-size: 11px;
}


/* =========================================================
   PROFILE GRID
========================================================= */

.lawyer-profile-grid {
    display: grid;

    grid-template-columns:
        minmax(0, 1.55fr)
        minmax(300px, .75fr);

    gap: 18px;

    align-items: start;
}


/* =========================================================
   PROFILE FORM
========================================================= */

.lawyer-profile-form {
    display: grid;

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

    gap: 16px;

    padding: 20px;
}

.lawyer-form-group {
    min-width: 0;
}

.lawyer-form-group.full {
    grid-column: 1 / -1;
}

.lawyer-form-group label {
    display: block;

    margin-bottom: 6px;

    color: #475569;

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

.lawyer-form-group small {
    display: block;

    margin-top: 5px;

    color: #94a3b8;

    font-size: 12px;
}


/* =========================================================
   INPUT
========================================================= */

.lawyer-form-input {
    position: relative;
}

.lawyer-form-input > i {
    position: absolute;

    top: 14px;
    left: 12px;

    z-index: 2;

    color: #94a3b8;

    font-size: 11px;

    pointer-events: none;
}

.lawyer-form-input input,
.lawyer-form-input textarea {
    width: 100%;

    box-sizing: border-box;

    padding: 0 12px 0 35px;

    border: 1px solid #dfe6ee;

    border-radius: 8px;

    outline: none;

    background: #ffffff;

    color: #334155;

    font-family: inherit;

    font-size: 9px;

    transition:
        border-color .2s ease,
        box-shadow .2s ease;
}

.lawyer-form-input input {
    height: 42px;
}

.lawyer-form-input textarea {
    min-height: 95px;

    padding-top: 11px;

    resize: vertical;
}

.lawyer-form-input input:focus,
.lawyer-form-input textarea:focus {
    border-color: #3772e5;

    box-shadow:
        0 0 0 3px rgba(55, 114, 229, .08);
}

.lawyer-form-input input:focus + *,
.lawyer-form-input textarea:focus + * {
    color: #3772e5;
}

.lawyer-form-input input[readonly] {
    background: #f8fafc;

    color: #64748b;

    cursor: not-allowed;
}


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

.lawyer-form-actions {
    display: flex;

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

    padding-top: 3px;
}

.lawyer-primary-btn {
    height: 40px;

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

    gap: 7px;

    padding: 0 17px;

    border: 0;

    border-radius: 8px;

    background: #3772e5;

    color: #ffffff;

    font-family: inherit;

    font-size: 8px;
    font-weight: 700;

    cursor: pointer;

    box-shadow:
        0 7px 18px rgba(55, 114, 229, .18);

    transition:
        transform .2s ease,
        background .2s ease,
        box-shadow .2s ease;
}

.lawyer-primary-btn:hover {
    background: #2862d0;

    transform: translateY(-1px);

    box-shadow:
        0 9px 22px rgba(55, 114, 229, .24);
}

.lawyer-primary-btn i {
    font-size: 10px;
}


/* =========================================================
   SECURITY
========================================================= */

.lawyer-security-content {
    padding: 20px;
}

.lawyer-security-info {
    display: flex;
    align-items: flex-start;

    gap: 10px;

    margin-bottom: 20px;
}

.lawyer-security-icon {
    width: 38px;
    height: 38px;

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

    flex-shrink: 0;

    border-radius: 9px;

    background: #eaf1ff;

    color: #3772e5;

    font-size: 13px;
}

.lawyer-security-info strong {
    display: block;

    color: #334155;

    font-size: 9px;
}

.lawyer-security-info p {
    margin: 4px 0 0;

    color: #94a3b8;

    font-size: 10px;

    line-height: 1.5;
}

.lawyer-password-form {
    display: flex;

    flex-direction: column;

    gap: 14px;
}

.lawyer-password-btn {
    width: 100%;

    margin-top: 2px;
}


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

@media (max-width: 1050px) {

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

}


@media (max-width: 650px) {

    .lawyer-profile-form {
        grid-template-columns: 1fr;

        padding: 16px;
    }

    .lawyer-form-group.full {
        grid-column: auto;
    }

    .lawyer-form-actions {
        justify-content: stretch;
    }

    .lawyer-form-actions .lawyer-primary-btn {
        width: 100%;
    }

}


@media (max-width: 450px) {

    .lawyer-page-header h1 {
        font-size: 19px;
    }

    .lawyer-profile-form,
    .lawyer-security-content {
        padding: 14px;
    }

}

/* =========================================================
   ASSIGNED INTERNSHIPS
========================================================= */

.lawyer-assignment-filter-card {
    margin-bottom: 18px;
}

.lawyer-assignment-filter {
    display: flex;
    align-items: center;

    gap: 10px;

    padding: 15px 18px;
}

.lawyer-filter-search {
    position: relative;

    flex: 1;

    min-width: 180px;
}

.lawyer-filter-search > i {
    position: absolute;

    top: 50%;
    left: 12px;

    color: #94a3b8;

    font-size: 10px;

    transform: translateY(-50%);
}

.lawyer-filter-search input,
.lawyer-filter-select select {
    width: 100%;
    height: 40px;

    box-sizing: border-box;

    border: 1px solid #dfe6ee;
    border-radius: 8px;

    outline: none;

    background: #ffffff;

    color: #475569;

    font-family: inherit;

    font-size: 8px;
}

.lawyer-filter-search input {
    padding: 0 12px 0 34px;
}

.lawyer-filter-search input:focus,
.lawyer-filter-select select:focus {
    border-color: #3772e5;

    box-shadow:
        0 0 0 3px rgba(55, 114, 229, .08);
}

.lawyer-filter-select {
    width: 150px;
}

.lawyer-filter-select select {
    padding: 0 10px;
}

.lawyer-assignment-filter .lawyer-primary-btn {
    height: 40px;

    flex-shrink: 0;
}

.lawyer-filter-reset {
    height: 40px;

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

    gap: 5px;

    padding: 0 11px;

    border: 1px solid #e2e8f0;
    border-radius: 8px;

    color: #64748b;

    font-size: 8px;
    font-weight: 600;

    text-decoration: none;
}

.lawyer-filter-reset:hover {
    background: #f8fafc;

    color: #dc2626;
}


/* =========================================================
   ASSIGNMENT HEADER
========================================================= */

.lawyer-assignment-count {
    padding: 6px 9px;

    border-radius: 6px;

    background: #f5f8ff;

    color: #3772e5;

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


/* =========================================================
   TABLE
========================================================= */

.lawyer-assignment-table-wrapper {
    width: 100%;

    overflow-x: auto;
}

.lawyer-assignment-table {
    width: 100%;

    border-collapse: collapse;

    min-width: 780px;
}

.lawyer-assignment-table th {
    padding: 12px 14px;

    border-bottom: 1px solid #e8edf3;

    background: #fafbfc;

    color: #94a3b8;

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

    text-align: left;

    text-transform: uppercase;

    letter-spacing: .4px;
}

.lawyer-assignment-table td {
    padding: 13px 14px;

    border-bottom: 1px solid #f0f3f7;

    color: #64748b;

    font-size: 8px;

    vertical-align: middle;
}

.lawyer-assignment-table tbody tr {
    transition:
        background .2s ease;
}

.lawyer-assignment-table tbody tr:hover {
    background: #fafcff;
}

.lawyer-assignment-table tbody tr:last-child td {
    border-bottom: 0;
}


/* =========================================================
   ROW NUMBER
========================================================= */

.lawyer-row-number {
    width: 25px;
    height: 25px;

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

    border-radius: 7px;

    background: #f1f5f9;

    color: #64748b;

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


/* =========================================================
   INTERNSHIP
========================================================= */

.lawyer-table-internship {
    display: flex;
    align-items: center;

    gap: 9px;

    min-width: 180px;
}

.lawyer-table-internship-icon {
    width: 34px;
    height: 34px;

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

    flex-shrink: 0;

    border-radius: 8px;

    background: #eaf1ff;

    color: #3772e5;

    font-size: 11px;
}

.lawyer-table-internship strong {
    display: block;

    max-width: 220px;

    overflow: hidden;

    color: #334155;

    font-size: 8px;
    font-weight: 700;

    text-overflow: ellipsis;
    white-space: nowrap;
}

.lawyer-table-internship span {
    display: block;

    margin-top: 3px;

    color: #a0aaba;

    font-size: 12px;
}


/* =========================================================
   TABLE SECONDARY
========================================================= */

.lawyer-table-secondary {
    display: inline-flex;
    align-items: center;

    gap: 5px;

    color: #64748b;

    font-size: 10px;
}

.lawyer-table-secondary i {
    color: #94a3b8;
}

.lawyer-table-muted {
    color: #b6c0cc;

    font-size: 8px;
}


/* =========================================================
   DATE
========================================================= */

.lawyer-table-date {
    display: inline-flex;
    align-items: center;

    gap: 5px;

    color: #64748b;

    font-size: 10px;
}

.lawyer-table-date i {
    color: #94a3b8;
}


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

.lawyer-view-btn {
    height: 29px;

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

    gap: 5px;

    padding: 0 9px;

    border: 1px solid #dbe5f5;
    border-radius: 6px;

    background: #f5f8ff;

    color: #3772e5;

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

    text-decoration: none;

    transition:
        background .2s ease,
        border-color .2s ease;
}

.lawyer-view-btn:hover {
    background: #eaf1ff;

    border-color: #cbdcf8;
}


/* =========================================================
   ERROR
========================================================= */

.lawyer-assignment-error {
    margin: 18px;

    padding: 13px;

    border: 1px solid #fecaca;
    border-radius: 8px;

    background: #fef2f2;

    color: #b91c1c;

    font-size: 8px;
}

.lawyer-assignment-error i {
    margin-right: 5px;
}


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

@media (max-width: 800px) {

    .lawyer-assignment-filter {
        flex-wrap: wrap;
    }

    .lawyer-filter-search {
        flex-basis: 100%;
    }

    .lawyer-filter-select {
        flex: 1;
    }

}


@media (max-width: 500px) {

    .lawyer-assignment-filter {
        align-items: stretch;
        flex-direction: column;

        padding: 13px;
    }

    .lawyer-filter-search,
    .lawyer-filter-select {
        width: 100%;
        flex-basis: auto;
    }

    .lawyer-assignment-filter .lawyer-primary-btn,
    .lawyer-filter-reset {
        width: 100%;
    }

}

/* =========================================================
   INTERNSHIP DETAILS
========================================================= */

.lawyer-back-link {
    display: inline-flex;
    align-items: center;

    gap: 6px;

    margin-bottom: 15px;

    color: #64748b;

    font-size: 8px;
    font-weight: 600;

    text-decoration: none;

    transition: color .2s ease;
}

.lawyer-back-link:hover {
    color: #3772e5;
}

.lawyer-back-link i {
    font-size: 10px;
}


/* =========================================================
   DETAILS HEADER
========================================================= */

.lawyer-details-header {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 20px;

    margin-bottom: 20px;
}

.lawyer-details-heading {
    display: flex;
    align-items: center;

    gap: 13px;

    min-width: 0;
}

.lawyer-details-main-icon {
    width: 48px;
    height: 48px;

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

    flex-shrink: 0;

    border-radius: 12px;

    background: #eaf1ff;

    color: #3772e5;

    font-size: 16px;
}

.lawyer-details-heading > div:last-child {
    min-width: 0;
}

.lawyer-details-heading span {
    display: block;

    margin-bottom: 4px;

    color: #3772e5;

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

    letter-spacing: .9px;
}

.lawyer-details-heading h1 {
    margin: 0;

    overflow: hidden;

    color: #011837;

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

    text-overflow: ellipsis;
    white-space: nowrap;
}

.lawyer-details-heading p {
    margin: 5px 0 0;

    color: #94a3b8;

    font-size: 8px;
}


/* =========================================================
   DETAILS GRID
========================================================= */

.lawyer-details-grid {
    display: grid;

    grid-template-columns:
        minmax(0, 1.55fr)
        minmax(280px, .75fr);

    gap: 18px;

    align-items: start;
}


/* =========================================================
   DETAILS BODY
========================================================= */

.lawyer-details-body {
    padding: 20px;
}

.lawyer-detail-section {
    margin-bottom: 24px;
}

.lawyer-detail-section:last-child {
    margin-bottom: 0;
}

.lawyer-detail-section h3 {
    margin: 0 0 9px;

    color: #334155;

    font-size: 9px;
    font-weight: 750;
}

.lawyer-detail-description {
    margin: 0;

    color: #64748b;

    font-size: 8px;

    line-height: 1.75;
}


/* =========================================================
   INFORMATION GRID
========================================================= */

.lawyer-detail-info-grid {
    display: grid;

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

    gap: 10px;

    margin-bottom: 24px;
}

.lawyer-detail-info-item {
    min-height: 65px;

    padding: 12px;

    border: 1px solid #edf1f5;
    border-radius: 9px;

    background: #fafbfc;
}

.lawyer-detail-info-item > span {
    display: flex;
    align-items: center;

    gap: 5px;

    margin-bottom: 7px;

    color: #94a3b8;

    font-size: 10px;
}

.lawyer-detail-info-item > span i {
    color: #3772e5;

    font-size: 9px;
}

.lawyer-detail-info-item > strong {
    display: block;

    overflow: hidden;

    color: #475569;

    font-size: 8px;
    font-weight: 700;

    text-overflow: ellipsis;
    white-space: nowrap;
}


/* =========================================================
   ASSIGNMENT INFORMATION
========================================================= */

.lawyer-assignment-info-section {
    padding-top: 20px;

    border-top: 1px solid #edf1f5;
}

.lawyer-assignment-info {
    display: grid;

    grid-template-columns:
        repeat(3, 1fr);

    gap: 10px;
}

.lawyer-assignment-info > div {
    padding: 11px;

    border-radius: 8px;

    background: #f8fafc;
}

.lawyer-assignment-info span:first-child {
    display: block;

    margin-bottom: 5px;

    color: #94a3b8;

    font-size: 12px;
}

.lawyer-assignment-info strong {
    display: block;

    color: #475569;

    font-size: 8px;
}


/* =========================================================
   NOTES
========================================================= */

.lawyer-detail-notes {
    display: flex;
    align-items: flex-start;

    gap: 9px;

    padding: 12px;

    border: 1px solid #dbeafe;
    border-radius: 8px;

    background: #eff6ff;

    color: #475569;
}

.lawyer-detail-notes > i {
    flex-shrink: 0;

    margin-top: 2px;

    color: #3772e5;

    font-size: 11px;
}

.lawyer-detail-notes p {
    margin: 0;

    font-size: 10px;

    line-height: 1.6;
}


/* =========================================================
   STUDENT CARD
========================================================= */

.lawyer-student-detail-body {
    padding: 25px 20px;

    text-align: center;
}

.lawyer-student-avatar {
    width: 64px;
    height: 64px;

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

    margin: 0 auto 12px;

    border-radius: 17px;

    background: #011837;

    color: #ffffff;

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

.lawyer-student-detail-body h3 {
    margin: 0;

    color: #334155;

    font-size: 12px;
    font-weight: 750;
}

.lawyer-student-id {
    display: block;

    margin-top: 4px;

    color: #94a3b8;

    font-size: 10px;
}

.lawyer-student-info {
    margin-top: 20px;

    padding-top: 15px;

    border-top: 1px solid #edf1f5;

    text-align: left;
}

.lawyer-student-info > div {
    display: flex;
    align-items: center;

    gap: 9px;

    min-height: 35px;

    border-bottom: 1px solid #f1f5f9;
}

.lawyer-student-info > div:last-child {
    border-bottom: 0;
}

.lawyer-student-info i {
    width: 15px;

    color: #3772e5;

    font-size: 10px;

    text-align: center;
}

.lawyer-student-info span {
    overflow: hidden;

    color: #64748b;

    font-size: 10px;

    text-overflow: ellipsis;
    white-space: nowrap;
}

.lawyer-student-action {
    width: 100%;

    margin-top: 18px;
}


/* =========================================================
   ERROR
========================================================= */

.lawyer-details-error-card {
    max-width: 650px;

    margin: 20px auto;
}

.lawyer-error-icon {
    background: #fff7ed;

    color: #ea580c;
}

.lawyer-error-back-btn {
    margin-top: 15px;
}


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

@media (max-width: 1050px) {

    .lawyer-details-grid {
        grid-template-columns: 1fr;
    }

}

@media (max-width: 750px) {

    .lawyer-details-header {
        align-items: flex-start;

        flex-direction: column;
    }

    .lawyer-detail-info-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .lawyer-assignment-info {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

}

@media (max-width: 500px) {

    .lawyer-details-heading {
        align-items: flex-start;
    }

    .lawyer-details-main-icon {
        width: 42px;
        height: 42px;
    }

    .lawyer-details-heading h1 {
        font-size: 17px;
    }

    .lawyer-detail-info-grid {
        grid-template-columns: 1fr;
    }

    .lawyer-assignment-info {
        grid-template-columns: 1fr;
    }

    .lawyer-details-body {
        padding: 15px;
    }

}

/* =========================================================
   UPDATE PROGRESS
========================================================= */

.lawyer-progress-summary {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 25px;

    margin-bottom: 18px;
    padding: 18px 20px;

    border: 1px solid #e7ebf1;
    border-radius: 13px;

    background: #ffffff;

    box-shadow:
        0 4px 18px rgba(15, 23, 42, 0.035);
}

.lawyer-progress-summary-main {
    display: flex;
    align-items: center;

    gap: 12px;

    min-width: 0;
}

.lawyer-progress-summary-main > div:last-child {
    min-width: 0;
}

.lawyer-progress-summary-main span {
    display: block;

    margin-bottom: 4px;

    color: #3772e5;

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

    letter-spacing: 1px;
}

.lawyer-progress-summary-main strong {
    display: block;

    overflow: hidden;

    color: #334155;

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

    text-overflow: ellipsis;
    white-space: nowrap;
}

.lawyer-progress-summary-main small {
    display: block;

    margin-top: 4px;

    color: #94a3b8;

    font-size: 12px;
}

.lawyer-progress-summary-meta {
    display: flex;
    align-items: center;

    gap: 25px;
}

.lawyer-progress-summary-meta > div {
    min-width: 75px;
}

.lawyer-progress-summary-meta span {
    display: block;

    margin-bottom: 5px;

    color: #94a3b8;

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

.lawyer-progress-summary-meta strong {
    display: block;

    color: #475569;

    font-size: 8px;
}


/* =========================================================
   FORM
========================================================= */

.lawyer-progress-form {
    display: grid;

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

    gap: 18px;

    padding: 20px;
}

.lawyer-progress-form .lawyer-form-group.full,
.lawyer-progress-actions.full {
    grid-column: 1 / -1;
}


/* =========================================================
   SELECT
========================================================= */

.lawyer-form-input select {
    width: 100%;
    height: 42px;

    box-sizing: border-box;

    padding: 0 12px 0 35px;

    border: 1px solid #dfe6ee;
    border-radius: 8px;

    outline: none;

    background: #ffffff;

    color: #475569;

    font-family: inherit;

    font-size: 9px;

    appearance: none;

    cursor: pointer;

    transition:
        border-color .2s ease,
        box-shadow .2s ease;
}

.lawyer-form-input select:focus {
    border-color: #3772e5;

    box-shadow:
        0 0 0 3px rgba(55, 114, 229, .08);
}


/* =========================================================
   PROGRESS INPUT
========================================================= */

.lawyer-progress-input-wrap {
    position: relative;
}

.lawyer-progress-input-wrap input {
    width: 100%;
    height: 42px;

    box-sizing: border-box;

    padding: 0 38px 0 12px;

    border: 1px solid #dfe6ee;
    border-radius: 8px;

    outline: none;

    background: #ffffff;

    color: #334155;

    font-family: inherit;

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

    transition:
        border-color .2s ease,
        box-shadow .2s ease;
}

.lawyer-progress-input-wrap input:focus {
    border-color: #3772e5;

    box-shadow:
        0 0 0 3px rgba(55, 114, 229, .08);
}

.lawyer-progress-input-wrap span {
    position: absolute;

    top: 50%;
    right: 13px;

    color: #94a3b8;

    font-size: 8px;
    font-weight: 700;

    transform: translateY(-50%);
}


/* =========================================================
   PROGRESS BAR
========================================================= */

.lawyer-progress-bar {
    width: 100%;
    height: 7px;

    margin-top: 10px;

    overflow: hidden;

    border-radius: 10px;

    background: #eaf1ff;
}

.lawyer-progress-bar-fill {
    width: 0;
    height: 100%;

    border-radius: inherit;

    background: #3772e5;

    transition:
        width .25s ease;
}


/* =========================================================
   ACTIONS
========================================================= */

.lawyer-progress-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;

    gap: 9px;

    padding-top: 3px;
}

.lawyer-secondary-btn {
    height: 40px;

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

    gap: 6px;

    padding: 0 15px;

    border: 1px solid #dfe6ee;
    border-radius: 8px;

    background: #ffffff;

    color: #64748b;

    font-family: inherit;

    font-size: 8px;
    font-weight: 700;

    text-decoration: none;

    transition:
        background .2s ease,
        border-color .2s ease,
        color .2s ease;
}

.lawyer-secondary-btn:hover {
    background: #f8fafc;

    border-color: #cbd5e1;

    color: #334155;
}


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

@media (max-width: 850px) {

    .lawyer-progress-summary {
        align-items: flex-start;

        flex-direction: column;
    }

    .lawyer-progress-summary-meta {
        width: 100%;

        justify-content: space-between;
    }

}


@media (max-width: 650px) {

    .lawyer-progress-form {
        grid-template-columns: 1fr;

        padding: 16px;
    }

    .lawyer-progress-form .lawyer-form-group.full,
    .lawyer-progress-actions.full {
        grid-column: auto;
    }

    .lawyer-progress-summary {
        padding: 15px;
    }

    .lawyer-progress-summary-meta {
        align-items: flex-start;

        flex-direction: column;

        gap: 12px;
    }

    .lawyer-progress-summary-meta > div {
        width: 100%;
    }

    .lawyer-progress-actions {
        flex-direction: column-reverse;

        align-items: stretch;
    }

    .lawyer-progress-actions .lawyer-primary-btn,
    .lawyer-progress-actions .lawyer-secondary-btn {
        width: 100%;
    }

}

/* =========================================================
   LAWYER UPDATE PROGRESS
========================================================= */

.lawyer-alert {
    display: flex;
    align-items: center;

    gap: 9px;

    margin-bottom: 15px;

    padding: 12px 14px;

    border-radius: 8px;

    font-size: 8px;
    line-height: 1.5;
}

.lawyer-alert i {
    flex-shrink: 0;

    font-size: 11px;
}

.lawyer-alert-success {
    border: 1px solid #bbf7d0;

    background: #f0fdf4;

    color: #15803d;
}

.lawyer-alert-error {
    border: 1px solid #fecaca;

    background: #fef2f2;

    color: #b91c1c;
}


/* =========================================================
   PROGRESS SUMMARY
========================================================= */

.lawyer-progress-summary {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 25px;

    margin-bottom: 18px;
    padding: 18px 20px;

    border: 1px solid #e7ebf1;
    border-radius: 13px;

    background: #ffffff;

    box-shadow:
        0 4px 18px rgba(15, 23, 42, .035);
}

.lawyer-progress-summary-main {
    display: flex;
    align-items: center;

    gap: 12px;

    min-width: 0;
}

.lawyer-progress-summary-main > div:last-child {
    min-width: 0;
}

.lawyer-progress-summary-main span {
    display: block;

    margin-bottom: 4px;

    color: #3772e5;

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

    letter-spacing: 1px;
}

.lawyer-progress-summary-main strong {
    display: block;

    overflow: hidden;

    color: #334155;

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

    text-overflow: ellipsis;
    white-space: nowrap;
}

.lawyer-progress-summary-main small {
    display: block;

    margin-top: 4px;

    color: #94a3b8;

    font-size: 12px;
}

.lawyer-progress-summary-meta {
    display: flex;
    align-items: center;

    gap: 25px;
}

.lawyer-progress-summary-meta > div {
    min-width: 80px;
}

.lawyer-progress-summary-meta span {
    display: block;

    margin-bottom: 5px;

    color: #94a3b8;

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

.lawyer-progress-summary-meta strong {
    display: block;

    color: #475569;

    font-size: 8px;
}


/* =========================================================
   PENDING LABEL
========================================================= */

.lawyer-pending-label {
    display: inline-flex;
    align-items: center;

    gap: 5px;

    padding: 6px 9px;

    border-radius: 6px;

    background: #fff7ed;

    color: #c2410c;

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

.lawyer-pending-label i {
    font-size: 8px;
}


/* =========================================================
   FORM
========================================================= */

.lawyer-progress-form {
    display: grid;

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

    gap: 18px;

    padding: 20px;
}

.lawyer-form-group.full,
.lawyer-progress-actions.full,
.lawyer-progress-submit-info.full {
    grid-column: 1 / -1;
}

.lawyer-form-group label {
    display: block;

    margin-bottom: 7px;

    color: #475569;

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

.lawyer-form-input {
    position: relative;
}

.lawyer-form-input > i {
    position: absolute;

    top: 14px;
    left: 12px;

    z-index: 1;

    color: #94a3b8;

    font-size: 10px;
}

.lawyer-form-input input,
.lawyer-form-input textarea {
    width: 100%;

    box-sizing: border-box;

    border: 1px solid #dfe6ee;
    border-radius: 8px;

    outline: none;

    background: #ffffff;

    color: #475569;

    font-family: inherit;

    font-size: 8px;

    transition:
        border-color .2s ease,
        box-shadow .2s ease;
}

.lawyer-form-input input {
    height: 42px;

    padding: 0 12px 0 35px;
}

.lawyer-form-input textarea {
    min-height: 130px;

    padding: 12px 12px 12px 35px;

    resize: vertical;

    line-height: 1.6;
}

.lawyer-form-input input:focus,
.lawyer-form-input textarea:focus {
    border-color: #3772e5;

    box-shadow:
        0 0 0 3px rgba(55, 114, 229, .08);
}

.lawyer-form-group > small {
    display: block;

    margin-top: 6px;

    color: #94a3b8;

    font-size: 12px;
}


/* =========================================================
   SUBMIT INFO
========================================================= */

.lawyer-progress-submit-info {
    display: flex;
    align-items: flex-start;

    gap: 9px;

    padding: 12px;

    border: 1px solid #dbeafe;
    border-radius: 8px;

    background: #eff6ff;

    color: #64748b;

    font-size: 10px;

    line-height: 1.6;
}

.lawyer-progress-submit-info i {
    flex-shrink: 0;

    margin-top: 1px;

    color: #3772e5;

    font-size: 10px;
}

.lawyer-progress-submit-info strong {
    color: #3772e5;
}


/* =========================================================
   ACTIONS
========================================================= */

.lawyer-progress-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;

    gap: 9px;

    padding-top: 2px;
}

.lawyer-secondary-btn {
    height: 40px;

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

    gap: 6px;

    padding: 0 15px;

    border: 1px solid #dfe6ee;
    border-radius: 8px;

    background: #ffffff;

    color: #64748b;

    font-size: 8px;
    font-weight: 700;

    text-decoration: none;
}

.lawyer-secondary-btn:hover {
    background: #f8fafc;

    border-color: #cbd5e1;

    color: #334155;
}


/* =========================================================
   RECENT PROGRESS
========================================================= */

.lawyer-recent-progress-card {
    margin-top: 18px;
}

.lawyer-small-empty {
    padding: 30px 20px;
}

.lawyer-progress-history {
    padding: 5px 20px 15px;
}

.lawyer-progress-history-item {
    display: flex;

    gap: 13px;

    padding: 15px 0;

    border-bottom: 1px solid #edf1f5;
}

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

.lawyer-progress-history-date {
    width: 42px;
    height: 42px;

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

    flex-shrink: 0;

    border-radius: 9px;

    background: #eaf1ff;

    color: #3772e5;
}

.lawyer-progress-history-date strong {
    font-size: 11px;
    line-height: 1;
}

.lawyer-progress-history-date span {
    margin-top: 3px;

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

    text-transform: uppercase;
}

.lawyer-progress-history-content {
    flex: 1;

    min-width: 0;
}

.lawyer-progress-history-top {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 10px;
}

.lawyer-progress-history-top h3 {
    margin: 0;

    overflow: hidden;

    color: #334155;

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

    text-overflow: ellipsis;
    white-space: nowrap;
}

.lawyer-progress-status {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    flex-shrink: 0;

    padding: 5px 8px;

    border-radius: 5px;

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

    text-transform: capitalize;
}

.lawyer-progress-status.pending {
    background: #fff7ed;

    color: #c2410c;
}

.lawyer-progress-status.approved {
    background: #f0fdf4;

    color: #15803d;
}

.lawyer-progress-status.rejected {
    background: #fef2f2;

    color: #b91c1c;
}

.lawyer-progress-history-content > p {
    margin: 6px 0 8px;

    color: #64748b;

    font-size: 10px;

    line-height: 1.65;
}

.lawyer-progress-history-meta {
    display: flex;
    align-items: center;

    gap: 15px;
}

.lawyer-progress-history-meta span {
    display: inline-flex;
    align-items: center;

    gap: 5px;

    color: #94a3b8;

    font-size: 12px;
}

.lawyer-progress-history-meta i {
    color: #3772e5;

    font-size: 8px;
}


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

@media (max-width: 850px) {

    .lawyer-progress-summary {
        align-items: flex-start;

        flex-direction: column;
    }

    .lawyer-progress-summary-meta {
        width: 100%;

        justify-content: space-between;
    }

}


@media (max-width: 650px) {

    .lawyer-progress-form {
        grid-template-columns: 1fr;

        padding: 16px;
    }

    .lawyer-form-group.full,
    .lawyer-progress-actions.full,
    .lawyer-progress-submit-info.full {
        grid-column: auto;
    }

    .lawyer-progress-summary-meta {
        align-items: flex-start;

        flex-direction: column;

        gap: 12px;
    }

    .lawyer-progress-summary-meta > div {
        width: 100%;
    }

    .lawyer-progress-actions {
        flex-direction: column-reverse;

        align-items: stretch;
    }

    .lawyer-progress-actions .lawyer-primary-btn,
    .lawyer-progress-actions .lawyer-secondary-btn {
        width: 100%;
    }

    .lawyer-progress-history-top {
        align-items: flex-start;

        flex-direction: column;
    }

}

/* =========================================================
   LAWYER DASHBOARD
========================================================= */

.lawyer-dashboard-welcome {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;

    margin-bottom: 18px;
    padding: 20px 22px;

    border: 1px solid #e6ebf2;
    border-radius: 14px;

    background: #ffffff;

    box-shadow: 0 4px 18px rgba(15, 23, 42, .035);
}

.lawyer-dashboard-welcome > div:first-child > span {
    display: block;

    margin-bottom: 5px;

    color: #3772e5;

    font-size: 12px;
    font-weight: 800;
    letter-spacing: 1px;
}

.lawyer-dashboard-welcome h1 {
    margin: 0;

    color: #011837;

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

.lawyer-dashboard-welcome p {
    margin: 6px 0 0;

    color: #94a3b8;

    font-size: 10px;
}


/* =========================================================
   MINI PROFILE
========================================================= */

.lawyer-profile-mini {
    display: flex;
    align-items: center;

    gap: 9px;

    padding: 7px 10px;

    border: 1px solid #edf1f5;
    border-radius: 10px;

    background: #fafcff;
}

.lawyer-profile-mini .lawyer-avatar {
    width: 35px;
    height: 35px;

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

    border-radius: 9px;

    background: #011837;

    color: #ffffff;

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

.lawyer-profile-mini strong {
    display: block;

    color: #334155;

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

.lawyer-profile-mini span {
    display: block;

    max-width: 150px;
    margin-top: 3px;

    overflow: hidden;

    color: #94a3b8;

    font-size: 12px;

    text-overflow: ellipsis;
    white-space: nowrap;
}


/* =========================================================
   ALERT
========================================================= */

.lawyer-alert {
    display: flex;
    align-items: center;

    gap: 9px;

    margin-bottom: 16px;
    padding: 12px 14px;

    border-radius: 8px;

    font-size: 8px;
    line-height: 1.5;
}

.lawyer-alert i {
    font-size: 11px;
}

.lawyer-alert-error {
    border: 1px solid #fecaca;

    background: #fef2f2;

    color: #b91c1c;
}

.lawyer-alert-success {
    border: 1px solid #bbf7d0;

    background: #f0fdf4;

    color: #15803d;
}


/* =========================================================
   STAT GRID
========================================================= */

.lawyer-stat-grid {
    display: grid;

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

    gap: 14px;

    margin-bottom: 18px;
}


/* =========================================================
   STAT CARD
========================================================= */

.lawyer-stat-card {
    display: flex;
    align-items: center;

    gap: 12px;

    min-height: 82px;

    padding: 15px;

    border: 1px solid #e7ebf1;
    border-radius: 12px;

    background: #ffffff;

    box-shadow:
        0 4px 18px rgba(15, 23, 42, .035);

    transition:
        transform .2s ease,
        box-shadow .2s ease;
}

.lawyer-stat-card:hover {
    transform: translateY(-2px);

    box-shadow:
        0 8px 25px rgba(15, 23, 42, .07);
}


/* =========================================================
   STAT ICON
========================================================= */

.lawyer-stat-icon {
    width: 42px;
    height: 42px;

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

    flex-shrink: 0;

    border-radius: 10px;

    font-size: 14px;
}

.lawyer-stat-icon.blue {
    background: #eaf1ff;
    color: #3772e5;
}

.lawyer-stat-icon.green {
    background: #ecfdf5;
    color: #059669;
}

.lawyer-stat-icon.orange {
    background: #fff7ed;
    color: #ea580c;
}

.lawyer-stat-icon.purple {
    background: #f5f3ff;
    color: #7c3aed;
}


/* =========================================================
   STAT TEXT
========================================================= */

.lawyer-stat-card span {
    display: block;

    margin-bottom: 5px;

    color: #94a3b8;

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

    letter-spacing: .7px;
}

.lawyer-stat-card strong {
    display: block;

    color: #011837;

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

    line-height: 1;
}

.lawyer-stat-card small {
    display: block;

    margin-top: 5px;

    color: #94a3b8;

    font-size: 12px;
}


/* =========================================================
   DASHBOARD CARD
========================================================= */

.lawyer-dashboard-card {
    margin-bottom: 18px;

    border: 1px solid #e7ebf1;
    border-radius: 13px;

    background: #ffffff;

    box-shadow:
        0 4px 18px rgba(15, 23, 42, .035);

    overflow: hidden;
}


/* =========================================================
   CARD HEADER
========================================================= */

.lawyer-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 15px;

    padding: 17px 20px;

    border-bottom: 1px solid #edf1f5;
}

.lawyer-card-header span:first-child {
    display: block;

    margin-bottom: 4px;

    color: #3772e5;

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

    letter-spacing: .8px;
}

.lawyer-card-header h2 {
    margin: 0;

    color: #334155;

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

.lawyer-card-header > a {
    display: inline-flex;
    align-items: center;

    gap: 5px;

    color: #3772e5;

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

    text-decoration: none;
}

.lawyer-card-header > a:hover {
    color: #275fc7;
}


/* =========================================================
   TABLE
========================================================= */

.lawyer-table-wrapper {
    width: 100%;

    overflow-x: auto;
}

.lawyer-data-table {
    width: 100%;

    min-width: 900px;

    border-collapse: collapse;
}

.lawyer-data-table th {
    padding: 11px 16px;

    border-bottom: 1px solid #edf1f5;

    background: #fafbfc;

    color: #94a3b8;

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

    letter-spacing: .7px;

    text-align: left;

    white-space: nowrap;
}

.lawyer-data-table td {
    padding: 13px 16px;

    border-bottom: 1px solid #f1f5f9;

    color: #64748b;

    font-size: 10px;

    vertical-align: middle;
}

.lawyer-data-table tbody tr {
    transition: background .2s ease;
}

.lawyer-data-table tbody tr:hover {
    background: #fafcff;
}

.lawyer-data-table tbody tr:last-child td {
    border-bottom: 0;
}


/* =========================================================
   STUDENT
========================================================= */

.lawyer-student-table-info {
    display: flex;
    align-items: center;

    gap: 9px;
}

.lawyer-student-table-avatar {
    width: 34px;
    height: 34px;

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

    flex-shrink: 0;

    border-radius: 9px;

    background: #011837;

    color: #ffffff;

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

.lawyer-student-table-info strong {
    display: block;

    max-width: 170px;

    overflow: hidden;

    color: #334155;

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

    text-overflow: ellipsis;
    white-space: nowrap;
}

.lawyer-student-table-info small {
    display: block;

    margin-top: 3px;

    color: #94a3b8;

    font-size: 12px;
}


/* =========================================================
   INTERNSHIP
========================================================= */

.lawyer-internship-cell strong {
    display: block;

    max-width: 200px;

    overflow: hidden;

    color: #475569;

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

    text-overflow: ellipsis;
    white-space: nowrap;
}

.lawyer-internship-cell small {
    display: block;

    margin-top: 4px;

    color: #94a3b8;

    font-size: 12px;
}


/* =========================================================
   DATE
========================================================= */

.lawyer-table-date {
    display: inline-flex;
    align-items: center;

    gap: 5px;

    color: #64748b;

    font-size: 10px;

    white-space: nowrap;
}

.lawyer-table-date i {
    color: #3772e5;

    font-size: 8px;
}


/* =========================================================
   ACTIVITY PROGRESS
========================================================= */

.lawyer-activity-progress-count {
    display: flex;
    align-items: baseline;

    gap: 4px;
}

.lawyer-activity-progress-count strong {
    color: #334155;

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

.lawyer-activity-progress-count span {
    color: #94a3b8;

    font-size: 12px;
}

.lawyer-activity-progress > small {
    display: block;

    margin-top: 4px;

    color: #c2410c;

    font-size: 12px;
}


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

.lawyer-status {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    padding: 5px 8px;

    border-radius: 5px;

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

    white-space: nowrap;
}

.lawyer-status.active {
    background: #ecfdf5;

    color: #059669;
}

.lawyer-status.completed {
    background: #eff6ff;

    color: #2563eb;
}

.lawyer-status.cancelled {
    background: #fef2f2;

    color: #dc2626;
}


/* =========================================================
   TABLE ACTIONS
========================================================= */

.lawyer-table-actions {
    display: flex;
    align-items: center;

    gap: 5px;
}

.lawyer-table-action {
    width: 29px;
    height: 29px;

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

    border: 1px solid #e2e8f0;
    border-radius: 7px;

    background: #ffffff;

    color: #64748b;

    text-decoration: none;

    transition:
        background .2s ease,
        border-color .2s ease,
        color .2s ease,
        transform .2s ease;
}

.lawyer-table-action:hover {
    border-color: #3772e5;

    background: #eaf1ff;

    color: #3772e5;

    transform: translateY(-1px);
}


/* =========================================================
   EMPTY STATE
========================================================= */

.lawyer-empty-state {
    padding: 45px 20px;

    text-align: center;
}

.lawyer-empty-icon {
    width: 48px;
    height: 48px;

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

    margin: 0 auto 12px;

    border-radius: 12px;

    background: #eaf1ff;

    color: #3772e5;

    font-size: 17px;
}

.lawyer-empty-state h3 {
    margin: 0;

    color: #334155;

    font-size: 10px;
    font-weight: 750;
}

.lawyer-empty-state p {
    max-width: 380px;

    margin: 6px auto 0;

    color: #94a3b8;

    font-size: 10px;

    line-height: 1.6;
}

.lawyer-small-empty {
    padding: 30px 20px;
}


/* =========================================================
   RECENT ACTIVITY
========================================================= */

.lawyer-recent-card {
    margin-top: 18px;
}

.lawyer-recent-list {
    padding: 0 20px;
}

.lawyer-recent-item {
    display: flex;
    align-items: center;

    gap: 11px;

    padding: 13px 0;

    border-bottom: 1px solid #edf1f5;
}

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

.lawyer-recent-icon {
    width: 35px;
    height: 35px;

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

    flex-shrink: 0;

    border-radius: 9px;

    background: #eaf1ff;

    color: #3772e5;

    font-size: 10px;
}

.lawyer-recent-content {
    flex: 1;

    min-width: 0;
}

.lawyer-recent-content strong {
    display: block;

    overflow: hidden;

    color: #475569;

    font-size: 8px;
    font-weight: 700;

    text-overflow: ellipsis;
    white-space: nowrap;
}

.lawyer-recent-content span {
    display: block;

    margin-top: 3px;

    color: #94a3b8;

    font-size: 12px;
}

.lawyer-recent-right {
    display: flex;
    align-items: center;

    gap: 9px;
}

.lawyer-recent-right small {
    color: #94a3b8;

    font-size: 12px;
}


/* =========================================================
   PROGRESS STATUS
========================================================= */

.lawyer-progress-status {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    padding: 5px 8px;

    border-radius: 5px;

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

    text-transform: capitalize;
}

.lawyer-progress-status.pending {
    background: #fff7ed;
    color: #c2410c;
}

.lawyer-progress-status.approved {
    background: #ecfdf5;
    color: #059669;
}

.lawyer-progress-status.rejected {
    background: #fef2f2;
    color: #dc2626;
}


/* =========================================================
   COMPLETION OVERVIEW
========================================================= */

.lawyer-overview-card {
    margin-top: 18px;
}

.lawyer-progress-overview {
    display: flex;
    align-items: center;

    gap: 35px;

    padding: 22px 25px;
}


/* =========================================================
   PROGRESS CIRCLE
========================================================= */

.lawyer-progress-circle {
    --progress: 0%;

    width: 125px;
    height: 125px;

    position: relative;

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

    flex-shrink: 0;

    border-radius: 50%;

    background:
        conic-gradient(
            #3772e5 var(--progress),
            #eaf1ff 0
        );
}

.lawyer-progress-circle::before {
    content: "";

    position: absolute;

    width: 96px;
    height: 96px;

    border-radius: 50%;

    background: #ffffff;
}

.lawyer-progress-circle > div {
    position: relative;

    z-index: 1;

    text-align: center;
}

.lawyer-progress-circle strong {
    display: block;

    color: #011837;

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

.lawyer-progress-circle span {
    display: block;

    margin-top: 3px;

    color: #94a3b8;

    font-size: 12px;
}


/* =========================================================
   PROGRESS DETAILS
========================================================= */

.lawyer-progress-details {
    width: 100%;
    max-width: 350px;
}

.lawyer-progress-row {
    display: flex;
    align-items: center;
    justify-content: space-between;

    padding: 10px 0;

    border-bottom: 1px solid #edf1f5;
}

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

.lawyer-progress-row span {
    display: flex;
    align-items: center;

    gap: 7px;

    color: #64748b;

    font-size: 10px;
}

.lawyer-progress-row strong {
    color: #334155;

    font-size: 9px;
}

.lawyer-progress-row .dot {
    width: 7px;
    height: 7px;

    display: inline-block;

    border-radius: 50%;
}

.lawyer-progress-row .dot.completed {
    background: #2563eb;
}

.lawyer-progress-row .dot.active {
    background: #059669;
}

.lawyer-progress-row .dot.pending {
    background: #ea580c;
}


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

@media (max-width: 1100px) {

    .lawyer-stat-grid {
        grid-template-columns: repeat(2, 1fr);
    }

}


@media (max-width: 800px) {

    .lawyer-dashboard-welcome {
        align-items: flex-start;

        flex-direction: column;
    }

    .lawyer-profile-mini {
        width: 100%;

        box-sizing: border-box;
    }

    .lawyer-progress-overview {
        gap: 25px;
    }

}


@media (max-width: 650px) {

    .lawyer-stat-grid {
        grid-template-columns: 1fr;
    }

    .lawyer-dashboard-welcome {
        padding: 17px;
    }

    .lawyer-dashboard-welcome h1 {
        font-size: 16px;
    }

    .lawyer-card-header {
        align-items: flex-start;

        flex-direction: column;
    }

    .lawyer-progress-overview {
        align-items: center;

        flex-direction: column;

        padding: 20px;
    }

    .lawyer-progress-details {
        max-width: 100%;
    }

    .lawyer-recent-item {
        align-items: flex-start;
    }

    .lawyer-recent-right {
        align-items: flex-end;

        flex-direction: column;

        gap: 4px;
    }

}
/* =========================================================
   ASSIGNED INTERNSHIPS
========================================================= */

.lawyer-page-header-user {
    display: flex;
    align-items: center;
    gap: 9px;

    padding: 7px 10px;

    border: 1px solid #e7ebf1;
    border-radius: 10px;

    background: #ffffff;
}

.lawyer-page-header-avatar {
    width: 34px;
    height: 34px;

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

    border-radius: 9px;

    background: #011837;
    color: #ffffff;

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

.lawyer-page-header-user strong {
    display: block;

    color: #334155;

    font-size: 8px;
}

.lawyer-page-header-user span {
    display: block;

    margin-top: 3px;

    color: #94a3b8;

    font-size: 12px;
}


/* =========================================================
   FILTER
========================================================= */

.lawyer-filter-card {
    margin-bottom: 18px;
}

.lawyer-filter-form {
    display: flex;
    align-items: center;

    gap: 9px;

    padding: 15px 18px;
}

.lawyer-filter-search {
    position: relative;

    flex: 1;

    min-width: 180px;
}

.lawyer-filter-search i {
    position: absolute;

    top: 50%;
    left: 12px;

    transform: translateY(-50%);

    color: #94a3b8;

    font-size: 9px;
}

.lawyer-filter-search input {
    width: 100%;
    height: 39px;

    box-sizing: border-box;

    padding: 0 12px 0 32px;

    border: 1px solid #dfe6ee;
    border-radius: 8px;

    outline: none;

    color: #475569;

    background: #ffffff;

    font-family: inherit;

    font-size: 10px;
}

.lawyer-filter-search input:focus {
    border-color: #3772e5;

    box-shadow:
        0 0 0 3px rgba(55, 114, 229, .08);
}

.lawyer-filter-status select {
    height: 39px;

    min-width: 125px;

    padding: 0 28px 0 10px;

    border: 1px solid #dfe6ee;
    border-radius: 8px;

    outline: none;

    background: #ffffff;

    color: #475569;

    font-family: inherit;

    font-size: 10px;

    cursor: pointer;
}

.lawyer-filter-status select:focus {
    border-color: #3772e5;
}

.lawyer-filter-form .lawyer-primary-btn {
    height: 39px;

    white-space: nowrap;
}

.lawyer-filter-reset {
    height: 39px;

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

    gap: 5px;

    padding: 0 11px;

    border: 1px solid #e2e8f0;
    border-radius: 8px;

    color: #64748b;

    background: #ffffff;

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

    text-decoration: none;

    white-space: nowrap;
}

.lawyer-filter-reset:hover {
    background: #f8fafc;

    color: #3772e5;
}


/* =========================================================
   RESULT COUNT
========================================================= */

.lawyer-result-count {
    display: inline-flex;

    padding: 6px 9px;

    border-radius: 6px;

    background: #eaf1ff;

    color: #3772e5;

    font-size: 6px !important;
    font-weight: 800;
}


/* =========================================================
   CONTACT
========================================================= */

.lawyer-contact-cell {
    display: flex;
    flex-direction: column;

    gap: 5px;

    max-width: 180px;
}

.lawyer-contact-cell span {
    display: flex;
    align-items: center;

    gap: 5px;

    overflow: hidden;

    color: #64748b;

    font-size: 12px;

    text-overflow: ellipsis;
    white-space: nowrap;
}

.lawyer-contact-cell i {
    flex-shrink: 0;

    color: #3772e5;

    font-size: 8px;
}


/* =========================================================
   ASSIGNMENT PROGRESS
========================================================= */

.lawyer-assignment-progress > div {
    display: flex;
    align-items: baseline;

    gap: 4px;
}

.lawyer-assignment-progress strong {
    color: #334155;

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

.lawyer-assignment-progress span {
    color: #94a3b8;

    font-size: 12px;
}

.lawyer-assignment-progress small {
    display: block;

    margin-top: 3px;

    color: #c2410c;

    font-size: 12px;
}

.lawyer-assignment-progress small.rejected-count {
    color: #dc2626;
}


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

@media (max-width: 850px) {

    .lawyer-filter-form {
        align-items: stretch;

        flex-wrap: wrap;
    }

    .lawyer-filter-search {
        flex-basis: 100%;
    }

    .lawyer-filter-status {
        flex: 1;
    }

    .lawyer-filter-status select {
        width: 100%;
    }

    .lawyer-filter-form .lawyer-primary-btn {
        flex: 0 0 auto;
    }

}


@media (max-width: 600px) {

    .lawyer-page-header-user {
        width: 100%;

        box-sizing: border-box;
    }

    .lawyer-filter-form {
        flex-direction: column;
    }

    .lawyer-filter-search,
    .lawyer-filter-status,
    .lawyer-filter-form .lawyer-primary-btn,
    .lawyer-filter-reset {
        width: 100%;
    }

    .lawyer-filter-search {
        flex-basis: auto;
    }

    .lawyer-filter-form .lawyer-primary-btn {
        flex: none;
    }

}
/* =========================================================
   INTERNSHIP DETAILS
========================================================= */

.lawyer-back-link {
    display: inline-flex;
    align-items: center;
    gap: 5px;

    margin-bottom: 8px;

    color: #64748b;

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

    text-decoration: none;
}

.lawyer-back-link:hover {
    color: #3772e5;
}

.lawyer-page-kicker {
    display: block;

    margin-bottom: 4px;

    color: #3772e5;

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

    letter-spacing: .8px;
}

.lawyer-detail-header-actions {
    display: flex;
    align-items: center;

    gap: 10px;
}

.lawyer-detail-grid {
    display: grid;

    grid-template-columns:
        minmax(0, .9fr)
        minmax(0, 1.1fr);

    gap: 18px;

    margin-bottom: 18px;
}


/* =========================================================
   STUDENT PROFILE
========================================================= */

.lawyer-student-profile {
    display: flex;
    align-items: center;

    gap: 12px;

    padding: 18px 20px;

    border-bottom: 1px solid #edf1f5;
}

.lawyer-student-large-avatar {
    width: 52px;
    height: 52px;

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

    flex-shrink: 0;

    border-radius: 13px;

    background: #011837;

    color: #ffffff;

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

.lawyer-student-profile-main h3 {
    margin: 0;

    color: #334155;

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

.lawyer-student-profile-main span {
    display: block;

    margin-top: 4px;

    color: #94a3b8;

    font-size: 12px;
}


/* =========================================================
   DETAIL INFO
========================================================= */

.lawyer-detail-info-list {
    padding: 4px 20px 15px;
}

.lawyer-detail-info-item {
    display: flex;
    align-items: center;

    gap: 10px;

    padding: 11px 0;

    border-bottom: 1px solid #f1f5f9;
}

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

.lawyer-detail-info-icon {
    width: 31px;
    height: 31px;

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

    flex-shrink: 0;

    border-radius: 8px;

    background: #eaf1ff;

    color: #3772e5;

    font-size: 9px;
}

.lawyer-detail-info-item span {
    display: block;

    margin-bottom: 3px;

    color: #94a3b8;

    font-size: 12px;
}

.lawyer-detail-info-item strong {
    display: block;

    max-width: 260px;

    overflow: hidden;

    color: #475569;

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

    text-overflow: ellipsis;
    white-space: nowrap;
}


/* =========================================================
   INTERNSHIP BODY
========================================================= */

.lawyer-internship-detail-body {
    padding: 18px 20px 20px;
}

.lawyer-internship-title-box {
    display: flex;
    align-items: center;

    gap: 11px;

    margin-bottom: 18px;

    padding-bottom: 16px;

    border-bottom: 1px solid #edf1f5;
}

.lawyer-internship-title-icon {
    width: 42px;
    height: 42px;

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

    border-radius: 10px;

    background: #eaf1ff;

    color: #3772e5;

    font-size: 13px;
}

.lawyer-internship-title-box span {
    display: block;

    margin-bottom: 4px;

    color: #94a3b8;

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

    letter-spacing: .7px;
}

.lawyer-internship-title-box h3 {
    margin: 0;

    color: #334155;

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


/* =========================================================
   META
========================================================= */

.lawyer-detail-meta-grid {
    display: grid;

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

    gap: 1px;

    overflow: hidden;

    border: 1px solid #edf1f5;
    border-radius: 9px;

    background: #edf1f5;
}

.lawyer-detail-meta-grid > div {
    padding: 10px;

    background: #ffffff;
}

.lawyer-detail-meta-grid span {
    display: block;

    margin-bottom: 4px;

    color: #94a3b8;

    font-size: 12px;
}

.lawyer-detail-meta-grid strong {
    display: block;

    color: #475569;

    font-size: 10px;
    font-weight: 750;
}


/* =========================================================
   DESCRIPTION / REMARKS
========================================================= */

.lawyer-description-box,
.lawyer-remarks-box {
    margin-top: 14px;

    padding: 12px;

    border-radius: 8px;
}

.lawyer-description-box {
    background: #f8fafc;
}

.lawyer-remarks-box {
    background: #fff7ed;
}

.lawyer-description-box > span,
.lawyer-remarks-box > span {
    display: block;

    margin-bottom: 5px;

    color: #64748b;

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

    letter-spacing: .6px;
}

.lawyer-description-box p,
.lawyer-remarks-box p {
    margin: 0;

    color: #64748b;

    font-size: 10px;

    line-height: 1.7;
}


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

.lawyer-detail-stats {
    display: grid;

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

    gap: 1px;

    background: #edf1f5;
}

.lawyer-detail-stat {
    display: flex;
    align-items: center;

    gap: 9px;

    min-height: 76px;

    padding: 13px;

    background: #ffffff;
}

.lawyer-detail-stat-icon {
    width: 34px;
    height: 34px;

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

    flex-shrink: 0;

    border-radius: 8px;

    font-size: 10px;
}

.lawyer-detail-stat-icon.blue {
    background: #eaf1ff;
    color: #3772e5;
}

.lawyer-detail-stat-icon.green {
    background: #ecfdf5;
    color: #059669;
}

.lawyer-detail-stat-icon.orange {
    background: #fff7ed;
    color: #ea580c;
}

.lawyer-detail-stat-icon.red {
    background: #fef2f2;
    color: #dc2626;
}

.lawyer-detail-stat-icon.purple {
    background: #f5f3ff;
    color: #7c3aed;
}

.lawyer-detail-stat span {
    display: block;

    margin-bottom: 4px;

    color: #94a3b8;

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

.lawyer-detail-stat strong {
    color: #334155;

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


/* =========================================================
   PROGRESS HISTORY
========================================================= */

.lawyer-progress-history {
    padding: 5px 22px 15px;
}

.lawyer-progress-history-item {
    display: flex;

    gap: 12px;
}

.lawyer-progress-timeline {
    position: relative;

    width: 24px;

    display: flex;
    justify-content: center;

    flex-shrink: 0;
}

.lawyer-progress-dot {
    width: 23px;
    height: 23px;

    position: relative;
    z-index: 2;

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

    border-radius: 50%;

    font-size: 10px;
}

.lawyer-progress-dot.approved {
    background: #ecfdf5;
    color: #059669;
}

.lawyer-progress-dot.pending {
    background: #fff7ed;
    color: #ea580c;
}

.lawyer-progress-dot.rejected {
    background: #fef2f2;
    color: #dc2626;
}

.lawyer-progress-line {
    position: absolute;

    top: 23px;
    bottom: -13px;

    width: 1px;

    background: #e2e8f0;
}

.lawyer-progress-history-content {
    flex: 1;

    min-width: 0;

    margin-bottom: 13px;

    padding: 13px;

    border: 1px solid #edf1f5;
    border-radius: 9px;

    background: #ffffff;
}

.lawyer-progress-history-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;

    gap: 12px;
}

.lawyer-progress-history-top h3 {
    margin: 0 0 5px;

    color: #334155;

    font-size: 9px;
    font-weight: 750;
}

.lawyer-progress-history-top span:not(.lawyer-progress-status) {
    display: flex;
    align-items: center;

    gap: 4px;

    color: #94a3b8;

    font-size: 12px;
}

.lawyer-progress-history-content > p {
    margin: 10px 0;

    color: #64748b;

    font-size: 10px;

    line-height: 1.65;
}

.lawyer-progress-history-meta {
    display: flex;
    align-items: center;

    gap: 12px;

    padding-top: 9px;

    border-top: 1px solid #f1f5f9;
}

.lawyer-progress-history-meta span {
    display: inline-flex;
    align-items: center;

    gap: 4px;

    color: #94a3b8;

    font-size: 12px;
}


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

.lawyer-secondary-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    gap: 6px;

    margin-top: 12px;

    padding: 8px 12px;

    border: 1px solid #dfe6ee;
    border-radius: 7px;

    background: #ffffff;

    color: #64748b;

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

    text-decoration: none;
}

.lawyer-secondary-btn:hover {
    border-color: #3772e5;

    background: #eaf1ff;

    color: #3772e5;
}


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

@media (max-width: 1100px) {

    .lawyer-detail-grid {
        grid-template-columns: 1fr;
    }

    .lawyer-detail-stats {
        grid-template-columns:
            repeat(3, 1fr);
    }

}


@media (max-width: 700px) {

    .lawyer-page-header {
        align-items: flex-start;

        flex-direction: column;
    }

    .lawyer-detail-header-actions {
        width: 100%;
    }

    .lawyer-detail-header-actions .lawyer-primary-btn {
        flex: 1;
    }

    .lawyer-detail-meta-grid {
        grid-template-columns: 1fr;
    }

    .lawyer-detail-stats {
        grid-template-columns:
            repeat(2, 1fr);
    }

    .lawyer-progress-history-top {
        flex-direction: column;
    }

}


@media (max-width: 480px) {

    .lawyer-detail-stats {
        grid-template-columns: 1fr;
    }

    .lawyer-student-profile {
        padding: 15px;
    }

    .lawyer-internship-detail-body {
        padding: 15px;
    }

    .lawyer-progress-history {
        padding-left: 13px;
        padding-right: 13px;
    }

}

/* =========================================================
   UPDATE PROGRESS
========================================================= */

.lawyer-progress-student-card {
    margin-bottom: 18px;
}

.lawyer-progress-student-summary {
    display: flex;
    align-items: center;

    gap: 12px;

    padding: 15px 20px;
}

.lawyer-progress-student-avatar {
    width: 45px;
    height: 45px;

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

    flex-shrink: 0;

    border-radius: 11px;

    background: #011837;
    color: #ffffff;

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

.lawyer-progress-student-info {
    flex: 1;
}

.lawyer-progress-student-info > span {
    display: block;

    margin-bottom: 3px;

    color: #3772e5;

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

    letter-spacing: .7px;
}

.lawyer-progress-student-info h2 {
    margin: 0;

    color: #334155;

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

.lawyer-progress-student-info p {
    margin: 4px 0 0;

    color: #94a3b8;

    font-size: 10px;
}

.lawyer-progress-student-info p strong {
    color: #64748b;
}

.lawyer-progress-student-id {
    padding: 8px 11px;

    border-radius: 7px;

    background: #f8fafc;

    text-align: right;
}

.lawyer-progress-student-id span {
    display: block;

    margin-bottom: 3px;

    color: #94a3b8;

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

.lawyer-progress-student-id strong {
    color: #475569;

    font-size: 8px;
}


/* =========================================================
   FORM LAYOUT
========================================================= */

.lawyer-progress-form-layout {
    display: grid;

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

    gap: 18px;

    align-items: start;
}

.lawyer-progress-form {
    padding: 20px;
}


/* =========================================================
   FORM GROUP
========================================================= */

.lawyer-form-group {
    margin-bottom: 17px;
}

.lawyer-form-group label {
    display: block;

    margin-bottom: 7px;

    color: #475569;

    font-size: 10px;
    font-weight: 750;
}

.lawyer-form-group label sup {
    color: #dc2626;

    font-size: 8px;
}

.lawyer-form-group input,
.lawyer-form-group textarea,
.lawyer-form-group select {
    width: 100%;

    box-sizing: border-box;

    border: 1px solid #dfe6ee;
    border-radius: 8px;

    outline: none;

    background: #ffffff;

    color: #475569;

    font-family: inherit;

    font-size: 10px;

    transition:
        border-color .2s ease,
        box-shadow .2s ease;
}

.lawyer-form-group input,
.lawyer-form-group select {
    height: 40px;

    padding: 0 11px;
}

.lawyer-form-group textarea {
    min-height: 125px;

    padding: 10px 11px;

    line-height: 1.6;

    resize: vertical;
}

.lawyer-form-group input:focus,
.lawyer-form-group textarea:focus,
.lawyer-form-group select:focus {
    border-color: #3772e5;

    box-shadow:
        0 0 0 3px rgba(55, 114, 229, .08);
}

.lawyer-form-group small {
    display: block;

    margin-top: 5px;

    color: #94a3b8;

    font-size: 10px;

    line-height: 1.5;
}


/* =========================================================
   FORM ROW
========================================================= */

.lawyer-form-row {
    display: grid;

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

    gap: 12px;
}


/* =========================================================
   INPUT ICON
========================================================= */

.lawyer-input-icon {
    position: relative;
}

.lawyer-input-icon i {
    position: absolute;

    top: 50%;
    left: 11px;

    z-index: 2;

    transform: translateY(-50%);

    color: #3772e5;

    font-size: 8px;

    pointer-events: none;
}

.lawyer-input-icon input {
    padding-left: 30px;
}


/* =========================================================
   STATUS INFO
========================================================= */

.lawyer-progress-status-info {
    display: flex;

    gap: 9px;

    margin: 5px 0 18px;

    padding: 11px;

    border: 1px solid #dbeafe;
    border-radius: 8px;

    background: #eff6ff;
}

.lawyer-progress-status-info-icon {
    width: 25px;
    height: 25px;

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

    flex-shrink: 0;

    border-radius: 7px;

    background: #dbeafe;

    color: #2563eb;

    font-size: 12px;
}

.lawyer-progress-status-info strong {
    display: block;

    margin-bottom: 3px;

    color: #1e40af;

    font-size: 10px;
}

.lawyer-progress-status-info p {
    margin: 0;

    color: #64748b;

    font-size: 12px;

    line-height: 1.5;
}


/* =========================================================
   FORM ACTIONS
========================================================= */

.lawyer-form-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;

    gap: 8px;

    padding-top: 15px;

    border-top: 1px solid #edf1f5;
}

.lawyer-form-actions .lawyer-secondary-btn {
    margin-top: 0;
}

.lawyer-primary-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    gap: 6px;

    min-height: 39px;

    padding: 0 14px;

    border: 0;
    border-radius: 8px;

    background: #3772e5;

    color: #ffffff;

    font-family: inherit;

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

    text-decoration: none;

    cursor: pointer;

    transition:
        background .2s ease,
        transform .2s ease,
        box-shadow .2s ease;
}

.lawyer-primary-btn:hover {
    background: #2f64ce;

    color: #ffffff;

    transform: translateY(-1px);

    box-shadow:
        0 5px 14px rgba(55, 114, 229, .2);
}


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

.lawyer-progress-help-card {
    margin-bottom: 18px;
}

.lawyer-progress-help-list {
    padding: 8px 16px 14px;
}

.lawyer-progress-help-list > div {
    display: flex;

    gap: 8px;

    padding: 10px 0;

    border-bottom: 1px solid #f1f5f9;
}

.lawyer-progress-help-list > div:last-child {
    border-bottom: 0;
}

.lawyer-progress-help-list > div > div {
    width: 23px;
    height: 23px;

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

    flex-shrink: 0;

    color: #3772e5;

    font-size: 10px;
}

.lawyer-progress-help-list p {
    margin: 2px 0 0;

    color: #64748b;

    font-size: 12px;

    line-height: 1.6;
}


/* =========================================================
   CURRENT STATUS
========================================================= */

.lawyer-current-status-card {
    margin-bottom: 18px;
}

.lawyer-current-status-body {
    padding: 17px;
}

.lawyer-current-status-body > p {
    margin: 10px 0 0;

    color: #94a3b8;

    font-size: 12px;
}

.lawyer-current-status-body > p strong {
    color: #475569;
}


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

@media (max-width: 900px) {

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

}


@media (max-width: 650px) {

    .lawyer-progress-student-summary {
        align-items: flex-start;

        flex-wrap: wrap;
    }

    .lawyer-progress-student-id {
        width: 100%;

        box-sizing: border-box;

        text-align: left;
    }

    .lawyer-form-row {
        grid-template-columns: 1fr;
    }

    .lawyer-form-actions {
        flex-direction: column-reverse;

        align-items: stretch;
    }

    .lawyer-form-actions .lawyer-primary-btn,
    .lawyer-form-actions .lawyer-secondary-btn {
        width: 100%;
        box-sizing: border-box;
    }

}

/* =========================================================
   ASSIGNED INTERNSHIPS
========================================================= */

.lawyer-page-kicker {
    display: block;
    margin-bottom: 5px;

    color: #3772E5;

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

    letter-spacing: 0.8px;
    text-transform: uppercase;
}


/* =========================================================
   PAGE HEADER COUNT
========================================================= */

.lawyer-page-header-count {
    min-width: 85px;

    padding: 10px 14px;

    border: 1px solid #E5EAF1;
    border-radius: 10px;

    background: #FFFFFF;

    text-align: center;
}

.lawyer-page-header-count span {
    display: block;

    margin-bottom: 4px;

    color: #94A3B8;

    font-size: 10px;
    font-weight: 800;
    letter-spacing: .5px;
}

.lawyer-page-header-count strong {
    display: block;

    color: #011837;

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


/* =========================================================
   STATISTICS
========================================================= */

.lawyer-dashboard-stats {
    display: grid;

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

    gap: 14px;

    margin-bottom: 18px;
}

.lawyer-stat-card {
    display: flex;
    align-items: center;

    gap: 11px;

    min-height: 76px;

    padding: 14px;

    border: 1px solid #E8EDF3;
    border-radius: 11px;

    background: #FFFFFF;

    box-sizing: border-box;

    transition:
        transform .2s ease,
        box-shadow .2s ease;
}

.lawyer-stat-card:hover {
    transform: translateY(-2px);

    box-shadow:
        0 8px 22px rgba(1, 24, 55, .07);
}

.lawyer-stat-icon {
    width: 37px;
    height: 37px;

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

    flex-shrink: 0;

    border-radius: 9px;

    font-size: 11px;
}

.lawyer-stat-icon.blue {
    background: #EAF1FF;
    color: #3772E5;
}

.lawyer-stat-icon.green {
    background: #ECFDF5;
    color: #059669;
}

.lawyer-stat-icon.purple {
    background: #F5F3FF;
    color: #7C3AED;
}

.lawyer-stat-icon.red {
    background: #FEF2F2;
    color: #DC2626;
}

.lawyer-stat-card span {
    display: block;

    margin-bottom: 4px;

    color: #94A3B8;

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

    text-transform: uppercase;
}

.lawyer-stat-card strong {
    display: block;

    color: #334155;

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


/* =========================================================
   FILTER CARD
========================================================= */

.lawyer-filter-card {
    margin-bottom: 18px;
}

.lawyer-filter-form {
    display: flex;
    align-items: flex-end;

    gap: 11px;

    padding: 17px 19px;
}

.lawyer-filter-field {
    flex: 1;

    min-width: 180px;
}

.lawyer-filter-field label {
    display: block;

    margin-bottom: 6px;

    color: #475569;

    font-size: 10px;
    font-weight: 750;
}

.lawyer-filter-field input,
.lawyer-filter-field select {
    width: 100%;
    height: 39px;

    box-sizing: border-box;

    padding: 0 11px;

    border: 1px solid #DDE4EC;
    border-radius: 8px;

    outline: none;

    background: #FFFFFF;

    color: #475569;

    font-family: inherit;

    font-size: 10px;
}

.lawyer-filter-field input:focus,
.lawyer-filter-field select:focus {
    border-color: #3772E5;

    box-shadow:
        0 0 0 3px rgba(55, 114, 229, .08);
}


/* =========================================================
   SEARCH INPUT
========================================================= */

.lawyer-input-with-icon {
    position: relative;
}

.lawyer-input-with-icon i {
    position: absolute;

    top: 50%;
    left: 11px;

    transform: translateY(-50%);

    color: #94A3B8;

    font-size: 9px;

    pointer-events: none;
}

.lawyer-input-with-icon input {
    padding-left: 31px;
}


/* =========================================================
   FILTER ACTIONS
========================================================= */

.lawyer-filter-actions {
    display: flex;
    align-items: center;

    gap: 7px;

    flex-shrink: 0;
}

.lawyer-filter-actions .lawyer-primary-btn {
    min-height: 39px;
}

.lawyer-filter-actions .lawyer-secondary-btn {
    margin-top: 0;
    min-height: 39px;

    box-sizing: border-box;
}


/* =========================================================
   RESULT COUNT
========================================================= */

.lawyer-result-count {
    display: inline-flex;
    align-items: center;

    padding: 6px 9px;

    border-radius: 6px;

    background: #EAF1FF;

    color: #3772E5;

    font-size: 6px !important;
    font-weight: 800;
}


/* =========================================================
   TABLE
========================================================= */

.lawyer-table-wrapper {
    width: 100%;

    overflow-x: auto;

    -webkit-overflow-scrolling: touch;
}

.lawyer-table {
    width: 100%;

    border-collapse: collapse;

    min-width: 900px;
}

.lawyer-table thead th {
    padding: 11px 14px;

    border-bottom: 1px solid #E8EDF3;

    background: #F8FAFC;

    color: #94A3B8;

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

    letter-spacing: .5px;

    text-align: left;

    white-space: nowrap;
}

.lawyer-table tbody td {
    padding: 13px 14px;

    border-bottom: 1px solid #F0F3F6;

    vertical-align: middle;

    color: #64748B;

    font-size: 10px;
}

.lawyer-table tbody tr {
    transition: background .15s ease;
}

.lawyer-table tbody tr:hover {
    background: #FBFCFE;
}

.lawyer-table tbody tr:last-child td {
    border-bottom: 0;
}


/* =========================================================
   STUDENT
========================================================= */

.lawyer-student-cell {
    display: flex;
    align-items: center;

    gap: 9px;

    min-width: 165px;
}

.lawyer-avatar {
    width: 34px;
    height: 34px;

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

    flex-shrink: 0;

    border-radius: 9px;

    background: #011837;

    color: #FFFFFF;

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

.lawyer-student-info {
    min-width: 0;
}

.lawyer-student-info strong {
    display: block;

    max-width: 170px;

    overflow: hidden;

    color: #334155;

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

    text-overflow: ellipsis;
    white-space: nowrap;
}

.lawyer-student-info small {
    display: block;

    margin-top: 3px;

    color: #94A3B8;

    font-size: 10px;
}


/* =========================================================
   CONTACT
========================================================= */

.lawyer-contact-cell {
    display: flex;
    flex-direction: column;

    gap: 5px;

    min-width: 155px;
}

.lawyer-contact-cell span {
    display: flex;
    align-items: center;

    gap: 5px;

    max-width: 190px;

    overflow: hidden;

    color: #64748B;

    font-size: 10px;

    text-overflow: ellipsis;
    white-space: nowrap;
}

.lawyer-contact-cell i {
    flex-shrink: 0;

    color: #3772E5;

    font-size: 8px;
}


/* =========================================================
   INTERNSHIP
========================================================= */

.lawyer-internship-cell {
    display: flex;
    flex-direction: column;

    gap: 4px;
}

.lawyer-internship-cell strong {
    color: #475569;

    font-size: 10px;
    font-weight: 750;
}

.lawyer-internship-cell small {
    color: #94A3B8;

    font-size: 10px;
}


/* =========================================================
   DATE
========================================================= */

.lawyer-date-cell {
    display: flex;
    align-items: center;

    gap: 5px;

    white-space: nowrap;
}

.lawyer-date-cell span {
    color: #64748B;

    font-size: 10px;
}

.lawyer-date-cell i {
    color: #CBD5E1;

    font-size: 10px;
}


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

.lawyer-status {
    display: inline-flex;
    align-items: center;

    padding: 5px 8px;

    border-radius: 5px;

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

    white-space: nowrap;
}

.lawyer-status.active {
    background: #ECFDF5;
    color: #059669;
}

.lawyer-status.completed {
    background: #EEF2FF;
    color: #4F46E5;
}

.lawyer-status.cancelled {
    background: #FEF2F2;
    color: #DC2626;
}


/* =========================================================
   ACTION BUTTONS
========================================================= */

.lawyer-table-actions {
    display: flex;
    align-items: center;

    gap: 5px;
}

.lawyer-action-btn {
    width: 29px;
    height: 29px;

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

    border-radius: 7px;

    text-decoration: none;

    font-size: 8px;

    transition:
        background .2s ease,
        color .2s ease,
        transform .2s ease;
}

.lawyer-action-btn:hover {
    transform: translateY(-1px);
}

.lawyer-action-btn.view {
    background: #EAF1FF;
    color: #3772E5;
}

.lawyer-action-btn.view:hover {
    background: #3772E5;
    color: #FFFFFF;
}

.lawyer-action-btn.edit {
    background: #ECFDF5;
    color: #059669;
}

.lawyer-action-btn.edit:hover {
    background: #059669;
    color: #FFFFFF;
}


/* =========================================================
   EMPTY STATE
========================================================= */

.lawyer-empty-state {
    padding: 55px 20px;

    text-align: center;
}

.lawyer-empty-icon {
    width: 50px;
    height: 50px;

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

    margin: 0 auto 12px;

    border-radius: 12px;

    background: #F1F5F9;

    color: #94A3B8;

    font-size: 18px;
}

.lawyer-empty-state h3 {
    margin: 0 0 5px;

    color: #475569;

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

.lawyer-empty-state p {
    margin: 0;

    color: #94A3B8;

    font-size: 10px;
}


/* =========================================================
   ALERT
========================================================= */

.lawyer-alert {
    display: flex;
    align-items: flex-start;

    gap: 8px;

    margin-bottom: 17px;

    padding: 11px 13px;

    border-radius: 8px;

    font-size: 10px;

    line-height: 1.5;
}

.lawyer-alert-error {
    border: 1px solid #FECACA;

    background: #FEF2F2;

    color: #B91C1C;
}

.lawyer-alert i {
    margin-top: 1px;

    font-size: 9px;
}


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

.lawyer-primary-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    gap: 6px;

    min-height: 39px;

    padding: 0 13px;

    border: 0;
    border-radius: 8px;

    background: #3772E5;

    color: #FFFFFF;

    font-family: inherit;

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

    text-decoration: none;

    cursor: pointer;

    white-space: nowrap;

    transition:
        background .2s ease,
        transform .2s ease,
        box-shadow .2s ease;
}

.lawyer-primary-btn:hover {
    background: #2F64CE;

    color: #FFFFFF;

    transform: translateY(-1px);

    box-shadow:
        0 5px 14px rgba(55, 114, 229, .2);
}


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

.lawyer-secondary-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    gap: 5px;

    padding: 0 11px;

    border: 1px solid #DDE4EC;
    border-radius: 8px;

    background: #FFFFFF;

    color: #64748B;

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

    text-decoration: none;

    white-space: nowrap;
}

.lawyer-secondary-btn:hover {
    border-color: #3772E5;

    background: #EAF1FF;

    color: #3772E5;
}


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

@media (max-width: 1100px) {

    .lawyer-dashboard-stats {
        grid-template-columns: repeat(2, 1fr);
    }

    .lawyer-filter-form {
        flex-wrap: wrap;
    }

    .lawyer-filter-field {
        min-width: calc(50% - 8px);
    }

    .lawyer-filter-actions {
        width: 100%;
    }

}


@media (max-width: 700px) {

    .lawyer-dashboard-stats {
        grid-template-columns: 1fr 1fr;
    }

    .lawyer-page-header-count {
        display: none;
    }

    .lawyer-filter-form {
        flex-direction: column;
        align-items: stretch;
    }

    .lawyer-filter-field {
        width: 100%;
        min-width: 0;
    }

    .lawyer-filter-actions {
        width: 100%;
    }

    .lawyer-filter-actions .lawyer-primary-btn,
    .lawyer-filter-actions .lawyer-secondary-btn {
        flex: 1;
    }

}


@media (max-width: 480px) {

    .lawyer-dashboard-stats {
        grid-template-columns: 1fr;
    }

    .lawyer-stat-card {
        min-height: 68px;
    }

    .lawyer-table {
        min-width: 850px;
    }

}

/* =========================================================
   LAWYER PROFILE VERIFICATION
========================================================= */

.lawyer-verification-page {
    width: 100%;
}


/* =========================================================
   PAGE HEADING
========================================================= */

.lawyer-verification-page .verification-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;

    margin-bottom: 25px;
}

.lawyer-verification-page .verification-breadcrumb {
    display: flex;
    align-items: center;
    gap: 7px;

    margin-bottom: 7px;

    color: #94a3b8;

    font-size: 11px;
}

.lawyer-verification-page .verification-breadcrumb i {
    font-size: 9px;
    color: #cbd5e1;
}

.lawyer-verification-page .verification-breadcrumb strong {
    color: #3772e5;
}

.lawyer-verification-page .verification-heading h1 {
    margin: 0 0 6px;

    color: #011837;

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

.lawyer-verification-page .verification-heading p {
    margin: 0;

    color: #64748b;

    font-size: 13px;
}


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

.lawyer-verification-page .verification-grid {
    display: grid;

    grid-template-columns: minmax(0, 1.5fr) minmax(300px, .8fr);

    gap: 22px;

    align-items: start;
}


/* =========================================================
   CARD
========================================================= */

.lawyer-verification-page .verification-card {
    overflow: hidden;

    border: 1px solid #e4eaf1;

    border-radius: 14px;

    background: #ffffff;

    box-shadow:
        0 3px 12px rgba(1, 24, 55, .04);
}

.lawyer-verification-page .verification-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 15px;

    padding: 18px 20px;

    border-bottom: 1px solid #edf1f5;
}

.lawyer-verification-page .verification-card-header h3 {
    margin: 0 0 4px;

    color: #011837;

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

.lawyer-verification-page .verification-card-header p {
    margin: 0;

    color: #94a3b8;

    font-size: 11px;
}


/* =========================================================
   PRICE
========================================================= */

.lawyer-verification-page .verification-price {
    padding: 8px 13px;

    border-radius: 8px;

    background: #eaf1ff;

    color: #3772e5;

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

    white-space: nowrap;
}


/* =========================================================
   QR SECTION
========================================================= */

.lawyer-verification-page .qr-section {
    padding: 25px 20px 22px;

    text-align: center;
}

.lawyer-verification-page .qr-title {
    display: flex;
    align-items: center;
    justify-content: center;

    gap: 8px;

    color: #011837;

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

.lawyer-verification-page .qr-title i {
    color: #3772e5;

    font-size: 20px;
}

.lawyer-verification-page .qr-description {
    max-width: 450px;

    margin: 8px auto 20px;

    color: #64748b;

    font-size: 12px;

    line-height: 1.6;
}


/* =========================================================
   QR BOX
========================================================= */

.lawyer-verification-page .qr-box {
    width: 290px;
    max-width: 100%;

    margin: 0 auto;

    padding: 13px;

    border: 1px solid #e1e7ef;

    border-radius: 15px;

    background: #ffffff;

    box-shadow:
        0 8px 25px rgba(1, 24, 55, .08);
}

.lawyer-verification-page .qr-box img {
    display: block;

    width: 100%;
    height: auto;

    border-radius: 8px;
}


/* =========================================================
   UPI DETAILS
========================================================= */

.lawyer-verification-page .upi-details {
    display: flex;
    align-items: center;
    justify-content: center;

    flex-wrap: wrap;

    gap: 7px;

    margin: 18px auto 0;

    padding: 11px 15px;

    max-width: 430px;

    border: 1px solid #e7edf4;

    border-radius: 8px;

    background: #f8fafc;
}

.lawyer-verification-page .upi-details span {
    color: #94a3b8;

    font-size: 11px;
}

.lawyer-verification-page .upi-details strong {
    color: #334155;

    font-size: 12px;
}


/* =========================================================
   PAYMENT AMOUNT
========================================================= */

.lawyer-verification-page .payment-amount {
    display: flex;
    align-items: center;
    justify-content: space-between;

    max-width: 430px;

    margin: 10px auto 0;

    padding: 13px 15px;

    border-radius: 9px;

    background: #f8fafc;
}

.lawyer-verification-page .payment-amount span {
    color: #64748b;

    font-size: 12px;
}

.lawyer-verification-page .payment-amount strong {
    color: #011837;

    font-size: 18px;
    font-weight: 750;
}


/* =========================================================
   PAYMENT INSTRUCTIONS
========================================================= */

.lawyer-verification-page .payment-instructions {
    padding: 20px;

    border-top: 1px solid #edf1f5;

    background: #fbfcfe;
}

.lawyer-verification-page .payment-instructions h4 {
    display: flex;
    align-items: center;

    gap: 8px;

    margin: 0 0 17px;

    color: #334155;

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

.lawyer-verification-page .payment-instructions h4 i {
    color: #3772e5;
}

.lawyer-verification-page .instruction-item {
    display: flex;
    align-items: flex-start;

    gap: 12px;

    margin-bottom: 14px;
}

.lawyer-verification-page .instruction-item:last-child {
    margin-bottom: 0;
}

.lawyer-verification-page .instruction-item > span {
    width: 27px;
    height: 27px;

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

    flex: 0 0 27px;

    border-radius: 50%;

    background: #eaf1ff;

    color: #3772e5;

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

.lawyer-verification-page .instruction-item p {
    margin: 3px 0 0;

    color: #64748b;

    font-size: 11px;

    line-height: 1.6;
}

.lawyer-verification-page .instruction-item strong {
    color: #334155;
}


/* =========================================================
   WHATSAPP SECTION
========================================================= */

.lawyer-verification-page .whatsapp-section {
    padding: 20px;

    text-align: center;

    border-top: 1px solid #edf1f5;
}

.lawyer-verification-page .whatsapp-button {
    display: flex;
    align-items: center;
    justify-content: center;

    gap: 8px;

    width: 100%;

    min-height: 46px;

    padding: 11px 16px;

    border-radius: 9px;

    background: #128c7e;

    color: #ffffff;

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

    text-decoration: none;

    transition:
        transform .2s ease,
        background .2s ease,
        box-shadow .2s ease;
}

.lawyer-verification-page .whatsapp-button:hover {
    background: #0d796d;

    color: #ffffff;

    transform: translateY(-1px);

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

.lawyer-verification-page .whatsapp-button i {
    font-size: 18px;
}

.lawyer-verification-page .whatsapp-section > p {
    margin: 9px 0 0;

    color: #94a3b8;

    font-size: 10px;
}

.lawyer-verification-page .whatsapp-section > p strong {
    color: #475569;
}


/* =========================================================
   LAWYER PROFILE
========================================================= */

.lawyer-verification-page .lawyer-profile-summary {
    padding: 25px 20px;
}

.lawyer-verification-page .lawyer-avatar {
    width: 72px;
    height: 72px;

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

    margin: 0 auto 13px;

    border-radius: 50%;

    background: #eaf1ff;

    border: 4px solid #f5f8fc;

    color: #3772e5;

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

.lawyer-verification-page .lawyer-profile-summary > h3 {
    margin: 0;

    color: #011837;

    font-size: 17px;
    font-weight: 700;

    text-align: center;

    word-break: break-word;
}

.lawyer-verification-page .lawyer-id {
    display: block;

    margin-top: 5px;

    color: #94a3b8;

    font-size: 10px;

    text-align: center;
}


/* =========================================================
   PROFILE INFO
========================================================= */

.lawyer-verification-page .profile-info-list {
    margin-top: 22px;

    padding-top: 7px;

    border-top: 1px solid #edf1f5;
}

.lawyer-verification-page .profile-info-list > div {
    display: flex;
    align-items: flex-start;

    gap: 11px;

    padding: 13px 0;

    border-bottom: 1px solid #f0f3f6;
}

.lawyer-verification-page .profile-info-list > div:last-child {
    border-bottom: 0;
}

.lawyer-verification-page .profile-info-list > div > i {
    flex: 0 0 18px;

    margin-top: 3px;

    color: #3772e5;

    font-size: 14px;
}

.lawyer-verification-page .profile-info-list section {
    min-width: 0;
}

.lawyer-verification-page .profile-info-list label {
    display: block;

    margin-bottom: 3px;

    color: #94a3b8;

    font-size: 10px;
    font-weight: 600;
}

.lawyer-verification-page .profile-info-list span {
    display: block;

    color: #475569;

    font-size: 11px;

    line-height: 1.5;

    word-break: break-word;
}


/* =========================================================
   VERIFICATION NOTE
========================================================= */

.lawyer-verification-page .verification-note {
    display: flex;
    align-items: flex-start;

    gap: 12px;

    margin-top: 18px;

    padding: 16px;

    border: 1px solid #fde7b2;

    border-radius: 10px;

    background: #fffbeb;
}

.lawyer-verification-page .verification-note > i {
    flex: 0 0 18px;

    margin-top: 2px;

    color: #d97706;

    font-size: 16px;
}

.lawyer-verification-page .verification-note strong {
    color: #92400e;

    font-size: 11px;
}

.lawyer-verification-page .verification-note p {
    margin: 4px 0 0;

    color: #92400e;

    font-size: 10px;

    line-height: 1.65;
}


/* =========================================================
   RESPONSIVE - 1100
========================================================= */

@media (max-width: 1100px) {

    .lawyer-verification-page .verification-grid {
        grid-template-columns: 1fr;
    }

}


/* =========================================================
   RESPONSIVE - 768
========================================================= */

@media (max-width: 768px) {

    .lawyer-verification-page .verification-heading h1 {
        font-size: 21px;
    }

    .lawyer-verification-page .verification-card-header {
        padding: 15px;
    }

    .lawyer-verification-page .qr-section {
        padding: 20px 15px;
    }

    .lawyer-verification-page .qr-box {
        width: 270px;
    }

    .lawyer-verification-page .payment-instructions,
    .lawyer-verification-page .whatsapp-section {
        padding: 16px;
    }

}


/* =========================================================
   RESPONSIVE - 576
========================================================= */

@media (max-width: 576px) {

    .lawyer-verification-page .verification-heading h1 {
        font-size: 20px;
    }

    .lawyer-verification-page .verification-card-header {
        align-items: flex-start;
    }

    .lawyer-verification-page .verification-price {
        font-size: 17px;

        padding: 7px 10px;
    }

    .lawyer-verification-page .qr-box {
        width: 245px;
    }

    .lawyer-verification-page .upi-details {
        flex-direction: column;

        gap: 3px;
    }

    .lawyer-verification-page .payment-amount {
        padding: 11px 12px;
    }

    .lawyer-verification-page .whatsapp-button {
        min-height: 48px;

        font-size: 11px;
    }

}