@import "primeicons/primeicons.css";
@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');

:root {

    /* BADGES */

    --lms-badge-green-bg: #E1FCEF;
    --lms-badge-green-text: #14804A;

    --lms-badge-red-bg: #FFEDEF;
    --lms-badge-red-text: #D40004;

    --lms-badge-blue-bg: #CCE6FF;
    --lms-badge-blue-text: #007FF5;

    --lms-badge-yellow-bg: #fff8e1;
    --lms-badge-yellow-text: #b45309;

    --lms-badge-orange-bg: #fff3e0;
    --lms-badge-orange-text: #c2410c;

    --lms-badge-purple-bg: #f3e8ff;
    --lms-badge-purple-text: #7e22ce;

    --lms-badge-teal-bg: #e6fffa;
    --lms-badge-teal-text: #0f766e;

    --lms-badge-pink-bg: #ffe4ec;
    --lms-badge-pink-text: #be185d;

    --lms-badge-gray-bg: #f3f4f6;
    --lms-badge-gray-text: #4b5563;

    --lms-badge-cyan-bg: #e0f7fa;
    --lms-badge-cyan-text: #0e7490;

    --lms-badge-lime-bg: #ecfccb;
    --lms-badge-lime-text: #4d7c0f;

    --lms-badge-brown-bg: #FCF2E6;
    --lms-badge-brown-text: #AA5B00;


    /* WIDGET */
    --lms-widget-bg: #ffffff;
    --lms-widget-border: 0.063rem solid #E1E1E2;
    --lms-widget-border-radius: 0.625rem;
    --lms-widget-padding: 0.938rem;

    /* TABS */
    --lms-tabs-overflow: hidden;
    --lms-tabs-border: 0.063rem solid #c9c9c9;
    --lms-tabs-border-radius: 0.75rem;
    --lms-tabs-color: #878787;
    --lms-tabs-color-active: var(--lms-body-text-black);
    --lms-tabs-color-avtive-height: 0.094rem;
    --lms-tabs-active-bg: var(--lms-body-text-black);
    --lms-tabs-font-size: var(--font-14);
    --lms-tabs-font-weight: 600;

    /* TAB START FROM HERE */
    --lms-tab-padding: 0.938rem;

    /* BUTTON ESSENTIALS */
    --p-primary-50: #e8f3ff !important;
    --p-primary-100: #d1e8ff !important;
    --p-primary-200: #a3d0ff !important;
    --p-primary-300: #75b8ff !important;
    --p-primary-400: #479fff !important;
    --p-primary-500: #007FF5 !important;
    --p-primary-600: #006ed8 !important;
    --p-primary-700: #005cb4 !important;
    --p-primary-800: #004a91 !important;
    --p-primary-900: #00396e !important;
    --p-primary-950: #00274b !important;

    /*  */
    --p-surface-0: #ffffff !important;
    --p-surface-50: #f2f2f2 !important;
    --p-surface-100: #d9d9d9 !important;
    --p-surface-200: #bfbfbf !important;
    --p-surface-300: #a6a6a6 !important;
    --p-surface-400: #8c8c8c !important;
    --p-surface-500: #737373 !important;
    --p-surface-600: #595959 !important;
    --p-surface-700: #404040 !important;
    --p-surface-800: #262626 !important;
    --p-surface-900: #1D1D1D !important;
    --p-surface-950: #0d0d0d !important;

    --font-10: 0.625rem;
    /* 10px */
    --font-11: 0.6875rem;
    /* 11px */
    --font-12: 0.75rem;
    /* 12px */
    --font-13: 0.8125rem;
    /* 13px */
    --font-14: 0.875rem;
    /* 14px */
    --font-15: 0.9375rem;
    /* 15px */
    --font-16: 1rem;
    /* 16px */
    --font-17: 1.0625rem;
    /* 17px */
    --font-18: 1.125rem;
    /* 18px */
    --font-19: 1.1875rem;
    /* 19px */
    --font-20: 1.25rem;
    /* 20px */
    --font-21: 1.3125rem;
    /* 21px */
    --font-22: 1.375rem;
    /* 22px */
    --font-23: 1.4375rem;
    /* 23px */
    --font-24: 1.5rem;
    /* 24px */
    --font-25: 1.5625rem;
    /* 25px */
    --font-26: 1.625rem;
    /* 26px */
    --font-27: 1.6875rem;
    /* 27px */
    --font-28: 1.75rem;
    /* 28px */
    --font-29: 1.8125rem;
    /* 29px */
    --font-30: 1.875rem;
    /* 30px */
    --font-31: 1.9375rem;
    /* 31px */
    --font-32: 2rem;
    /* 32px */
    --font-33: 2.0625rem;
    /* 33px */
    --font-34: 2.125rem;
    /* 34px */
    --font-35: 2.1875rem;
    /* 35px */
    --font-36: 2.25rem;
    /* 36px */
    --font-37: 2.3125rem;
    /* 37px */
    --font-38: 2.375rem;
    /* 38px */
    --font-39: 2.4375rem;
    /* 39px */
    --font-40: 2.5rem;
    /* 40px */
    --font-41: 2.5625rem;
    /* 41px */
    --font-42: 2.625rem;
    /* 42px */
    --font-43: 2.6875rem;
    /* 43px */
    --font-44: 2.75rem;
    /* 44px */
    --font-45: 2.8125rem;
    /* 45px */
    --font-46: 2.875rem;
    /* 46px */
    --font-47: 2.9375rem;
    /* 47px */
    --font-48: 3rem;
    /* 48px */
    --font-49: 3.0625rem;
    /* 49px */
    --font-50: 3.125rem;
    /* 50px */
    --font-51: 3.1875rem;
    /* 51px */
    --font-52: 3.25rem;
    /* 52px */
    --font-53: 3.3125rem;
    /* 53px */
    --font-54: 3.375rem;
    /* 54px */
    --font-55: 3.4375rem;
    /* 55px */
    --font-56: 3.5rem;
    /* 56px */
    --font-57: 3.5625rem;
    /* 57px */
    --font-58: 3.625rem;
    /* 58px */
    --font-59: 3.6875rem;
    /* 59px */
    --font-60: 3.75rem;
    /* 60px */
    --font-61: 3.8125rem;
    /* 61px */
    --font-62: 3.875rem;
    /* 62px */
    --font-63: 3.9375rem;
    /* 63px */
    --font-64: 4rem;
    /* 64px */
    --font-65: 4.0625rem;
    /* 65px */
    --font-66: 4.125rem;
    /* 66px */
    --font-67: 4.1875rem;
    /* 67px */
    --font-68: 4.25rem;
    /* 68px */
    --font-69: 4.3125rem;
    /* 69px */
    --font-70: 4.375rem;
    /* 70px */
    --font-71: 4.4375rem;
    /* 71px */
    --font-72: 4.5rem;
    /* 72px */
    --font-73: 4.5625rem;
    /* 73px */
    --font-74: 4.625rem;
    /* 74px */
    --font-75: 4.6875rem;
    /* 75px */


    /* Typography */
    --lms-font-family-base: "Inter",
        sans-serif;
    --lms-btn-font-family: var(--lms-font-family-base);
    --lms-font-size-xs: 0.75rem;
    /* 12px */
    --lms-font-size-sm: 0.875rem;
    /* 14px */
    --lms-font-size-md: 1rem;
    /* 16px */
    --lms-font-size-lg: 1.125rem;
    /* 18px */
    --lms-font-size-xl: 1.375rem;
    /* 22px */
    --lms-font-size-xxl: 1.5rem;
    /* 24px */
    --lms-font-size-heading: 1.75rem;
    /* 28px */

    --lms-font-weight-regular: 400;
    --lms-font-weight-medium: 500;
    --lms-font-weight-semibold: 600;
    --lms-font-weight-bold: 700;

    /* Primary Brand */
    --lms-primary-blue: #2488ff;
    --lms-primary-yellow: #ffb400;

    /* Status Colors */
    --lms-success: #28a745;
    --lms-danger: #dc3545;
    --lms-warning: #ffc107;
    --lms-info: #17a2b8;

    /* Text Colors */
    --lms-text-primary: #007FF5;
    --lms-text-main: #1f1f1f;
    --lms-text-secondary: #6c7278;
    --lms-text-muted: #8e8e8e;
    --lms-text-white: #ffffff;
    --lms-body-text-black: #101010;

    /* Background */
    --lms-bg-white: #ffffff;
    --lms-bg-gray-light: #f5f6f8;
    --lms-bg-hover: #e9efff;
    --lms-bg-card: #ffffff;
    --lms-bg-card-transparent: transparent;

    /* Border */
    --lms-border-light: #e0e0e0;
    --lms-border-input: #d6d6d6;
    --lms-border-divider: #dddddd;

    /* Buttons */
    --lms-btn-primary-bg: var(--p-primary-500);
    --lms-btn-primary-border: #0070F4;
    --lms-btn-primary-text: #ffffff;

    --lms-btn-secondary-bg: var(--p-surface-900);
    --lms-btn-secondary-border: var(--p-surface-900);
    --lms-btn-secondary-text: #ffffff;

    --lms-btn-trinary-bg: #F0F0F0;
    --lms-btn-trinary-border: #DADBDD;
    --lms-btn-trinary-text: var(--lms-body-text-black);
    --lms-btn-trinary-hover: var(--p-surface-200);

    --lms-btn-outline-bg: transparent;
    --lms-btn-trinary-border: var(--p-primary-500);

    --lms-btn-danger-bg: var(--lms-danger);
    --lms-btn-danger-text: #ffffff;

    /* DEFAULT BTN VARIABLES */
    --lms-btn-height: 2.5rem;
    --lms-btn-padding: 0.5rem 0.75rem;
    --lms-btn-gap: 0.313rem;
    --lms-btn-radius: 0.25rem;
    --lms-btn-border: 0.063rem;
    --lms-btn-font-faimly: var(--lms-font-family-base);
    --lms-btn-display: flex;
    --lms-align: center;
    --lms-font-size: 0.875rem;
    --lms-font-weight: 500;

    --lms-btn-md-height: 2.25rem;

    --lms-btn-xs-gredient-bg: linear-gradient(180deg, #FF8E8E 0%, #D21D1D 100%);
    --lms-btn-gredient-bg-hover: linear-gradient(180deg, #D21D1D 0%, #FF8E8E 100%);

    --lms-btn-xs-outlined: #DADBDD;

    /* SMALL BUTTONS */
    --lms-btn-xs-height: 1.563rem;
    --lms-btn-xs-padding: 0.125rem 0.375rem;
    --lms-btn-xs-gap: 0.313rem;
    --lms-btn-xs-radius: 0.188rem;
    --lms-btn-xs-border: 0.063rem;
    --lms-btn-xs-font-faimly: var(--lms-font-family-base);
    --lms-btn-xs-display: flex;
    --lms-xs-align: center;
    --lms-xs-font-size: 0.875rem;
    --lms-xs-font-weight: 500;

    /* FIELDS VARIALS */

    --lms-field-bg-white: #ffffff;
    --lms-field-bg-transparent: transparent;
    --lms-field-height: 2.5rem;
    --lms-field-sm-height: 1.938rem;
    --lms-field-sm-border: #C5C6C9;

    /* small pagination */
    --lms-pagination-bg: rgba(233, 237, 245, 1);
    /* Interaction */
    --lms-focus-ring: rgba(36, 136, 255, 0.4);
    --lms-hover-gray: #f0f2f5;
    --lms-active: #dbe8ff;

    /* Avatar */
    --lms-avatar-bg: #e8e8e8;
    --lms-avatar-border: #cccccc;
    --lms-input-border: #E1E1E2;

    /* Shadows */
    --lms-shadow-card: 0rem 0.125rem 0.375rem rgba(0, 0, 0, 0.08);
    /* 0px 2px 6px */
    --lms-shadow-modal: 0rem 0.25rem 0.625rem rgba(0, 0, 0, 0.12);
    /* 0px 4px 10px */

    /* Radius */
    --lms-radius-sm: 0.375rem;
    /* 6px */
    --lms-radius-md: 0.625rem;
    /* 10px */
    --lms-radius-lg: 0.75rem;
    /* 12px */

    /* Lead Stage Colors */
    --lms-stage-closure-bg: #e6f9f1;
    --lms-stage-closure-text: #0c8f60;

    --lms-stage-proposal-bg: #fff2d9;
    --lms-stage-proposal-text: #d18d00;

    --lms-stage-qualification-bg: #fff4e6;
    --lms-stage-qualification-text: #db7900;

    /* Icon System */
    --icon-size: 2.625rem;
    /* 42px */
    --icon-size-sm: 2.5rem;
    /* 40px */
    --icon-font: 1.375rem;
    /* 22px */
    --icon-radius: 0.75rem;
    /* 12px */
    --icon-padding: 0.5rem;
    /* 8px */
    --icon-transition: 0.25s ease;
    --icon-cursor: pointer;

    --icon-bg: #ffffff;
    --icon-border: #dcdcdc;
    --icon-color: #000000;

    /* COMPONETS NG PRIME */

    /* BRAND COLORS */
    --lms-primary: #007FF5;
    /* Blue */
    --lms-secondary: #c47400;
    /* Orange */
    --lms-danger: #d90000;
    /* Red */
    --lms-gray: #6a6a6a;

    /* Background Shades */
    --lms-primary-bg: #d8edff;
    --lms-danger-bg: #ffeaea;
    --lms-secondary-bg: #fff2e0;

    /* PrimeNG Variable Overrides */
    --p-primary-color: var(--lms-primary);
    --p-primary-hover-color: color-mix(in srgb, var(--lms-primary), #000 10%);
    --p-primary-active-color: color-mix(in srgb, var(--lms-primary), #000 20%);

    --p-button-primary-bg: var(--lms-primary);
    --p-button-primary-border-color: var(--lms-primary);
    --p-button-primary-color: #ffffff;

    /* Alert / Status Colors */
    --p-danger-color: var(--lms-danger);
    --p-danger-hover-color: color-mix(in srgb, var(--lms-danger), #000 10%);


    --lms-btn-primary-bg: var(--lms-primary-blue);
    --lms-btn-primary-text: #ffffff;
    --lms-btn-primary-hover-bg: color-mix(in srgb, var(--lms-primary-blue), #000 10%);
    --lms-btn-primary-active-bg: color-mix(in srgb, var(--lms-primary-blue), #000 20%);

    /* 🔥 Hot */
    --hot-text: #D40004;
    --hot-bg: #FFE0E0;

    /* ❄️ Cold */
    --cold-text: #007FF5;
    --cold-bg: #CCE6FF;

    /* ✅ Qualified / Proposal / Followup / Converted */
    --success-text: #10B980;
    --success-bg: #DEF4ED;

    /* ❌ Disqualified / Closed */
    --error-text: #D40004;
    --error-bg: #FFE0E0;

    /* 💬 Negotiation / On Hold / Dormant */
    --warning-text: #CB9500;
    --warning-bg: #FFF1DF;

    /* TABLE VARIABLES */

    --lms-table-th-bg: #E9EDF5BF;
    --lms-table-th-color: #687182;
    --lms-table-th-font-size: 0.75rem;
    --lms-table-th-font-weight: 500;
    --lms-table-tr-hover-bg: #EFF2F8;
}


body {
    font-family: var(--lms-font-family-base);
}

/**********************************
    CARD
**********************************/

.lms-fit-screen {
    height: calc(100vh - 76px) !important;
    overflow: hidden;
}

.lms-card {
    background-color: var(--lms-bg-card);
    color: var(--lms-text-main);
    border: 0.0625rem solid var(--lms-border-light);
    border-radius: var(--lms-radius-lg);
    box-shadow: var(--lms-shadow-card);
    padding: 1rem;
    width: 100%;
    transition: all 0.2s ease-in-out;
}

.lms-card-header {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 0.5rem;
    padding-bottom: 0.75rem;
    border-bottom: 0.0625rem solid var(--lms-border-light);
}

.lms-card-title {
    font-size: var(--font-22);
    font-weight: 600;
    color: var(--lms-body-text-black);
}

.lms-card-subtitle h5 {
    font-size: var(--lms-font-size-sm);
    color: var(--lms-text-secondary);
    margin-top: 0.125rem;
}

.lms-card-body {
    font-size: var(--lms-font-size-md);
    color: var(--lms-text-secondary);
}

.lms-card-footer {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    margin-top: 0.5rem;
    padding-top: 0.75rem;
    border-top: 0.0625rem solid var(--lms-border-light);
}

.lms-card.card-transparent {
    background: var(--lms-bg-card-transparent);
    box-shadow: none;
    border: 0;
}

/**********************************
    TABLE
**********************************/

.lms-table {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    height: 100%;
}

.lms-table .p-datatable-thead>tr>th {
    background-color: var(--lms-table-th-bg);
    color: var(--lms-table-th-color);
    font-size: var(--lms-table-th-font-size);
    font-weight: var(--lms-table-th-font-weight);
    padding: 0.75rem;
    border-bottom: 0.0625rem solid #E9EDF5;
    border-top: 0.0625rem solid var(--lms-border-divider);
    text-transform: uppercase;
}

.lms-table .p-datatable-thead>tr>th:first-child {
    border-left: 0.0625rem solid var(--lms-border-divider);
    border-radius: 12px 0 0 0px;
}

.lms-table .p-datatable-thead>tr>th:last-child {
    border-right: 0.0625rem solid var(--lms-border-divider);
    border-radius: 0 12px 0 0;
}

.lms-table .p-datatable-tbody>tr>td:first-child {
    border-left: 1px solid var(--lms-border-divider);
}

.lms-table .p-datatable-tbody>tr:hover {
    background: var(--lms-table-tr-hover-bg);
}

.lms-table .p-datatable-tbody>tr>td:last-child {
    border-right: 1px solid var(--lms-border-divider);
}

.lms-table .p-datatable-tbody>tr>td {
    font-size: var(--font-12);
    color: var(--lms-table-text);
    border-bottom: 0.0625rem solid #E9EDF5;
    padding: 0.5rem 0.75rem;
    white-space: wrap;
}

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

.lms-table.md .p-datatable-thead>tr>th {
    background-color: var(--lms-table-th-bg);
    color: var(--lms-table-th-color);
    font-size: var(--lms-table-th-font-size);
    font-weight: var(--lms-table-th-font-weight);
    padding: 0.375rem;
    border-bottom: 0.0625rem solid #E9EDF5;
    border-top: 0.0625rem solid var(--lms-border-divider);
    text-transform: uppercase;
}

.lms-table.md .p-datatable-thead>tr>th:first-child {
    border-left: 0.0625rem solid var(--lms-border-divider);
    border-radius: 0;
}

.lms-table.md .p-datatable-thead>tr>th:last-child {
    border-right: 0.0625rem solid var(--lms-border-divider);
    border-radius: 0;
}

.lms-table.md .p-datatable-tbody>tr>td:first-child {
    border-left: 1px solid var(--lms-border-divider);
}

.lms-table.md .p-datatable-tbody>tr:hover {
    background: var(--lms-table-tr-hover-bg);
}

.lms-table.md .p-datatable-tbody>tr>td:last-child {
    border-right: 1px solid var(--lms-border-divider);
}

.lms-table.md .p-datatable-tbody>tr>td {
    font-size: var(--font-12);
    color: var(--lms-table-text);
    border-bottom: 0.0625rem solid #E9EDF5;
    padding: 0.375rem;
    white-space: wrap;
}

.lms-link {
    color: var(--lms-primary-blue);
    font-weight: var(--lms-font-weight-medium);
    text-decoration: none;
}

.lms-link:hover {
    text-decoration: underline;
}


/**********************************
    BADGES
**********************************/
.lms-badge {
    display:flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.25rem 0.5rem;
    font-size: var(--lms-font-size-xs);
    border-radius: var(--lms-radius-sm);
    font-weight: var(--lms-font-weight-medium);
    width: max-content;
    line-height: normal;
}

.lms-badge::before {
    content: "";
    width: 8px;
    height: 8px;
    border-radius: 2px;
    background: currentColor;
}

/* Stage Variants */
.lms-badge.closure {
    background-color: var(--lms-stage-closure-bg);
    color: var(--lms-stage-closure-text);
}

.lms-badge.proposal {
    background-color: var(--lms-stage-proposal-bg);
    color: var(--lms-stage-proposal-text);
}

.lms-badge.qualification {
    background-color: var(--lms-stage-qualification-bg);
    color: var(--lms-stage-qualification-text);
}

/* NEW BADGE COLOR LIST */

/* Color Variants */
.lms-badge-green {
    background-color: var(--lms-badge-green-bg);
    color: var(--lms-badge-green-text);
}

.lms-badge-red {
    background-color: var(--lms-badge-red-bg);
    color: var(--lms-badge-red-text);
}

.lms-badge-blue {
    background-color: var(--lms-badge-blue-bg);
    color: var(--lms-badge-blue-text);
}

.lms-badge-yellow {
    background-color: var(--lms-badge-yellow-bg);
    color: var(--lms-badge-yellow-text);
}

.lms-badge-orange {
    background-color: var(--lms-badge-orange-bg);
    color: var(--lms-badge-orange-text);
}

.lms-badge-purple {
    background-color: var(--lms-badge-purple-bg);
    color: var(--lms-badge-purple-text);
}

.lms-badge-teal {
    background-color: var(--lms-badge-teal-bg);
    color: var(--lms-badge-teal-text);
}

.lms-badge-pink {
    background-color: var(--lms-badge-pink-bg);
    color: var(--lms-badge-pink-text);
}

.lms-badge-gray {
    background-color: var(--lms-badge-gray-bg);
    color: var(--lms-badge-gray-text);
}

.lms-badge-cyan {
    background-color: var(--lms-badge-cyan-bg);
    color: var(--lms-badge-cyan-text);
}

.lms-badge-lime {
    background-color: var(--lms-badge-lime-bg);
    color: var(--lms-badge-lime-text);
}

.lms-badge-brown {
    background-color: var(--lms-badge-brown-bg);
    color: var(--lms-badge-brown-text);
}

/* Optional Hover Effect */
.lms-badge:hover {
    opacity: 0.9;
    transition: opacity 0.2s ease-in-out;
}

/**********************************
    ICON BOXES
**********************************/
.lms-icon-box {
    width: var(--icon-size);
    height: var(--icon-size);
    display: inline-flex;
    justify-content: center;
    align-items: center;
    background-color: var(--icon-bg);
    border: 0.0625rem solid var(--icon-border);
    border-radius: var(--icon-radius);
    padding: var(--icon-padding);
    cursor: var(--icon-cursor);
    transition: var(--icon-transition);
    font-size: var(--icon-font);
}

.lms-icon-box.sm {
    width: var(--icon-size-sm);
    height: var(--icon-size-sm);
    font-size: calc(var(--icon-font) - 0.25rem);
}

.lms-icon-box svg,
.lms-icon-box i,
.lms-icon-box img {
    width: 1em;
    height: 1em;
    fill: var(--icon-color);
    color: var(--icon-color);
}

/* Color Variants */
.icon-blue {
    --icon-bg: #d8edff;
    --icon-border: #add8ff;
    --icon-color: #0081e5;
}

.icon-red {
    --icon-bg: #ffeaea;
    --icon-border: #ffc9c9;
    --icon-color: #d90000;
}

.icon-orange {
    --icon-bg: #fff2e0;
    --icon-border: #ffd9b3;
    --icon-color: #c47400;
}

/* BUTTONS START FROM HERE */
/* Common base for LMS primary buttons */
.lms-btn .p-button {
    font-family: var(--lms-btn-font-family);
    font-size: var(--lms-font-size);
    font-weight: var(--lms-font-weight);
    height: var(--lms-btn-height);
    padding: var(--lms-btn-padding);
    border-radius: var(--lms-btn-radius);
    border-width: var(--lms-btn-border);
    display: var(--lms-btn-display);
    align-items: var(--lms-align);
    gap: var(--lms-btn-gap);
}

.lms-btn.lms-btn-outline .p-button {
    background-color: var(--lms-btn-outline-bg);
    border: var(--lms-btn-border solid var(--lms-btn-primary-border));
    color: var(--lms-text-primary);
}

.lms-btn .p-button.lms-primary {
    background-color: var(--lms-btn-primary-bg);
    border: var(--lms-btn-border solid var(--lms-btn-primary-border));
}

.lms-btn .p-button.lms-secondary {
    background-color: var(--lms-btn-secondary-bg);
}

.lms-btn.md .p-button {
    height: var(--lms-btn-md-height);
    line-height: 1;
}

.lms-btn.xs .p-button {
    height: var(--lms-btn-xs-height);
    padding: var(--lms-btn-xs-padding);
    gap: var(--lms-btn-xs-gap);
    border-radius: var(--lms-btn-xs-radius);
    border-width: var(--lms-btn-xs-border);
    font-family: var(--lms-btn-xs-font-faimly);
    display: var(--lms-btn-xs-display);
    align-items: var(--lms-xs-align);
    font-size: var(--lms-xs-font-size);
    font-weight: var(--lms-xs-font-weight);
    justify-content: center;
    line-height: 1;
}

.lms-btn.gredient-red .p-button {
    background: var(--lms-btn-xs-gredient-bg);
    color: #ffffff;
    border: 1px solid #D44444;
}

.lms-btn.gredient-red .p-button:hover {
    background: var(--lms-btn-gredient-bg-hover);
    border: 1px solid #D44444;
}

.lms-split-btn-field {
    display: flex;
    align-items: center;
}

.lms-split-btn-field .splip-btn .p-button {
    border-right: 0px;
    border-radius: 8px 0px 0px 8px;
    background-color: #ffffff;
    box-shadow: var(--p-inputtext-shadow);
    font-size: var(--font-14);
    font-weight: 500;
    color: var(--lms-body-text-black);
    border-color: #DADBDD !important;
    height: 37px;
}

.lms-split-btn-field .splip-btn .p-button:hover {
    border-right: 0px;
    color: var(--lms-body-text-black);
    background-color: #ffffff73;
}

.lms-split-btn-field .split-field {
    border-radius: 0px 8px 8px 0px;
    font-size: var(--font-14);
    font-weight: 500;
    color: #A1A9B8;
    border-color: #DADBDD !important;
    width: 200px;
    height: 37px;
}

.lms-split-btn-field .split-field .p-datepicker-input {
    border-radius: 0px 8px 8px 0px;
    font-size: var(--font-14);
    font-weight: 500;
    color: #A1A9B8;
    border-color: #DADBDD !important;
    width: 200px;
    height: 37px;
}

.lms-split-btn-field .split-field .p-select {
    border-radius: 0px 8px 8px 0px;
    font-size: var(--font-14);
    font-weight: 500;
    color: #A1A9B8;
    border-color: #DADBDD !important;
    color: var(--lms-body-text-black) !important;
    width: 200px;
    height: 37px;
}

.lms-split-btn-field .split-field:enabled:focus {
    box-shadow: 0px 0px 0px 2px #87C5FF
}

/* LMS SECTION STYLE START FROM HERE */

/* =================== */
/* LMS PAGINATOR CSS */
/* =================== */

.lms-paginator {
    background: var(--lms-pagination-bg) !important;
    display: flex !important;
    align-items: center;
    width: 100%;
}

.lms-paginator:first-child {
    margin-left: auto !important;
}


/* Center pagination elements inline */
.lms-paginator .p-paginator-pages {
    display: none;
    /* hide individual page numbers to match screenshot */
}

/* Text: "1-10 of 32" */
.lms-paginator .p-paginator-current {
    font-size: 0.875rem;
    font-weight: 500;
    margin-right: auto;
}

/* Rows per page dropdown */
.lms-paginator .p-select {
    margin: 0 12px;
    background-color: transparent;
    border: none;
    font-size: 0.75rem;
    box-shadow: none;
    height: 32px;
    margin: 0;
}

.lms-paginator .p-select-label {
    color: var(--lms-text-secondary);
    padding: 6px;
    margin: 0;
}

/* Navigation buttons */
.lms-paginator .p-paginator-first,
.lms-paginator .p-paginator-last {
    display: none !important;
}

.lms-paginator .p-paginator-prev,
.lms-paginator .p-paginator-next {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    border: 1px solid rgba(0, 0, 0, 0.08);
    background: #fff;
    order: 3;
}

.lms-paginator .p-paginator-prev .p-paginator-icon,
.lms-paginator .p-paginator-next .p-paginator-icon {
    font-size: 0.75rem;
    color: var(--lms-text-main);
}

.lms-paginator .p-paginator-prev:not(.p-disabled):hover,
.lms-paginator .p-paginator-next:not(.p-disabled):hover {
    background-color: var(--lms-primary-50, #f0f6ff);
    border-color: var(--lms-primary-200, #b4cdf5);
    cursor: pointer;
}

/* Current page text "1/4" */
.lms-paginator .p-paginator-pages {
    font-size: 0.875rem;
    color: var(--lms-text-main);
    font-weight: 500;
    margin-right: 12px;
}

/* ============================================= */
/* SINGLE LEAD ACTIVITY PAGE CSS START FROM HERE */
/* ============================================= */

.lms-page-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 0;
    border-bottom: 0.0625rem solid #e5e7eb;
}

/* ---------- LEFT SIDE ---------- */
.lms-header-info {
    display: flex;
    align-items: start;
}

.lms-header-id {
    font-size: var(--font-22);
    font-weight: 600;
    color: var(--lms-primary-blue);
    margin: 0;
}

.lms-header-meta {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    /* 2px */
}

.lms-page-title label {
    font-size: var(--font-14);
    font-weight: 600;
    color: var(--lms-body-text-black);
}

.lms-page-title .value {
    font-size: var(--font-14);
    font-weight: 400;
    color: var(--lms-body-text-black);
}

.lms-header-title {
    font-size: var(--font-22);
    font-weight: 600;
    color: var(--lms-body-text-black);
    margin: 0;
}

.lms-header-desc {
    font-size: var(--font-14);
    font-weight: 400;
    color: var(--lms-body-text-black);
    margin: 4px 0 0 0;
}

.lms-page-title label {
    font-size: var(--font-14);
    font-weight: 600;
    color: var(--lms-body-text-black);
}

.lms-page-title .value {
    font-size: var(--font-14);
    font-weight: 400;
    color: var(--lms-body-text-black);
}
.lms-header-org {
    font-size: var(--font-14);
    color: var(--lms-primary-blue);
    font-weight: 400;

}

.lms-header-date label {
    font-size: var(--font-14);
    color: #4b5563;
    font-weight: 500;
}

.lms-header-date {
    font-size: var(--font-14);
    color: #4b5563;
    font-weight: 400;
}


/* ---------- RIGHT SIDE ---------- */
.lms-header-actions {
    display: flex;
    align-items: center;
    /* gap: 0.75rem; */
    /* 12px */
}

.lms-header-btn {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    /* 6px */
    background: #fff;
    border: none;
    color: #111827;
    font-size: 0.9375rem;
    /* 15px */
    font-weight: 600;
    cursor: pointer;
    transition: color 0.2s ease;
}

.lms-header-btn:hover {
    color: var(--lms-primary-blue);
}

.lms-header-btn i {
    font-size: 1rem;
}

/* ---------- SEARCH BOX ---------- */
.lms-header-search {
    display: flex;
    align-items: center;
    background: #fff;
    border: 0.0625rem solid #d1d5db;
    border-radius: 0.5rem;
    /* 8px */
    padding: 0.5rem 0.75rem;
    min-width: 14rem;
    /* 224px */
}

.lms-header-search i {
    color: #9ca3af;
    font-size: 1rem;
    margin-right: 0.5rem;
}

.lms-header-search input {
    border: none;
    outline: none;
    font-size: 0.9375rem;
    color: #111827;
    width: 100%;
}

.lms-header-search input::placeholder {
    color: #9ca3af;
}

/* ===========================
   Base Icon Button
=========================== */
.lms-icon-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.625rem;
    /* 10px */
    border: none;
    background: transparent;
    cursor: pointer;
    font-family: var(--lms-font-family-base, "Inter", sans-serif);
    padding: 0;
}

.lms-icon-btn:hover .lms-icon-holder {
    border-color: var(--lms-primary, #007bff);
    background-color: var(--lms-hover-bg, #e8f0ff);
}


/* ===========================
   Icon Circle
=========================== */
.lms-icon-holder {
    height: 1.9375rem;
    /* 31px */
    width: 1.9375rem;
    border-radius: 50%;
    border: 0.0625rem solid var(--lms-border-color, #dadbdd);
    background-color: var(--lms-icon-bg, #f0f0f0);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    color: var(--lms-icon-color, var(--lms-body-text-black));
    transition: all 0.25s ease;
}

.lms-icon-holder svg {
    width: 1rem;
    /* 16px */
    height: 1rem;
    stroke: currentColor;
}

/* ===========================
   Label beside icon
=========================== */
.lms-btn-label {
    font-size: var(--lms-font-size-sm, 0.875rem);
    /* 14px */
    font-weight: 600;
    color: var(--lms-text-color, var(--lms-body-text-black));
    transition: color 0.25s ease;
}

.lms-icon-btn:hover .lms-btn-label {
    color: var(--lms-primary, #007bff);
}

/* ===========================
   Optional Modifiers
=========================== */
.lms-icon-btn.sm .lms-icon-holder {
    height: 1.5rem;
    /* 24px */
    width: 1.5rem;
}

.lms-icon-btn.sm .lms-btn-label {
    font-size: var(--lms-font-size-xs, 0.75rem);
    /* 12px */
}

.text-label {
    font-size: var(--font-12);
    font-weight: 600;
    color: var(--lms-body-text-black);
}

.text-value {
    font-size: var(--font-12);
    font-weight: 400;
    color: var(--lms-body-text-black);
}

.lms-divider:before {
    border-block-start: 1px solid #E1E1E2 !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* INPUT FIELDS */

.p-inputtext:disabled {
    background: #f6f6f6 !important;
}

.lms-field-group {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.lms-field {
    position: relative;
}

.lms-field .error-icon {
    position: absolute;
    top: 0;
    right: 5px;
    bottom: 0;
}

.lms-field-group label {
    font-size: var(--font-12);
    font-weight: 400;
    color: var(--lms-body-text-black);
}

.lms-required {
    color: var(--error-text);
    font-size: var(--font-12);
    font-weight: 400;
}

.lms-field-error {
    color: var(--error-text);
    font-size: var(--font-12);
    font-weight: 400;
}

.lms-field .p-datepicker-input {
    height: var(--lms-field-height);
    border-radius: 4px;
    font-size: var(--font-14);
    color: var(--lms-body-text-black);
    padding: 5px 10px;
    border: 1px solid var(--lms-input-border);
}

.lms-search-field {
    width: 185px !important;
}

.lms-field .p-datepicker-input:enabled:focus {
    box-shadow: 0px 0px 0px 2px #87C5FF
}

.lms-field.p-inputtext {
    height: var(--lms-field-height);
    border-radius: 4px;
    font-size: var(--font-14);
    color: var(--lms-body-text-black);
    padding: 5px 10px;
    border: 1px solid var(--lms-input-border);

}

.lms-field.p-inputtext:enabled:focus {
    box-shadow: 0px 0px 0px 2px #87C5FF
}

.lms-field.p-select {
    height: var(--lms-field-height);
    border-radius: 4px;
    border: 1px solid var(--lms-input-border);

}

.lms-field.p-select:enabled:focus {
    box-shadow: 0px 0px 0px 2px #87C5FF
}

.lms-field.p-textarea {
    min-height: 55px;
    border-radius: 4px;
    font-size: var(--font-14);
    color: var(--lms-body-text-black);
    padding: 5px 10px;
    border: 1px solid var(--lms-input-border);

}

.lms-field.p-textarea:enabled:focus {
    box-shadow: 0px 0px 0px 2px #87C5FF
}

.lms-field .p-select-label {
    font-size: var(--font-14);
    color: var(--lms-body-text-black);
}


.lms-field.p-multiselect {
    height: var(--lms-field-height);
    border-radius: 4px;
    font-size: var(--font-14);
    color: var(--lms-body-text-black);
    border: 1px solid var(--lms-input-border);

}

.lms-field.p-multiselect:enabled:focus {
    box-shadow: 0px 0px 0px 2px #87C5FF
}

.lms-field.p-inputtext {
    height: var(--lms-field-height);
    border-radius: 4px;
    font-size: var(--font-14);
    color: var(--lms-body-text-black);
    padding: 4px 8px;
    border: 1px solid var(--lms-input-border);

}

.lms-field.p-inputtext:enabled:focus {
    box-shadow: 0px 0px 0px 2px #87C5FF
}

/* FILD SM */

.lms-field-sm.p-inputtext {
    height: var(--lms-field-sm-height);
    border-radius: 4px;
    font-size: var(--font-14);
    color: var(--lms-body-text-black);
    padding: 4px 8px;
    border: 1px solid var(--lms-field-sm-border);
}

.lms-field-sm .p-datepicker-input {
    height: var(--lms-field-sm-height);
    border-radius: 4px;
    font-size: var(--font-14);
    color: var(--lms-body-text-black);
    padding: 4px 8px;
    border: 1px solid var(--lms-field-sm-border);
}

.lms-field-sm.p-select {
    height: var(--lms-field-sm-height) !important;
    border-radius: 4px;
    border: 1px solid var(--lms-field-sm-border);
}

.lms-field-sm .p-select-label {
    font-size: var(--font-14);
    color: var(--lms-body-text-black);
    padding: 0.313rem 0.625rem;
}

.lms-field-sm .p-multiselect-label {
    font-size: var(--font-14);
    color: var(--lms-body-text-black);
    padding: 0.313rem 0.625rem;
}


.lms-field-sm .p-select-dropdown {
    width: auto;
    height: 100%;
    margin-right: 8px;
}


.lms-field-sm.p-multiselect {
    height: var(--lms-field-sm-height);
    border-radius: 4px;
    font-size: var(--font-14);
    color: var(--lms-body-text-black);
    border: 1px solid var(--lms-field-sm-border);
}

.p-icon {
    color: var(--lms-body-text-black) !important;
}

.sub-heading {
    color: var(--lms-text-primary);
    font-size: var(--font-14);
    font-weight: 600;
}

/* CHECKED BOX STYLE START FROM HERE */

.set-primary {
    display: flex;
    align-items: center;
    gap: 8px;
}

.set-primary label {
    color: var(--lms-body-text-black);
    font-size: var(--font-14);
    font-weight: 600;
}

.p-checkbox {
    display: flex !important;
}

.p-checkbox-input {
    border: 1px solid #E1E1E2 !important;
}

.p-checkbox-checked .p-checkbox-box {
    background-color: transparent !important;
    border-color: #E1E1E2 !important;
}

.p-checkbox-checked .p-checkbox-box .p-checkbox-icon {
    color: var(--lms-text-primary) !important;
}

/* END */


/* DRAWERS */


.p-drawer {
    min-width: 460px !important;
}

.p-drawer-header {
    font-size: var(--font-22);
    font-weight: 600;
    color: var(--lms-body-text-black);
    padding: 8px 20px !important;
}


.lms-btn.upload-btn .p-fileupload-choose-button {
    background-color: var(--lms-btn-trinary-bg);
    border-color: var(--lms-btn-trinary-border);
    color: var(--lms-btn-trinary-text);
}

.lms-btn.upload-btn .p-fileupload-choose-button:hover {
    background-color: var(--lms-btn-trinary-hover);
    border-color: var(--lms-btn-trinary-border);
    color: var(--lms-btn-trinary-text);
}

.lms-btn.upload-btn .p-iconwrapper {
    display: none;
}

.lms-upload-avtaar {
    height: 40px;
    width: 40px;
    overflow: hidden;
}

.lms-upload-avtaar img {
    height: 100%;
    width: 100%;
    object-fit: contain;
}

/* UPLOAD DOCUMENTS STYLE START  */
.lms-upload {
    border: 2px dashed #E1E1E2;
    padding: 30px 10px;
    border-radius: 4px;
    display: flex;
    flex-direction: column;
    gap: 4px;
    align-items: center;
    justify-content: center;
}

.lms-uploaded-list ul {
    padding: 0;
    list-style: none;
}

.lms-uploaded-list li {
    background-color: #F5F7FB;
    border: 1px solid #E1E1E2;
    border-radius: 10px;
    padding: 10px;
}


/* LMS UPLOAD LIST */

.lms-uploaded-list ul {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 6px;
}

.lms-uploaded-list ul li .file-item {
    display: flex;
    align-items: center;
    gap: 8px;
}

.lms-uploaded-list li .file-type {
    width: auto;
}

.lms-uploaded-list li .file-details .file-title {
    font-size: var(--font-14);
    font-weight: 600;
    color: var(--lms-body-text-black);
}

.lms-uploaded-list li .file-details .file-size {
    font-size: var(--font-12);
    font-weight: 400;
    color: var(--lms-body-text-black);
    display: flex;
    align-items: center;
}

.lms-uploaded-list li .file-details .status label {
    font-size: var(--font-12);
    font-weight: 600;
    color: var(--lms-body-text-black);
}

.fileupload-text .p-button {
    padding: 0;
    background: transparent;
    border: 0;
    color: var(--lms-text-primary);
    font-size: var(--font-12);
    font-weight: 700;
}

.fileupload-text .p-button:hover {
    background: inherit !important;
    color: inherit !important;
    border: inherit !important;
}

.fileupload-text .p-button .p-iconwrapper {
    display: none;
}


.lms-upload label {
    font-size: var(--font-14);
    font-weight: 400;
    color: var(--lms-body-text-black);
}

.lms-upload p {
    font-size: var(--font-12);
    font-weight: 400;
    color: #767676;
    display: flex;
    align-items: center;
    gap: 4px;
}

.lms-upload .format-info {
    font-size: var(--font-12);
    font-weight: 400;
    text-align: center;
    padding: 5px 10px;
    color: #798798;
    background-color: #E7ECF2;
    width: fit-content;
}


/* ---------------------------------------------- */


.lms-radio-btn-group .p-togglebutton {
    background: transparent !important;
    border-color: #c5c6c9 !important;
    box-shadow: var(--p-inputtext-shadow);
}

.lms-radio-btn-group .p-togglebutton .p-togglebutton-label {
    font-size: var(--font-14);
    font-weight: 400;
    color: var(--lms-body-text-black);
}

.lms-radio-btn-group .p-togglebutton {
    padding: 0 !important;
}

.lms-radio-btn-group .p-togglebutton-content {
    padding: 0.3rem 12px !important;
    border-radius: 0px !important;
}

.lms-radio-btn-group .p-togglebutton-checked .p-togglebutton-content {
    background: #007FF5 !important;
    box-shadow: none !important;
    border-radius: 0px;
}

.lms-radio-btn-group .p-togglebutton.p-togglebutton-checked {
    border-color: #007FF5 !important;
}

.lms-radio-btn-group .p-togglebutton-checked .p-togglebutton-content .p-togglebutton-label {
    color: #ffffff;
}

.upcoming-badge {
  background-color: #CCE6FF !important;
  color: #007FF5;
}

.missed-badge {
  background-color: #FFE0E0 !important;
  color: #D40004 !important;
}