/* ----- Original Header Styles ----- */

/* Header and Menus */
#headerContainer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background-color: #fff;
    width: 100%;
    margin: 0;
    padding: 0;
}

#headerLogoContainer {
    flex: 0 0 auto;
}

.topBar {
    flex: 1;
    text-align: right;
}

.topBarLink {
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    text-transform: uppercase;
    font-family: 'Inter', sans-serif;
    color: #2F322B;
    text-decoration: none;
    padding-right: 0px;
    padding-left: 0px;
    box-sizing: border-box;
}

    .topBarLink:hover {
        font-weight: 500;
        color: #1C803F;
        box-sizing: border-box;
    }
    .topBarLink::after {
        content: "|"; /* Add the pipe character */
        margin-left: 8px; /* Add spacing between the text and the pipe */
        margin-right: 8px;
        padding: 0;
        color: inherit; /* Match the color of the text */
    }

    .topBarLink:last-child::after {
        content: ""; /* Remove the pipe for the last item */
    }
.nav-header {
    border-top: 4px solid #1C803F; /* Add a thin green line */
    display: flex;
    align-items: center;
    justify-content: center;
    background: #03204b;
    min-height: 75px;
    /*padding: 16px 6px;*/
    gap: 12px;
    width: 100%;
    padding: 0;
    margin: 0;
}

    .nav-header a {
        font-family: 'Inter', sans-serif;
        font-size: 14px;
        background: #03204b;
        cursor: pointer;
        color: white;
        white-space: nowrap;
        padding: 12px 16px;
        min-height: 46px;
        width: auto;
        text-decoration: none;
        display: flex;
        align-items: center;
        justify-content: center;
        box-sizing: border-box;
        margin: 0;
    }

        .nav-header a:hover,
        .nav-header a.active {
            background: #1C893F;
            color: white;
        }

.secondary-nav {
    display: flex;
    align-items: center;
    justify-content: left;
    background: #03204b;
    min-height: 40px;
    /*padding: 16px 6px;*/
    gap: 8px;
    width: 1200px;
    padding: 10px;
    margin: 0 auto;
}

    .secondary-nav a {
        background: #fff;
        color: #1C803F;
        border-radius: 4px;
        height: 36px;
        line-height: 36px;
        font-weight: bold;
        padding: 0 16px;
        text-decoration: none;
    }

        .secondary-nav a:hover,
        .secondary-nav a.active {
            background: #1C893F;
            color: #fff;
        }
.secondary-nav-banner {
    background-color: #f9f9f9;
    width: 1220px;
}
.tertiary-nav {
    display: flex;
    align-items: center;
    justify-content: left;
    background: #BCC7A9;
    min-height: 40px;
    /*padding: 16px 6px;*/
    gap: 8px;
    width: 1200px;
    padding: 10px;
    margin: 0 auto;
}

    .tertiary-nav a {
        background: #fff;
        color: #1C803F;
        border-radius: 4px;
        height: 36px;
        line-height: 36px;
        font-weight: bold;
        padding: 0 16px;
        text-decoration: none;
    }

        .tertiary-nav a:hover,
        .tertiary-nav a.active {
            background: #1C893F;
            color: #fff;
        }

.tertiary-link {
    background: #fff;
    color: #1C803F;
    border-radius: 4px;
    height: 36px;
    line-height: 36px;
    font-weight: bold;
    padding: 0 16px;
    text-decoration: none;
    display: inline-block; 
}

    .tertiary-link:hover,
    .tertiary-link.active {
        background: #1C893F;
        color: #fff;
    }
.tertiary-nav-banner {
    background-color: #f9f9f9;
    width: 1220px;
   
    height: 30px;
   
}
    .tertiary-nav-banner td {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }
/* Footer*/
#footer {
    /*display: flex;
    flex-direction: column;*/ /* Stack children vertically */
    /*align-items: center;*/ /* Center content horizontally */
    background-color: #2F322B; /* Optional: Set a background color */
    color: white; /* Optional: Set text color */
    /*padding: 10px 20px;*/ /* Add padding around the footer */
    width: 100%;
    text-align: center;
    padding: 0;
    margin: 0;
    
}

    #footer .row {
        display: flex;
        justify-content: space-between; /* Distribute items with space between them */
        align-items: center; /* Vertically align items */
        width: 100%; /* Ensure the row spans the full width */
        flex-wrap: wrap; /* Allow wrapping on smaller screens */
        margin-bottom: 3px; /* Add spacing between the row and copyright */
        
        height: 94px;
    }

.footer-nav {
    flex: 1; /* Allow the navigation to take up remaining space */
    text-align: center; /* Center the navigation links */
}

    .footer-nav a {
        font-weight: 400;
        font-family: 'Inter', sans-serif;
        color: #fff;
        text-transform: uppercase;
        text-decoration: none;
    }

        .footer-nav a:hover {
            font-weight: 400;
            font-family: 'Inter', sans-serif;
            color: #fff;
            text-transform: uppercase;
            text-decoration: underline;
        }

#footer-copyright {
    text-align: right; /* Align the copyright text to the right */
    width: 98%; /* Ensure it spans the full width */
    margin-top: 0px; /* Add spacing above the copyright */
    color: #BCC7A9; /* Restore the white color for the text */
    font-size: 14px; /* Optional: Adjust font size for better readability */
    font-family: 'Inter', sans-serif; /* Ensure consistent font */
    padding: 0 10px 10px 0;
    margin: 0;
}
.footer-logo {
    vertical-align: top;
}
.greenLink {
    color: #1C803F;
    font-weight: 700;
}

/* ----- Global Styles ----- */
html, body {
    height: 100%; /* Ensure the body takes up the full height of the viewport */
    margin: 0;
    padding: 0;
    font-family: 'Inter', sans-serif;
    /*background-color: #EFF1EA;*/
     background-color: #eff1f3;
   
}

.standard-width {
    width:1216px;
}
.footnote {
    font-size: 12px;
}
td {
}
    
    td.status {
        font-weight: bold;
        color: #ff0000;
    }

    td.headListItem {
        padding-right: 5px;
        padding-left: 14px !important;
        background: #dddbdc;
        padding-bottom: 1px;
        padding-top: 1px;
        border-right: solid 1px #000;
        word-wrap: break-word;
        overflow-wrap: break-word;
    }

