/****************************************
Table of Contents
/****************************************
- Partner Program Page
- PC Phases Page
- LT Phases Page
- Dashboard Reward Code Page
- Send Email Page
- Patient Invoice


- Global Elements
- Header
- Form Elements (Specific)
- Forms Page - Side Menu
- Forms Page

- Patient List
- LT Phases Page
- PC Phases Page
- Patient Info Tabs
- Patient Details
- Patient Activity
- Send Email Page
- Patient Documents Pages
- Patient Treatment Plan
- Patient Progress Charts
- Orders Page
- Patient Invoice
- Promo Codes Page
- Webinars
- Consultations Page
- Free Consultation Details
- Calendar Page
- Notes Page
- Partner Program Dashboard
- Partner Program Admin

****************************************/

.treatment-row {
    display: flex;
    flex-direction: row;
}

.treatment-row>* {
    flex: 1;
    /* Each child grows equally to fill the row */
}

.dosage-row {
    margin: 10px 0px;
    display: flex;
    gap: 15px;
    flex-wrap: wrap;
}

.dosage-info input[type=text] {
    width: 75px;
    padding: 6px !important;
    background: #fff;

}

#table-1 select {
    padding: 5px !important;
}

.treatment-notes select {
    padding: 5px !important;
}

.sp-header {
    display: flex;
    align-items: center;
    background: #eee;
    padding: 10px;
    justify-content: space-between;
    margin-bottom: 15px;
    font-size: 16px;
}

/* .sp-header-med-date label {
    font-size: 16px;
} */

.sp-header-left,
.sp-header-right {
    display: flex;
    align-items: center;
    gap: 20px;
}

.sp-header input[type="date"] {
    padding: 7px !important;
    background: #fff;

}

/* Compact label+input pair for the Actual Start / Stopped date fields
   added to the sp-header. Mirrors the spacing of sibling cells. */
.sp-header-med-date label {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 16px;
    color: #444;
    white-space: nowrap;
}

.sp-header-med-date input[type="date"] {
    font-size: 13px;
    padding: 2px 4px;
}

/* When a date has been entered, tint the field so it's visually
   obvious at a glance: green for Actual Start, red for Stopped.
   The .date-has-value class is toggled via JS on page load and on
   change/blur (see patient-treatment-plan-new.php). */
.sp-header-med-date input[data-field="med_start_date"].date-has-value {
    background-color: #d4edda;
    color: #155724;
    border-color: #b6dfc1;
}

.sp-header-med-date input[data-field="med_end_date"].date-has-value {
    background-color: #f8d7da;
    color: #721c24;
    border-color: #efb9bf;
}




#supplement-schedule-notes {
    margin-top: 30px;
}

#supplement-schedule-notes-title {
    font-size: 18px;
    font-weight: 600;
    margin: 0 0 14px 0;
    background-color: #ccc;
    padding: 10px;
}

.week-note-card {
    border: 1px solid #cccccc;
    border-radius: 6px;
    padding: 12px 16px;
    margin-bottom: 12px;
    background-color: #fafafa;
}

.week-note-card .week-note-header {
    font-weight: 600;
    color: #444;
    margin-bottom: 6px;
}

.week-note-card .week-note-body {
    color: #222;
    line-height: 1.5;
    white-space: normal;
    word-wrap: break-word;
}



.tp-drag-handle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 5px 17px 2px 10px;
    cursor: grab;
    color: #fff;
    background-color: #888;
    transition: color 0.2s;
}

/* .tp-drag-handle:hover {
    color: green;
} */

.tp-drag-handle:active {
    cursor: grabbing;
}

.tp-drag-handle .material-icons {
    font-size: 20px;
}

.treatment-plan-section.ui-sortable-helper {
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
    opacity: 0.95;
    transform: scale(1.005);
}

.treatment-plan-sortable-placeholder {
    border: 2px dashed seagreen;
    background: rgb(192, 213, 201);
    border-radius: 8px;
    margin-bottom: 16px;
    min-height: 60px;
}




#tp-collapse-controls {
    display: flex;
    gap: 10px;
    margin-bottom: 12px;
    justify-content: flex-end;
}

.tp-collapse-btn {
    display: flex;
    align-items: center;
    background-color: #fff;
    /* border: 1px solid #ccc; */
    border-radius: 20px;
    height: 20px;
    width: 20px;
    justify-content: center;
    /* padding: 2px 6px; */
    cursor: pointer;
    margin-left: 10px;
    margin-bottom: 5px;
    color: #000;
    transition: background 0.15s;
}

/* .tp-collapse-btn:hover {
    background: #f0f0f0;
} */

.tp-collapse-icon {
    font-size: 18px;
    transition: transform 0.2s;
}

.treatment-plan-section.is-collapsed .tp-collapse-icon {
    transform: rotate(180deg);
}

.treatment-plan-section.is-collapsed .treatment-notes {
    display: none;
}



#collapse-all-btn {
    background-color: #384974;
    color: #fff;
    padding: 7px 10px;
    border-radius: 5px;
}

#expand-all-btn {
    background-color: seagreen;
    color: #fff;
    padding: 7px 10px;
    border-radius: 5px;
}



/***************************************************************************************
General Information Page
***************************************************************************************/

.height-weight-input {
    display: flex;
    align-items: center;
    gap: 20px;
    background-color: #a6dfbf;
    padding: 5px 20px;
    margin-top: 15px;
    font-weight: bold;
}

.height-weight-input p {
    margin-right: 15px;
}

.height-weight-input div input {
    width: 100px;
    background-color: #fff;
}


/* .form-table-wrapper {
    background-color: #fff;
    margin: 0 20px;
    padding-top: 20px;
    padding-left: 20px;
    padding-right: 20px;

} */


#inline-supplement-schedule {
    margin-bottom: 20px;
}

#supplement-schedule-table {
    width: 100%;
    border-collapse: collapse;
    border: 1px solid #ccc;
    /* font-size: 0.875rem; */
}

#supplement-schedule-table thead tr {
    background-color: #3a6ea5;
    color: #fff;
}

#supplement-schedule-table th {
    padding: 10px 12px;
    text-align: left;
    font-weight: 600;
    white-space: nowrap;
}

#supplement-schedule-table td {
    padding: 10px 12px;
    border-bottom: 1px solid #e5e5e5;
}

/* #supplement-schedule-table tbody tr:nth-child(even) {
    background-color: #f7f9fc;
} */

#supplement-schedule-table tbody tr:hover {
    background-color: #eee;
}

#supplement-schedule-table tr.supp-stopped td {
    background-color: #ffebee !important;
}










#consultation-forms-table {
    width: 100%;
    border-collapse: collapse;
    border: 1px solid #ccc;
    /* font-size: 0.875rem; */
}

#consultation-forms-table thead tr {
    background-color: #3a6ea5;
    color: #fff;
}

#consultation-forms-table th {
    padding: 10px 12px;
    text-align: left;
    font-weight: 600;
    white-space: nowrap;
}

#consultation-forms-table td {
    padding: 10px 12px;
    border-bottom: 1px solid #e5e5e5;
}

#consultation-forms-table td:first-child {
    font-weight: bold;
}

/* #consultation-forms-table tbody tr:nth-child(even) {
    background-color: #f7f9fc;
} */

#consultation-forms-table tbody tr:hover {
    background-color: #eee;
}

#consultation-forms-table tr.supp-stopped td {
    background-color: #ffebee !important;
}

.badge-active,
.badge-stopped {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 12px;
    font-size: 14px;
    /* font-weight: 600; */
    white-space: nowrap;
}

.badge-active {
    background-color: seagreen;
    color: #fff;
}

.badge-stopped {
    background-color: crimson;
    color: #fff;
}


/***************************************************************************************
Membership Status Page
***************************************************************************************/



.quick-nav-wrapper {
    display: flex;
    align-items: center;
    justify-content: space-between;

}

.quick-nav {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 20px;
    font-weight: bold;
}

/* .quick-nav-r {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 20px;
    font-weight: bold;
} */

.form-btn-placeholder {
    width: 210px;
}

.form-btn {
    display: inline-block;
    white-space: nowrap;
    background-color: seagreen;
    color: #fff;
    padding: 5px 10px;
    border-radius: 5px;
    text-align: center;
    display: flex;
    align-items: center;
    gap: 7px;

}

.form-btn-2 {
    display: inline-block;
    white-space: nowrap;
    background-color: #384974;
    color: #fff;
    padding: 5px 10px;
    border-radius: 5px;
    text-align: center;
    display: flex;
    align-items: center;
    gap: 7px;

}

.nav-btn {
    background-color: seagreen;
    color: #fff;
    padding: 7px 10px;
    border-radius: 5px;
}

.flex-table-row {
    display: flex;
    align-items: center;
    gap: 50px;
    padding: 10px 10px;
    border-bottom: 1px solid #ccc;
    border-left: 1px solid #ccc;
    border-right: 1px solid #ccc;
}

.flex-table-row>div {
    flex: 1;
}

.sub-active {
    color: #4caf50;
    font-size: 14px !important;
}

.sub-paused {
    color: #f9a825;
    font-size: 14px !important;
}

.sub-pastdue {
    color: #8e24aa;
    font-size: 14px !important;
}