.page-container {
    width: 100%;
    margin: 0 auto;
    padding: 0;
    /*flex: 1;*/
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    min-height: 100%;
    align-items: center;
    justify-content: flex-start; /* aligns to the top*/
}

#outerContentWrapper {
    flex: 1;
    width: 100%; /* Ensures it spans the available width */
    box-sizing: border-box;
    background-color: #eff1f3;
    align-content: center;
    display: flex;
    justify-content: center; /* Centers the content horizontally */

    padding: 0; /* Remove padding */
    margin: 0; /* Remove margin */
    overflow: visible; /* Ensure no overflow constraints */
}

#contentWrapper {
    /*flex: 1;*/
    /*max-width: 1448px;*/
    /*width: 1216px;*/
    /*width: 100%;*/ /* Ensures it spans the available width */
    /*padding: 20px;*/
    box-sizing: border-box;
    width: 100%;
    padding: 0; /* Remove padding */
    margin: 0; /* Remove margin */
    background-color: #eff1f3;
    text-align: center;
}
    
/* ----- Banner Component (original, keep for compatibility) ----- */
.banner {
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 18px 24px 10px 28px;
    gap: 8px;
    /*width: 100%;*/
    width: 1216px;
    background: #FFFFFF;
    border-left: 4px solid #1C803F;
    box-shadow: 0px 4px 6px -1px rgba(0, 0, 0, 0.1), 0px 2px 4px -2px rgba(0, 0, 0, 0.1);
    border-radius: 8px;
    margin: 0 auto 20px auto;
    max-width:1216px;
}

    .banner h1 {
        width: 100%;
        font-weight: 700;
        font-size: 20px;
        line-height: 30px;
        letter-spacing: -0.449219px;
        color: #2F322B;
        margin: 0;
    }

    .banner h3 {
        padding-bottom: 3px;
        margin-bottom: 0px;
    }

    .banner h4 {
        padding-top: 3px;
        margin-top: 0;
    }

    .banner h5 {
        font-size: 12px;
    }

    .banner p {
        width: 100%;
        font-weight: 400;
        font-size: 16px;
        line-height: 24px;
        letter-spacing: -0.3125px;
        color: rgba(47, 50, 43, 0.7);
        margin: 0;
    }
   
.client-anchor-banner {
    display: flex; /* Use flexbox for horizontal alignment */
    justify-content: space-between; /* Space out the left and right sections */
    align-items: center; /* Vertically align items */
    box-sizing: border-box;
    width: 100%;
    background: #FFFFFF;
    border-left: 4px solid #1C803F;
    box-shadow: 0px 4px 6px -1px rgba(0, 0, 0, 0.1), 0px 2px 4px -2px rgba(0, 0, 0, 0.1);
    border-radius: 0 0 8px 8px;
    margin: 0 0 10px 0;
    padding: 2px 10px;
    /*max-width: 1216px;*/
}
    .client-anchor-banner left {
        width:50%;
        text-align: left;
    }
    .client-anchor-banner right {
        width: 50%;
        text-align: right;
    }

.banner-full-width {
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.banner-noBorder {
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 18px 24px 10px 28px;
    gap: 8px;
    
    background: #FFFFFF;
    box-shadow: 0px 4px 6px -1px rgba(0, 0, 0, 0.1), 0px 2px 4px -2px rgba(0, 0, 0, 0.1);
    border-radius: 8px;
    margin: 20px auto 20px auto;
    /*width: 100%;*/
    width:1216px;
}

.banner-card-body {
    font-family: 'Inter', sans-serif;
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
    color: rgba(47, 50, 43, 0.7);
    margin: 0 0 6px 0;
}

    .banner-card-body:last-child {
        margin-bottom: 0;
    }

.banner-card-error {
    font-family: 'Inter', sans-serif;
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
    color: #dc2626;
    margin: 0 0 6px 0;
}

.banner-card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
}


.banner-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
}

.banner-text {
    text-align: center;
    width: 100%;
}

    .banner-text p {
        color: rgba(47, 50, 43, 0.70);
        font-size: 14px;
        font-family: 'Inter', sans-serif;
        font-weight: 400;
        line-height: 20px;
        margin: 0 0 4px 0;
        padding: 0;
    }

        .banner-text p:last-child {
            margin-bottom: 0;
        }

/* ----- Radio Card (Figma style) ----- */
.radio-card {
    width: 100%;
    background: white;
    box-shadow: 0px 2px 4px -2px rgba(0, 0, 0, 0.10), 0px 4px 6px -1px rgba(0, 0, 0, 0.10);
    border-radius: 8px;
    outline: 1px solid rgba(47, 50, 43, 0.10);
    outline-offset: -1px;
    padding: 17px;
    margin-bottom: 20px;
    box-sizing: border-box;
}

.radio-row {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 32px;
}

.radio-option {
    display: flex;
    align-items: center;
    gap: 8px;
}

    .radio-option input[type="radio"] {
        margin: 0;
        width: 16px;
        height: 16px;
        accent-color: #1C803F;
    }

    .radio-option label {
        color: #2F322B;
        font-size: 16px;
        font-family: 'Inter', sans-serif;
        font-weight: 500;
        line-height: 24px;
        white-space: nowrap;
        cursor: pointer;
      
    }

.tooltip-icon {
    color: #1C803F;
    font-size: 14px;
    font-family: 'Inter', sans-serif;
    font-weight: 500;
    line-height: 20px;
    text-decoration: none;
    background: transparent;
    border: none;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    transition: background 0.2s;
    border-radius: 50%;
}

    .tooltip-icon:hover {
        background: rgba(28, 128, 63, 0.1);
    }

@media (max-width: 600px) {
    .radio-row {
        gap: 16px;
    }

    .radio-option label {
        white-space: normal;
    }
}

/* ----- Card Component (Base) ----- */
.card-grid {
    display: flex;
    gap: 20px;
    min-height: 0;
    width: 100%;
    margin: 0 auto;
    max-width: 1216px;
}

    .card-grid > .card {
        flex: 1;
        min-width: 0;
    }