.sub-canceled {
    color: #e53935;
    font-size: 14px !important;
}

.subscription-status-cell {
    text-align: center;
    padding: 4px;
}


#patient-list tfoot tr.membership-totals-row td {
    font-weight: 700;
    font-size: 13px;
    border-top: 2px solid #ccc;
    padding: 8px 4px;
    white-space: nowrap;
}

#patient-list tfoot td.totals-label {
    text-align: right;
    color: #555;
    padding-right: 12px;
}

#patient-list tfoot td.month-total {
    text-align: center;
    /* color: #1976d2; */
}



/***************************************************************************************
Patient List Consent Icons
***************************************************************************************/
.consent-yes {
    color: #4caf50;
    font-size: 14px !important;
}

.consent-no {
    color: #cccccc;
    font-size: 14px !important;
}

.consent-missing {
    color: #e0e0e0;
    font-size: 14px !important;

}

.consent-cell {
    text-align: center;
    padding: 4px;
}

.tooltip-th {
    cursor: default;
}

.th-tooltip {
    position: absolute;
    background-color: #333;
    color: #fff;
    padding: 4px 8px;
    border-radius: 4px;
    font-size: 12px;
    white-space: nowrap;
    pointer-events: none;
    opacity: 0;
    transform: translateX(-50%);
    transition: opacity 0.2s ease;
    z-index: 9999;
}

.th-tooltip.visible {
    opacity: 1;
}








/***************************************************************************************
Dashboard Home
***************************************************************************************/


.lab-test-section {
    display: flex;
    gap: 30px;
}

.test-section {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    flex: 1 1 300px;
    max-width: 550px;
}

/***************************************************************************************
Supplement Schedule
***************************************************************************************/

#med-sched-table table {
    width: 100%;
    border: 1px solid #ccc;
}

#med-sched-table th {
    padding: 10px 10px;
    background-color: #ccc;
}

#med-sched-table td {
    padding: 5px 10px;
}

#med-sched-table td:nth-child(1) {
    max-width: 300px;
    padding-right: 30px;
    font-weight: bold;
}

/* #med-sched-table table tbody tr:nth-child(even) {
    background-color: #eee;
} */

#med-sched-table table tbody tr {
    border-bottom: 1px solid #ccc;
}

#med-sched-table a {
    color: #000;
    text-decoration: none;
    font-weight: bold;
}

#dash-med-sched-table table {
    width: 100%;
    border: 1px solid #ccc;
}

#dash-med-sched-table th {
    padding: 10px 10px;
    background-color: #ccc;
}

#dash-med-sched-table td {
    padding: 15px 10px;
}

#dash-med-sched-table td:nth-child(1) {
    /* background-color: red; */
    max-width: 300px;
    padding-right: 30px;
    font-weight: bold;
}

#dash-med-sched-table table tbody tr:nth-child(even) {
    background-color: #eee;
}

#dash-med-sched-table a {
    color: #000;
    text-decoration: none;
    font-weight: bold;
}

.reset-date-btn {
    cursor: pointer;
    color: #666;
    font-size: 18px;
    vertical-align: middle;
    margin-left: 5px;
    transition: color 0.2s;
    margin-right: 20px;
}

.reset-date-btn:hover {
    color: #f44336;
}

.med-active {
    background-color: seagreen;
    color: #fff;
    padding: 5px 10px;
    border-radius: 5px;

}

.med-stopped {
    background-color: crimson;
    color: #fff;
    padding: 5px 10px;
    border-radius: 5px;

}

/***************************************************************************************
Global Elements
***************************************************************************************/
* {
    font-family: Arial, Helvetica, sans-serif;
}

body[data-i18n-loading="true"] {
    display: none;
}

#admin-body {
    background: #eee;
    padding: 0px;
    margin: 0px 0px 0px 0px;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

main {
    flex: 1;
}

.error-message {
    background-color: crimson;
    color: #fff;
    padding: 20px 0px;
    text-align: center;
}

/**** Error / Success Messages ****/

/* Intake Forms*/
#save-notification {
    position: fixed;
    top: 10px;
    left: 50%;
    transform: translateX(-50%);
    background: green;
    color: white;
    padding: 10px 20px;
    border-radius: 4px;
    font-family: Arial, sans-serif;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.5s ease;
    z-index: 9999;
}

.document-success {
    position: fixed;
    top: 20px;
    left: 50%;
    transform: translateX(-50%);
    background-color: green;
    color: #fff;
    padding: 10px 20px;
    border-radius: 5px;
    z-index: 9999;
    opacity: 0;
    animation: fadeInOut 3s ease-in-out forwards;
}

@keyframes fadeInOut {
    0% {
        opacity: 0;
    }

    10% {
        opacity: 1;
    }

    90% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

.floating-success {
    position: fixed;
    top: 20px;
    left: 50%;
    transform: translateX(-50%);
    background-color: green;
    color: #fff;
    padding: 10px 20px;
    border-radius: 5px;
    z-index: 9999;
    opacity: 1;
    animation: fadeInOut 3s ease-in-out;
}

@keyframes fadeInOut {
    0% {
        opacity: 0;
    }

    10% {
        opacity: 1;
    }

    90% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}


.left-content {
    display: flex;
    align-items: center;
    gap: 20px;
}

.right-content {
    margin-left: auto;
    margin-right: 20px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.right-content a {
    text-decoration: none;
}

.form-header-left {
    display: flex;
    align-items: center;
    gap: 20px;
}

.form-header-right {
    display: flex;
    align-items: center;
    gap: 20px;
}



@keyframes fadeOut {
    to {
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
    }
}

.documents-error-message {
    background-color: crimson;
    color: #fff;
    padding: 20px 0px;
    margin-bottom: 15px;
    text-align: center;
}

.close-error-message {
    position: absolute;
    right: 60px;
    cursor: pointer;
    font-size: 20px;
}

/**** Tables ****/
table {
    border-collapse: collapse;
}

th,
td {
    text-align: left;
}

/**** Forms ****/
input[type=text],
input[type=tel],
input[type=email],
input[type=date],
input[type=time],
input[type=number],
input[type=password],
select,
textarea {
    font-size: 16px;
    padding: 8px;
    border: 1px solid #bbb;
    background-color: #eee;
    border-radius: 4px;
    box-sizing: border-box;
}

input[type=submit] {
    background-color: #EF662F;
    color: white;
    font-size: 16px;
    padding: 12px 20px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    width: 100%;
    transition: 0.3s;
}

#sort-select {
    background-color: seagreen;
    color: #fff !important;
}

/**** Page Elements ****/
#header {
    height: 70px;
    background: #fff;
    display: flex;
    align-items: center;
    margin-bottom: 10px;
    border-bottom: 1px solid #bbb;
}

#logo {
    margin-right: 20px;
}

#logo img {
    height: 45px;
    margin-left: 30px;
}

#page-header {
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

#page-title {
    font-weight: bold;
    font-size: 20px;
    margin-left: 20px;
}

#page-title span {
    font-weight: bold;
    font-size: 20px;
    margin-left: 20px;
    margin: 0;
    padding: 0;
}

#page-body {
    background: #fff;
    margin: 0px 20px 10px 20px;
    padding: 20px;
}

#section-title-blue {
    font-size: 18px;
    font-weight: bold;
    margin: 10px 0px;
    padding: 10px;
    background-color: #56C5D8;
    display: flex;
    align-items: center;
    gap: 10px;
}

#section-title-grey {
    font-size: 18px;
    font-weight: bold;
    margin: 10px 0px;
    padding: 10px;
    background-color: #ddd;
}

.fall-back-message {
    padding: 12px;
    margin-bottom: 10px;
    font-style: italic;
    color: #666;
    border: 1px dashed #ccc;
    border-radius: 4px;
}

.table-scroll-wrapper {
    overflow-x: auto;
    display: block;
    width: 100%;
    border: 1px solid #ccc;
    margin-bottom: 20px;
    white-space: nowrap;
}

.table-scroll-wrapper table {
    /* min-width: 1900px; */
    width: 100%;
    border-collapse: collapse;
}


.pagination-controls {
    display: flex;
    gap: 20px;
    align-items: center;
    margin-top: 20px;
    padding: 15px 0;
}

.pagination-info {
    font-weight: bold;
}

.pagination-select {
    display: flex;
    align-items: center;
    gap: 10px;
}

#rows-per-page {
    padding: 5px 10px;
    background-color: seagreen;
    color: #fff !important;
}

/***************************************************************************************
Header
***************************************************************************************/
#main-menu {
    margin-left: 30px;
    font-weight: bold;
}

#main-menu div {
    display: inline-block;
    margin-right: 30px;
}

#main-menu div a {
    color: #000;
    transition: 0.3s;
    text-decoration: none;
    font-size: 18px;
    transition: 0.3s;
}

.current-section {
    color: #EF662F !important;
}

#main-menu div a:hover {
    color: #EF662F;
    transition: 0.3s;
}

#menu-settings {
    display: flex;
    align-items: center;
    margin-left: auto;
    margin-right: 20px;
    font-weight: bold;
    text-decoration: none;
}

.material-icons.logout-icon {
    font-size: 23px;
    color: grey;
    margin-left: 30px;
    font-weight: bold;
}

#user-greeting {
    font-size: 18px;
}

/***************************************************************************************
Footer
***************************************************************************************/
#footer {
    background-color: #fff;
    padding: 20px 0px;
    margin-top: 40px;
    border-top: 1px solid #bbb;
}

/***************************************************************************************
Patient List
***************************************************************************************/
.patient-name-link.np {
    font-weight: normal !important;
}

.patient-name-link.inactive {
    color: red !important;
}

#patient-list th.optional,
#patient-list td.optional {
    display: none;
}

body.show-extra #patient-list th.optional,
body.show-extra #patient-list td.optional {
    display: table-cell;
}

#patient-list-page-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 10px;
}

#patient-list-table table {
    width: 100%;
    table-layout: auto;
}

#patient-list-table th {
    padding: 10px 10px;
    background-color: #ccc;
    white-space: nowrap;
}

#patient-list-table td {
    padding: 12px 10px;
    white-space: nowrap;
    /* background: #fff; */
    border-bottom: 1px solid #ccc;
}

#patient-list-table tr:nth-child(odd) {
    background-color: #eee;
}

#patient-list-table a {
    color: #000;
    text-decoration: none;
}

#patient-list-table td:nth-child(1),
#patient-list-table td:nth-child(2),
#patient-list-table td:nth-child(4),
#patient-list-table td:nth-child(5),
#patient-list-table td:nth-child(6),
#patient-list-table td:nth-child(7),
#patient-list-table td:nth-child(8),
#patient-list-table td:nth-child(9),
#patient-list-table td:nth-child(10),
#patient-list-table td:nth-child(11),
#patient-list-table td:nth-child(12),
#patient-list-table td:nth-child(13) {
    border-right: 1px solid #ccc;
}

/* Progress */
#patient-list-table td:nth-child(14),
#patient-list-table td:nth-child(15),
#patient-list-table td:nth-child(16),
#patient-list-table td:nth-child(17),
#patient-list-table td:nth-child(18),
#patient-list-table td:nth-child(19),
#patient-list-table td:nth-child(20),
#patient-list-table td:nth-child(21),
#patient-list-table td:nth-child(22),
#patient-list-table td:nth-child(23),
#patient-list-table td:nth-child(24),
#patient-list-table td:nth-child(25),
#patient-list-table td:nth-child(26),
#patient-list-table td:nth-child(27),
#patient-list-table td:nth-child(28),
#patient-list-table td:nth-child(29),
#patient-list-table td:nth-child(30),
#patient-list-table td:nth-child(31),
#patient-list-table td:nth-child(32) {
    border-right: 1px solid #ccc;
}

.verification-icon.ok {
    color: #10b981;
    font-size: 18px;
}

.verification-icon.wait {
    color: #f59e0b;
    font-size: 18px;
}

.verification-icon.none {
    color: #ef4444;
    font-size: 18px;
}

.custom-tooltip {
    position: relative;
    display: inline-block;
    cursor: pointer;
}

.tooltip-text {
    visibility: hidden;
    opacity: 0;
    background-color: #444;
    color: #fff;
    text-align: left;
    border-radius: 6px;
    padding: 6px 10px;
    position: absolute;
    z-index: 1;
    left: 180%;
    top: 50%;
    transform: translateY(-50%);
    white-space: nowrap;
    transition: opacity 0.3s;
    box-shadow: 0 0 6px rgba(0, 0, 0, 0.2);
    font-size: 13px;
    line-height: 1.6;
    min-width: 120px;
}

.custom-tooltip:hover .tooltip-text {
    visibility: visible;
    opacity: 1;
}

.patient-baby {
    color: seagreen;
}

.patient-child {
    color: #3d919e;
}

.patient-adult {
    color: #EF662F;
}

#sort-title {
    font-size: 16px;
    font-weight: unset;
    margin-left: 20px;
}

.left-content span {
    margin-right: 10px;
    font-weight: bold;
    font-size: 20px;
}

#add-patient-button {
    background-color: #2d97a9;
    color: #fff;
    padding: 5px 20px;
    border-radius: 5px;
}

.material-icons.link-icon {
    color: green;
}

.patient-name-link {
    font-weight: bold;
}

.patient-status-link .status-text {
    color: #000;
    font-weight: normal;
}

.document-count a,
.consent-form-count a,
.lab-results-count a {
    text-decoration: none;
    color: #000;
}

.status-grey {
    color: #aaa;
    font-size: 20px !important;
}

.patient-status.status-green {
    color: green;
    font-size: 16px;
}

.patient-status.status-grey {
    color: #aaa;
    font-size: 20px;
}

.status-text {
    padding: 2px 6px;
    border-radius: 4px;
    display: inline-block;
}

.dashboard-status-text.ordered {
    background-color: lightblue;
}

.dashboard-status-text.received {
    background-color: lightsalmon;
}

.dashboard-status-text.returned {
    background-color: Khaki;
}

.dashboard-status-text.results {
    background-color: plum;
}

.dashboard-status-text.complete {
    background-color: lightgreen;
}

/***************************************************************************************
LT Phases Page
***************************************************************************************/
#lab-testing-table table {
    width: 100%;
}

#lab-testing-table th {
    padding: 10px 10px;
    background-color: steelblue;
    color: #fff;
    white-space: nowrap;
}

#lab-testing-table td {
    padding: 15px 10px;
    white-space: nowrap;
}

#lab-testing-table table tbody tr:nth-child(even) {
    background-color: #eee;
}

#lab-testing-table a {
    color: #000;
    text-decoration: none;
    font-weight: bold;
}


.lt-days-since {
    font-size: 14px;
    font-weight: bold;
    /* color: #2d97a9; */
    color: green;
    margin-top: 5px;
}

#lab-testing-table td:nth-child(2),
#lab-testing-table td:nth-child(3),
#lab-testing-table td:nth-child(4),
#lab-testing-table td:nth-child(5),
#lab-testing-table td:nth-child(6),
#lab-testing-table td:nth-child(7),
#lab-testing-table td:nth-child(8),
#lab-testing-table td:nth-child(9) {
    border-right: 1px solid #ccc;
}



/* Highlight overdue consultations */
.lt-days-since.overdue {
    color: #dc3545;
    font-weight: bold;
}

tr[data-overdue="1"] td a.patient-name-link,
tr[data-overdue="1"] td a.patient-name-link.np {
    color: #dc3545 !important;
}

/***************************************************************************************
PC Phases Page
***************************************************************************************/
#project-consultation-monthly-table table {
    width: 100%;
}

#project-consultation-monthly-table th {
    padding: 10px 10px;
    background-color: steelblue;
    color: #fff;
    white-space: nowrap;
}

#project-consultation-monthly-table td {
    padding: 15px 10px;
    white-space: nowrap;
}

#project-consultation-monthly-table table tbody tr:nth-child(even) {
    background-color: #eee;
}

#project-consultation-monthly-table a {
    color: #000;
    text-decoration: none;
    font-weight: bold;
}

#project-consultation-monthly-table td:nth-child(2),
#project-consultation-monthly-table td:nth-child(3),
#project-consultation-monthly-table td:nth-child(4),
#project-consultation-monthly-table td:nth-child(5),
#project-consultation-monthly-table td:nth-child(6),
#project-consultation-monthly-table td:nth-child(7),
#project-consultation-monthly-table td:nth-child(8),
#project-consultation-monthly-table td:nth-child(9),
#project-consultation-monthly-table td:nth-child(10),
#project-consultation-monthly-table td:nth-child(11),
#project-consultation-monthly-table td:nth-child(12),
#project-consultation-monthly-table td:nth-child(13),
#project-consultation-monthly-table td:nth-child(14) {

    border-right: 1px solid #ccc;
}

/***************************************************************************************
Patient Info Tabs
***************************************************************************************/

#patient-form-tabs {
    background-color: #fff;
    height: 50px;
    margin: 0 20px;
    padding-top: 20px;
    padding-left: 20px;
    padding-right: 20px;
}

#patient-form-tabs-menu {
    display: flex;
    background-color: #eee;

}

#patient-form-tabs-item {
    padding: 15px 20px;
    border-right: 1px solid #ccc;
}

#patient-form-tabs a {
    color: #000;
    font-weight: bold;
}

.form-menu-inactive {
    color: #000;
}

.form-menu-active {
    background: steelblue;
    color: #fff;
}

/******* Forms Tabs *******/
#patient-info-menu {
    margin-top: 15px;
    margin-left: 20px;
}

#patient-info-menu a {
    color: #000;
    text-decoration: none;
}

#patient-info-menu div {
    display: inline-block;
}

#patient-menu-item {
    padding: 10px 10px;
    text-align: center;
    margin-right: 5px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}

.patient-tabs-active {
    background: #fff;
    font-weight: bold;
    /* border-top: 1px solid #ccc;
    border-left: 1px solid #ccc;
    border-right: 1px solid #ccc; */
}

.patient-tabs-inactive {
    background: #384974;
    color: #fff;
}

/***************************************************************************************
Patient Details
***************************************************************************************/
#patient-detail-table th,
#patient-detail-table td {
    padding: 8px 10px;
}

#patient-detail-table th {
    width: 200px;
}

#patient-detail-table a {
    color: #000;
    text-decoration: underline;
}

/* Free Consulation Details */
#patient-detail-table textarea {
    width: 100%;
    margin-top: 8px;
    padding: 10px;
}