.card {
    /*flex: 1;*/
    background: #FFFFFF;
    border: 1px solid rgba(47, 50, 43, 0.1);
    box-shadow: 0px 4px 6px -1px rgba(0, 0, 0, 0.1), 0px 2px 4px -2px rgba(0, 0, 0, 0.1);
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    font-family: 'Inter', sans-serif;
}
.card-header {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 70px;
    padding: 0;
    margin: 0;
    background: #03204b;
    border-bottom: 2px solid #1C803F;
}
.card-header-title {
    margin: 0; /* Remove extra margin */
    padding: 0; /* Remove extra padding */
    text-align: center; /* Center text horizontally */
    font-family: 'Inter', sans-serif;
    font-weight: bold;
    font-size: 20px;
    color: #FFFFFF;
    width: 100%; /* Ensure it spans the full width */
   
}

.card-header-compact {
    background: #03204b;
    border-bottom: 2px solid #1C803F;
    padding: 16px 16px 2px 16px;
    height: 61px;
    display: flex;
    align-items: flex-end;
    box-sizing: border-box;
}

    .card-header-compact .card-header-title {
        text-align: left;
        font-weight: 500;
        font-size: 18px;
        line-height: 27px;
        color: #FFFFFF;
        margin: 0;
        width: 100%;
    }

.card-content {
    padding: 24px 24px 0 24px;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    /*flex: 1;*/
}

.card-content-flush {
    padding: 0;
    flex: 1;
}



.table-card {
    padding: 12px 0 0 0;
    border-radius: 8px;
    border-spacing: 0;
    border-collapse: collapse;
   
    border: none;
    background: transparent;
    box-shadow: 0px 4px 6px -1px rgba(0, 0, 0, 0.1), 0px 2px 4px -2px rgba(0, 0, 0, 0.1);
    overflow: hidden;
    width: 1216px;
    margin: 8px auto;
}

    .table-card tr, .table-card td {
        padding: 0;
        margin: 0;
    }

.table-card-title {
    font-family: 'Inter', sans-serif;
    font-weight: bold;
    font-size: 20px;
    line-height: 27px;
    text-align: center;
    letter-spacing: -0.439453px;
    color: #FFFFFF;
    margin: 0;
    width: 100%;
    background: #03204b;
    border-bottom: 2px solid #1C803F;
    padding: 20px 24px 20px 24px;
    height: 70px;
    padding-left: 10px !important;
}

    .table-card-title td:first-child {
        padding: 0 0 0 10px;
    }

.table-card-title-small {
    font-family: 'Inter', sans-serif;
    font-weight: bold;
    font-size: 16px;
    line-height: 20px;
    text-align: left;
    letter-spacing: -0.439453px;
    color: #FFFFFF;
    margin: 0;
    width: 100%;
    background: #03204b;
    border-bottom: 2px solid #1C803F;
    padding: 18px 20px 18px 24px;
    /*height: 50px;*/
    padding-left: 10px !important;
}
.table-card-title-small td:first-child {
    padding: 0 0 0 10px;
}
.table-card-title-small th {
    color: #FFFFFF !important;
}
.table-card-title-small a {
    color: #FFFFFF !important;
}
.table-full-width {
    position: relative; /* Keep the table in the document flow */
    /*left: 0;*/ /* Align to the very left of the viewport */
    /*width: 98%;*/ /* Full viewport width */
    max-width: 98% !important; /* Prevent any constraints */
    width: 98% !important;
    margin: 0 auto; /* Center the table horizontally */
    padding: 0; /* Remove any padding */
    box-sizing: border-box; /* Include padding and borders in width */
}

.table-search-container {
    background-color: #fff !important;
    width: 1216px;
    min-width:1216px;
    margin: 0 auto;
   /* display: flex;
    align-items: center;
    justify-content: left;
    gap: 8px;*/
}
   
.table-search-container-cell {
    padding-top: 10px !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
    padding-bottom: 10px !important;
   
}

/* ----- Table Styles (updated Figma design) ----- */
.table-container {
width: 100%;
overflow-x: auto;
margin-top: 0;

}

.invoice-table {
    width: 99%;
    min-width:99%;
    /*min-width:1206px;*/
    border-collapse: collapse;
    font-family: 'Inter', sans-serif;
    font-size: 14px;
    background: #FFFFFF;
    /*box-shadow: 0px 2px 4px -2px rgba(0, 0, 0, 0.10), 0px 4px 6px -1px rgba(0, 0, 0, 0.10);*/
/*    outline: 1px solid rgba(47, 50, 43, 0.10);*/
    /*outline-offset: -1px;*/
    /*border-radius: 0 0 6px 6px;*/
    overflow: hidden;
    margin: 6px 6px 6px 6px;
}

    .invoice-table thead {
        background: #d6e4ec;
    }

    .invoice-table th {
        color: #2F322B;
        font-size: 16px;
        font-family: 'Inter', sans-serif;
        font-weight: bold;
        line-height: 20px;
        padding: 12px 8px;
        text-align: left;
        /*white-space: nowrap;*/
        border-bottom: none;
        overflow: visible !important;
        white-space: normal !important;
        text-overflow: clip !important;
        word-wrap: break-word;
        max-width: none;
    }
    /*.invoice-table-custom th:nth-child(1) {
    width: 10%;
}
.invoice-table-custom th:nth-child(2) {
    width: 13%;
}
.invoice-table-custom th:nth-child(3) {
    width: 18%;
}
.invoice-table-custom th:nth-child(4) {
    width: 25%;
}
.invoice-table-custom th:nth-child(5) {
    width: 13%;
}
.invoice-table-custom th:nth-child(6) {
    width: 21%;
    text-align: center;
}*/
    .invoice-table td {
        color: #2F322B;
        font-size: 14px;
        font-family: 'Inter', sans-serif;
        font-weight: 400;
        line-height: 20px;
        padding: 12px 8px;
        /*border-bottom: 1px solid #D7DDCB;*/
        vertical-align: middle;
    }

  /*  .invoice-table tbody tr:last-child td {
        border-bottom: none;
    }*/

    .invoice-table .alt-row {
        background-color: #f9f9f9;
    }

    .invoice-table .highlight {
        background-color: #FFE5B4;
    }

   /* .invoice-table td:last-child {
        text-align: center;
        white-space: nowrap;
    }*/