#patient-detail-notes {
    margin-top: 10px;
}

.patient-dashboard-button {
    background-color: seagreen;
    color: #fff;
    padding: 5px 20px;
    border-radius: 5px;
}

.edit-patient-button {
    background-color: #2d97a9;
    color: #fff;
    padding: 5px 20px;
    border-radius: 5px;
}

.delete-patient-button {
    background-color: crimson;
    color: #fff;
    padding: 5px 20px;
    border-radius: 5px;
    cursor: pointer;
}

/***************************************************************************************
Patient Activity
***************************************************************************************/

/* Verification Section */
.activity-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.activity-header-left-group {
    display: flex;
    align-items: center;
    gap: 20px;
}

.activity-header-right-group {
    display: flex;
    align-items: center;
    gap: 25px;
}

#send-patient-emails {
    height: 37px;
    padding: 0 10px;
    border-radius: 5px;
    background-color: seagreen;
    color: #fff;
    text-align: center;
    line-height: 37px;
}

#view-test-invoice {
    border-radius: 5px;
    background-color: steelblue;
    color: #fff;
    text-align: center;
    line-height: 37px;
}

#paid-test-invoice {
    background-color: mediumseagreen;
    color: #fff;
    text-align: center;
    line-height: 37px;
    width: 100%;
}

#unpaid-test-invoice {
    background-color: #999;
    color: #fff;
    text-align: center;
    line-height: 37px;
    width: 100%;
}

.formatted-date {
    font-weight: bold;
    font-size: 16px;
}

#testing-status table {
    width: 100%;

}

#testing-status table th {
    width: 186px;
}

#testing-status select {
    width: 300px;
}

#activity-checkbox {
    width: 10px;
}

#testing-activity-table {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

#testing-activity-table th,
#testing-activity-table td {
    padding: 10px 10px;
}

#consultation-activity-table th,
#consultation-activity-table td {
    padding: 10px 10px;
    text-align: left;
}

#consultation-activity-table th {
    padding-right: 30px;
}

.testing-left {
    display: flex;
    flex-direction: column;
    flex: 1 1 400px;
}

.testing-right {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    flex: 1 1 300px;
    max-width: 350px;
}

.testing-right select {
    width: 100%;
}

#lab-details table,
#testing-details table {
    width: 100%;
    border: 1px solid #ccc;
    background-color: #f9f9f9;
    border-radius: 6px;
    padding: 0.5rem;
}

#lab-details td,
#testing-details td {
    padding: 4px 8px;
}

#testing-notes {
    margin-top: 10px;
}

#testing-notes textarea {
    width: 70%;
    margin: 10px 0px;
}

.formatted-date {
    margin-left: 20px;
}

#progress-start-date {
    background-color: lightgreen;
}

.date-diff-note {
    margin-left: 20px;
    font-style: italic;
    color: #888;
}

.material-icons.clear-date {
    color: #aaa;
    margin-left: 20px !important;
    cursor: pointer;
    vertical-align: middle;
}

.ordered {
    background-color: lightblue;
}

.received {
    background-color: lightsalmon;
}

.returned {
    background-color: khaki;
}

.results {
    background-color: plum;
}

.complete {
    background-color: lightgreen;
}

input.ordered {
    background-color: lightblue;

}

input.received {
    background-color: lightsalmon;
}

input.returned {
    background-color: Khaki;
}

input.results {
    background-color: plum;
}

input.complete {
    background-color: lightgreen;
}

.lab-id input[type=text],
.lab-id input[type=number] {
    width: 100%;
    margin-bottom: 5px;
}

.auto-save-select.verified {
    background-color: seagreen;
    color: #fff !important;
}

.auto-save-select.waiting {
    background-color: #f59e0b;
    color: #fff !important;
}

.auto-save-select.unverified {
    background-color: #ef4444;
    color: #fff !important;
}

#consultation-completed-notes ul {
    line-height: 25px;
    border: 1px dashed green;
    padding: 10px 30px;
}

input.auto-save-date.has-date {
    background-color: mediumseagreen;
    color: #fff;
}

/***************************************************************************************
Send Email Page
***************************************************************************************/
.email-send-title {
    color: #000;
    font-size: 20px;
    font-weight: bold;
    margin-left: 20px;


}

.email-send-title-2 {
    color: seagreen;
    font-size: 20px;
    font-weight: bold;


}

#send-email-table td {
    padding: 10px 20px;
}

#send-email-table tr:hover {
    background-color: #eee;
}

#send-email-table td:first-child {
    font-weight: bold;
    width: 400px;
}

.view-email {
    background-color: #fff;
    border: 1px solid #999;
    padding: 8px 15px;
    border-radius: 5px;
}

.send-email {
    background-color: seagreen;
    color: #fff;
    padding: 8px 15px;
    border-radius: 5px;
}

.sent-count {
    margin-left: 20px;
    color: #444;
    font-size: 18px;
    font-weight: bold;
}

/***************************************************************************************
Patient Documents Pages
***************************************************************************************/
#section-title-documents {
    font-size: 18px;
    font-weight: bold;
    padding: 5px 10px !important;
    background-color: #ddd;
}

#document-instructions {
    background-color: #fff;
    padding: 15px;
    margin: 10px;
    border: 2px dashed crimson;
}

#document-instructions div,
#document-requirements div {
    padding: 10px 10px;
    font-size: 17px;
}

#document-instructions div {
    border-bottom: 1px solid #ccc;
}

#document-instructions div:first-child,
#document-instructions div:last-child {
    border-bottom: none;
}

#document-requirements {
    background-color: #fff;
    padding: 15px;
    margin: 10px;
    border: 2px dashed dodgerblue;
}

#document-instructions-title {
    font-weight: bold;
    font-size: 20px !important;
}

#document-instructions-text {
    margin-bottom: 10px;
}

#document-upload {
    background-color: #f9f9f9;
    border-radius: 10px;
    border: 1px solid #ddd;
    padding: 15px;
}

.upload-form-inline {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.8rem;
}

#allowed-files {
    font-style: italic;
    font-size: 17px;
    color: #555;
}

.form-input-inline {
    flex: 1 1 180px;
    padding: 0.4em;
    border-radius: 5px;
    border: 1px solid #ccc;
    min-width: 150px;
}

.form-file-inline {
    flex: 1 1 200px;
    padding: 0.2em;
    font-size: 0.95em;
    min-width: 180px;
}

.upload-btn-inline {
    background-color: green;
    color: white;
    border: none;
    padding: 0.5em 1.2em;
    border-radius: 6px;
    cursor: pointer;
    font-size: 1em;
    transition: background-color 0.2s ease-in-out;
}

.document-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.6rem 10px;
    border-bottom: 1px solid #eee;
}

.document-row a {
    color: #000;
    font-weight: bold;
    max-width: 60%;
    font-size: 16px;
    word-wrap: break-word;
    font-weight: bold;
}

.document-row:first-child {
    padding: 0px 10px 0.6rem 10px;
}

.document-row:last-child {
    border-bottom: none;
}

.doc-date-display {
    flex-shrink: 0;
    min-width: 90px;
    margin-right: 1rem;
    font-size: 15px;
    color: #222;
}

.doc-date-input {
    width: 120px;
    margin-left: 0.5rem;
}

.document-actions {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-left: auto;
}

.document-actions form {
    margin: 0;
}

#doc-file-name {
    margin-left: 100px;
    color: #999;
}

.doc-remove-btn {
    background-color: #ccc;
    padding: 5px 10px;
    border-radius: 5px;
    border: none;
    cursor: pointer;
}

.doc-edit-btn {
    background-color: #ccc;
    padding: 5px 10px;
    border-radius: 5px;
    border: none;
    cursor: pointer;
}

.doc-save-btn {
    background-color: green;
    color: #fff;
    padding: 5px 10px;
    border-radius: 5px;
    border: none;
    margin-left: 15px;
    height: 30px;
    margin-top: 8px;
    cursor: pointer;
}

.doc-cancel-btn {
    background-color: #ccc;
    padding: 5px 10px;
    border-radius: 5px;
    border: none;
    margin-left: 15px;
    height: 30px;
    margin-top: 8px;
    cursor: pointer;
}

.doc-name-input {
    width: 400px;
}

#preloader {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #fff;
    z-index: 9999;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

#preloader-logo img {
    width: 60px;
    margin-bottom: 20px;
}

#preloader-text {
    margin-bottom: 20px;
    font-size: 23px;
    font-weight: bold;
}

.spinner {
    width: 40px;
    height: 40px;
    border: 5px solid #ccc;
    border-top-color: #923A8E;
    border-radius: 50%;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    to {
        transform: rotate(360deg);
    }
}

/***************************************************************************************
Patient Treatment Plan
***************************************************************************************/
.supplement-schedule-btn {
    background-color: firebrick;
    color: #fff;
    padding: 7px 15px;
    border-radius: 5px;
    margin-right: 20px;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 10px;
}

#tp-header-left {
    display: flex;
    align-items: center;
    gap: 20px;
}

.tp-header-right {
    display: flex;
    align-items: center;
    gap: 20px;
}

#pdf-download-tp {
    background-color: green;
    color: #fff;
    padding: 10px 15px;
    border-radius: 5px;
    cursor: pointer;
}

.insert-after-wrapper {
    display: flex;
    align-items: center;
}

.highlight-new {
    animation: fadeHighlight 2.5s ease forwards;
}

@keyframes fadeHighlight {
    0% {
        background-color: cornflowerblue;
    }

    100% {
        background-color: transparent;
    }
}

.highlight-copy {
    animation: fadeHighlightCopy 2.5s ease forwards;
}

@keyframes fadeHighlightCopy {
    0% {
        background-color: green;
    }

    100% {
        background-color: transparent;
    }
}

#add-week-wrapper {
    display: flex;
    margin-bottom: 20px;
    align-items: center;
}

.treatment-plan-section {
    border: 1px solid #888;
    margin-bottom: 20px;
    padding-bottom: 10px;

}

#table-2 {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
}

#table-1 {
    width: 100%;
    margin-bottom: 10px;
}


#table-1 td {
    background-color: #eee;
    border-bottom: 1px solid #ccc;
}

#table-1 th:nth-child(1) {
    width: 100px;
}

#table-1 th:nth-child(2) {
    width: 30px;
}

#table-1 th:nth-child(3) {
    width: 80px;
}

#table-1 th:nth-child(4) {
    width: 90px;
}

#table-1 th:nth-child(5) {
    width: 90px;
}

#table-1 td:nth-child(6) {
    width: 120px;
}

#table-1 td:nth-child(2),
#table-1 td:nth-child(3),
#table-1 td:nth-child(4),
#table-1 td:nth-child(5),
#table-1 td:nth-child(6) {
    font-weight: bold;
}

/* #table-1 th:nth-child(7),
#table-1 td:nth-child(7) {
    width: 120px;
} */

/* #table-1 th:nth-child(8),
#table-1 td:nth-child(8) {
    width: 200px;
    text-align: right;
} */

#table-1 th:nth-child(9),
#table-1 td:nth-child(9) {
    width: 220px;
    text-align: right;
}

#table-1 th {
    background-color: #56C5D8;
    padding: 5px;
}

#table-2 th {
    background-color: #ddd;
}

#table-1 td {
    padding: 10px;
}

.copy-week-btn {
    background: none;
    border: none;
    cursor: pointer;
    margin-right: 30px;
    height: 30px;
    background-color: green;
    color: #fff;
    font-size: 15px;
    border-radius: 5px;
    padding: 0px 10px;
}

.add-week-btn {
    background: none;
    border: none;
    cursor: pointer;
    height: 30px;
    background-color: cornflowerblue;
    color: #fff;
    font-size: 15px;
    border-radius: 5px;
    padding: 0px 10px;
    margin-left: 10px;
}

#add-week-select {
    margin-left: 10px;
    padding: 5px 10px;
    font-size: 15px;
    background-color: cornflowerblue;
    color: #fff !important;
    border-radius: 5px;
    border: none;
}

.delete-week {
    background: none;
    border: none;
    cursor: pointer;
    color: #777;
    margin-left: 15px;
}

/* .material-icons.delete-week {
    font-weight: bold;
    font-size: 18px;
} */

.display-notification {
    height: 30px;
    width: 140px;
    text-align: center;
    background-color: crimson;
    color: #fff;
    font-size: 15px;
    line-height: 30px;
    border-radius: 5px;
    padding: 0px 10px;
    float: right;
}

.week-select {
    background-color: #bbb;
}

#treatment-plan-wrapper {
    margin-bottom: 15px;
}

.treatment-notes {
    padding: 0px 10px;
}

.highlight-cascade {
    background-color: cornflowerblue;
    transition: background-color 1.5s ease;
}

.phase-label {
    display: inline-block;
    padding: 5px 10px !important;
    border-radius: 5px;
}

.phase-1 {
    background-color: #e53935;
    color: white !important;
    border: none;
}

.phase-2 {
    background-color: #fb8c00;
    color: white !important;
    border: none;
}

.phase-3 {
    background-color: #26a69a;
    color: white !important;
    border: none;
}

.phase-4 {
    background-color: #42a5f5;
    color: white !important;
    border: none;
}

.treatment-notes textarea {
    width: 100%;
    margin: 5px 0px;
    background-color: #fff !important;
    border: 1px solid #ddd !important;
    font-weight: bold;
}

.treatment-notes b {
    color: #888;
}


/* .week-display {
    background-color: teal !important;
} */

.start-date-bkg {
    background-color: seagreen !important;
    color: #fff !important;
}

.tp-admin-patient-messages {
    background-color: #d2f5d2;
    padding: 10px;
    border-radius: 5px;
    margin: 5px 0px;
    min-height: 15px;
}

/* .tp-admin-therapist-messages {
    background-color: #c8edf9;
} */

.tp-admin-message-row {
    display: flex;
    align-items: center;
    margin-top: 5px;
}

.tp-send-message-admin-btn {
    background-color: green;
    color: #fff;
    padding: 5px 10px;
    border-radius: 3px;
    margin-right: 15px;
}

#supplement-schedule-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-weight: bold;
    font-size: 20px;
    margin-bottom: 20px;
}

/***************************************************************************************
Patient Progress Charts
***************************************************************************************/
#progress-chart-types {
    display: flex;
    gap: 10px;
    margin-right: 20px;
}

#symptom-tracking-progress,
#core-development-progress {
    padding: 7px 15px;
    border: 1px solid #ccc;
    border-radius: 5px;
}

.progress-button-active {
    background-color: seagreen;
    color: #fff;
}


.progress-button-inactive {
    background-color: #ccc;
    color: #000;
}

#symptom-progress table {
    width: 100%;
    margin-bottom: 10px;
}

#symptom-progress th,
#symptom-progress td {
    border-bottom: 1px solid #aaa;
}

#symptom-progress th {
    background-color: #eee;
    padding: 8px;
}

#symptom-progress td {
    padding: 10px 8px;
}

#symptom-progress td:first-child {
    font-weight: bold !important;
    width: 400px;
}

.symptom-rating-circle {
    display: inline-block;
    width: 25px;
    height: 25px;
    line-height: 25px;
    border-radius: 50%;
    color: white;
    text-align: center;
}

.symptom-rating-1 {
    background-color: #007bff;
}

.symptom-rating-2 {
    background-color: #28a745;
}

.symptom-rating-3 {
    background-color: #fd7e14;
}

.symptom-rating-4 {
    background-color: #dc3545;
}

/***************************************************************************************
Orders Page
***************************************************************************************/

.view-invoice-icon {
    color: seagreen;
}

.add-order {
    color: seagreen;
    font-size: 33px !important;
    margin-right: 30px;

}

#orders-table table {
    width: 100%;
    border: 1px solid #ccc;
}

#orders-table th {
    padding: 10px 10px;
    background-color: #ccc;
}

#orders-table td {
    padding: 15px 10px;
}

#orders-table table tbody tr:nth-child(even) {
    background-color: #eee;
}

#orders-table a {
    color: #000;
    text-decoration: none;
    font-weight: bold;
}

#download-orders {
    background-color: #EF662F;
    color: #fff;
    padding: 5px 10px;
    border-radius: 5px;
    margin-right: 20px;
}

#promo-codes-page {
    background-color: steelblue;
    color: #fff;
    padding: 5px 10px;
    border-radius: 5px;
    margin-right: 20px;
}

#monthly-numbers-page {
    background-color: seagreen;
    color: #fff;
    padding: 5px 10px;
    border-radius: 5px;
    margin-right: 20px;
}

/***************************************************************************************
Patient Invoice
***************************************************************************************/
#invoice-container {
    max-width: 700px;
    margin: 0 auto;
    background: #fff;
    padding: 24px;
    box-sizing: border-box;
}

.invoice-header {
    display: flex;
    align-items: center;
    margin-bottom: 20px;
}

#inv-address-info {
    display: flex;
    justify-content: space-between;
    border-top: 1px solid #ccc;
    padding-top: 15px;
}

#inv-address-left div,
#inv-address-right div {
    margin-bottom: 5px;
}

.invoice-date-row {
    display: flex;
    justify-content: space-between;
    padding: 10px 0px;
    border-top: 1px solid #ccc;
}

.invoice-detail-row {
    display: flex;
    justify-content: space-between;
    padding: 10px 0px;
    border-bottom: 1px solid #ccc;
}

.invoice-detail-title {
    font-weight: bold;
}

#invoice-download {
    max-width: 700px;
    margin: 0 auto;
    background: #fff;
    padding: 0px 24px;
    box-sizing: border-box;
}

.invoice-download-btn {
    background-color: seagreen;
    color: #fff;
    text-align: center;
    padding: 7px 10px;
    border-radius: 5px;
    margin-top: 15px;
    width: 200px;
}

/***************************************************************************************
Promo Codes Page
***************************************************************************************/

#add-promo-code-section {
    background-color: #f9f9f9;
    border-radius: 10px;
    border: 1px solid #ddd;
    padding: 15px;
}

#add-promo-code-section form {
    margin-bottom: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 20px;

}

.add-promo-code {
    background-color: seagreen;
    color: #fff;
    padding: 8px 10px;
    border-radius: 5px;
    margin-right: 20px;
}

#promo-code-table table {
    width: 100%;
    margin-top: 20px;
}