/* ----- Action Buttons (for tables) ----- */
.action-cell {
    text-align: center;
  
}

.action-cell-inner {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: center;
}
.action-cell-checkbox {
    text-align: center;
    vertical-align: middle;
    background: rgba(28, 128, 63, 0.10);
    word-wrap: break-word;
    white-space: normal;
}
td.goldBox, span.goldBox {
    border-right: #a19a81 1px solid;
    padding-right: 4px;
    border-top: #a19a81 1px solid;
    padding-left: 4px;
    font-weight: normal;
    padding-bottom: 0px;
    margin: 0px;
    border-left: #a19a81 1px solid;
    padding-top: 0px;
    border-bottom: #a19a81 1px solid;
    background-color: #ffcb24;
    text-align: left;
}

.action-btn-nowrap {
    white-space: nowrap;
    display: inline-block;
    overflow: visible;
}

.action-btn-nowrap-cell {
    white-space: nowrap;
    overflow: visible;
    vertical-align: middle;
}

.action-btn, .button {
    display: inline-block;
    background: rgba(28, 128, 63, 0.10);
    border-radius: 4px;
    border: solid 1px #000;
    color: #3A6F69;
    font-size: 16px;
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    line-height: 40px;
    text-align: center;
    padding-right: 12px;
    padding-left: 12px;
    text-decoration: none;
    margin-right: 8px;
    transition: background 0.2s;
    height: 42px;
}

    .action-btn:hover, .button:hover {
        /*background: rgba(28, 128, 63, 0.20);*/
        /*color: #1C803F;*/
        text-decoration: none;
        cursor: pointer;
        background: #515253;
        color: white;
    }

    .action-btn:last-child {
        margin-right: 0;
    }
.action-btn-small {
    font-size: 14px;
    line-height: normal;
    height: auto;
}

/* Exact button widths from Figma (optional) */
.action-btn-finish {
    width: 116.42px;
}

.action-btn-remove {
    width: 71.78px;
}
.action-btn.disabled, .button.disabled,
.action-btn:disabled, .button:disabled {
    background: #e0e0e0;
    color: #9e9e9e;
    cursor: not-allowed;
    /*pointer-events: none;*/
    opacity: 0.6;
}

    .action-btn.disabled:hover, .button.disabled:hover,
    .action-btn:disabled:hover, .button:disabled:hover {
        background: #e0e0e0;
        color: #9e9e9e;
        cursor: not-allowed;
    }
.action-btn-red {
    color: rgba(180, 0, 0, .7);
    background: rgba(220, 53, 69, 0.10);
}
/* ----- Legacy Button Classes (kept for compatibility) ----- */
.buttonLarge,
.buttonAlternate {
    width: 100% !important;
    min-height: 48px !important;
    height: auto !important;
    background: rgba(28, 128, 63, 0.1) !important;
    border-radius: 4px !important;
    border: solid 1px #000 !important;
    font-family: 'Inter', sans-serif !important;
    font-weight: 700 !important;
    font-size: 16px !important;
    line-height: 24px !important;
    text-align: center !important;
    letter-spacing: -0.3125px !important;
    color: #3A6F69 !important;
    cursor: pointer;
    margin: 0 0 0 0;
    margin-bottom: 12px !important;
    transition: background 0.2s;
    box-sizing: border-box;
    white-space: normal !important;
    word-wrap: break-word !important;
    padding: 11px 16px;
    text-decoration: none;
}

    .buttonLarge:hover,
    .buttonAlternate:hover {
        background: rgba(28, 128, 63, 0.2) !important;
    }


/*.button {
    display: inline-block;
    background: rgba(28, 128, 63, 0.10);
    border-radius: 4px;
    border: none;
    color: #1C803F;
    font-size: 16px;
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    line-height: 40px;
    text-align: center;
    padding-right: 12px;
    padding-left: 12px;
    text-decoration: none;
    margin-right: 8px;
    transition: background 0.2s;
    height: 42px;
    cursor:pointer;*/
    /*    font-size: 13px;
    background: #62879C;
    cursor: pointer;
    color: white;
    white-space: nowrap;
    padding: 2px;
    border: #ccc 1px outset;*/
/*}*/

  /*  .button:hover {
        background: #515253;
        color: white;
    }*/

/*.button.disabled,
.button:disabled {
    background: #e0e0e0;
    color: #9e9e9e;
    cursor: not-allowed;
    pointer-events: none;
    opacity: 0.6;
}

.button.disabled:hover,
.button:disabled:hover {
    background: #e0e0e0;
    color: #9e9e9e;
    cursor: not-allowed;
}*/

.buttonYellow {
    border: #ccc 1px outset;
    font-weight: bold;
    font-size: 13px;
    background: yellow;
    cursor: pointer;
    font-family: "Lato", sans-serif;
}
.buttonRetrieve {
    background: #dea045;
    color: white;
    font-weight: bold;
    padding: 2px;
    cursor: pointer;
    border: #ccc 1px outset;
}

    .buttonRetrieve:hover {
        background: #515253;
        color: white;
    }
.button1 {
    font-size: 13px;
    background: #62879C;
    cursor: pointer;
    color: white;
    font-family: "Lato", sans-serif;
    padding: 3px;
    border-radius: 5px;
    border: #ccc 1px outset;
    display: inline-block;
}

    .button1:hover {
        background: #515253;
    }

a.button1 {
    text-decoration: none;
}

    a.button1:hover {
        color: white;
    }

.button2 {
    border: none;
    font-weight: bold;
    font-size: 13px;
    background: #009999;
    border: #ccc 1px outset;
    cursor: pointer;
    color: #FFFFFF;
    padding: 2px;
    font-family: "Lato", sans-serif;
}

    .button2:hover {
        background: #515253;
        color: white;
    }