#promo-code-table th {
    padding: 10px 10px;
    background-color: #ccc;
}

#promo-code-table td {
    padding: 8px 10px;
}

#promo-code-table td:nth-child(3) {
    text-align: right;
}

#promo-code-table table tbody tr:nth-child(even) {
    background-color: #eee;
}

#promo-code-table a {
    color: #000;
    text-decoration: none;
    font-weight: bold;
}

#promo-code-table button {
    background: none;
}

#promo-code-table .material-icons.delete {
    color: #999;
    cursor: pointer;
}

/***************************************************************************************
Monthly Numbers Page
***************************************************************************************/

#total-pl {
    font-size: 20px;
    font-weight: bold;
    margin-right: 20px;
}

#add-monthly-numbers-section {
    background-color: #f9f9f9;
    border-radius: 10px;
    border: 1px solid #ddd;
    padding: 15px;
}

#add-monthly-numbers-section form {
    margin-bottom: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 20px;
}

.add-monthly-numbers {
    background-color: seagreen;
    color: #fff;
    padding: 8px 10px;
    border-radius: 5px;
    margin-right: 20px;
}

#monthly-numbers-table table {
    width: 100%;
    margin-top: 20px;
}

#monthly-numbers-table th {
    padding: 10px 10px;
    background-color: #ccc;
}

#monthly-numbers-table td {
    padding: 8px 10px;
}

/* #monthly-numbers-table td:nth-child(5) {
    text-align: right;
} */

#monthly-numbers-table table tbody tr:nth-child(even) {
    background-color: #eee;
}

#monthly-numbers-table a {
    color: #000;
    text-decoration: none;
    font-weight: bold;
}

#monthly-numbers-table button {
    background: none;
}

#monthly-numbers-table .material-icons.delete {
    color: #999;
    cursor: pointer;
}


/***************************************************************************************
Webinars
***************************************************************************************/

#webinars-list-table table {
    width: 100%;
}

#webinars-list-table th {
    padding: 10px 10px;
    background-color: #ccc;
}

#webinars-list-table td {
    padding: 15px 10px;
}

#webinars-list-table tr:nth-child(odd) {
    background-color: #eee;
}

.download-csv-btn {
    background-color: seagreen;
    color: #fff;
    padding: 7px 10px;
    border-radius: 5px;
}

/***************************************************************************************
Consultations Page
***************************************************************************************/
#consultations-list-table table {
    width: 100%;
}

#consultations-list-table th {
    padding: 10px 10px;
    background-color: #ccc;
}

#consultations-list-table td {
    padding: 15px 10px;
}

#consultations-list-table tr:nth-child(odd) {
    background-color: #eee;
}

#consultations-list-table a {
    color: #000;
    text-decoration: none;
    font-weight: bold;
}

.date-relative {
    color: #fff;
    margin-left: 20px;
    padding: 5px 10px;
    border-radius: 5px;
}

.count-consultations-waiting {
    border-radius: 30px;
    padding: 6px 10px;
    background-color: crimson;
    color: #fff;
    font-weight: bold;
    font-size: 14px;
    margin: 0px 10px;
}

.relative-blue {
    background-color: cornflowerblue;
    /* Blue for >10 days */
}

.relative-green {
    background-color: #4caf50;
    /* Green for 6–10 days */
}

.relative-red {
    background-color: #f44336;
    /* Red for 0–5 days */
}

.relative-grey {
    background-color: #9e9e9e;
    /* Grey for past dates */
}

.hide-consultation {
    color: #888;
}

.zoom-meeting {
    background-color: #0e72ed;
    color: #fff !important;
    font-weight: normal !important;
    padding: 7px 10px;
    border-radius: 5px;
}

/* Cancel button on the patient-consultations.php admin list. Sized to
   match .zoom-meeting in the adjacent column so the row reads as a tidy
   pair of action chips. Disabled state is dimmed for the in-flight POST. */
.cancel-consultation {
    background-color: #c0392b;
    color: #fff;
    font-weight: normal;
    padding: 7px 10px;
    border-radius: 5px;
    border: none;
    cursor: pointer;
    font-size: inherit;
    font-family: inherit;
    line-height: 1;
}

.cancel-consultation:hover {
    background-color: #a93226;
}

.cancel-consultation:disabled {
    opacity: 0.6;
    cursor: wait;
}

/***************************************************************************************
Free Consultation Details
***************************************************************************************/
#delete-free-contact {
    margin-left: auto;
    height: 30px;
    width: 150px;
    text-align: center;
    background: crimson;
    color: #fff;
    line-height: 30px;
    border-radius: 5px;
    cursor: pointer;
    margin-right: 20px;
}

/***************************************************************************************
Calendar Page
***************************************************************************************/
/* .calendar-management-container {
    display: flex;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    padding: 0 30px;
} */

.calendar-management-container {
    display: flex;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    padding: 0 30px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.calendar-management-wrapper {
    flex: 1;
    background-color: #fff;
    min-width: 0;
}

/* .calendar-management {
    display: grid;
    grid-template-rows: 30px repeat(16, minmax(40px, 1fr));
    grid-auto-flow: column;
    grid-auto-columns: minmax(120px, 1fr);
    border: 1px solid #ccc;
    width: 100%;
    min-height: 700px;
    background-color: #fff;
} */

.calendar-management {
    display: grid;
    grid-template-rows: 30px repeat(16, 40px);
    grid-auto-flow: column;
    grid-auto-columns: minmax(120px, 1fr);
    border: 1px solid #ccc;
    width: auto;
    min-width: 100%;
    background-color: #fff;
}

.header-row {
    display: flex;
    align-items: center;
    margin: 10px 35px 20px 35px;
    justify-content: space-between;
}

#week-range {
    font-size: 23px;
    font-weight: bold;
}

.header-right {
    display: flex;
    align-items: center;
    gap: 20px;
}

.nav-buttons {
    display: flex;
    align-items: center;
    gap: 10px;
}

.nav-buttons button {
    background-color: green;
    color: #fff;
    border: none;
    height: 30px;
    width: 30px;
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* .time-labels {
    display: flex;
    flex-direction: column;
    margin-right: 5px;
} */


.time-labels {
    display: flex;
    flex-direction: column;
    margin-right: 5px;
    flex-shrink: 0;
    position: sticky;
    left: 0;
    z-index: 2;
    /* background: #fff; */
}

/* .time-label {
    height: 41px;
    line-height: 38px;
    text-align: right;
    padding-right: 5px;
    color: #666;
} */

.time-label {
    height: 40px;
    line-height: 40px;
    text-align: right;
    padding-right: 5px;
    color: #666;
}

.header {
    background: #f4f4f4;
    font-weight: bold;
    text-align: center;
    line-height: 30px;
    border-bottom: 1px solid #ccc;
}

.cell {
    border-bottom: 1px solid #eee;
    border-right: 1px solid #eee;
    padding: 3px 3px 0px 3px;
    cursor: pointer;
    font-size: 13px;
    text-align: left;
}

.cell.booked {
    background-color: #d9534f !important;
    color: #fff;
    font-weight: bold;
    border-bottom: 1px solid #d9534f;
}

.cell.blocked {
    background-color: #4da6ff !important;
    border-bottom: 1px solid #4da6ff;
}

/* Recurring weekly schedule blocks (managed on calendar-management-schedule.php).
   Read-only and gray to distinguish from one-off blue blocks above. */
.cell.schedule-blocked {
    background-color: #b8b8b8 !important;
    border-bottom: 1px solid #b8b8b8;
    cursor: not-allowed;
}

.block-label,
.booked-label {
    font-weight: bold;
    font-size: 12px;
    color: #fff;
    padding: 5px;
}

.schedule-block-label {
    color: #fff;
    opacity: 0.95;
}

/* Tool Tips */
#blockTooltip,
#deleteTooltip,
#bookedDeleteTooltip {
    position: absolute;
    background: white;
    border: 1px solid #ccc;
    padding: 10px 3px 10px 10px;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
    border-radius: 6px;
    display: none;
    z-index: 10;
}

#blockTooltip button,
#deleteTooltip button,
#bookedDeleteTooltip button {
    margin-right: 8px;
    background: none;
    border: none;
    font-size: 14px;

}

#confirmBlockSave {
    background-color: green !important;
    color: #fff;
    border-radius: 5px;
    padding: 5px;

}

#cancelBlock,
#cancelDelete,
#cancelBookedDelete {
    background-color: #999 !important;
    color: #fff;
    border-radius: 5px;
    padding: 5px;
}

#confirmDelete,
#confirmBookedDelete {
    background-color: red !important;
    color: #fff;
    border-radius: 5px;
    padding: 5px;
}

#calendar-view {
    display: flex;
    gap: 10px;
}

.view-toggle {
    padding: 5px 10px;
    cursor: pointer;
    background-color: #fff;
    border: 1px solid #ccc;
    border-radius: 4px;
}

.view-toggle.active {
    background-color: steelblue;
    color: white;
}

/* Modal styles */
.description-modal {
    display: none;
    position: fixed;
    z-index: 1000;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
}

.description-modal-content {
    background-color: #fff;
    margin: 10% auto;
    padding: 20px;
    border-radius: 8px;
    width: 90%;
    max-width: 500px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

.description-modal-header {
    font-size: 18px;
    font-weight: bold;
    margin-bottom: 15px;
}

.description-modal-body textarea {
    width: 100%;
    min-height: 100px;
    padding: 10px;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-family: inherit;
    resize: vertical;
}

.description-modal-footer {
    margin-top: 15px;
    display: flex;
    gap: 10px;
    justify-content: flex-end;
}

.description-modal-footer button {
    padding: 8px 16px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
}

.description-modal-footer button:first-child {
    background-color: #007bff;
    color: white;
}

.description-modal-footer button:last-child {
    background-color: #6c757d;
    color: white;
}

.block-description {
    font-size: 12px;
    color: #fff;
    padding: 0px 5px;
    font-style: italic;
}

#addDescription {
    background-color: green !important;
    color: #fff;
    padding: 5px;
    border-radius: 5px;
}

/***************************************************************************************
Notes Page
***************************************************************************************/
.note {
    display: flex;
    height: auto !important;
    background: #fff;
    margin: 15px 0px;
    padding: 15px;
    border-radius: 10px;
    border: 1px solid #999;
}

.handle {
    vertical-align: top;
    margin-top: 6px;
    color: #999;
    margin-right: 15px;
    cursor: pointer;
}

.note-area {
    width: 95%;
}

.note-area input[type=text] {
    width: 100%;
    border: none;
    font-size: 20px;
    font-weight: bold;
    background-color: #fff;
}

hr {
    border-top: 1px solid #eee;
}

.note-area textarea {
    width: 100%;
    height: 50px;
    border: none;
    font-size: 16px;
    background-color: #fff;
}

#add-note {
    background: none;
    border: none;
    cursor: pointer;
    margin-bottom: 10px;
    height: 30px;
    background-color: green;
    color: #fff;
    font-size: 15px;
    border-radius: 5px;
    padding: 0px 10px;
}

.delete-note {
    margin-left: 10px;
    background: none;
    border: none;
    font-size: 18px;
    color: #999;
}

.note-placeholder {
    background-color: lightgreen;
    border: 2px dashed green;
    height: 80px;
    margin: 10px 0;
    border-radius: 8px;
}

/***************************************************************************************
Partner Program Dashboard
***************************************************************************************/

/* Header */
#partner-header-title {
    font-size: 23px;
    font-weight: bold;
}

#partner-header-title a {
    color: #000;
}

#partner-name {
    font-size: 18px;
    font-weight: bold;
}

/* .profile-container {
    position: relative;
} */

.profile-icon {
    font-size: 36px;
    line-height: 1;
}

/* .dropdown-menu {
    display: none;
    position: absolute;
    right: 0;
    top: 42px;
    min-width: 200px;
    background: #fff;
    border: 1px solid #e3e3e3;
    border-radius: 8px;
    box-shadow: 0 6px 20px rgba(0, 0, 0, .08);
    padding: 10px;
    z-index: 10;
}

.dropdown-menu a {
    display: block;
    padding: 8px 10px;
    text-decoration: none;
    color: #333;
    border-radius: 6px;
}

.dropdown-menu a:hover {
    background: #f5f5f5;
}

.dropdown-menu hr {
    border: none;
    border-top: 1px solid #eee;
    margin: 8px 0;
} */

/* Partner Page */
#partner-code {
    color: #000;
    font-size: 20px;
    font-weight: bold;
    margin-left: 20px;
}

.status-badge {
    padding: 4px 10px;
    border-radius: 20px;
    font-size: 13px;
    text-transform: capitalize;
    border: 1px solid transparent;
}

.status-unpaid {
    background-color: #777;
    color: #fff;
}

.status-paid {
    background-color: green;
    color: #fff;
}

/***************************************************************************************
Partner Program Admin
***************************************************************************************/

#partner-page-buttons,
#partner-page-totals {
    display: flex;
    gap: 10px;
}

#partner-page-btn {
    padding: 7px 15px;
    border: 1px solid #ccc;
    border-radius: 5px;
}

.partner-page-btn-active {
    background-color: seagreen;
    color: #fff;
}

.partner-page-btn-inactive {
    background-color: #ccc;
    color: #000;
}

.partner-totals {
    font-size: 23px;
    font-weight: bold;
}

.mark-paid-btn {
    padding: 6px 10px;
    border-radius: 3px;
    background: steelblue;
    color: #fff;
    cursor: pointer;
}

.mark-paid-btn[disabled] {
    opacity: .6;
    cursor: not-allowed;
}

.paid-cell .material-icons {
    vertical-align: middle;
}

.check-icn {
    color: green;
}

.send-payment-email {
    padding: 6px 10px;
    border-radius: 3px;
    background: mediumseagreen;
    color: #fff;
    cursor: pointer;
}

.sent-count {
    margin-left: 10px;
    color: #333;
    font-size: 15px;
}

.count-partners-unpaid {
    border-radius: 30px;
    padding: 6px 10px;
    background-color: crimson;
    color: #fff;
    font-weight: normal;
    font-size: 14px;
    margin: 0px 10px;
}

/* ============================================================
   BOOKKEEPING SECTION
   Styles for the bookkeeping pages under /patients/:
     patient-bookkeeping*.php (Income, Expenses, P&L, Tax Prep,
     Owner Draws, and the corresponding entry forms)
   plus the patient-bookkeeping-tabs.php and
   patient-bookkeeping-monthly-bar.php includes.
   ============================================================ */

/* ----- Sub-tabs divider (sits inside #patient-info-menu row) ----- */
.bk-tab-divider {
    display: inline-block;
    width: 1px;
    background: #ccc;
    height: 22px;
    margin: 0 10px;
    vertical-align: middle;
}

/* ----- Monthly bar (top of Income / Expenses / P&L pages).
        Also reused on the Owner Draws page (year + Add Draw). ----- */
.bk-monthly-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 18px;
    flex-wrap: wrap;
}

.bk-monthly-bar-left {
    display: flex;
    align-items: center;
    gap: 20px;
    flex-wrap: wrap;
}

.bk-monthly-bar-form {
    display: flex;
    gap: 10px;
    align-items: center;
    margin: 0;
}

/* ----- Income / Expenses / P&L pill buttons ----- */
.bk-pill-group {
    display: flex;
    gap: 6px;
}

.bk-pill {
    padding: 7px 18px;
    border-radius: 20px;
    text-decoration: none;
    font-size: 13px;
    border: 1px solid #ccc;
    color: #333;
    background: #fff;
}

.bk-pill.active {
    border-color: #2a7;
    color: #fff;
    background: #2a7;
}

/* ----- Table action icons (edit/delete in list views) ----- */
.bk-action-icon {
    font-size: 18px;
}

.bk-action-icon-delete {
    color: #b94a48;
}

/* ----- Totals row in income/expense tables ----- */
.bk-totals-row {
    font-weight: bold;
    border-top: 2px solid #ccc;
}

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

/* ----- Error message block on entry forms ----- */
.bk-error-msg {
    background: #fdd;
    color: #900;
    padding: 10px;
    margin-bottom: 15px;
    border-radius: 4px;
}

/* ----- Hidden delete form (used on income/expense list pages) ----- */
.bk-hidden-form {
    display: none;
}

/* ----- Entry form (Income / Expense / Draws) ----- */
.bk-form {
    max-width: 600px;
}

.bk-form-row {
    margin-bottom: 12px;
}

.bk-form-label {
    display: block;
    margin-bottom: 4px;
}

.bk-form-input {
    width: 100%;
    padding: 6px;
}

.bk-form-hint {
    margin-top: 4px;
    font-size: 12px;
    color: #666;
}

.bk-form-actions {
    display: flex;
    gap: 10px;
}

.bk-btn-save {
    padding: 8px 16px;
    background: #2a7;
    color: #fff;
    border: none;
    border-radius: 4px;
    cursor: pointer;
}

.bk-btn-cancel {
    padding: 8px 16px;
    background: #eee;
    color: #333;
    border-radius: 4px;
    text-decoration: none;
}

.bk-radio-group label {
    display: inline-block;
    margin-right: 20px;
}

.bk-radio-group label:last-child {
    margin-right: 0;
}

/* ----- P&L statement table ----- */
.bk-pl-statement {
    max-width: 600px;
    font-family: 'Ubuntu', sans-serif;
}

.bk-pl-title {
    margin: 0 0 4px 0;
}

.bk-pl-period {
    color: #666;
    margin-bottom: 20px;
}

.bk-pl-table {
    width: 100%;
    border-collapse: collapse;
}

.bk-pl-table tr.bk-pl-section>td {
    padding: 18px 0 4px 0;
    font-weight: bold;
    border-bottom: 1px solid #ccc;
}

.bk-pl-table tr.bk-pl-section.first>td {
    padding-top: 12px;
}

.bk-pl-table tr.bk-pl-detail>td:first-child {
    padding: 6px 0 6px 20px;
}

.bk-pl-table tr.bk-pl-detail>td:last-child {
    text-align: right;
    padding: 6px 0;
}

.bk-pl-table tr.bk-pl-detail.empty>td {
    color: #888;
}

.bk-pl-table tr.bk-pl-total>td {
    font-weight: bold;
    border-top: 1px solid #ccc;
    padding: 8px 0;
}

.bk-pl-table tr.bk-pl-total>td:last-child {
    text-align: right;
}