.buttonPurple {
    border: none;
    font-weight: bold;
    font-size: 13px;
    background: #a249a3;
    border: #ccc 1px outset;
    cursor: pointer;
    color: #FFFFFF;
    padding: 2px;
    font-family: "Lato", sans-serif;
}

    .buttonPurple:hover {
        background: #515253;
        color: white;
    }

.button3 {
    border: #ccc 1px outset;
    font-weight: bold;
    font-size: 13px;
    background: #FF0000;
    cursor: pointer;
    color: #FFFFFF;
    padding: 2px;
    font-family: "Lato", sans-serif;
}

    .button3:hover {
        background: #515253;
        color: white;
    }
.button3reversed {
    border-right: #ccc 1px outset;
    border-top: #ccc 1px outset;
    font-weight: bold;
    font-size: 13px;
    background: #FFFFFF;
    border-left: #ccc 1px outset;
    cursor: pointer;
    color: #FF0000;
    border-bottom: #ccc 1px outset;
    font-family: "Lato", sans-serif;
}
#btnViewSubmittedRequests,
.btn-tall {
    height: 72px !important;
    white-space: normal;
    line-height: 24px;
    padding: 11px 0;
}

/* ----- Client Info Panel ----- */
.client-info-panel {
    font-size: 16px;
    line-height: 24px;
    letter-spacing: -0.3125px;
    color: #2F322B;
    margin-bottom: 20px;
}

    .client-info-panel p {
        margin: 0 0 8px 0;
        display: flex;
        align-items: center;
    }

    .client-info-panel strong {
        font-weight: 600;
        width: 70px;
        display: inline-block;
    }

    .client-info-panel span {
        font-weight: 400;
    }

/* ----- CCLR Container ----- */
.cclr-container {
    background: rgba(28, 128, 63, 0.1);
    border-radius: 8px;
    padding: 17px 17px 1px 17px;
    margin-top: 20px;
    width: 100%;
    box-sizing: border-box;
    text-align: center;
}

    .cclr-container .buttonAlternate {
        width: 100% !important;
        background: transparent !important;
        font-size: 14px !important;
        line-height: 20px !important;
        letter-spacing: -0.150391px !important;
        height: auto !important;
        white-space: normal;
        padding: 0;
        margin-bottom: 0 !important;
        display: inline-block;
    }

/* ----- Utility Classes ----- */
.text-center {
    text-align: center;
}

.mb-0 {
    margin-bottom: 0 !important;
}

.nowrap {
    white-space: nowrap;
}

.errors {
    color: #d32f2f;
    background: #ffebee;
    padding: 10px;
    border-radius: 4px;
    margin-bottom: 15px;
}

.redError {
    color: #d32f2f !important;
    font-weight: bold;
}

/*.sort-link {
    color: #2F322B;
    text-decoration: none;
    font-weight: 500;
}

    .sort-link:hover {
        color: #1C803F;
        text-decoration: underline;
    }*/

.download-btn {
    background: rgba(28, 128, 63, 0.1);
    border: none;
    border-radius: 4px;
    color: #1C803F;
    font-weight: 700;
    font-size: 14px;
    padding: 6px 12px;
    cursor: pointer;
    text-decoration: none;
    display: inline-block;
    transition: background 0.2s;
}

    .download-btn:hover {
        background: rgba(28, 128, 63, 0.2);
        text-decoration: none;
        color: #1C803F;
    }

/* ----- Modal Popup (global background) ----- */
.modalPopupClearV {
    background: #EFF1EA !important;
    border: none !important;
    border-radius: 8px;
    box-shadow: 0px 4px 6px -1px rgba(0, 0, 0, 0.1), 0px 2px 4px -2px rgba(0, 0, 0, 0.1);
    padding: 0 !important;
}

    .modalPopupClearV > div {
        background: transparent;
        color: #2F322B;
        font-family: 'Inter', sans-serif;
        font-size: 14px;
        line-height: 20px;
    }
.modalBackgroundV {
    background-color: #808080;
    filter: alpha(opacity=70);
    opacity: 0.7;
    z-index: 1;
    position: absolute;
    top: 4px;
    left: 4px;
    height: 1240px;
}

.btnOkToolTip {
    background: rgba(28, 128, 63, 0.1);
    border: none;
    border-radius: 4px;
    color: #1C803F;
    font-weight: 700;
    font-size: 14px;
    padding: 8px 16px;
    cursor: pointer;
    transition: background 0.2s;
}

    .btnOkToolTip:hover {
        background: rgba(28, 128, 63, 0.2);
    }

/* Hide old title strokes */
.module-title-stroke {
    display: none;
}



/* Responsive adjustments */
@media (max-width: 1000px) {
    .card-grid {
        flex-direction: column;
    }

    .top-nav {
        padding: 0 20px 2px;
    }

    .nav-inner {
        flex-wrap: wrap;
        height: auto;
        padding: 10px 0;
    }
}

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

.align-left {
    text-align: left !important;
}

.align-center {
    text-align: center;
    justify-content: center !important;
}

.align-middle {
    vertical-align: middle;
}

.promptSpacer {
    padding-left: 8px !important;
}

.detailLabel {
    font-size: 15px;
    font-weight: 500;
    line-height: 20px;
    color: #000;
}

.textbox1 {
    width: 500px;
}
#phFirmsEmployeesInfo .card,
.repeater-card {
    width: 100%;
    box-sizing: border-box;
}

.card-content-flush {
    padding: 0;
    flex: 1;
    width: 100%;
    box-sizing: border-box;
}

    .card-content-flush .table-container {
        width: 100%;
        overflow-x: auto;
    }

        .card-content-flush .table-container .invoice-table {
            width: 100%;
            table-layout: fixed;
        }

.invoice-table th,
.invoice-table td {
    overflow: hidden;
   /* text-overflow: ellipsis;*/
    /*white-space: nowrap;*/
    font-weight: bold;
    border: solid 1px #2F322B;
}
    .invoice-table th a {
        text-decoration: underline;
        color: #2F322B;
        
    }
    .invoice-table th a:hover {
        text-decoration: underline;
        color: #1C893F;
    }
/* Inputs */
input[type="text"] {
    border: 1px solid #000; /* Add a border */
    border-radius: 4px; /* Round the corners */
    font-size: 16px; /* Set font size */
    font-family: 'Inter', sans-serif;
    box-sizing: border-box; /* Include padding and border in width */
    height: 40px;
}

input[type="checkbox"] {
    width: 16px;
    height: 16px;
    /*accent-color: #1C803F;*/
}


a {
    color: #1C803F;
}
select {
    /*width: 100%;*/ /* Make dropdowns full width */
    padding: 8px; /* Add padding inside the dropdown */
    border: 1px solid #000; /* Add a border */
    border-radius: 4px; /* Round the corners */
    font-size: 16px; /* Set font size */
    font-family: 'Inter', sans-serif; /* Use a consistent font */
    background-color: #fff; /* Set background color */
    box-sizing: border-box; /* Include padding and border in width */
    height: 40px; /* Set a consistent height */
    /*appearance: none;*/ /* Remove default browser styles */
}

.info-icon {
    text-decoration: none !important;
}

a.info-icon,
a.info-icon:hover,
a.info-icon:visited {
    text-decoration: none !important;
}

:root {
    --primary-green: #1C803F;
    --dark-green: #2F322B;
    --muted-green: #BCC7A9;
    --medium-muted: #D7DDCB;
    --light-muted: #EFF1EA;
    --primary-bg: rgba(28, 128, 63, 0.1);
}

/*
.modern-form {
    max-width: 1200px;
    margin: 0 auto;
    width: 100%;
    background: white;
    border-radius: 1rem;
    box-shadow: 0 10px 25px rgba(0,0,0,0.05);
    padding: 2rem;
}*/

table.anchorWide {
    width: 100%;
    border-collapse: collapse;
    background: transparent;
}

    table.anchorWide td,
    table.anchorWide th {
        padding: 0.5rem;
        border: none;
        vertical-align: top;
    }

.doubleBordered {
    border: 2px solid var(--primary-green);
    outline: 2px solid var(--primary-green);
    outline-offset: 2px;
    border-radius: 1rem;
}

.form-grid-2, .form-grid-3, .form-grid-4 {
    display: grid;
    gap: 1.5rem 2rem;
}

.form-grid-2 {
    grid-template-columns: repeat(2, 1fr);
}

.form-grid-3 {
    grid-template-columns: repeat(3, 1fr);
}

.form-grid-4 {
    grid-template-columns: repeat(4, 1fr);
}

@media (max-width: 768px) {
    .form-grid-2, .form-grid-3, .form-grid-4 {
        grid-template-columns: 1fr;
    }
}

.field-group {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    width: 100%;
}
.field-group-inline {
    display: flex;
    flex: 1;
    align-items: center;
    gap: 0.5rem;
    width: 100%;
}
.field-group-third {
    width: 30%;
}

.field-label {
    font-size: 15px;
    font-weight: 700;
    line-height: 20px;
    color: #000;
    display: inline;
    margin: 0;
    padding: 0;
    vertical-align: middle;
    /*opacity: 0.6;*/
    /*font-weight: 500;
    font-size: 0.9rem;
    color: var(--dark-green);*/
}
.field-label-inline {
    font-size: 15px;
    font-weight: 500;
    line-height: 20px;
    color: #000;
    display: inline;
    margin: 0;
    padding: 0;
    vertical-align: middle;
    line-height: 40px;
}
.field-label-cell {
    font-size: 15px;
    font-weight: 700;
    line-height: 20px;
    color: #000;
    margin: 0;
    padding: 0;
    vertical-align: middle;
}

.field-control {
    padding: 0.6rem 0.8rem;
    border: 1px solid #000;
    border-radius: 4px;
    font-size: 0.95rem;
    font-family: 'Inter', sans-serif;
    width: 100%;
    box-sizing: border-box;
}

.field-control-yes-no-ddl {
    width: 80px;
}
.field-control-date {
    padding: 0.6rem 0.8rem;
    border: 1px solid #cbd5e1;
    border-radius: 4px;
    font-size: 0.95rem;
    font-family: 'Inter', sans-serif;
    max-width: 200px;
    box-sizing: border-box;
}

.child-group-container {
    display: flex;   
    flex-direction: column; /* Items are in a row */
    justify-content: space-between; /* Space between items */
    align-items: center; /* Align items vertically */
    gap: 1rem; /* Add spacing between items */
    border: solid 1px #000;
    font-size: 13px;
}
    .child-group-container .field-label{
        font-size: 13px;
        width: 120px;
        text-align: left;
    }
    .child-group-container .field-control {
        flex-grow:1;
    }
    .child-group-container input[type="text"] {
        max-width: 400px;
        
    }
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.6rem 1.5rem;
    border-radius: 4px;
    font-weight: 700;
    font-size: 16px;
    line-height: 24px;
    letter-spacing: -0.3125px;
    border: none;
    cursor: pointer;
    font-family: 'Inter', sans-serif;
}

.btn-primary {
    background: var(--primary-green);
    color: white;
}

    .btn-primary:hover {
        background: #146633;
    }

.btn-secondary {
    background: var(--primary-bg);
    color: var(--primary-green);
}

    .btn-secondary:hover {
        background: rgba(28, 128, 63, 0.2);
    }

.alert-info {
    background: var(--light-muted);
    border-left: 4px solid var(--primary-green);
    padding: 1rem 1.5rem;
    border-radius: 0.5rem;
    font-family: 'Neue Haas Grotesk Text Pro', sans-serif;
}

.error-message {
    color: #dc2626;
    font-size: 16px;
    font-weight: 700 !important;
}

.validation-summary {
    background: #fee2e2;
    border: 1px solid #fecaca;
    border-radius: 0.5rem;
    padding: 1rem;
    color: #b91c1c;
    margin-bottom:10px
}

.info-icon {
    display: inline-block;
    width: 24px;
    height: 24px;
    background: var(--primary-green);
    color: white;
    border-radius: 50%;
    text-align: center;
    line-height: 24px;
    font-weight: bold;
    cursor: pointer;
    font-size: 16px;
    text-decoration: none !important;
}