.bk-pl-table tr.bk-pl-net>td {
    font-weight: bold;
    padding: 12px 8px;
    font-size: 16px;
    border-top: 2px solid #888;
}

.bk-pl-table tr.bk-pl-net>td:last-child {
    text-align: right;
}

.bk-pl-table tr.bk-pl-net.positive>td {
    background: #e8f5e8;
}

.bk-pl-table tr.bk-pl-net.negative>td {
    background: #fbe9e7;
}

.bk-pl-table tr.bk-pl-margin>td {
    padding: 6px 8px;
    color: #666;
}

.bk-pl-table tr.bk-pl-margin>td:last-child {
    text-align: right;
}

/* ----- Tax Prep + Owner Draws year-only filter form ----- */
.bk-filter-form {
    display: flex;
    gap: 10px;
    align-items: center;
    margin-bottom: 20px;
    flex-wrap: wrap;
}

/* ----- Page header text (Tax Prep / Owner Draws subtitle) ----- */
.bk-section-header {
    margin-bottom: 6px;
}

.bk-section-header h2 {
    margin: 0;
}

.bk-section-header-sub {
    color: #666;
}

/* ----- Horizontal scroll wrapper for wide grids ----- */
.bk-grid-scroll {
    overflow-x: auto;
}

.bk-grid-scroll.has-top-margin {
    margin-top: 14px;
}

/* ----- Footnote text under grids ----- */
.bk-footnote {
    color: #666;
    font-size: 12px;
    margin-top: 14px;
    max-width: 700px;
}

/* ----- Bookkeeping Overview tab (Chart.js grouped bar chart) -----
   Summary cards sit above the chart in a flexible row that wraps on
   narrow viewports. The chart itself lives in a horizontal-scroll
   wrapper so the timeline can keep extending as new months get data
   without squeezing the bars together. */
.bk-overview-summary {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin: 10px 0 20px;
}

.bk-overview-card {
    flex: 1 1 100px;
    background: #fff;
    border: 1px solid #e3e3e3;
    border-radius: 6px;
    padding: 12px 14px;
}

.bk-overview-card-label {
    color: #666;
    font-size: 12px;
    margin-bottom: 6px;
}

.bk-overview-card-value {
    font-size: 18px;
    font-weight: 600;
    color: #222;
}

.bk-overview-card-value.bk-overview-income {
    color: #28a745;
}

.bk-overview-card-value.bk-overview-expense {
    color: #dc3545;
}

.bk-overview-card-value.bk-overview-draw-60 {
    color: #36a2eb;
}

.bk-overview-card-value.bk-overview-draw-40 {
    color: #9966ff;
}

/* Solid-background variants used for the Balance 60% / Balance 40% cards.
   Same blue and purple as the corresponding chart bars, with white text
   so the figures stand out alongside the lighter YTD cards next to them. */
.bk-overview-card.bk-overview-card-solid-blue {
    background: #36a2eb;
    border-color: #36a2eb;
}

.bk-overview-card.bk-overview-card-solid-purple {
    background: #9966ff;
    border-color: #9966ff;
}

.bk-overview-card.bk-overview-card-solid-blue .bk-overview-card-label,
.bk-overview-card.bk-overview-card-solid-blue .bk-overview-card-value,
.bk-overview-card.bk-overview-card-solid-purple .bk-overview-card-label,
.bk-overview-card.bk-overview-card-solid-purple .bk-overview-card-value {
    color: #fff;
}

.bk-overview-chart-wrap {
    background: #fff;
    border: 1px solid #e3e3e3;
    border-radius: 6px;
    padding: 14px;
    overflow-x: auto;
}

.bk-overview-chart-inner {
    /* min-width is set inline on the element so it scales with the
       number of months currently in the dataset. height is set on the
       canvas itself so Chart.js's responsive resize behaves. */
    height: 360px;
    position: relative;
}

/* ----- Tax Prep 12-month grid ----- */
.bk-tax-table {
    border-collapse: collapse;
    min-width: 100%;
    font-size: 13px;
    margin-top: 10px;
}

.bk-tax-table thead tr {
    background: #f5f5f5;
}

.bk-tax-table thead th {
    border-bottom: 2px solid #888;
    padding: 8px 6px;
    text-align: right;
    min-width: 70px;
}

.bk-tax-table thead th.bk-tax-cat-head {
    text-align: left;
    padding: 8px 10px;
    min-width: 200px;
}

.bk-tax-table thead th.bk-tax-ytd-head {
    /* background: #eef; */
    border-left: 1px solid #ccc;
    padding: 8px 10px;
    min-width: 90px;
}

/* .bk-tax-table thead th.current {
    background: #e8f0ff;
} */

.bk-tax-table tbody td {
    padding: 6px 6px;
    text-align: right;
}

.bk-tax-table tbody tr {
    border-bottom: 1px solid #ccc;


}

.bk-tax-table tbody td.bk-tax-cat-cell {
    text-align: left;
    padding: 6px 10px 6px 20px;
}

.bk-tax-table tbody td.bk-tax-ytd-cell {
    /* background: #eef; */
    border-left: 1px solid #ccc;
    padding: 6px 10px;
}

.bk-tax-table tbody td.current {
    background: #f3f7ff;
}

.bk-tax-table tbody tr.bk-tax-section>td {
    padding: 14px 10px 4px 0;
    font-weight: bold;
    color: #444;
    text-align: left;
}

.bk-tax-table tbody tr.bk-tax-detail-revenue td.bk-tax-ytd-cell {
    font-weight: bold;
}

.bk-tax-table tbody tr.bk-tax-empty>td {
    color: #888;
    padding: 6px 10px 6px 20px;
    text-align: left;
}

.bk-tax-table tbody tr.bk-tax-total>td {
    font-weight: bold;
    border-top: 1px solid #ccc;
    padding: 8px 6px;
}

.bk-tax-table tbody tr.bk-tax-total>td.bk-tax-cat-cell {
    padding: 8px 10px;
}

.bk-tax-table tbody tr.bk-tax-total>td.bk-tax-ytd-cell {
    padding: 8px 10px;
}

.bk-tax-table tbody tr.bk-tax-net>td {
    font-weight: bold;
    padding: 10px 6px;
    font-size: 14px;
    border-top: 2px solid #888;
}

.bk-tax-table tbody tr.bk-tax-net>td.bk-tax-cat-cell {
    padding: 10px 10px;
}

.bk-tax-table tbody tr.bk-tax-net>td.bk-tax-ytd-cell {
    padding: 10px 10px;
    border-left: 1px solid #ccc;
}

.bk-tax-table tbody tr.bk-tax-net.positive>td {
    background: #e8f5e8;
}

.bk-tax-table tbody tr.bk-tax-net.positive>td.bk-tax-ytd-cell {
    background: #cfe6cf;
}

.bk-tax-table tbody tr.bk-tax-net.positive>td.current {
    background: #d8eed8;
}

.bk-tax-table tbody tr.bk-tax-net.negative>td {
    background: #fbe9e7;
}

/* ----- Owner Draws grid (similar shape to tax-table) ----- */
.bk-draws-grid {
    border-collapse: collapse;
    min-width: 100%;
    font-size: 13px;
}

.bk-draws-grid thead tr {
    background: #f5f5f5;
}

.bk-draws-grid thead th {
    border-bottom: 2px solid #888;
    padding: 8px 6px;
    text-align: right;
    min-width: 70px;
}

.bk-draws-grid thead th.bk-draws-line-head {
    text-align: left;
    padding: 8px 10px;
    min-width: 180px;
}

.bk-draws-grid thead th.bk-draws-ytd-head {
    /* background: #eef; */
    border-left: 1px solid #ccc;
    padding: 8px 10px;
    min-width: 90px;
}

/* .bk-draws-grid thead th.current {
    background: #e8f0ff;
} */

.bk-draws-grid tbody td {
    padding: 6px 6px;
    text-align: right;
}

.bk-draws-grid tbody tr {
    border-bottom: 1px solid #ccc;

}

.bk-draws-grid tbody td.bk-draws-line-cell {
    text-align: left;
    padding: 6px 10px 6px 20px;
}

.bk-draws-grid tbody td.bk-draws-ytd-cell {
    /* background: #eef; */
    border-left: 1px solid #ccc;
    padding: 6px 10px;
}

.draw {
    background-color: #daeae1;
}

/* .bk-draws-grid tbody td.current {
    background: #f3f7ff;
} */

.bk-draws-grid tbody tr.bk-draws-net-profit>td {
    background: #fafafa;
    font-weight: bold;
    padding: 8px 6px;
}

.bk-draws-grid tbody tr.bk-draws-net-profit>td.bk-draws-line-cell {
    padding: 8px 10px;
}

.bk-draws-grid tbody tr.bk-draws-net-profit>td.bk-draws-ytd-cell {
    padding: 8px 10px;
}

.bk-draws-grid tbody tr.bk-draws-owner-section>td {
    padding: 14px 10px 2px 0;
    font-weight: bold;
    color: #444;
    text-align: left;
}

.bk-draws-grid tbody tr.bk-draws-balance>td {
    font-weight: bold;
    border-bottom: 1px solid #ccc;
}

.bk-draws-neg {
    color: #b94a48;
}