a.info-icon:hover {
    text-decoration: none !important;
    opacity: 0.85;
}

.red-text {
    color: #dc2626;
    font-weight: bold;
    text-decoration: none;
    cursor: pointer;
}

.stepper {
    display: flex;
    gap: 2rem;
    justify-content: center;
    margin: 2rem 0;
}

.step {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.step-number {
    width: 32px;
    height: 32px;
    background: var(--medium-muted);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
}

.step.active .step-number {
    background: var(--primary-green);
    color: white;
}

.radio-group-horizontal {
    display: flex;
    gap: 2rem;
    /*flex-wrap: wrap;*/
    align-items: flex-start;
    justify-content: flex-start;
    font-size: 15px; 
    line-height: 20px;
   
   /* margin:0;
    padding:0;*/
}
    .radio-group-horizontal td {
        padding-right:16px;
    }

.double-border-card {
    border: 2px solid var(--primary-green);
    outline: 2px solid var(--primary-green);
    outline-offset: 2px;
    border-radius: 1rem;
    padding: 1.5rem;
    background: white;
    max-width: 800px;
    margin: 0 auto;
    text-align: center;
}

    .double-border-card > * {
        text-align: left;
        max-width: 100%;
    }

.section-card {
    background: white;
    border: 1px solid #e2e8f0;
    border-radius: 1rem;
    padding: 1.5rem 2rem;
    margin-bottom: 2rem;
    box-shadow: 0 2px 4px rgba(0,0,0,0.02);
}


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

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

.fw-bold {
    font-weight: bold;
}

.mt-3 {
    margin-top: 1rem;
}

.mt-4 {
    margin-top: 1.5rem;
}

.field-hint {
    font-size: 14px;
    color: #64748b;
    /*margin-top: 0.25rem;*/
}

.vs-table td:first-child {
    width: 120px;
    text-align: left;
    font-weight: 500;
    color: var(--dark-green);
}

.left-aligned {
    text-align: left;
    padding-left: 0;
}

table.clear {
    margin: 0 auto;
    width: 100%;
}

table.clear td {
   padding-right: 5px;
}

.clearWide {
    padding: 0px;
    width: 100%;
    border-collapse: collapse;
    background: transparent;
}
.yellow {
    background-color: yellow !important;
}

.step-status-card {
    background: white;
    border: 1px solid #e2e8f0;
    border-radius: 1rem;
    padding: 1.5rem;
    margin: 1rem 0;
    box-shadow: 0 2px 4px rgba(0,0,0,0.02);
   
}

.step-status-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
    align-items: center;
    font-size: 14px;
}

    .step-status-grid .status {
        font-weight: 600;
        white-space: nowrap;
    }
    .step-status-grid > div {
        margin: 0; /* Remove any default margins */
        padding: 0; /* Remove any default padding */
    }
.status.completed {
    color: var(--primary-green);
}

.status.tobecompleted {
    color: #b45309;
}

.step-status-table td {
    font-size: 14px;
}

.step-status-table .action-btn {

    font-size:14px;
    line-height: normal;
    height: auto;
}
/*------------------------------------------------------------------------------------*/
/* css for timepicker */
.ui-timepicker-div .ui-widget-header {
    margin-bottom: 8px;
}

.ui-timepicker-div dl {
    text-align: left;
}

    .ui-timepicker-div dl dt {
        float: left;
        clear: left;
        padding: 0 0 0 5px;
    }

    .ui-timepicker-div dl dd {
        margin: 0 10px 10px 45%;
    }

.ui-timepicker-div td {
    font-size: 90%;
}

.ui-tpicker-grid-label {
    background: none;
    border: none;
    margin: 0;
    padding: 0;
}

.ui-timepicker-rtl {
    direction: rtl;
}

    .ui-timepicker-rtl dl {
        text-align: right;
        padding: 0 5px 0 0;
    }

        .ui-timepicker-rtl dl dt {
            float: right;
            clear: right;
        }

        .ui-timepicker-rtl dl dd {
            margin: 0 45% 10px 10px;
        }

/* color changes override */
.ui-datepicker-header, .ui-datepicker-title {
    background-color: #03204b !important;
    color: #fff;
    font-family: 'Inter', sans-serif;
    font-size: 18px;
}

.ui-state-default {
    border: solid 1px gray !important;
}

.ui-state-active {
    background-color: #1C803F !important;
    color: white !important;
}


.ui-datepicker-prev, .ui-datepicker-next {
    background-color: rgb(255,246,216) !important;
    cursor: pointer;
    background-repeat: no-repeat;
    background-position: center !important;
    -moz-background-size: 15px 13px !important;
    -o-background-size: 15px 13px !important;
    -webkit-background-size: 15px 13px !important;
    background-size: 15px 13px !important;
}

.ui-datepicker-prev-hover, .ui-datepicker-next-hover {
    background: none !important;
    background-repeat: no-repeat !important;
    background-color: rgb(239, 241, 234) !important;
    cursor: pointer;
    background-size: 0px !important;
    background-position: center;
}

.ui-datepicker-calendar th {
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    border: solid thin #a19a81;
}

.ui-datepicker-next {
    background-image: url(../Images/arrowRt.png) !important;
}

.ui-datepicker-prev {
    background-image: url(../Images/arrowLt.png) !important;
}
    
.ui-datepicker-month {
}   

.datepickerClass {
    width: 250px !important;
}

#ui-datepicker-div {
    background-color: rgb(239, 241, 234) !important;
    border: solid 2px gray;
    width: 240px;
    font-size: 14px;
}

.single-border {
    border: solid 1px #a19a81;
    padding: 10px;
    text-align: left;
}
.linkButton, .linkButtonLarge {
    color: white;
    text-decoration: none;
    padding: 4px;
    background-color: #62869c;
    white-space: nowrap;
    font-family: "Lato", sans-serif;
    padding: 5px;
    border-radius: 5px;
}

    .linkButton:hover, .linkButtonLarge:hover {
        background-color: #465a65;
        color: white;
        cursor: pointer;
    }

.linkButtonLarge {
    vertical-align: central !important;
    height: 30px !important;
}

.button3 {
    border: #ccc 1px outset;
    font-weight: bold;
    font-size: 13px;
    background: #FF0000;
    cursor: pointer;
    color: #FFFFFF;
    padding: 2px;
    font-family: "Lato", sans-serif;
}

    .button3:hover {
        background: #515253;
        color: white;
    }

.button3reversed {
    border-right: #ccc 1px outset;
    border-top: #ccc 1px outset;
    font-weight: bold;
    font-size: 13px;
    background: #FFFFFF;
    border-left: #ccc 1px outset;
    cursor: pointer;
    color: #FF0000;
    border-bottom: #ccc 1px outset;
    font-family: "Lato", sans-serif;
}
.box a.button {
    display: block;
    width: fit-content;
    white-space: normal;
    word-wrap: break-word;
    margin-bottom: 4px;
}

.button-repeater {
    display: block; 
    width: fit-content; 
    max-width: 100%; 
    height: auto; 
    line-height: 1.4; 
    padding-top: 10px;
    padding-bottom: 10px; 
    background: rgba(28, 128, 63, 0.10);
    border-radius: 4px;
    border: none;
    color: #1C803F;
    font-size: 16px;
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    text-align: center;
    padding-right: 12px;
    padding-left: 12px;
    text-decoration: none;
    margin-bottom: 6px; /* was margin-right: 8px - stack vertically now */
    transition: background 0.2s;
    cursor: pointer;
    white-space: normal;
    word-wrap: break-word;
    box-sizing: border-box;
}
.hLink {
    text-decoration: none;
    cursor: pointer;
}

    .hLink:hover {
        text-decoration: none;
        cursor: pointer;
    }

td.redBox {
    border-right: #a19a81 1px solid;
    padding-right: 4px;
    border-top: #a19a81 1px solid;
    padding-left: 4px;
    font-weight: bold;
    padding-bottom: 0px;
    margin: 0px;
    border-left: #a19a81 1px solid;
    padding-top: 0px;
    border-bottom: #a19a81 1px solid;
    background-color: #ff0000;
    text-align: left;
}

td.greenBox {
    border-right: #a19a81 1px solid;
    padding-right: 4px;
    border-top: #a19a81 1px solid;
    padding-left: 4px;
    font-weight: bold;
    padding-bottom: 0px;
    margin: 0px;
    border-left: #a19a81 1px solid;
    padding-top: 0px;
    border-bottom: #a19a81 1px solid;
    background-color: #33CC33;
    text-align: left;
}

td.brownBox {
    border-right: #a19a81 1px solid;
    padding-right: 4px;
    border-top: #a19a81 1px solid;
    padding-left: 4px;
    font-weight: bold;
    padding-bottom: 0px;
    margin: 0px;
    border-left: #a19a81 1px solid;
    padding-top: 0px;
    border-bottom: #a19a81 1px solid;
    background-color: #CC9900;
    text-align: left;
}

.modalPanel {
    background-color: beige !important;
    width: 25% !important;
    color: black !important;
}

.custom-add-note-modal .table-card {
    border: none !important;
    box-shadow: 0px 4px 6px -1px rgba(0, 0, 0, 0.1), 0px 2px 4px -2px rgba(0, 0, 0, 0.1);
}

.custom-add-note-modal .table-card-title {
    background: #03204b;
    border-bottom: 2px solid #1C803F;
    color: white;
    padding: 12px;
}

.custom-add-note-modal .table-search-container-cell {
    padding: 20px;
}

.custom-add-note-modal .field-label {
    font-weight: bold;
    margin-bottom: 4px;
    display: block;
}

.custom-add-note-modal .field-control {
    width: 100%;
    padding: 8px;
    border: 1px solid #ccc;
    border-radius: 4px;
}

.custom-add-note-modal .error-message {
    color: #d32f2f;
    font-size: 12px;
}

.modalPopupClearV-override {
    background: #EFF1EA !important;
    border: none !important;
    border-radius: 8px;
    box-shadow: 0px 4px 6px -1px rgba(0, 0, 0, 0.1), 0px 2px 4px -2px rgba(0, 0, 0, 0.1);
    padding: 0 !important;
}

    .modalPopupClearV-override > div {
        background: transparent;
        color: #2F322B;
        font-family: 'Inter', sans-serif;
        font-size: 14px;
        line-height: 20px;
    }
/*td.boxCtr {
    border-right: #a19a81 1px solid;
    padding-right: 4px;
    border-top: #a19a81 1px solid;
    padding-left: 4px;
    padding-bottom: 0px;
    margin: 0px;
    border-left: #a19a81 1px solid;
    padding-top: 0px;
    border-bottom: #a19a81 1px solid;
    background-color: #efefef;
    text-align: center;
}
td.altBoxCtr {
    background: #dcdbdc;
    margin: 0px;
    text-align: center;
}

td.box {
    padding: 8px 4px 8px 4px;
    margin: 0;
    text-align: left;
    border: solid 1px #a19a81;
    background-color: #efefef;
}
td.altBox {
    padding: 8px 4px 8px 4px;
    background: #dcdbdc;
    margin: 0px;
    text-align: left;
    border: solid 1px #a19a81;
    border-collapse: collapse;
}*/

.bordered-section {
    display: inline-block;
    border: 2px solid black;
    padding: 15px;
    margin: 10px;
}

.ui-tooltip {
    background-color: #f9f9f9 !important;
    border: 1px solid #aaa !important;
    border-radius: 4px !important;
    padding: 8px 12px !important;
    font-size: 13px !important;
    font-family: 'Inter', sans-serif !important;
    color: #333 !important;
    max-width: 300px !important;
    box-shadow: 2px 2px 6px rgba(0,0,0,0.2) !important;
    opacity: 1 !important;
}

.ui-widget.ui-tooltip {
    background-color: #f9f9f9 !important;
    border: 1px solid #aaa !important;
}

.hLink {
    color: #62869c;
    font-weight: bold;
    text-decoration: none;
    cursor: pointer;
}
    .hLink:hover {
        text-decoration: none;
        cursor: pointer;
    }


.hlink_disabled {
    color: #ccc;
    font-weight: bold;
}