/* =========================
   Tipografía global (fuera del editor)
   ========================= */
html,
body,
body.has-global-datetime-bar {
  /* Keep transparent so .particles-js animated gradient + particle canvas show through. */
  background-color: transparent;
}

body {
  font-family: 'Inter', sans-serif;
  font-weight: 300;
}

/* Negrita / headings / párrafos SOLO fuera de editores (Quill y TipTap) */
b:not(.ql-editor *):not(.ProseMirror *) {
  font-weight: 500;
  font-style: normal;
}

h2:not(.ql-editor *):not(.ProseMirror *) {
  vertical-align: middle;
  text-align: center;
  margin-bottom: 20px;
  /* color: #39505d; */
}

h3:not(.ql-editor *):not(.ProseMirror *) {
  margin-bottom: 20px;
  text-align: center;
  color: #39505d;
}

h4:not(.ql-editor *):not(.ProseMirror *),
h5:not(.ql-editor *):not(.ProseMirror *) {
  text-align: center;
  color: #39505d;
}

h5:not(.ql-editor *):not(.ProseMirror *) {
  margin-bottom: 10px;
}

h6:not(.ql-editor *):not(.ProseMirror *) {
  text-align: center;
  color: #39505d;
}

p:not(.ql-editor *):not(.ProseMirror *) {
  text-align: center;
  margin-bottom: 0;
}


/* =========================
   Dentro del editor (TipTap)
   ========================= */
.ProseMirror {
  font-family: 'Inter', sans-serif;
  font-weight: 400;        /* base legible dentro del editor */
  line-height: 1.5;
}

/* Negrita real dentro del editor (TipTap usa <strong>) */
.ProseMirror strong,
.ProseMirror b {
  font-weight: 600;
}

/* Itálica dentro del editor */
.ProseMirror em,
.ProseMirror i {
  font-style: italic;
}

/* (Opcional) Asegura alineación por defecto en headings del editor */
.ProseMirror h1,
.ProseMirror h2,
.ProseMirror h3,
.ProseMirror h4,
.ProseMirror h5,
.ProseMirror h6 {
  text-align: left;
}






label {
    vertical-align: middle;
}

.text-grey {
    color: #747c7c;
}

.myform {
    padding: 0 20% 0;
    text-align: center;
}

.login-form {
    width: 400px;
    text-align: center;
    margin-left: 20px;
    position: fixed;
    bottom: 40px;
    left: 0;
}

.login-layout {
    gap: 24px;
}

.login-fields {
    width: 300px;
}

.login-field-group {
    text-align: left;
}

.login-field-label {
    display: block;
    margin-bottom: 8px;
    color: rgba(255, 255, 255, 0.92);
    font-size: 0.84rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.login-input-shell {
    position: relative;
    display: flex;
    align-items: center;
    min-height: 48px;
    border: 1px solid rgba(255, 255, 255, 0.52);
    border-radius: 14px;
    background: rgba(247, 250, 252, 0.84);
    box-shadow: 0 10px 24px rgba(26, 46, 58, 0.14);
    transition: border-color 0.22s ease, box-shadow 0.22s ease, transform 0.22s ease;
}

.login-input-shell:focus-within {
    border-color: rgba(77, 161, 169, 0.9);
    box-shadow: 0 12px 28px rgba(20, 40, 52, 0.18);
    transform: translateY(-1px);
}

.login-input-shell.is-invalid {
    border-color: rgba(255, 196, 196, 0.92);
    box-shadow: 0 12px 28px rgba(104, 25, 25, 0.12);
}

.login-input-icon {
    position: absolute;
    left: 14px;
    color: rgba(57, 80, 93, 0.7);
    font-size: 0.88rem;
    pointer-events: none;
}

.login-input {
    height: 48px;
    border: 0;
    padding: 0 42px 0 38px;
    border-radius: 14px;
    background: transparent;
    color: #39505d;
    font-size: 0.94rem;
}

.login-input::placeholder {
    color: rgba(57, 80, 93, 0.45);
}

.login-input:focus,
.login-input.is-invalid:focus {
    background: transparent;
    color: #39505d;
    box-shadow: none;
}

.login-input.is-invalid {
    border: 0;
    background-image: none;
}

.login-password-input {
    padding-right: 44px;
}

.login-password-toggle {
    position: absolute;
    right: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border: 0;
    border-radius: 999px;
    background: rgba(57, 80, 93, 0.08);
    color: rgba(57, 80, 93, 0.82);
    transition: background-color 0.2s ease, color 0.2s ease;
}

.login-password-toggle:hover,
.login-password-toggle:focus {
    background: rgba(57, 80, 93, 0.14);
    color: #39505d;
    outline: none;
}

/* !important beats the p centring above. */
.login-field-error {
    margin-top: 8px;
    color: #ff4d4d;
    font-weight: 500;
    text-shadow: 0 1px 3px rgba(24, 6, 4, 0.6);
    text-align: left !important;
}

.login-forgot-password {
    color: rgba(255, 255, 255, 0.78);
    text-align: left !important;
    transition: color 0.2s ease, opacity 0.2s ease;
}

.login-forgot-password:hover {
    color: #ffffff;
}

.login-submit-column {
    width: 74px;
    min-height: 140px;
}

.login-submit-btn {
    min-width: 72px;
    min-height: 72px;
    border: 0;
    border-radius: 22px;
    background: rgba(255, 255, 255, 0.9);
    color: #39505d;
    font-weight: 600;
    font-size: 0.95rem;
    letter-spacing: 0.01em;
    box-shadow: 0 14px 28px rgba(32, 48, 60, 0.16);
    transition: transform 0.22s ease, box-shadow 0.22s ease, opacity 0.22s ease;
}

.login-submit-btn:hover,
.login-submit-btn:focus {
    transform: translateY(-2px);
    box-shadow: 0 18px 34px rgba(32, 48, 60, 0.2);
    color: #39505d;
}

@media (max-width: 768px) {
    .login-form {
        width: calc(100% - 32px);
        max-width: 420px;
        left: 50%;
        bottom: 28px;
        margin-left: 0;
        transform: translateX(-50%);
    }

    .login-layout {
        flex-direction: column;
        gap: 18px;
    }

    .login-fields,
    .login-submit-column {
        width: 100%;
    }

    .login-submit-column {
        min-height: auto;
    }

    .login-submit-btn {
        width: 100%;
        min-height: 56px;
        border-radius: 18px;
    }

    /* Above .image-mask (z-index 1). */
    .login-form {
        z-index: 2;
    }
}

table {
    margin-bottom: 0px;
}

thead, th {
    position: sticky;
    top: 0;
    z-index: 1;
    white-space: nowrap;
}

td {
    padding-top: 0;
    padding-bottom: 0;
}



.filter-entity {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 10;
    height: 30px;
    width: auto;
}



.center-column {
    display: flex;
    justify-content: center;
    align-items: center;
}

.card,
.card-body,
.center-column {
    overflow: visible !important;
}

.center {
    justify-content: center;
    align-items: center;
    text-align: center;
    vertical-align: middle;
}

.btn-choice {
    width: 100px;
}

.btn-app {
    background-color: #39505d;
    color: white;
    border-color: #39505d;
    margin-bottom: 0px;
}

.processing-assignee-filter {
    align-items: center;
    display: flex;
    column-gap: 8px;
    flex-wrap: wrap;
    margin: 0 0 0.75rem 0.25rem;
    min-height: 34px;
    padding: 5px 8px 0 0;
    row-gap: 12px;
    width: 100%;
}

.processing-navbar-assignee-row .processing-assignee-filter {
    margin-bottom: 0.25rem;
    margin-left: 0;
}

.processing-assignee-avatar {
    align-items: center;
    background: #fff;
    border: 2px solid #fff;
    border-radius: 50%;
    box-shadow: 0 1px 4px rgba(57, 80, 93, 0.2);
    color: #39505d;
    display: inline-flex;
    flex: 0 0 34px;
    height: 34px;
    justify-content: center;
    margin-left: 0;
    overflow: visible;
    padding: 0;
    position: relative;
    transition: transform 0.15s ease, border-color 0.15s ease;
    width: 34px;
    aspect-ratio: 1 / 1;
}

.processing-assignee-unassigned {
    background: #39505d;
    border-color: #39505d;
    color: #fff;
}
.processing-assignee-avatar:hover { transform: translateY(-2px); z-index: 2; }
.processing-assignee-avatar.active { border-color: #39505d; z-index: 1; }
.processing-assignee-indicator {
    cursor: default;
    opacity: 0.72;
}
.processing-assignee-indicator:hover {
    transform: none;
    z-index: auto;
}
.processing-assignee-avatar img {
    aspect-ratio: 1 / 1;
    display: block;
    flex: 0 0 100%;
    height: 100%;
    max-width: none;
    object-fit: cover;
    border-radius: 50%;
    width: 100%;
}
.processing-assignee-count {
    align-items: center;
    background: #dc3545;
    border: 1.5px solid #fff;
    border-radius: 999px;
    color: #fff;
    display: inline-flex;
    font-size: 0.58rem;
    font-weight: 700;
    height: 17px;
    justify-content: center;
    line-height: 1;
    min-width: 17px;
    padding: 0 3px;
    position: absolute;
    right: -8px;
    top: -8px;
    z-index: 3;
}
.processing-department-divider {
    border-top-width: 2px;
    opacity: 0.32;
}
.processing-assignee-filtering { position: relative; }
.processing-assignee-loader {
    align-items: center;
    background: #fff;
    border: 1px solid #e1e8eb;
    border-radius: 999px;
    box-shadow: 0 2px 8px rgba(57, 80, 93, 0.12);
    color: #586d78;
    display: none;
    flex-direction: row;
    font-size: 0.68rem;
    font-weight: 600;
    gap: 0.2rem;
    height: 30px;
    justify-content: center;
    left: 50%;
    padding: 0.15rem 0.55rem;
    position: absolute;
    top: 2px;
    transform: translateX(-50%);
    white-space: nowrap;
    width: auto;
    z-index: 20;
}
.processing-assignee-filtering > .processing-assignee-loader { display: flex; }
.processing-assignee-loader .loading-spinner.kurik-ip-wrap {
    flex: 0 0 26px !important;
    height: 18px !important;
    margin: 0 !important;
    min-height: 0 !important;
    padding: 0 !important;
    position: static !important;
    width: 26px !important;
}
.processing-assignee-loader .kurik-ip {
    display: block !important;
    height: 18px !important;
    max-height: 18px !important;
    max-width: 26px !important;
    width: 26px !important;
}
.processing-assignee-loader .kurik-ip__track { stroke: rgba(57, 80, 93, 0.18); }
.processing-assignee-loader .kurik-ip__worm1,
.processing-assignee-loader .kurik-ip__worm2 { animation: kurik-ip-worm1 2s linear infinite; }
.processing-assignee-loader .kurik-ip__worm2 { animation-name: kurik-ip-worm2; }

@keyframes kurik-ip-worm1 {
    from { stroke-dashoffset: 0; }
    50% { animation-timing-function: steps(1); stroke-dashoffset: -358; }
    50.01% { animation-timing-function: linear; stroke-dashoffset: 358; }
    to { stroke-dashoffset: 0; }
}

@keyframes kurik-ip-worm2 {
    from { stroke-dashoffset: 358; }
    50% { stroke-dashoffset: 0; }
    to { stroke-dashoffset: -358; }
}
.processing-assignee-option-photo {
    aspect-ratio: 1 / 1;
    border-radius: 50%;
    display: block;
    flex: 0 0 24px;
    height: 24px;
    max-width: none;
    object-fit: cover;
    width: 24px;
}
.processing-assignee-option-icon {
    border-radius: 50%;
    flex: 0 0 24px;
    height: 24px;
    overflow: hidden;
    padding: 0;
    width: 24px;
}

.nitovo-icon-navbar {
    color: #39505d;
    font-size: 25px;
    transition: opacity 0.3s;
}
.nitovo-icon-navbar:hover {
    color: #4DA1A9;
}

.workmail-icon-navbar {
    color: #f7811d;
    font-size: 30px;
    line-height: 1;
    position: relative;
    top: -2px;
    transition: opacity 0.3s;
}
.workmail-icon-navbar:hover {
    color: #4DA1A9;
}

button.btn-app:disabled,
.btn.btn-app:disabled {
    opacity: 0.5 !important;
    background-color: #39505d !important;
    border-color: #39505d !important;
    color: white !important;
}

.btn-app:hover, .btn-app.dropdown-toggle.show {
    background-color: #39505d;
    border-color: #39505d;
    color: white;
    opacity: 0.7;
}

.btn-app-teal {
    background-color: #4DA1A9;
    color: white;
    border-color: #4DA1A9;
    margin-bottom: 0px;
}

.btn-app-teal:hover, .btn-app-teal.dropdown-toggle.show {
    background-color: #4DA1A9;
    border-color: #4DA1A9;
    color: white;
    opacity: 0.7;
}

button.btn-app-teal:disabled,
.btn.btn-app-teal:disabled {
    opacity: 0.5 !important;
    background-color: #4DA1A9 !important;
    border-color: #4DA1A9 !important;
    color: white !important;
}

.btn-app-danger {
    background-color: #dc3545;
    color: white;
    border-color: #dc3545;
    margin-bottom: 0px;
}

.btn-app-danger:hover, .btn-app-danger.dropdown-toggle.show {
    background-color: #dc3545;
    border-color: #dc3545;
    color: white;
    opacity: 0.7;
}

button.btn-app-danger:disabled,
.btn.btn-app-danger:disabled {
    opacity: 0.5 !important;
    background-color: #dc3545 !important;
    border-color: #dc3545 !important;
    color: white !important;
}

.btn-app-blue {
    background-color: #2E5077;
    color: white;
    border-color: #2E5077;
    margin-bottom: 0px;
}

.btn-app-blue:hover, .btn-app-blue.dropdown-toggle.show {
    background-color: #2E5077;
    border-color: #2E5077;
    color: white;
    opacity: 0.7;
}

.btn-app-purple {
    background-color: #AD4497;
    color: white;
    border-color: #AD4497;
    margin-bottom: 0px;
}

.btn-app-purple:hover, .btn-app-purple.dropdown-toggle.show {
    background-color: #AD4497;
    border-color: #AD4497;
    color: white;
    opacity: 0.7;
}

.btn-app-green {
    background-color: #48c9b0;
    color: white;
    border-color: #48c9b0;
    margin-bottom: 0px;
}

.btn-app-green:hover, .btn-app-green.dropdown-toggle.show {
    background-color: #48c9b0;
    border-color: #48c9b0;
    color: white;
    opacity: 0.7;
}

.team-badge {
    background-color: #39505d !important; /* Custom background color */
    color: white !important; /* Custom text color */
}
.team-badge-inv {
    border: 1px solid #39505d;
    background-color: white !important; /* Custom background color */
    color: #39505d !important; /* Custom text color */
}

.teal-badge {
    background-color: #4DA1A9 !important; /* Custom background color */
    color: white !important; /* Custom text color */
}
.teal-badge-inv {
    border: 1px solid #4DA1A9;
    background-color: white !important; /* Custom background color */
    color: #4DA1A9 !important; /* Custom text color */
}

.purple-badge {
    background-color: #AD4497 !important; /* Custom background color */
    color: white !important; /* Custom text color */
}

.purple-badge-inv {
    border: 1px solid #AD4497;
    background-color: white !important; /* Custom background color */
    color: #AD4497 !important; /* Custom text color */
}

.sms-category-badge {
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    min-width: 0;
    max-width: 100%;
    padding: 0.24rem 0.52rem;
    border-radius: 999px;
    font-size: 0.7rem;
    font-weight: 700;
    line-height: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: middle;
}

.sms-category-appointments {
    background: rgba(138, 91, 181, 0.13) !important;
    color: #704391 !important;
}

.sms-category-medications {
    background: rgba(77, 161, 169, 0.12) !important;
    color: #2c6870 !important;
}

.sms-category-referrals {
    background: rgba(61, 126, 222, 0.12) !important;
    color: #295aa3 !important;
}

.sms-category-prior-authorizations {
  background-color: #ede7f6;
  color: #5e35b1;
}

.sms-category-labs {
    background: rgba(214, 162, 34, 0.16) !important;
    color: #8a6611 !important;
}

.sms-category-other {
    background: rgba(108, 117, 125, 0.14) !important;
    color: #59636c !important;
}

.sms-category-dynamic {
    background: color-mix(in srgb, var(--sms-type-color) 14%, transparent) !important;
    color: color-mix(in srgb, var(--sms-type-color) 72%, #1f2d33) !important;
}

#sms-filters .form-check-label,
#sms-filters .form-check-input {
    cursor: pointer;
}

#sms-filters .sms-category-filter-option {
    min-height: 27px;
    margin-bottom: 0.25rem;
}

#sms-filters .sms-category-filter-option:last-child {
    margin-bottom: 0;
}

#sms-filters .sms-category-filter-option .form-check-label {
    display: inline-flex;
    align-items: center;
}

@media (min-width: 768px) {
    #sms-filters .sms-filter-status-column {
        border-left: 1px solid #dee2e6;
    }
}

.sms-main-table thead th {
    background: #39505d !important;
    background-clip: padding-box;
    color: #fff !important;
    font-size: 0.82rem;
    font-style: normal;
    font-weight: 700;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    border-bottom: 1px solid rgba(255, 255, 255, 0.18);
    box-shadow: 0 -1px 0 #39505d, 0 1px 0 rgba(57, 80, 93, 0.22);
}

.sms-main-table thead th.sortable > i {
    margin-left: 0.25rem;
    color: rgba(255, 255, 255, 0.82);
    font-size: 0.78rem;
}

.sms-main-table thead th.sortable > i:hover {
    color: #fff;
}

.sms-patient-profile-link {
    font-weight: 500;
}

.btn-app-reverse {
    background-color: white;
    color: #39505d;
    border-color: #39505d;
    margin-bottom: 0px;
}

.btn-app-reverse:hover,
    .custom-btn:focus {
      background-color: #39505d;
      border-color: #39505d;
      color: white;
}

.btn-app-reverse.active {
    background-color: #39505d;
    border-color: #39505d;
    color: white;
}

.entity-select-btn {
    height: 26px;
    padding-top:0px;
    padding-bottom:0px;
    padding-left: 3px;
    padding-right: 3px;
}

.btn-app-red:hover,
    .custom-btn:focus {
      background-color: white;
      border-color: #dc3545;
      color: #dc3545;
}

.btn-grey {
    background-color: #747c7c;
    color: white;
    border-color: #747c7c;
    margin-bottom: 0px;
}

.btn-grey:hover,
    .custom-btn:focus {
      background-color: white;
      border-color: #747c7c;
      color: #747c7c;
}

.btn-app-disabled {
    background-color: #04bcec;
    color: white;
    border-color: #04bcec;
    margin-bottom: 0px;
}

.btn-app-radio {
    border-color: #04bcec;
    color: #04bcec;
    background-color: white;
}
/* Prevent hover effect for unchecked buttons */
.btn-check:not(:checked) + .btn-app-radio:hover {
    border-color: #04bcec;
    color: #04bcec;
    background-color: white;
}
.btn-check:checked + .btn-app-radio {
    background-color: #04bcec;
    color: white;
    border-color: #04bcec;
}

.tooltip {
    opacity: 1 !important;
}

.dropdown-header:not(.muted) {
    color: black;
    font-size: 1.1rem;
    padding: 6px 16px;
}

.btn-sm.dropdown-toggle {
    padding-top: 5px;
    padding-bottom: 6px;
    height: 31px;
}

.dropdown-menu {
    position: absolute;
    top: 100%; /* Align the dropdown below the button */
    left: 0;
    z-index: 3000 !important; /* Ensure dropdown is above other elements */
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.2); /* Soft shadow */
    border: none; /* Optional: Removes default border */
}

.dropdown-item {
    cursor: pointer;
}

.justify {
    text-align: justify;
}

footer {
    margin-top: 10px;
    background: linear-gradient(to left, #00bdee, #747c7c);
    width: 100%;
}

.note-right-side {
    border-left: 1px solid #ddd;
}

.note-left-side {
    position: relative;
}

.chat-footer {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 100%;
}

.chat-cloud {
  border-radius: 10px;
  padding: 10px;
  margin: 5px;
  max-width: 80%;
  display: inline-block;
  word-wrap: break-word;
}

.chat-name {
  margin-top: 0px;
  margin-bottom: 5px;
  text-align: left !important;
}

.chat-text {
  margin: 0;
  text-align: left !important;
}

.bot-name {
    color: white;
}

.bot-cloud {
    background-color: rgba(57, 80, 93, 1);
    position: relative;
    padding-top: 34px;
}

.chat-copy-btn {
    position: static;
    top: 4px;
    right: 6px;
    left: auto;
    color: rgba(255, 255, 255, 0.8);
    line-height: 1.2;
    text-decoration: none;
    z-index: 3;
    min-height: 30px;
    padding: 4px 8px !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    pointer-events: auto;
    cursor: pointer;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 500;
}

.bot-cloud .chat-actions {
    position: absolute;
    top: 4px;
    right: 6px;
    left: auto;
    z-index: 3;
    display: inline-flex;
    align-items: center;
    gap: 6px !important;
    margin-bottom: 0 !important;
}

.generate-pdf-btn {
    color: rgba(255, 255, 255, 0.8);
    line-height: 1.2;
    text-decoration: none;
    min-height: 30px;
    padding: 4px 8px !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 500;
    background: transparent;
    border: none;
}

.generate-pdf-btn:hover,
.generate-pdf-btn:focus {
    color: #fff;
    background-color: rgba(255, 255, 255, 0.08);
}

.chat-copy-btn-inner {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    pointer-events: none;
}

.chat-copy-icon {
    font-size: 16px;
    line-height: 1;
    pointer-events: none;
}

.chat-copy-label {
    pointer-events: none;
    white-space: nowrap;
}

.chat-copy-icon-done,
.chat-copy-label-done {
    display: none;
}

.chat-copy-btn.is-copied {
    color: #9fe8c8;
}

.chat-copy-btn.is-copied .chat-copy-icon-default,
.chat-copy-btn.is-copied .chat-copy-label-default {
    display: none;
}

.chat-copy-btn.is-copied .chat-copy-icon-done,
.chat-copy-btn.is-copied .chat-copy-label-done {
    display: inline;
}

.chat-copy-btn:hover,
.chat-copy-btn:focus {
    color: #fff;
    background-color: rgba(255, 255, 255, 0.08);
}

#llm-chat-input,
#ai-chat-input {
    min-height: 90px;
    max-height: 320px;
}

/* LLM chat input base - start with a single-line height and allow expansion via JS/resize handle */
#llm-chat-input {
    resize: none;
    min-height: 44px; /* start compact so controls align */
    max-height: 480px;
    width: 100%;
    display: block;
    padding-right: 56px; /* make room for absolute send icon */
}

.ai-chat-container.llm-chat-input-shell {
    flex-direction: column;
    align-items: stretch;
}

.llm-chat-input-shell {
    flex-direction: column;
    align-items: stretch;
}

.llm-chat-input-row {
    position: relative;
    width: 100%;
    display: flex; /* align children in a single row */
    align-items: stretch; /* make buttons and textarea the same height */
    gap: 8px;
}

.llm-chat-input-shell .text-input {
    height: auto;
    min-height: 44px; /* match icon/button default height */
    max-height: 480px;
    resize: none;
    align-self: stretch; /* grow to fill the row height */
}

.llm-chat-input-shell .llm-chat-input-resize-handle {
    /* grip sits flush with the top border: full-width, small height */
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 10px;
    cursor: row-resize;
    touch-action: none;
    z-index: 6;
}

.llm-chat-input-shell .llm-chat-input-resize-handle::after {
    /* centered bar that sits on the border line */
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: -2px; /* overlap the container border so it visually touches */
    width: 48px;
    height: 6px;
    background: rgba(120, 130, 138, 0.55);
    border-radius: 3px;
    transition: background 0.12s ease;
}

.llm-chat-input-shell .llm-chat-input-resize-handle:hover::after,
body.llm-chat-input-resizing .llm-chat-input-shell .llm-chat-input-resize-handle::after {
    background: rgba(0,0,0,0.18);
}

.llm-chat-input-row .send-icon-inline {
    position: static; /* flow with the flex layout */
    width: 18px;
    height: 18px;
    cursor: pointer;
    opacity: 0.9;
    transition: opacity 0.12s;
}

.llm-chat-input-row .send-icon-inline:hover {
    opacity: 1;
}

body.llm-chat-input-resizing {
    cursor: row-resize !important;
    user-select: none;
}

.prompt-cloud {
    background-color: rgba(255, 149, 14, 1);
}

.prompt-text {
    color: white;
}

.prompt-images {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 6px;
}

.prompt-image-thumb {
  max-width: 160px;
  max-height: 160px;
  object-fit: cover;
  border-radius: 10px;
}

.prompt-file-pdf {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100px;
}

.prompt-file-pdf .pdf-thumb-wrap {
  background: rgba(255, 255, 255, 0.9);
}

.prompt-file-pdf .pdf-thumb-name {
  color: #fff;
  width: 100px;
}

.fixed-bottom {
    position: fixed;
    bottom: 0;
}

.mfa-input {
    width: 40px; /* Adjust width as needed */
    height: 40px; /* Adjust height as needed */
    text-align: center;
    margin: 0 5px; /* Adjust spacing between boxes */
}

.chart {
    height: 670px;
}

.add-btn {
    height: 30px;
    width: 30px;
    vertical-align: middle;
    text-align: center;
    font-size: 15px;
    padding: 0;
}

table {
    vertical-align: middle;
    text-align: center;
}

.table tr:nth-child(even) {
    background-color: #e0f7fa;
}

.header-cell {
    background-color: #00b8d4;
}

td {
    vertical-align: middle;
    justify-content: center;
    align-items: center;
    text-align: center;
}

.compare-row {
    height: 250px;
}

.sttable {
    background-color: #00b8d4;
    border-radius: 15px;
}

.img-flag {
    height: 20px;
    width: 20px;
  }

.hidden {
    display: none !important;
}


#autocomplete-list {
    list-style-type: none;
    padding: 0;
}
#autocomplete-list li {
    cursor: pointer;
    padding: 5px;
}
#autocomplete-list li:hover {
    background-color: lightgray;
}

.result-box ul {
    color: #000;
    background-color: #ffffff;
    padding: 5px 5px;
    border-radius: 10px;
}

.result-box ul li {
    list-style: none;
    padding: 5px 5px;
    border-radius: 5px;
}

.result-box ul li:hover{
    background: #ebf5fb;
}

.dropdown {
    margin: 2px;
}

.dropdown-toggle.btn-sm {
    height: 32px;
    padding-top: 3px;
    padding-bottom: 3px;
}

.dropdown-item:hover{
    background-color: rgba(77, 161, 169, 0.1); /*rgba(4, 188, 236, 0.1)*/;
}

.result-box {
    max-height: 300px;
    overflow-y: scroll;
    z-index: 1;
    width: 100%;
    border: 1px solid rgba(11, 143, 164, 0.1);
    border-radius: 10px;
}

























.badge-custom {
    display: inline-flex;
    align-items: center; /* Vertically center the content */
    justify-content: center; /* Optionally center horizontally */
    padding: 0.5em;
    background-color: #007bff;
    color: white;
    border-radius: 0.5rem;
    /*font-size: 1rem;*/
    height: 30px; /* Set a height if needed */
}


/* Cards */

.card {
    display: flex;
    flex-direction: column;
    max-height: 100%;
}

/* Ensure header and footer don't shrink */
.card-header, .card-footer {
    flex-shrink: 0;
}

.card-header {
    background-color: rgba(116,124,124, 0.05); /*rgba(4,188,236, 0.15)*/
    position: relative;
    padding-top: 4px;
    padding-bottom: 4px;
}


.card-body {
    flex-grow: 1; /* Take up available space */
    overflow-y: auto; /* Enable scrolling for the body */
    padding-top: 8px;
    padding-bottom: 8px;
}

.card-footer {
    background-color: rgba(116,124,124, 0.05); /*rgba(116,124,124, 0.15)*/
}


/* Navbar */
.navbar-brand {
    font-size: 1.5rem;
    font-family: 'Open Sans', sans-serif;
    padding: 0;
    height: 35px;
    align-items: center;
}

.navbar-nav .nav-link {
    font-family: 'Open Sans', sans-serif; /* Change to Open Sans */
    padding-top: 0.7rem;
    padding-bottom: 0.7rem;
    line-height: 1.2;
    display: flex;
    align-items: center;
}

.changes-nav-menu {
    width: 400px;
    max-height: 75vh;
    overflow-y: auto;
}

.changes-nav-menu .changes-nav-heading {
    padding: 4px 16px 8px;
    border-bottom: 1px solid #eef1f5;
}

.changes-nav-menu .changes-nav-rows {
    display: block;
}

/* A <button>, so the alignment is set here rather than left to the UA default. */
.changes-nav-menu .changes-nav-row {
    display: block;
    width: 100%;
    padding-top: 6px;
    padding-bottom: 6px;
    border-bottom: 1px solid #eef1f5;
    text-align: left;
    white-space: normal;
}

.changes-nav-menu .changes-nav-view-all {
    font-weight: 600;
}

.changes-nav-menu .changes-nav-title {
    overflow-wrap: anywhere;
}

.changes-nav-menu .changes-nav-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px 8px;
    margin-top: 3px;
    color: #5b6776;
    font-size: 0.8rem;
}

.changes-nav-menu .changes-nav-meta .change-log-type {
    padding: 0 7px;
    font-size: 0.72rem;
}

.changes-tag {
    /* Default for custom areas, which have no colour rule of their own. */
    background: #eceff1;
    color: #455a64;
    flex: 0 0 auto;
    border-radius: 999px;
    padding: 2px 9px;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    text-transform: uppercase;
}

/* Same area colours the list page uses, so a badge reads the same everywhere. */
.changes-tag.change-log-badge--appointments { background: #e3f0fd; color: #0d47a1; }
.changes-tag.change-log-badge--billing { background: #e6f4ea; color: #1b5e20; }
.changes-tag.change-log-badge--patients { background: #f3e8fd; color: #6a1b9a; }
.changes-tag.change-log-badge--office_config { background: #fff3e0; color: #e65100; }
.changes-tag.change-log-badge--self_scheduling { background: #e0f7f4; color: #00695c; }
.changes-tag.change-log-badge--documents { background: #fdf0e3; color: #8a5a00; }
.changes-tag.change-log-badge--other { background: #eceff1; color: #455a64; }

.changes-nav-empty {
    color: #5b6776;
}

/* Detail dialog for one change, opened from the dropdown. */
.changes-detail-overlay {
    position: fixed;
    inset: 0;
    z-index: 2100;
    display: none;
    align-items: center;
    justify-content: center;
    background: rgba(17, 24, 39, 0.6);
}

.changes-detail-overlay.show {
    display: flex;
}

.changes-detail-dialog {
    width: min(820px, 94vw);
    max-height: 92vh;
    overflow-y: auto;
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 18px 48px rgba(15, 23, 42, 0.32);
}

.changes-detail-head {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    background: linear-gradient(90deg, #2c3e50 0%, #39505d 50%, #2c3e50 100%);
    border-bottom: 2px solid rgba(255, 149, 14, 0.85);
    border-radius: 10px 10px 0 0;
}

/* styles.css colours every h3 dark navy, which vanishes on this header. */
.changes-detail-overlay .changes-detail-head .changes-detail-title {
    flex: 1 1 auto;
    margin: 0;
    font-size: 1.02rem;
    font-weight: 600;
    text-align: left;
    color: #fff;
}

.changes-detail-close {
    background: none;
    border: 0;
    color: #fff;
    font-size: 1.3rem;
    line-height: 1;
    cursor: pointer;
}

.changes-detail-body {
    padding: 16px;
    padding-bottom: 18px;
}

.changes-detail-tags {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
}

/* Beats the global rule that centres every paragraph. */
.changes-detail-overlay .changes-detail-body .changes-detail-meta {
    margin: 8px 0 0;
    color: #5b6776;
    font-size: 0.85rem;
    text-align: left;
}

.changes-detail-overlay .changes-detail-body .changes-detail-text {
    margin: 10px 0 0;
    color: #33414f;
    font-size: 0.9rem;
    line-height: 1.55;
    text-align: left;
    white-space: pre-wrap;
}

/* Before / after, side by side. */
.changes-detail-compare {
    margin-top: 14px;
    background: #f4f7fb;
    border: 1px solid #dbe3ec;
    border-radius: 8px;
    padding: 10px;
}

.changes-detail-pair {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}

.changes-detail-side {
    margin: 0;
    text-align: center;
}

.changes-detail-side figcaption {
    margin-bottom: 6px;
    color: #46566b;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.changes-detail-side img {
    display: block;
    max-width: 100%;
    max-height: 46vh;
    margin: 0 auto;
    background: #fff;
    border: 1px solid #dbe3ec;
    border-radius: 6px;
    object-fit: contain;
}

.changes-detail-missing {
    display: inline-block;
    padding: 24px 10px;
    color: #9aa7b5;
    font-size: 0.78rem;
}

.changes-detail-pair-nav {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    margin-top: 8px;
}

/* The pair arrows sit in flow, unlike the slider's overlaid ones. */
.changes-detail-pair-nav .changes-detail-arrow {
    position: static;
    transform: none;
    width: 28px;
    height: 28px;
    font-size: 1.1rem;
}

.changes-detail-pair-counter {
    color: #6b7280;
    font-size: 0.75rem;
}

@media (max-width: 640px) {
    .changes-detail-pair { grid-template-columns: 1fr; }
}

.changes-detail-slider {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 14px;
    background: #f4f7fb;
    border: 1px solid #dbe3ec;
    border-radius: 8px;
    padding: 10px;
}

.changes-detail-frame {
    display: block;
    max-width: 100%;
}

.changes-detail-image {
    display: block;
    max-width: 100%;
    max-height: 56vh;
    margin: 0 auto;
    border-radius: 6px;
    object-fit: contain;
}

.changes-detail-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 34px;
    height: 34px;
    background: rgba(17, 24, 39, 0.55);
    border: 0;
    border-radius: 50%;
    color: #fff;
    font-size: 1.4rem;
    line-height: 1;
    cursor: pointer;
}

.changes-detail-arrow:hover {
    background: rgba(17, 24, 39, 0.78);
}

.changes-detail-prev { left: 10px; }
.changes-detail-next { right: 10px; }

.changes-detail-counter {
    position: absolute;
    right: 14px;
    bottom: 14px;
    background: rgba(17, 24, 39, 0.6);
    border-radius: 999px;
    padding: 1px 9px;
    color: #fff;
    font-size: 0.7rem;
}

.changes-detail-files {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 12px;
}

.changes-detail-file {
    background: #f4f7fb;
    border: 1px solid #dbe3ec;
    border-radius: 6px;
    padding: 5px 10px;
    font-size: 0.78rem;
    color: #33414f;
}

.navbar {

    margin-bottom: 0;
    position: fixed;
    padding-top: 4px;
    padding-bottom: 0;
    width: 100%;
    z-index: 2000;
    background-color: white;
}

/* Circular images */
.radio-label {
    height: 30px;
    padding: 2px 4px 0px;
}



/* Circular images */
.circular-img {
    border-radius: 50%; /* Makes the image circular */
    object-fit: cover; /* Maintain aspect ratio and cover the container */
}


/* General classes */
.left-align {
    text-align: left !important;
}

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

.pointer {
    cursor: pointer;
}

.no-margin {
    margin: 0;
}

/* Spinners */
.overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.3);
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 9999;
}

.spinner-container {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 1001; /* Ensure spinner is on top of overlay */
  display: none;
}

.teal-grow-spinner {
  color: #4DA1A9 !important;
}

.tl-menubar {
    top: 152px !important;
}

.tl-storyslider, .td-slide-content {
    height: 150px !important;
}

button.tl-slidenav-previous, button.tl-slidenav-next {
    top: 40px !important;
}

.tl-attribution {
    display: none;
}

.tl-text-headline-container h2.tl-headline {
    font-size: 20px !important;
}

.btn-preview-doc, .btn-preview-note, .btn-preview-note-simple, .edit-note-btn, .delete-note-btn {
    padding-top: 0px;
    padding-bottom: 0px;
}

.search-container {
    position: relative;
}

.navbar-patient-search {
    display: flex;
    align-items: center;
    align-self: center;
    margin: 0;
    top: auto;
    overflow: visible;
    z-index: 2100;
}

.navbar-search-icon {
    position: absolute;
    left: 13px;
    top: 50%;
    transform: translateY(-50%);
    color: #39505d;
    font-size: 0.95rem;
    line-height: 1;
    pointer-events: none;
    z-index: 2;
}

.inbox-val-doc-primary-fields .doc-type.is-valid,
.inbox-val-doc-primary-fields select[id^="doc-subtype-"].is-valid {
    background-image: none;
    padding-right: 0.75rem;
    border-color: var(--bs-border-color);
}

.navbar-search-input {
    display: block;
    width: 320px;
    height: 38px;
    margin: 0;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 0.375rem;
    padding-right: 0.75rem;
    padding-bottom: 0.375rem;
    padding-left: 36px;
    border: 1px solid rgba(57, 80, 93, 0.16);
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.92);
    color: #39505d;
    box-shadow: 0 8px 18px rgba(24, 42, 53, 0.08);
    transition: border-color 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
    -webkit-appearance: none;
    appearance: none;
    background-clip: padding-box;
    line-height: 1.5;
    vertical-align: middle;
}

.navbar-search-input.search-with-icon {
    background-image: none !important;
    background-position: initial !important;
    background-size: initial !important;
    background-repeat: no-repeat !important;
}

.navbar-search-input::placeholder {
    color: rgba(57, 80, 93, 0.52);
}

.navbar-search-input:focus {
    border-color: rgba(57, 80, 93, 0.32);
    background: rgba(255, 255, 255, 0.98);
    box-shadow: 0 12px 22px rgba(24, 42, 53, 0.12);
    color: #39505d;
}

.navbar-search-input::-webkit-search-cancel-button {
    -webkit-appearance: none;
    appearance: none;
    display: none;
}

.navbar-search-input::-webkit-search-decoration,
.navbar-search-input::-webkit-search-results-button,
.navbar-search-input::-webkit-search-results-decoration {
    -webkit-appearance: none;
    appearance: none;
    display: none;
}

.navbar-patient-suggestion {
    display: flex;
    align-items: center;
    gap: 2px;
    padding-top: 6px;
    padding-bottom: 6px;
    padding-left: 10px;
    padding-right: 10px;
}

.navbar-patient-suggestion-copy {
    min-width: 0;
    line-height: 1.2;
}

.navbar-patient-suggestion-ban-row {
    display: flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
    margin-top: 4px;
}

.navbar-patient-suggestion-banned-badge {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    padding: 0.28rem 0.5rem;
    border-radius: 999px;
    border: 1px solid #f8c9c9;
    background: #fdecec;
    color: #b02a2a;
    font-size: 0.68rem;
    font-weight: 600;
    line-height: 1;
    white-space: nowrap;
}

.navbar-patient-suggestion-ban-reason {
    min-width: 0;
    overflow: hidden;
    color: #b02a2a;
    font-size: 0.73rem;
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.navbar-patient-suggestion-avatar-wrap {
    width: 36px;
    height: 36px;
    margin-right: 10px !important;
    border-radius: 50%;
    overflow: hidden;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #ffffff;
}

.navbar-patient-suggestion-avatar {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: var(--patient-photo-position-x, 50%) var(--patient-photo-position-y, 50%);
    transform: scale(var(--patient-photo-zoom, 1));
    transform-origin: center center;
}

.navbar-patient-suggestion-avatar-wrap.is-initials {
    background: #dde6ea;
    color: #39505d;
}

.navbar-patient-suggestion-initials {
    font-size: 0.8125rem;
    font-weight: 700;
    line-height: 1;
}

.navbar-patient-suggestion-dob {
    margin-top: 2px;
    color: #7d8a93;
    font-size: 0.73rem;
    font-weight: 500;
}


/* Dropdown menu styles — positioned fixed by JS under the navbar search input */
#search-patient-dropdown,
.navbar-patient-search-dropdown {
    position: fixed;
    display: none;
    max-height: 420px;
    overflow-y: auto;
    margin-top: 0;
    border: 1px solid #ccc;
    border-radius: 0.5rem;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18);
    background-color: white;
    z-index: 5000 !important;
}

#search-patient-dropdown.show,
.navbar-patient-search-dropdown.show {
    display: block;
}

.circular-img {
    border-radius: 50%;  /* Makes the image circular */
    object-fit: cover;   /* Ensures the image covers the entire area without distortion */
    overflow: hidden;    /* Hides any overflow if the image doesn't perfectly fit the container */
}

.patient-desc-col {
    color: white;
    display: flex;
    align-items: left;
    justify-content: left;
    margin-right: 10px;  /* Optional space between columns */
}

.box {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    width: auto;
}

.transparent-table {
    width: 100%;
    background-color: rgba(0, 0, 0, 0); /* Adjust alpha (0-1) for transparency */
    /*color: white;  Set text color to white */
    border-collapse: collapse; /* Optional: for cleaner borders */
}

.transparent-table th,
.transparent-table td {
    background-color: rgba(0, 0, 0, 0); /* Make background of cells transparent */
    /*color: white;  Ensure text in each cell is white */
    text-align: left;
}

.transparent-table tr:nth-child(even),
.transparent-table tr:nth-child(odd) {
    background-color: rgba(0, 0, 0, 0); /* Ensure all rows have the same background */
}

.blue-event {
    background-color: #39505d !important;
    color: white !important;
}

.orange-event {
    background-color: #ff950e !important;
}

.red-event {
    background-color: #f5b7b1 !important;
}

.green-event {
    background-color: #abebc6 !important;
}

.tl-headline {
    color: black !important;
}

/*
.input-group-text {
    background-color: #39505d;
    color: white;
}
*/

.card-radio input[type="radio"]:checked + .card-body {
    background-color: #d5f5e3;
    color: black;
}

/* Transparent table */
.transparent-table-existing-patient {
    background-color: transparent !important; /* Make the table background transparent */
}

.transparent-table-existing-patient th, .transparent-table-existing-patient td {
    background-color: rgba(255, 255, 255, 0); /* Semi-transparent background for table cells */
    border-color: rgba(255, 255, 255, 0); /* Semi-transparent border color */
    color: black;
}

.transparent-table-existing-patient th {
    font-weight: bold;
}

.transparent-table-existing-patient tr:nth-child(even),
.transparent-table-existing-patient tr:nth-child(odd) {
    background-color: rgba(0, 0, 0, 0); /* Ensure all rows have the same background */
}

.white {
    color: white !important;
}

.blue-nitovo {
    background-color: #39505d !important;
    color: white !important;
}

.blue-appt-nitovo {
    background-color: #2980b9 !important;
    color: white !important;
}

.purple-nitovo {
    background-color: #AD4497 !important;
    color: white !important;
}

.teal-nitovo {
    background-color: #4DA1A9 !important;
    color: white !important;
}

.teal-purple-nitovo {
    background: linear-gradient(135deg, #4DA1A9, #AD4497) !important;
    color: white !important;
}


.green-nitovo {
    background-color: #48c9b0 !important;
    color: white !important;
}


.wide-tr {
    margin-top: 32px;
    margin-bottom: 32px;
}

.moving-gradient {
    margin-top: 50px;
    margin-bottom: 50px;
    width: 100%;        /* Set the width of the div */
    height: 5px;       /* Set the height of the div */
    background: linear-gradient(to right, #39505d, #ff950e, #39505d, #ff950e, #39505d, #ff950e, #39505d); /* Repeat the gradient */
    background-size: 500% 100%;  /* Double the width for smooth movement */
    animation: moveGradient 10s linear infinite;  /* Animate the background */
    border-radius: 5px;
}

.moving-gradient-sm {
    margin-top: 20px;
    margin-bottom: 20px;
    width: 100%;        /* Set the width of the div */
    height: 5px;       /* Set the height of the div */
    background: linear-gradient(to right, #39505d, #ff950e, #39505d, #ff950e, #39505d, #ff950e, #39505d); /* Repeat the gradient */
    background-size: 500% 100%;  /* Double the width for smooth movement */
    animation: moveGradient 10s linear infinite;  /* Animate the background */
    border-radius: 5px;
}

@keyframes moveGradient {
    0% {
        background-position: 0% 0%;
    }
    100% {
        background-position: 100% 0%;
    }
}

.nav-tabs {
  border-bottom: none !important;
}

.nav-tabs .nav-item .nav-link {
  background-color: transparent;
  color: #39505d;
  border: none !important;
  border-bottom: 2px solid transparent !important;
  border-radius: 0;
}

.nav-tabs .nav-item .nav-link.active {
  color: #39505d;
  background-color: transparent;
  border-bottom: 2px solid #39505d !important;
}

.nav-tabs .nav-item .nav-link:not(.active):hover {
  color: #4DA1A9;
  border-bottom: 2px solid #4DA1A9 !important;
}

.accordion-button {
    background-color: white; /* Change to desired background color */
    color: black; /* Change to desired font color */
}

/* Change background and font color of the accordion button when collapsed */
.accordion-button:not(.collapsed) {
    background-color: #39505d; /* Adjust color for active state */
    color: white;
}

/* Change Arrow Icon Color When Expanded */
.accordion-button:not(.collapsed)::after {
  filter: brightness(0) invert(1); /* Make the arrow icon white when expanded */
  z-index: 1080;
}

/* Optional: Change Arrow Icon Color When Collapsed */
.accordion-button.collapsed::after {
  filter: none; /* Keep default arrow color when collapsed */
  z-index: 1080;
}

/* Pseudo-element for the left-to-right color animation */
.accordion-button::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 0%; /* Start from 0% width */
  height: 100%;
  background-color: #4DA1A9; /* Solid green color for animation */
  transition: none; /* No animation unless the class is added */
}

/* Trigger left-to-right animation when 'highlight' class is added */
.accordion-button.validated::before {
  width: 100%; /* Fill from left to right */
  transition: width 1s ease-in-out; /* Smooth animation over 1 second */
}

/* Ensure text remains visible over the animation */
.accordion-button.validated {
  color: white !important; /* Keep text white during the animation */
}

.accordion-button.delete-attachment, .accordion-button.delete-attachment::before {
  background-color: #808b96 !important;
}



.hr-with-label {
    display: flex;
    align-items: center;
    text-align: center;
    margin: 20px 0;
}

.hr-with-label::before,
.hr-with-label::after {
    content: "";
    flex: 1;
    border-bottom: 1px solid #ccc;
    margin: 0 10px;
}

.hr-with-label span {
    white-space: nowrap;
    font-size: 14px;
    color: #333;
}

.carousel-item .card-radio {
    pointer-events: auto;
    z-index: 10;
    position: relative;
}

.card-radio {
    cursor: pointer;
    position: relative;
    z-index: 10;
}

.accordion-body {
   overflow-y: auto;
   overflow-x: hidden;
}

.no-body-scroll .accordion-body {
    overflow: visible !important;
}

.accordion-open {
    display: flex;
    flex-direction: column;
    flex: 1;
}

/* El body ahora tiene contexto de altura */
.accordion-open .accordion-body {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
}

.accordion-body .table td {
   padding: 5px;
   word-break: break-word;
}

.nav-item.bold .nav-link {
    font-weight: bold;
}

.dropdown-item.bold {
    font-weight: bold;
}

.btn-label {
    position: relative;
    padding-right: 20px;
    border-radius: 5px;
    cursor: default !important;
    padding-top: 3px;
    padding-bottom: 3px;
    background-color: white;
    color: black;
    border: 1px solid rgba(4,188,236, 0.5);
    text-align: left;
}

.btn-label:hover {
  background-color: rgba(255, 255, 255, 0.5) !important;
}

.btn-label .close {
  position: absolute;
  top: 0px !important;
  right: 4px !important;
  font-size: 20px;
  color: rgba(0,0,0,0.6);
  cursor: pointer;
}
.btn-label .close:hover {
  color: #eb5d8b;
}

.btn-label.team-label {
    /*background-color: rgba(57, 80, 93, 0.1) !important;*/
    border: 1px solid rgba(57, 80, 93, 0.5) !important;
}

.btn-label.patient-label {
    /*background-color: rgba(77, 161, 169, 0.1) !important;*/
    border: 1px solid rgba(77, 161, 169, 0.5) !important;
}

.btn-label.provider-label {
    /*background-color: rgba(173, 68, 151, 0.1) !important;*/
    border: 1px solid rgba(173, 68, 151, 0.5) !important;
}

/* ---- particles ---- */

.particles-js-login {
  width: 100%;
  height: 100%;
  background: linear-gradient(45deg, #f9c299, #8ee0d0); /* linear-gradient(45deg, #fbb9b9, #a0d5ce);*/
  position: fixed; /* Stays in place even when scrolling */
  top: 0;
  left: 0;
  z-index: -1;
}
/*
.particles-js {
  width: 100%;
  height: 100%;
  background: linear-gradient(45deg, #566573, #b1dfde);
  position: fixed;
  top: 0;
  left: 0;
  z-index: -1;
}
*/
.particles-js {
  width: 100%;
  height: 100%;
  background: linear-gradient(
      135deg,
      #4d7388,
      #395a6d,
      #2f4c5c,
      #457891
    );
  background-size: 400% 400%;
  animation: gradientShift 70s ease-in-out infinite;
  position: fixed;
  top: 0;
  left: 0;
  z-index: -2;
}

/* Nueva capa de blur */
.background-blur {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(255, 255, 255, 0.2); /* transparencia */
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px); /* Safari */
  z-index: -1; /* entre el fondo y el contenido */
}


@keyframes gradientShift {
  0%   { background-position: 0% 50%; }
  50%  { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}


.modal:not(.static-modal) .modal-header {
    cursor: move;
}

.static-modal .modal-header {
    cursor: default;
}

a.fc-daygrid-day-number {Borrador Reglamento Copropiedad Entrelomas III
    color: #39505d;
    text-decoration: none;
}

a.fc-daygrid-day-number:hover {
    color: #ff950e;
}

a.fc-col-header-cell-cushion {
    color: #39505d;
    text-decoration: none;
    cursor: pointer;
}

a.fc-col-header-cell-cushion:hover {
    color: #ff950e;
}

.fc-timegrid-slot {
    cursor: pointer;
}

.fc-event-title.fc-sticky, .fc-event-time {
    text-align: left;
}


.red-outline-btn {
    border-color: #e74c3c;
    color: #e74c3c;
    background-color: white;
}
/* Prevent hover effect for unchecked buttons */
.btn-check:not(:checked) + .red-outline-btn:hover {
    border-color: #e74c3c;
    color: #e74c3c;
    background-color: white;
}
.btn-check:checked + .red-outline-btn {
    background-color: #e74c3c;
    color: white;
    border-color: #e74c3c;
}

.purple-outline-btn {
    border-color: #8e44ad;
    color: #8e44ad;
    background-color: white;
}
/* Prevent hover effect for unchecked buttons */
.btn-check:not(:checked) + .purple-outline-btn:hover {
    border-color: #8e44ad;
    color: #8e44ad;
    background-color: white;
}
.btn-check:checked + .purple-outline-btn {
    background-color: #8e44ad;
    color: white;
    border-color: #8e44ad;
}

.blue-outline-btn {
    border-color: #3498db;
    color: #3498db;
    background-color: white;
}
/* Prevent hover effect for unchecked buttons */
.btn-check:not(:checked) + .blue-outline-btn:hover {
    border-color: #3498db;
    color: #3498db;
    background-color: white;
}
.btn-check:checked + .blue-outline-btn {
    background-color: #3498db;
    color: white;
    border-color: #3498db;
}

.green-outline-btn {
    border-color: #27ae60;
    color: #27ae60;
    background-color: white;
}
/* Prevent hover effect for unchecked buttons */
.btn-check:not(:checked) + .green-outline-btn:hover {
    border-color: #27ae60;
    color: #27ae60;
    background-color: white;
}
.btn-check:checked + .green-outline-btn {
    background-color: #27ae60;
    color: white;
    border-color: #27ae60;
}

.orange-outline-btn {
    border-color: #f39c12;
    color: #f39c12;
    background-color: white;
}
/* Prevent hover effect for unchecked buttons */
.btn-check:not(:checked) + .orange-outline-btn:hover {
    border-color: #f39c12;
    color: #f39c12;
    background-color: white;
}
.btn-check:checked + .orange-outline-btn {
    background-color: #f39c12;
    color: white;
    border-color: #f39c12;
}


.btn-outline-teal {
  color: #4DA1A9;
  border: 1px solid #4DA1A9;
  background-color: #fff;
  transition: background-color 0.2s, color 0.2s;
}

.btn-outline-teal:hover,
.btn-check:checked + .btn-outline-teal {
  background-color: #4DA1A9 !important;
  color: #fff !important;
  border-color: #4DA1A9 !important;
}

.offcanvas {
    z-index: 2000 !important;
    top: 54px !important; /* Push the offcanvas down by 20px */
    height: calc(100% - 54px) !important; /* Adjust height so it fits properly */
}

/* Cuando el panel está abierto, mover el contenedor principal */
#main-container {
  width: 100%;
  transition: width 0.35s ease;
  margin-left: 0; /* asegura alineación a la izquierda */
}

#main-container.with-offcanvas {
  width: calc(100% - var(--active-offcanvas-width, 400px)) !important;
}

#llm-chat-offcanvas {
  --bs-offcanvas-width: var(--active-offcanvas-width, 400px);
}

#llm-chat-offcanvas .llm-chat-resize-handle {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 8px;
  cursor: col-resize;
  z-index: 6;
  touch-action: none;
}

#llm-chat-offcanvas .llm-chat-resize-handle::after {
  content: "";
  position: absolute;
  left: 3px;
  top: 0;
  bottom: 0;
  width: 2px;
  background: transparent;
  transition: background 0.15s ease;
}

#llm-chat-offcanvas .llm-chat-resize-handle:hover::after,
body.llm-chat-resizing #llm-chat-offcanvas .llm-chat-resize-handle::after {
  background: rgba(77, 161, 169, 0.7);
}

#llm-chat-offcanvas .llm-chat-resize-handle::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 5px;
  height: 100px;
  background: rgba(90, 98, 105, 0.55);
  border-radius: 3px;
  transition: background 0.12s ease;
}

#llm-chat-offcanvas .llm-chat-resize-handle:hover::before,
body.llm-chat-resizing #llm-chat-offcanvas .llm-chat-resize-handle::before {
  background: rgba(77, 161, 169, 0.9);
}

body.llm-chat-resizing {
  cursor: col-resize !important;
  user-select: none;
}

body.llm-chat-resizing #main-container.with-offcanvas,
body.llm-chat-resizing #llm-chat-offcanvas.offcanvas {
  transition: none !important;
}

.ai-chat-border {
    border-bottom: 4px solid;
    border-image: linear-gradient(to right, #39505d, #ff950e) 1;
}

/* Bootstrap .offcanvas is position: fixed — do NOT override its position,
   the absolute close button below already anchors to it. */
#llm-chat-offcanvas .offcanvas-header,
#ai-chat-offcanvas .offcanvas-header {
    padding-left: 2.75rem;
}

.kurik-chat-close-btn {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 12;
    width: 2.25rem;
    height: 2.25rem;
    margin: 0;
    padding: 0;
    border: none;
    border-radius: 0 0 0.5rem 0;
    background: linear-gradient(135deg, #4da1a9 0%, #39505d 100%);
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: 0 2px 8px rgba(57, 80, 93, 0.35);
    transition: background 0.15s ease, transform 0.15s ease;
}

.kurik-chat-close-btn:hover,
.kurik-chat-close-btn:focus-visible {
    background: linear-gradient(135deg, #ff950e 0%, #e68600 100%);
    color: #fff;
    outline: none;
}

.kurik-chat-close-btn:active {
    transform: scale(0.96);
}

.kurik-chat-close-btn .bi {
    font-size: 1.1rem;
    font-weight: 700;
    line-height: 1;
}

#modal-email-recipient-create.modal {
    z-index: 1065;
}

#modal-email-recipient-create.modal ~ .modal-backdrop {
    z-index: 1060;
}

/* AI chat input text */
.ai-chat-container {
    position: relative;
    width: 100%;
    border: 1px solid #ddd; /* single outer border */
    border-radius: 10px;
    padding: 8px; /* compact padding so inner elements align */
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.04);
    background: #fff;
}

.llm-chat-input-row {
    display: flex;
    align-items: stretch; /* make children match height */
    gap: 0.5rem;
    position: relative;
}

.llm-chat-input-shell .llm-chat-input-resize-handle {
    /* grip sits flush with the top border: full-width, small height */
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 10px;
    cursor: row-resize;
    touch-action: none;
    z-index: 6;
}

.llm-chat-input-shell .llm-chat-input-resize-handle::after {
    /* centered bar that sits on the border line */
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: -2px; /* overlap the border */
    width: 40px;
    height: 4px;
    background: rgba(90, 98, 105, 0.55);
    border-radius: 2px;
    transition: background 0.12s ease;
}

.llm-chat-input-shell .llm-chat-input-resize-handle:hover::after,
body.llm-chat-input-resizing .llm-chat-input-shell .llm-chat-input-resize-handle::after {
    background: rgba(0,0,0,0.18);
}

.llm-chat-icon-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    min-width: 44px;
    height: 44px; /* fixed button size to match textarea min-height */
    padding: 0;
    border: none; /* minimal icon-only buttons */
    border-radius: 0;
    background: transparent;
    color: #4da1a9; /* light blue */
    cursor: pointer;
    transition: color 0.12s ease, background 0.12s ease;
    align-self: stretch; /* fill the row height so alignment matches textarea */
    font-size: 18px;
}

.llm-chat-icon-btn:hover,
.llm-chat-icon-btn:focus {
    background: transparent;
    color: #3a8d93;
}

.llm-chat-icon-btn:focus {
    outline: none;
    box-shadow: none;
}

.send-btn {
    /* keep legacy class harmless */
    background: transparent;
    border: none;
    color: inherit;
}

.send-icon-btn {
    position: static; /* inline with other controls */
    width: 44px;
    height: 44px;
    padding: 0;
    background: transparent;
    border: none;
    color: #4da1a9; /* light blue */
    font-size: 18px;
    line-height: 1;
    cursor: pointer;
    align-self: stretch;
}

.send-icon-btn i {
    font-size: 18px;
}

.text-input {
    flex: 1;
    border: none; /* remove inner border so only container shows */
    border-radius: 8px;
    outline: none;
    resize: none;
    padding: 10px 12px;
    min-height: 44px;
    max-height: 220px;
    line-height: 1.4;
    overflow-y: auto;
    background: transparent;
    align-self: center; /* align vertically with buttons */
}

.ai-chat-container:focus-within {
    /* No visible highlight — user requested no green box */
    border-color: inherit;
    box-shadow: none;
}

.text-input.dragover {
    /* highlight via container focus */
}

.send-icon-inline {
    width: 18px;
    height: 18px;
}

.clipboard {
    height: 18px;
    cursor: pointer;
    margin-left: 5px;
    opacity: 0.5;
}

.clipboard:hover {
    opacity: 1;
}


.table-striped-app > tbody > tr:nth-of-type(odd) > * {
    background-color: rgba(233, 252, 255, 1); /*  rgba(4, 188, 236, 0.1);*/
}

.table > tbody > tr.table-row-selected > * {
    background-color: rgba(233, 252, 255, 1) !important; /*rgba(248, 196, 113, 1)*/
}

/* Custom table-hover */
.table {
    --bs-table-hover-bg: rgba(233, 252, 255, 1);
}


.carousel-control-prev {
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
}

.carousel-control-next {
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
}

/* Step progress bar for each document validation */

.steps-container {
    padding-left: 10%;
    padding-right: 10%;
}

.steps-container .steps {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: space-between;
    position: relative;
}

.steps .circle {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 40px;
    width: 40px;
    color: #34495e;
    font-size: 30;
    font-weight: 500;
    border-radius: 50%;
    border: solid 4px #34495e;
    background: #ffffff;
}

.steps .progress-bar {
    position: absolute;
    height: 4px;
    width: 100%;
    background: #34495e;
    z-index: -1;
}

.progress-bar .indicator {
    position: absolute;
    height: 100%;
    width; 100%;
    background: #34495e;
}

.one-visit {
    background-color: #f7dc6f !important;
}

.many-visits {
    background-color: #82e0aa !important;
}

/* Rounded table */
.table-container {
  /* max-height: 300px;  */
  overflow-y: auto; /* Enable vertical scrolling */
  border: 1px solid #ddd; /* Optional: Add a border around the table container */
  border-radius: 10px; /* Add border-radius to the entire container */
}

.rounded-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
}

.rounded-table thead th {
  position: sticky; /* Fix the header row */
  top: 0; /* Keep it stuck to the top */
  background-color: #f4f4f4; /* Set background for better visibility */
  z-index: 2 !important; /* Ensure the header stays on top of content */
  padding: 10px;
  border: 1px solid #ddd;
  text-align: left;
}

.rounded-table tbody td {
  padding: 10px;
  border: 1px solid #ddd;
}

.rounded-table th:first-child {
  border-top-left-radius: 10px; /* Top-left corner */
  /* border-bottom-left-radius: 10px;*/
}

.rounded-table th:last-child {
    border-top-right-radius: 10px; /* Top-right corner */
    /* border-bottom-right-radius: 10px; *//* Top-right corner */
}

.rounded-table tr:last-child td:first-child {
    border-bottom-left-radius: 10px; /* Bottom-left corner */
    /*border-top-left-radius: 10px;*/
}

.rounded-table tr:last-child td:last-child {
    border-bottom-right-radius: 10px; /* Bottom-right corner */
    /*border-top-right-radius: 10px;*/
}

/*
.sticky-column {
    position: sticky;
    left: 0;
    z-index: 2 !important;
}

.sticky-header {
    position: sticky;
    left: 0;
    z-index: 100000 !important;
}
*/

.file-row {
    cursor: pointer;
}

.dropdown-menu.columns-4 {
	min-width: 850px;
}

.dropdown-menu.columns-3 {
	min-width: 650px;
}

.dropdown-menu.columns-2 {
	min-width: 450px;
}

.resizer {
  position: absolute;
  right: 0;
  top: 0;
  width: 5px;
  height: 100%;
  cursor: col-resize;
  background-color: transparent;
}

/* Update icons */
.icon {
    width: 20px;
    height: 20px;
    cursor: pointer;
}
.icon:hover {
    opacity: 0.7;
}

.span-save {
    border-right: none;
    border-left: none;
    padding-left: 4px;
    padding-right: 2px;
    background-color: white;
}
.span-cancel {
    border-left: none;
    padding-left: 2px;
    padding-right: 4px;
    background-color: white;
}
.editable {
    cursor: pointer;
}
.no-focus-border:focus {
    outline: none;
    box-shadow: none;
    border-color: #dee2e6;
}

.no-border {
    border: none !important;
}


/* Mapbox map */
#map {
    width: 500px;
    height: 300px;
    border-radius: 10px;
}

.overlined {
    text-decoration: overline;
}

/* Progress bar of the validation headers */
.progress-fill {
    position: absolute;
    top: 0;
    left: 0;
    width: 0%;
    height: 100%;
    background: #4DA1A9; /* Progress fill color */
    transition: width 0.5s ease-in-out;
    border-radius: 3px 3px 0 0;
}


.transparent-btn {
    background: transparent !important;  /* Make background transparent */
    border: none !important;             /* Remove border */
    color: #39505d !important;             /* Keep text visible */
    box-shadow: none !important;         /* Remove shadow */
}

.is-invalid {
    z-index: 1 !important;  /* Lower z-index so it doesn't overlap dropdown */
    position: relative;     /* Ensure z-index takes effect */
}

/* Modal layering */
.modal {
  z-index: 3010 !important;
}
.modal-backdrop {
  z-index: 3000 !important;
}


.modal-stack {
}

.modal-xl-custom {
  max-width: 100%;
  width: 95vw;
  height: 95vh;
}

.modal-xl-custom .modal-content {
  height: 100%;
}

#toast, .toast-container, .toast {
  z-index: 110000 !important;
}

.toast-body {
    background-color: white;
    border-radius: 0 0 0.25rem 0.25rem;
}

#toast {
  z-index: 110000 !important;
  pointer-events: none !important;
}

#toast #liveToast.toast {
  position: relative !important;
  inset: auto !important;
  right: auto !important;
  bottom: auto !important;
  display: block !important;
  width: min(92vw, 26rem) !important;
  max-width: 26rem !important;
  padding: 0 !important;
  color: #212529 !important;
  background: #ffffff !important;
  border: 1px solid rgba(24, 42, 53, 0.12) !important;
  border-radius: 0.5rem !important;
  box-shadow: 0 18px 44px rgba(24, 42, 53, 0.18) !important;
  pointer-events: auto;
}

#toast #liveToast.toast:not(.show):not(.showing) {
  pointer-events: none !important;
}

#toast #liveToast .toast-header {
  display: flex !important;
  align-items: center !important;
  background: #ffffff !important;
  color: inherit !important;
  border-bottom: 1px solid rgba(24, 42, 53, 0.08) !important;
}

#toast #liveToast .toast-body {
  background: #ffffff !important;
  color: inherit !important;
  white-space: normal !important;
}

.form-check-input {
    cursor: pointer;
}

.form-check-input:checked {
  background-color: #4DA1A9;
  border-color: #4DA1A9;
}

.auto-width {
    white-space: nowrap;  /* Prevents content from wrapping */
    width: 1%;            /* Forces the column to shrink to fit content */
}

td.editable {
  position: relative;
  cursor: pointer;
}

td.editable::after {
  content: '';
  background: url('/static/images/edit.png') no-repeat center center;
  background-size: contain;
  width: 15px;
  height: 15px;
  position: absolute;
  top: 4px;
  right: 4px;
  opacity: 0;
  transition: opacity 0.2s;
  pointer-events: none;
}

td.editable:hover::after {
  opacity: 1;
}

tr.high-health td {
    background-color: #d5f5e3;
}

tr.medium-health td {
    background-color: #fef9e7;
}

tr.low-health td {
    background-color: #fadbd8;
}

/* Update cells textarea */
.textarea-container {
    box-shadow: 0 4px 8px rgba(0,0,0,0.2);
    background-color: #fff;
    border: 1px solid #ccc;
    border-radius: 4px;
}

.button-group-inside {
    position: absolute;
    bottom: 5px;
    right: 5px;  /* Positioned at the right bottom corner */
    display: flex;
    gap: 5px;
    background-color: rgba(255, 255, 255, 0.9);
    padding: 5px;
    border-radius: 4px;
    box-shadow: 0 2px 5px rgba(0,0,0,0.2);
}

.textarea-container textarea {
    padding-bottom: 50px; /* Space for buttons */
    box-sizing: border-box;
}

.button-group-inside button {
    font-size: 12px;
    padding: 4px 8px;
}

@media (min-width: 1400px) {
    .col-large-3 { width: 25%; }  /* 4 columns */
    .col-large-4 { width: 33.33%; } /* 3 columns */
    .col-large-6 { width: 50%; } /* 2 columns */
}

@media (max-width: 2600px) and (min-width: 1700px) {
    .col-medium-3 { width: 25%; }  /* 4 columns */
    .col-medium-4 { width: 33.33%; } /* 3 columns */
    .col-medium-6 { width: 50%; } /* 2 columns */
}

/* Default nav-pills link style */
.nav-pills .nav-link {
  color: #4DA1A9;
  background-color: rgba(255, 255, 255, 0.5);
  border-radius: 0.5rem;
  transition: background-color 0.3s, color 0.3s;
}

/* Hover effect */
.nav-pills .nav-link:hover {
  background-color: #f0f8f9;
  color: #4DA1A9;
}

/* Active (selected) tab */
.nav-pills .nav-link.active {
  background-color: #39505d;
  color: white;
  font-weight: bold;
}

/* Nav tabs for multiple documents in one email */
.pagination .page-item.active .page-link {
    background-color: #39505d;
    color: #ffffff;
    border-color: #39505d;
}

.pagination .page-item .page-link {
    background-color: white;
    color: #39505d;
}

.pagination .page-item:not(.active) .page-link:hover {
    background: rgba(233, 252, 255, 1);
    color: #39505d;
    cursor: pointer;
}

/* Elimina la animación de collapse */
.no-animation.collapse:not(.show) {
  display: none;
}

.no-animation.collapsing {
  transition: none !important;
  display: block !important;
  height: auto !important;
  overflow: hidden;
}


/* Dictation button for audio notes */
.dictation-btn {
  border: none;
  border-radius: 50%;
  width: 45px;
  height: 45px;
  background-color: #4DA1A9;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background-color 0.3s, transform 0.3s;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
  cursor: pointer;
  padding: 0;
}

.dictation-btn img {
  height: 20px;
  width: 20px;
}

.dictation-btn.active {
  background-color: #e74c3c;
  animation: pulse 1.2s infinite;
}

@keyframes pulse {
  0% {
    transform: scale(1);
    box-shadow: 0 0 0 0 rgba(231, 76, 60, 0.7);
  }
  70% {
    transform: scale(1.1);
    box-shadow: 0 0 0 10px rgba(231, 76, 60, 0);
  }
  100% {
    transform: scale(1);
    box-shadow: 0 0 0 0 rgba(231, 76, 60, 0);
  }
}

/* Estado intermedio: preparando (naranjo) */
.dictation-btn.preparing {
  background-color: #f39c12;
  animation: pulse 1.2s infinite;
}

/* Patient dashboard: Scribe snap widget */
.scribe-widget-snap .scribe-widget-reason-text {
  font-size: 0.82rem;
  max-height: 160px;
  overflow-y: auto;
  resize: none;
}

#save-note-btn.active {
  background-color: #4da1a9 !important;
  border-color: #4da1a9 !important;
  color: #fff !important;
  animation: scribe-finalize-ready-pulse 1.4s ease-in-out infinite;
}

#save-note-btn.active:hover,
#save-note-btn.active:focus,
#save-note-btn.active:active {
  background-color: #3f8f97 !important;
  border-color: #3f8f97 !important;
  color: #fff !important;
}

@keyframes scribe-finalize-ready-pulse {
  0% {
    transform: scale(1);
    box-shadow: 0 0 0 0 rgba(77, 161, 169, 0.42);
  }
  55% {
    transform: scale(1.07);
    box-shadow: 0 0 0 8px rgba(77, 161, 169, 0);
  }
  100% {
    transform: scale(1);
    box-shadow: 0 0 0 0 rgba(77, 161, 169, 0);
  }
}

@media (prefers-reduced-motion: reduce) {
  #save-note-btn.active {
    animation: none;
  }
}

.step-header {
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  width: 100%;
}

.step-title {
  margin-right: 2rem;
  white-space: nowrap;
}

.step-flow-wrapper {
  flex-grow: 1;
  position: relative;
  display: flex;
  flex-direction: column;
}

.step-flow-line {
  position: absolute;
  top: 12px;
  left: 50px;      /* Desde el centro del paso 1 */
  width: 560px;    /* Hasta el centro del paso 6 */
  height: 2px;
  background-color: #4DA1A9;
  z-index: 0;
}

.step-flow-container {
  display: flex;
  gap: 12px;
  z-index: 1;
  align-items: flex-start;
  justify-content: flex-start;
}

.step-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  min-width: 100px;
  position: relative;
  flex-shrink: 0;
}

.step-number {
  background: #4DA1A9;
  color: white;
  width: 24px;
  height: 24px;
  font-size: 13px;
  font-weight: bold;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 8px; /* más espacio entre número y botón */
  z-index: 1;
}

.step-gap-between {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 6px;
}

.step-compact {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center; /* para centrar el timer bajo el badge */
}

#llm-chat-input.dragover {
  border: 2px dashed #0d6efd;
  background-color: #eef7ff;
}

#llm-files-preview {
  padding: 8px 0;
}

#llm-files-preview .file-preview {
  position: relative;
  display: inline-block;
}

#llm-files-preview img.thumb {
  width: 100px;
  height: 100px;
  object-fit: cover;
  border-radius: 10px;
}

#llm-files-preview .file-preview-pdf {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100px;
}

.pdf-thumb-wrap {
  position: relative;
  width: 100px;
  height: 100px;
  border-radius: 10px;
  overflow: hidden;
  background: #f4f6f7;
  border: 1px solid #e1e6e8;
  display: flex;
  align-items: center;
  justify-content: center;
}

.pdf-thumb-canvas {
  max-width: 100%;
  max-height: 100%;
}

.pdf-badge {
  position: absolute;
  left: 5px;
  bottom: 5px;
  background: #39505d;
  color: #fff;
  font-size: 0.6rem;
  font-weight: 700;
  padding: 1px 6px;
  border-radius: 4px;
  letter-spacing: 0.02em;
}

.pdf-thumb-name {
  width: 100px;
  margin-top: 4px;
  font-size: 0.72rem;
  color: #39505d;
  text-align: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.file-preview-pdf.pdf-thumb-failed .pdf-thumb-wrap::after {
  content: "\f1c1";
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  color: #dc3545;
  font-size: 26px;
}

.file-remove-btn {
  position: absolute;
  top: -6px;
  right: -6px;
  background: rgba(0, 0, 0, 0.6);
  color: white;
  border: none;
  border-radius: 50%;
  width: 20px;
  height: 20px;
  font-size: 14px;
  line-height: 18px;
  text-align: center;
  cursor: pointer;
  z-index: 2;
}

.profile-img {
  height: 35px;
  width: 35px;
  border-radius: 50%;
  border: 2px solid #39505d;
  cursor: pointer;
}

.navbar-account-toggle .navbar-profile-icon-fallback {
  align-items: center;
  border: 2px solid #4DA1A9;
  border-radius: 50%;
  color: #39505d;
  display: inline-flex;
  height: 35px;
  justify-content: center;
  width: 35px;
}

.navbar-account-toggle .navbar-profile-icon {
  font-size: 1.65rem;
  line-height: 1;
}

.grid-stack-item-content {
  background-color: white;
  color: black; /* <== Asegura que el texto sea visible */
  border-radius: 5px;
  text-align: center;
  font-size: 18px;
  padding: 1rem;
  position: relative;
}

.dashboard-delete-btn {
  position: absolute;
  top: 4px;
  right: 6px;
  border: none;
  background: transparent;
  font-size: 18px;
  color: #d33;
  cursor: pointer;
}


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

.dashboard-controls {
  text-align: center;
  margin-bottom: 10px;
}

.dashboard-grid {
  background-color: #ddd;
  min-height: 600px;
}

.dashboard-block {
  background-color: white;
  border: 1px solid #ccc;
  border-radius: 6px;
  text-align: center;
  padding: 1rem;
  font-weight: bold;
  position: relative;
}

.dashboard-delete-btn:hover {
  color: #ff0000;
}


.search-with-icon{
  max-width:100%;
  padding-left:36px !important;
  background-image:url("/static/images/magnifying-glass.png");
  background-repeat:no-repeat;
  background-position:10px center;
  background-size:16px 16px;
  -webkit-appearance:none;
  appearance:none;
}
.search-with-icon::-webkit-search-cancel-button{
  -webkit-appearance:none;
}


/* Dropdown global en <body> — no se recorta por overflow */
/* Caja flotante del menú */
#providers-menu {
  position: fixed !important;
  display: none;            /* se controla con JS */
  background: #fff;
  border: 1px solid rgba(0,0,0,.12);
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(0,0,0,.12);
  max-height: 500px;
  overflow-y: auto;
  z-index: 4000 !important; /* asegúrate que quede sobre modales */
  min-width: min(720px, calc(100vw - 2rem));
  max-width: min(900px, calc(100vw - 2rem));
}



/* Enlaces como items del dropdown */
#providers-menu .dropdown-item {
  display: block;           /* como texto normal */
  white-space: normal;      /* permite saltos de línea */
  word-break: break-word;   /* corta palabras largas */
  padding: 6px 12px;
}

#providers-menu .order-suggestion-group-title {
  padding: 0.5rem 0.75rem 0.35rem;
  color: #39505d;
  background: #f6f9fa;
  border-bottom: 1px solid rgba(57, 80, 93, 0.1);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

#providers-menu .icd10-suggestion {
  display: flex;
  align-items: baseline;
  gap: 0.55rem;
  cursor: pointer;
}

#providers-menu .icd10-suggestion:hover,
#providers-menu .icd10-suggestion:focus,
#providers-menu .order-contact-suggestion:hover,
#providers-menu .order-contact-suggestion:focus {
  color: #2c6870;
  background: rgba(77, 161, 169, 0.12);
}

.icd-search-results .order-icd-suggestion-group {
  padding: 0.5rem 0.75rem 0.35rem;
  color: #39505d;
  background: #f6f9fa;
  border-bottom: 1px solid rgba(57, 80, 93, 0.1);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.icd-search-results .order-icd-suggestion {
  display: flex;
  align-items: baseline;
  gap: 0.35rem;
  padding: 0.5rem 0.75rem;
  border-bottom: 1px solid rgba(57, 80, 93, 0.08);
  color: #39505d;
  font-size: 0.82rem;
  cursor: pointer;
}

.icd-search-results .order-icd-suggestion:hover,
.icd-search-results .order-icd-suggestion.is-active {
  color: #2c6870;
  background: rgba(77, 161, 169, 0.12);
}

.icd-search-results .order-icd-suggestion-description {
  min-width: 0;
  overflow-wrap: anywhere;
}

/* Shared ICD creation dialog for order screens outside Clinical Schedule. */
#addIcdModalOverlay.modal-overlay {
  position: fixed;
  inset: 0;
  z-index: 4100;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  background: rgba(0, 0, 0, 0.5);
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.2s ease, visibility 0.2s ease;
}

#addIcdModalOverlay.modal-overlay.active {
  opacity: 1;
  visibility: visible;
}

#addIcdModalOverlay .modal-box {
  overflow: hidden;
  max-height: calc(100vh - 2rem);
  background: #fff;
  border-radius: 0.75rem;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.2);
}

#addIcdModalOverlay .modal-header,
#addIcdModalOverlay .modal-footer {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

#addIcdModalOverlay .modal-header {
  justify-content: space-between;
  padding: 1rem 1.25rem;
  color: #fff;
  background: #39505d;
}

#addIcdModalOverlay .modal-header h3 {
  margin: 0;
  color: inherit;
  font-size: 1.15rem;
}

#addIcdModalOverlay .close-btn {
  border: 0;
  color: #fff;
  background: transparent;
  font-size: 1.5rem;
  line-height: 1;
}

#addIcdModalOverlay .modal-footer {
  justify-content: flex-end;
  border-top: 1px solid rgba(57, 80, 93, 0.12);
}

#addIcdModalOverlay .form-input {
  width: 100%;
  padding: 0.5rem 0.65rem;
  border: 1px solid #ced4da;
  border-radius: 0.375rem;
}

#addIcdModalOverlay .form-input:focus {
  border-color: #4DA1A9;
  outline: 3px solid rgba(77, 161, 169, 0.18);
}

.order-icd-code {
  flex: 0 0 auto;
  color: #2c6870;
  font-weight: 800;
}

.order-icd-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.34rem;
  max-width: 100%;
  margin: 0 0.25rem 0.25rem 0;
  padding: 0.3rem 0.58rem;
  border: 0;
  border-radius: 999px;
  color: #2c6870;
  background: rgba(77, 161, 169, 0.12);
  font-size: 0.78rem;
  line-height: 1.15;
  text-align: left;
}

.order-icd-chip > .fa-tag { color: #4DA1A9; }
.order-icd-chip > strong { font-weight: 800; }
.order-icd-chip .order-icd-description { font-weight: 600; }
.order-icd-chip.btn-label {
  padding-right: 0.58rem;
}
.btn-label .order-chip-delete {
  position: static !important;
  top: auto !important;
  right: auto !important;
  flex: 0 0 auto;
  margin-left: 0.2rem;
  color: #dc3545;
  font-size: 1.05rem;
  font-weight: 900;
  line-height: 1;
  cursor: pointer;
}

.btn-label .order-chip-delete:hover {
  color: #b02a37;
}

#providers-menu .order-contact-suggestion {
  display: flex;
  flex-direction: column;
  gap: 0.34rem;
  cursor: pointer;
}

.order-contact-suggestion-item + .order-contact-suggestion-item {
  border-top: 1px solid rgba(57, 80, 93, 0.14);
}

.order-contact-path {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.3rem;
}

.order-contact-path .order-path-chevron:first-child { display: none; }
.order-path-chevron { color: #9aa9b1; font-size: 0.62rem; }
.order-hierarchy-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.28rem;
  max-width: 100%;
  padding: 0.22rem 0.48rem;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 700;
  line-height: 1.1;
}
.order-hierarchy-badge.is-provider { color: #2c6870; background: rgba(77, 161, 169, 0.14); }
.order-hierarchy-badge.is-department { color: #8a6611; background: rgba(214, 162, 34, 0.16); }
.order-hierarchy-badge.is-location { color: #295aa3; background: rgba(61, 126, 222, 0.12); }
.order-hierarchy-badge.is-organization { color: #5d4592; background: rgba(103, 80, 164, 0.13); }
.order-contact-name { color: #39505d; }
.order-contact-address,
.order-contact-fax {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  color: #687985;
  font-size: 0.75rem;
}
.order-contact-fax { font-weight: 800; }
.order-contact-fax.is-provider,
.order-selected-fax-number.is-provider { color: #2c6870; }
.order-contact-fax.is-department,
.order-selected-fax-number.is-department { color: #8a6611; }
.order-contact-fax.is-location,
.order-selected-fax-number.is-location { color: #295aa3; }
.order-contact-fax.is-organization,
.order-selected-fax-number.is-organization { color: #5d4592; }

.order-selected-contact.btn-label {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.35rem;
  width: fit-content;
  max-width: 100%;
  margin: 0;
  padding: 0.35rem 0.5rem;
  border: 1px solid rgba(57, 80, 93, 0.16);
  border-radius: 9px;
  color: #39505d;
  background: #fff;
  box-shadow: 0 2px 7px rgba(57, 80, 93, 0.08);
}

.order-selected-contact.btn-label:hover,
.order-selected-contact.btn-label:focus {
  background: #fff !important;
}

.order-selected-fax-number {
  display: inline-flex;
  align-items: center;
  gap: 0.32rem;
  color: #2c6870;
  font-size: 0.78rem;
  font-weight: 800;
}

.order-selected-fax-number i,
.order-contact-fax i { color: inherit; }
.order-selected-path-chevron {
  flex: 0 0 auto;
  color: #9aa9b1;
  font-size: 0.62rem;
}

.order-selected-contact.btn-label .order-chip-delete {
  margin-left: 0.15rem;
}

#fax-suggestions {
  position: absolute;
  display: none;
  max-height: 400px;
  overflow-y: auto;
  z-index: 4000 !important;
}

/* Enlaces como items del dropdown */
#fax-suggestions .dropdown-item {
  display: block;           /* como texto normal */
  white-space: normal;      /* permite saltos de línea */
  word-break: break-word;   /* corta palabras largas */
}


/* Celdas y chips */
.cell-tags {
  display: flex;
  flex-wrap: wrap;
  gap: .25rem;
  position: relative;
}

/* Input de providers: SIEMPRE primero y 100% ancho */
.providers-cell .provider-input {
  order: 0;
  flex: 0 0 100%;
  width: 100%;
  min-width: 0;
}

/* Chips de provider: vienen después y se alinean en fila */
.providers-cell .provider-chip {
  order: 1;
  display: inline-flex;
  align-items: center;
  gap: .25rem;
}

/* Inputs generales */
.cell-input { min-width: 140px; flex: 1 1 140px; }

/* Chip de provider */
.purple-badge { background: #6f42c1; color: #fff; }
.provider-chip .close { font-weight: bold; }

/* Split (animación ya la tienes en tu HTML, lo añado por claridad) */
#split-wrap { transition: grid-template-columns .5s ease; }
#split-wrap.right-full { grid-template-columns: 0fr 1fr; }



#ai-results .table th,
#ai-results .table td { vertical-align: top; }

#ai-results .fw-semibold { font-weight: 600; }

/* Botón copiar discreto */
#ai-results .copy-param {
    line-height: 1;
    vertical-align: middle;
}

#ai-results .copy-param i {
    font-size: 1rem;
}

/* Input valid background for contacts validation */
.bg-valid { background-color: #d1fae5 !important; } /* verde suave */
/* Contenedor del dropdown: pegado al input */
.autocomplete-menu {
  position: absolute;
  top: 100%;           /* justo debajo del input */
  left: 0;
  right: 0;
  z-index: 1060;
  display: none;
  max-height: 220px;
  overflow: auto;
  background: #fff;
  border: 1px solid rgba(0,0,0,.125);
  border-radius: .25rem;
  box-shadow: 0 .25rem .5rem rgba(0,0,0,.075);
}

/* Lista y items con look de dropdown bootstrap */
.autocomplete-menu ul { list-style: none; margin: 0; padding: 0; }
.autocomplete-menu .dropdown-item {
  cursor: pointer;
  padding: .25rem .5rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}


/* Menú de country code */
.cc-menu { /* opcionalmente hazlo parecer un dropdown real */
  border-radius: .375rem; /* igual que .dropdown-menu */
  padding: .25rem 0;      /* espacio vertical del menú */
}

/* Aplica “look” de dropdown-item a LI (si no cambias a <button>/<a>) */
.cc-menu .dropdown-item {
  display: flex;
  align-items: center;
  gap: .5rem;
  width: 100%;
  padding: .25rem 1rem;       /* mismo padding que Bootstrap */
  clear: both;
  font-weight: 400;
  text-align: inherit;
  white-space: nowrap;
  border: 0;
  cursor: pointer;
  line-height: 1.5;
  border-radius: .375rem;     /* para hover más suave */
}

@keyframes pumpGlow {
  0% {
    transform: scale(1);
    filter: drop-shadow(0 0 0 red);
  }
  50% {
    transform: scale(2);
    filter: drop-shadow(0 0 10px red);
  }
  100% {
    transform: scale(1);
    filter: drop-shadow(0 0 0 red);
  }
}

#open-dictation-note.pumping {
  animation: pumpGlow 1.2s infinite ease-in-out;
}

/* Cuando el modal está colapsado, el backdrop no bloquea */
.collapse-left-modal {
  transition: transform 0.4s ease;
}
.collapse-left-modal.collapsed {
  transform: translateX(-100%);
}
#modal-dictation-note.collapsed-state {
  pointer-events: none;
}
#modal-dictation-note.collapsed-state #open-dictation-note {
  pointer-events: auto; /* solo este botón sigue funcionando */
}


/* Backdrop inactivo */
.modal-backdrop.backdrop-hidden {
  opacity: 0 !important;
  pointer-events: none !important;
}


/* Chips */
.input-with-selected {
  display: flex;
  flex-direction: column;
}

.selected-options-box {
  background: rgba(0,0,0,0.04);  /* transparencia ligera */
  border-radius: 6px;
  margin-top: 4px;
  padding: 2px 4px;
  min-height: 26px;
}

.external-orders-modal-dialog .selected-options-box:has(.selected-chips:empty) {
  display: none;
}

.external-orders-modal-dialog .selected-options-box:has(.order-selected-contact) {
  min-height: 0;
  padding: 0.25rem;
}

.external-orders-modal-dialog .selected-options-box:has(.order-selected-contact) > .selected-title {
  display: none;
}

.external-orders-modal-dialog .selected-chips:has(.order-selected-contact) {
  align-items: flex-start;
}

.selected-title {
  font-size: 0.65rem;
  color: #666;
  margin-bottom: 2px;
  display: block;
}

.selected-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}

.selected-chips .icd-chip.btn-label,
.selected-chips .cpt-chip.btn-label {
  display: inline-flex !important;
  align-items: center !important;
  flex-shrink: 0 !important;
  white-space: normal !important;
  word-break: break-word !important;
  max-width: 100% !important;
  padding-right: 22px !important;
  position: relative !important;
}

.external-orders-modal-dialog .selected-chips .icd-chip.btn-label {
  max-width: none !important;
  white-space: nowrap !important;
  word-break: normal !important;
}

.selected-chips .icd-chip.btn-label .close,
.selected-chips .cpt-chip.btn-label .close {
  position: absolute !important;
  top: 2px !important;
  right: 4px !important;
  font-size: 16px !important;
  line-height: 1 !important;
}

/* Orders - Follow up time ranges */
/* Timerange */
.timerange-wrap {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); /* 👈 dinámico */
  gap: 6px;
}

.timerange-wrap .date-field {
  display: flex;
  flex-direction: column;
}

.timerange-wrap .date-field label {
  text-align: left;
  margin-bottom: 2px;
  font-size: 0.8rem;
}

.timerange-wrap input[type="date"],
.timerange-wrap input[type="datetime-local"] {
  width: 100%;
  padding: .25rem .5rem;
  font-size: .875rem;
}


.attachments-title,
.recipients-title {
  font-size: 0.95rem;
  font-weight: 600;
  margin: 0 0 8px 0;
  display: flex;
  align-items: center;
  flex-shrink: 0; /* evita que desaparezca con scroll */
}

#attachments-chips,
#to-address-send-fax-results {
  padding-right: 4px; /* espacio para scrollbar */
}

.tab-pane {
  pointer-events: none;
}
.tab-pane.active {
  pointer-events: auto;
}

/* Quitar sombra al hacer foco */
.select2-container--bootstrap-5.select2-container--focus .select2-selection,
.select2-container--bootstrap-5 .select2-selection:focus {
  box-shadow: none !important;
  outline: 0 !important;
}

/* Igualar altura a form-control-sm */
.select2-container--bootstrap-5 .select2-selection {
  min-height: calc(1.5em + .5rem + 2px) !important; /* altura form-control-sm */
  padding: .25rem .5rem !important;                  /* padding form-control-sm */
  font-size: .875rem !important;                     /* font-size form-control-sm */
  border-radius: .2rem !important;                   /* border-radius form-control-sm */
}

/* Ajustar el texto renderizado */
.select2-container--bootstrap-5 .select2-selection__rendered {
  padding-left: 0 !important;
  line-height: 1.5 !important;
}

/* Centrar la flecha verticalmente */
.select2-container--bootstrap-5 .select2-selection__arrow {
  height: 100% !important;
}

/* Quitar focus del contenedor */
.select2-container--bootstrap-5 .select2-selection,
.select2-container--bootstrap-5.select2-container--focus .select2-selection {
  box-shadow: none !important;
  outline: none !important;
  border-color: #ced4da !important; /* color normal de form-control-sm */
}

/* Quitar focus del input de búsqueda */
.select2-container--bootstrap-5 .select2-search__field:focus {
  box-shadow: none !important;
}


.modal-dialog.custom-90 {
  position: absolute;        /* se posiciona respecto al .modal (que ocupa toda la pantalla) */
  top: 0%;
  left: 5%;
  transform: translate(-50%, -50%);

  width: 90% !important;
  height: 90% !important;
  max-width: 90% !important;
  max-height: 90% !important;
  margin: 0 !important;
}

.modal-dialog.custom-90 .modal-content {
  width: 100%;
  height: 100%;
  border-radius: 0.5rem; /* opcional */
}

/* External Orders uses the same near-full-page footprint as Contacts create/edit. */
.external-orders-modal-dialog {
  width: calc(100vw - 2rem);
  max-width: none;
  height: calc(100vh - 2rem);
  margin: 1rem auto;
}

.external-orders-modal-dialog .modal-content {
  height: 100%;
  max-height: 100%;
  min-height: 0;
  overflow: hidden;
}

.external-orders-modal-dialog > .modal-content > .app-modal-datetime-banner,
.external-orders-modal-dialog > .modal-content > .app-modal-datetime-banner .app-modal-datetime-time {
  color: #fff !important;
  font-style: normal !important;
}

.external-orders-modal-dialog .modal-body {
  max-height: none !important;
  min-height: 0;
  flex: 1 1 auto;
}

.external-orders-modal-dialog .order-card-body > .table-responsive {
  max-height: min(42vh, 430px);
  overflow: auto;
}

/* Match the /contacts directory header without enabling sortable columns. */
.external-orders-modal-dialog table.equal-cols.rounded-table {
  table-layout: fixed;
  overflow: hidden;
  border-radius: 10px;
  clip-path: inset(0 round 10px);
  isolation: isolate;
}

.external-orders-modal-dialog table.equal-cols col.col-delete {
  width: 64px;
}

.external-orders-modal-dialog table.equal-cols col.col-order-action {
  width: 200px;
}

.external-orders-modal-dialog table.external-order-table col.col-icd {
  width: 34%;
}

.external-orders-modal-dialog table.external-order-table td[data-order-cell="icd"],
.external-orders-modal-dialog table.external-order-table .order-icd-cell {
  white-space: nowrap;
}

.external-orders-modal-dialog table.equal-cols td {
  min-width: 0;
  overflow-wrap: anywhere;
}

.external-orders-modal-dialog table.equal-cols thead th {
  position: sticky;
  top: 0;
  z-index: 2 !important;
  background: #39505d !important;
  background-clip: padding-box;
  color: #fff !important;
  font-size: 0.82rem;
  font-style: normal;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  border-bottom: 1px solid rgba(255, 255, 255, 0.18);
  box-shadow: 0 -1px 0 #39505d, 0 1px 0 rgba(57, 80, 93, 0.22);
}

.external-orders-modal-dialog table.equal-cols thead th:first-child {
  overflow: hidden;
  border-top-left-radius: 10px !important;
}

.external-orders-modal-dialog table.equal-cols thead th:last-child {
  overflow: hidden;
  border-top-right-radius: 10px !important;
}

.external-orders-modal-dialog table.equal-cols tbody td {
  vertical-align: top !important;
}

.external-orders-modal-dialog table.equal-cols tbody td > .delete-row,
.external-orders-modal-dialog table.equal-cols tbody td > .save-row-icon,
.external-orders-modal-dialog table.equal-cols tbody td > .spinner-border {
  vertical-align: top !important;
}

.order-row-state-cell {
  padding-right: 0.75rem !important;
  padding-left: 0.75rem !important;
  text-align: center;
  white-space: nowrap;
}

.order-row-actions {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  max-width: 100%;
  box-sizing: border-box;
}

.order-row-send-slot {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 70px;
}

.order-row-state-cell .order-row-status,
.order-row-state-cell .btn-preview-outgoing-order {
  width: fit-content;
  margin-right: auto;
  margin-left: auto;
}

.order-row-state-cell .order-row-status {
  display: flex;
}

.order-row-state-cell .btn-preview-outgoing-order {
  display: flex;
}

.order-row-state-cell .order-row-status + .btn-preview-outgoing-order {
  margin-top: 0.35rem;
}

.order-row-action-btn,
.external-orders-modal-dialog .btn-preview-outgoing-order {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.38rem;
  min-height: 34px;
  padding: 0.35rem 0.65rem;
  border: 1px solid #4da1a9;
  border-radius: 0.45rem;
  color: #2c6870;
  background: #fff;
  font-size: 0.78rem;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
}

.order-row-action-btn:hover,
.order-row-action-btn:focus,
.external-orders-modal-dialog .btn-preview-outgoing-order:hover,
.external-orders-modal-dialog .btn-preview-outgoing-order:focus {
  color: #fff;
  background: #4da1a9;
  border-color: #4da1a9;
  outline: none;
}

.order-row-action-btn:disabled,
.order-row-action-btn[aria-disabled="true"] {
  color: #87979e;
  background: #f1f4f5;
  border-color: #cbd4d8;
  cursor: not-allowed;
  opacity: 1;
}

.order-row-action-btn:disabled:hover,
.order-row-action-btn:disabled:focus {
  color: #87979e;
  background: #f1f4f5;
  border-color: #cbd4d8;
}

.order-row-remove-btn {
  color: #b4232f;
  background: #fff;
  border-color: #dc3545;
}

.order-row-remove-btn:hover,
.order-row-remove-btn:focus {
  color: #fff;
  background: #dc3545;
  border-color: #dc3545;
}

.order-row-status {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.28rem;
  margin-bottom: 0;
  font-size: 0.76rem;
  font-weight: 700;
}

.order-row-status.is-pending { color: #2c6870; }
.order-row-status.is-sent { color: #198754; }
.order-row-status.is-failed { color: #b02a37; }

.order-row-remove-cell--inactive {
  background: rgba(57, 80, 93, 0.025);
}

.external-orders-modal-close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  padding: 0;
  border: 0;
  border-radius: 6px;
  color: #6c757d;
  background: transparent;
  font-size: 1.15rem;
  line-height: 1;
}

.external-orders-modal-close:hover,
.external-orders-modal-close:focus {
  color: #39505d;
  background: rgba(57, 80, 93, 0.08);
}

.order-attachments-content {
    width: 100%;
    min-height: 0;
    overflow: hidden;
    border-radius: 0.55rem;
    background: #fff;
}

.order-attachments-table-shell {
    min-height: 180px;
    border: 1px solid rgba(57, 80, 93, 0.12);
    border-radius: 0.55rem;
    background: #fff;
}

.order-attachments-list-heading {
    flex: 0 0 auto;
    padding: 0.62rem 0.75rem;
    color: #39505d;
    background: rgba(77, 161, 169, 0.08);
    border-bottom: 1px solid rgba(57, 80, 93, 0.1);
}

.order-attachments-list-heading > i {
    color: #4da1a9;
}

.order-attachments-list-title {
    font-size: 0.86rem;
    font-weight: 700;
    line-height: 1.15;
}

.order-attachments-list-hint {
    margin-top: 0.12rem;
    color: #667a83;
    font-size: 0.75rem;
    line-height: 1.2;
}

.order-attachments-table {
    width: 100%;
    border-collapse: collapse;
    background: #fff;
    color: #22343d;
    text-align: left;
}

.order-attachments-table thead th {
    position: sticky;
    top: 0;
    z-index: 3;
    padding: 0.38rem 0.5rem;
    background: #f5f8fa;
    background-clip: padding-box;
    color: #5f727b;
    font-size: 0.72rem;
    font-style: normal;
    font-weight: 700;
    letter-spacing: 0.045em;
    text-transform: uppercase;
    text-align: left;
    border-bottom: 1px solid rgba(57, 80, 93, 0.14);
    box-shadow: 0 -1px 0 #f5f8fa, 0 1px 0 rgba(57, 80, 93, 0.14);
    white-space: nowrap;
}

.order-attachments-table td {
    height: 2rem;
    padding: 0.3rem 0.5rem;
    color: #233640;
    font-size: 0.82rem;
    vertical-align: middle;
    border-bottom: 1px solid rgba(57, 80, 93, 0.08);
}

.order-attachments-table tbody tr:hover td {
    background: rgba(77, 161, 169, 0.06);
}

.order-attachments-table tbody tr.is-selected td,
.order-attachments-table tbody tr:has(.order-attachment-checkbox:checked) td {
    background: rgba(77, 161, 169, 0.12);
}

.order-attachments-checkbox-heading,
.order-attachments-checkbox-cell {
    width: 64px;
    min-width: 64px;
    text-align: center !important;
}

.order-attachment-checkbox {
    width: 1.1rem;
    height: 1.1rem;
    margin: 0;
    border-color: #6b8089;
    cursor: pointer;
}

.order-attachment-checkbox:checked {
    border-color: #4da1a9;
    background-color: #4da1a9;
}

.order-attachment-checkbox:focus {
    border-color: #4da1a9;
    box-shadow: 0 0 0 0.2rem rgba(77, 161, 169, 0.2);
}

.order-attachments-sort-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0;
    border: 0;
    color: inherit;
    background: transparent;
    font: inherit;
    letter-spacing: inherit;
    text-transform: inherit;
    cursor: pointer;
}

.order-attachments-sort-btn i {
    width: 0.75rem;
    color: #7a8e97;
    text-align: center;
}

.order-attachments-actions-heading,
.referral-attach-actions-cell {
    width: 120px;
    min-width: 120px;
    white-space: nowrap;
}

.referral-attach-actions-cell {
    display: table-cell;
}

.order-attachment-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.85rem;
    height: 1.85rem;
    margin-left: 0.18rem;
    padding: 0;
    border: 0;
    border-radius: 0;
    color: #39505d;
    background: transparent !important;
    font-size: 0.95rem;
    cursor: pointer;
}

.order-attachment-action:hover,
.order-attachment-action:focus {
    color: #4da1a9;
    background: transparent !important;
    outline: none;
}

.order-attachment-action.is-disabled {
    color: #aab7bd;
    cursor: default;
    opacity: 0.65;
    pointer-events: none;
}

.order-attachment-action.dropdown-toggle::after {
    display: none;
}

/* Clean buttons design with href inside */
.btn-link-clean {
    color: inherit !important;
    text-decoration: none !important;
    cursor: pointer !important;
}

.btn-link-clean:hover,
.btn-link-clean:focus,
.btn-link-clean:active {
    color: inherit !important;
    text-decoration: none !important;
    cursor: pointer !important;
}


/* Login logo in the middle of the screen */
.image-mask {
  position: absolute;
  top: 50%;
  left: 50%;
  height: 40vh;
  width: 40vh;              /* ajusta si no es cuadrada */
  transform: translate(-50%, -50%);
  /*background-color: white;*/
  /*opacity: 0.3;*/

  background-image: url("/static/images/kurik_logo.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
    /*
  -webkit-mask-image: url("/static/images/kurik_logo.png");
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  -webkit-mask-size: contain;

  mask-image: url("/static/images/kurik_logo.png");
  mask-repeat: no-repeat;
  mask-position: center;
  mask-size: contain;
    */
  pointer-events: none;
  z-index: 1;
}

/* Phones: keep the logo above the bottom-pinned form (340px = tallest form). */
@media (max-width: 768px) {
  .image-mask {
    height: min(28vh, 52vw);
    width: min(28vh, 52vw);
    top: max(56px, calc((100vh - 340px - min(28vh, 52vw)) / 2));
    transform: translateX(-50%);
  }
}

/* Landscape phones: no room for it. */
@media (max-height: 560px) and (orientation: landscape) and (pointer: coarse) {
  .image-mask {
    display: none;
  }
}


/* SMS flag's toggle in required response */
.sms-flag-toggle {
  cursor: pointer;
  transition: opacity 0.15s ease, transform 0.1s ease;
}

.sms-flag-toggle:hover {
  opacity: 0.85;
  transform: scale(1.1);
}


.logo1 {
  width: 100% !important;
  height: inherit !important
}

#fax-mail-combined{
  width: auto !important;
  height: 25px !important;
}

#fax-mail-portal-nav i {
  width: auto !important;
  height: 25px !important;
}

.sms-flag-toggle:hover {
  opacity: 0.85;
  transform: scale(1.1);
}

/* Kurik.ai Header Styling */
.kurik-header {
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
  border-bottom: 3px solid #4a5568;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

.kurik-header h1 {
  font-family: 'Inter', sans-serif;
  font-weight: 700;
  font-size: 2.5rem;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
}

.kurik-header p {
  font-family: 'Inter', sans-serif;
  font-weight: 400;
  font-size: 1.1rem;
}

:root {
    --kurik-tooltip-bg: #2c3e50;
    --kurik-tooltip-color: #ffffff;
    --kurik-tooltip-border: rgba(255, 255, 255, 0.1);
    --kurik-tooltip-shadow: 0 5px 16px rgba(25, 42, 51, 0.22);
}

/* Canonical tooltip treatment. It mirrors the compact appointment/status badge
   tooltip while remaining readable for longer labels throughout the app. */
.tooltip.kurik-app-tooltip,
.tooltip {
    --bs-tooltip-bg: var(--kurik-tooltip-bg);
    --bs-tooltip-color: var(--kurik-tooltip-color);
    --bs-tooltip-max-width: min(260px, calc(100vw - 16px));
    --bs-tooltip-opacity: 1;
    z-index: 30000 !important;
}

.tooltip.kurik-app-tooltip .tooltip-inner,
.tooltip .tooltip-inner {
    max-width: min(260px, calc(100vw - 16px));
    padding: 6px 9px;
    border: 1px solid var(--kurik-tooltip-border);
    border-radius: 7px;
    background: var(--kurik-tooltip-bg);
    color: var(--kurik-tooltip-color);
    box-shadow: var(--kurik-tooltip-shadow);
    font-size: 0.75rem;
    font-weight: 500;
    line-height: 1.3;
    letter-spacing: 0.01em;
    overflow-wrap: anywhere;
    text-align: center;
    white-space: normal;
}

@media (prefers-reduced-motion: reduce) {
    .tooltip.fade {
        transition: none !important;
    }
}

/* -------------------------------------------------------------------------- */
/* Global live date & time (layout.html) + modal / offcanvas banners          */
/* -------------------------------------------------------------------------- */

:root {
    --app-global-navbar-height: 52px;
    --app-global-navbar-overlap: 4px;
    --app-global-datetime-total-offset: 88px;
}

body.has-global-datetime-bar #main-container.main-with-global-datetime {
    margin-top: var(--app-global-datetime-total-offset) !important;
}

.app-global-datetime-bar {
    position: fixed;
    /* Keep the dark navbar edge and this bar overlapped so no paint seam appears. */
    top: calc(var(--app-global-navbar-height) - var(--app-global-navbar-overlap));
    left: 0;
    right: 0;
    z-index: 1025;
    display: flex;
    align-items: stretch;
    justify-content: flex-start;
    gap: 0;
    min-height: 32px;
    box-sizing: border-box;
    padding: 0;
    font-family: 'Inter', 'Segoe UI', system-ui, sans-serif;
    font-size: 0.88rem;
    font-weight: 600;
    letter-spacing: 0.02em;
    color: #fff;
    background: #39505d;
    border-bottom: 0;
    box-shadow: none;
}

/*
 * Paint slightly behind the fixed navbar as well. The navbar height is measured
 * after first paint and can briefly land on a fractional pixel while fonts or
 * responsive items settle, otherwise exposing the page background as a seam.
 */
.app-global-datetime-bar::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: -8px;
    height: 8px;
    background: #39505d;
    pointer-events: none;
}

.app-global-datetime-bar:not(.has-two-line-shortcuts) {
    /* Two painted pixels sit behind the navbar; the visible padding remains 3px/3px. */
    top: calc(var(--app-global-navbar-height) - 2px);
    height: 33px;
    min-height: 33px;
    padding-top: 5px;
    padding-bottom: 3px;
}

.app-global-datetime-bar.has-two-line-shortcuts {
    display: grid;
    grid-template-columns: max-content minmax(0, 1fr);
    grid-template-rows: 28px 28px;
    align-items: stretch;
    border-bottom: 4px solid #39505d;
}

.app-global-datetime-text,
.app-global-view-title {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    flex: 0 0 auto;
    height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 0.85rem;
    padding-bottom: 0;
    color: #fff;
    position: relative;
    align-self: flex-end;
    line-height: 1;
}

.app-global-datetime-bar.has-two-line-shortcuts .app-global-datetime-text {
    height: 28px;
    padding-bottom: 0;
    align-items: center;
}

.app-global-datetime-bar.has-two-line-shortcuts .app-global-datetime-text {
    grid-column: 1;
    grid-row: 1;
    align-self: stretch;
    margin-right: 0;
    clip-path: none;
}

.app-global-datetime-bar.has-two-line-shortcuts .app-global-view-title {
    grid-column: 1;
    grid-row: 2;
    height: 22px;
    align-self: center;
    justify-content: flex-start;
    margin-left: 0;
    padding-left: 0.85rem;
    clip-path: none;
}

.app-global-datetime-text {
    color: #fff !important;
    font-style: normal !important;
    padding-right: 1.15rem;
    margin-right: -0.15rem;
    background: #39505d;
    clip-path: polygon(0 0, 100% 0, calc(100% - 16px) 100%, 0 100%);
}

.app-global-view-title {
    background: #fff;
    color: #39505d;
    height: 22px;
    align-self: center;
    padding-left: 1.5rem;
    padding-right: 0.9rem;
    margin-left: -0.18rem;
    border-radius: 0;
    border: 0;
    box-shadow: none;
    outline: 0;
    clip-path: polygon(16px 0, 100% 0, 100% 100%, 0 100%);
}

.app-global-datetime-bar:not(.has-two-line-shortcuts) .app-global-view-title,
.app-global-datetime-bar:not(.has-two-line-shortcuts) .app-global-shortcut-badge {
    height: 25px;
}

.app-global-datetime-bar:not(.has-two-line-shortcuts) .app-global-datetime-text {
    height: 25px;
    align-self: center;
}

.app-global-datetime-bar:not(.has-two-line-shortcuts) .app-global-shortcuts,
.app-global-datetime-bar:not(.has-two-line-shortcuts) .app-global-shortcuts-viewport,
.app-global-datetime-bar:not(.has-two-line-shortcuts) .app-global-shortcuts-list {
    height: 25px;
    min-height: 25px;
    align-self: center;
    align-items: center;
}

.app-global-datetime-bar:not(.has-two-line-shortcuts) .app-global-shortcuts-page {
    height: 25px;
    grid-template-rows: 25px;
    align-content: center;
}

.app-global-datetime-bar:not(.has-two-line-shortcuts) .app-global-shortcuts-arrow {
    height: 25px;
}

.app-global-shortcuts {
    min-width: 0;
    flex: 1 1 auto;
    display: flex;
    align-items: flex-end;
    align-self: flex-end;
    position: relative;
    padding-left: 16px;
    padding-right: 0;
    min-height: 32px;
}

.app-global-datetime-bar.has-two-line-shortcuts .app-global-shortcuts {
    grid-column: 2;
    grid-row: 1 / span 2;
    align-self: stretch;
}

.app-global-shortcuts::before {
    content: "";
    position: absolute;
    left: 0.45rem;
    top: 1px;
    width: 2px;
    height: calc(100% - 2px);
    background: rgba(255, 255, 255, 0.82);
}

.app-global-shortcuts-viewport {
    min-width: 0;
    flex: 1 1 auto;
    min-height: 32px;
    display: flex;
    align-items: center;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.app-global-shortcuts-viewport::-webkit-scrollbar {
    display: none;
}

.app-global-shortcuts-list {
    min-width: 100%;
    min-height: 32px;
    display: flex;
    align-items: center;
    gap: 0;
    padding: 0;
}

.app-global-shortcuts-list.is-empty {
    min-width: 100%;
}

.app-global-shortcuts-page {
    flex: 0 0 100%;
    min-width: 100%;
    display: grid;
    grid-template-rows: 28px;
    row-gap: 0;
    align-content: end;
    padding: 0;
}

.app-global-shortcuts-page.has-second-row {
    grid-template-rows: 22px 22px;
    row-gap: 4px;
    padding: 5px 0 0;
}

.app-global-shortcuts-row {
    display: flex;
    align-items: center;
    gap: 0.15rem;
    min-width: 0;
    padding-right: 0.35rem;
    overflow: hidden;
}

.app-global-shortcut-badge {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    height: 22px;
    gap: 0.35rem;
    padding: 0.15rem 0.5rem;
    border: 1px solid rgba(57, 80, 93, 0.18);
    border-radius: 4px;
    background: #fff;
    color: #39505d;
    font-size: 0.76rem;
    font-weight: 700;
    line-height: 1.1;
    text-decoration: none;
    user-select: none;
}

.app-global-shortcut-badge:hover,
.app-global-shortcut-badge:focus {
    color: #39505d;
    background: #f6f9fb;
}

.app-global-shortcut-badge.is-dragging {
    opacity: 0.55;
}

.app-global-shortcut-badge.is-drop-target {
    outline: 0;
}

.app-global-shortcut-badge.is-drop-before {
    box-shadow: inset 3px 0 0 rgba(77, 161, 169, 0.95);
}

.app-global-shortcut-badge.is-drop-after {
    box-shadow: inset -3px 0 0 rgba(77, 161, 169, 0.95);
}

.app-global-shortcut-drop-slot {
    width: 6px;
    min-width: 6px;
    height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    position: relative;
    flex: 0 0 auto;
    opacity: 0;
    transition: opacity 0.18s ease, width 0.18s ease, transform 0.18s ease;
}

.app-global-shortcut-drop-slot::before {
    content: "";
    width: 2px;
    height: 14px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.28);
    transition: height 0.18s ease, width 0.18s ease, background 0.18s ease;
}

.app-global-shortcuts-list.is-sorting .app-global-shortcut-drop-slot {
    opacity: 1;
}

.app-global-shortcut-drop-slot.is-active {
    width: 14px;
}

.app-global-shortcut-drop-slot.is-active::before {
    width: 3px;
    height: 18px;
    background: rgba(255, 255, 255, 0.95);
}

.app-global-shortcut-handle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: rgba(57, 80, 93, 0.72);
    cursor: grab;
    flex: 0 0 auto;
}

.app-global-shortcut-handle:active {
    cursor: grabbing;
}

.app-global-shortcut-label {
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
    flex: 0 0 auto;
}

.app-global-shortcuts-arrow {
    width: 28px;
    min-width: 28px;
    height: 32px;
    border: 0;
    border-radius: 0;
    background: #39505d;
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding-bottom: 0;
    transition: opacity 0.2s ease;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 1;
}

.app-global-shortcuts.is-two-line {
    min-height: 56px;
}

.app-global-shortcuts.is-two-line .app-global-shortcuts-viewport,
.app-global-shortcuts.is-two-line .app-global-shortcuts-list {
    min-height: 56px;
}

.app-global-shortcuts.is-two-line.has-overflow-pages .app-global-shortcuts-arrow {
    transform: none;
    height: 22px;
    align-items: center;
    padding-bottom: 0;
}

.app-global-shortcuts.is-two-line.has-overflow-pages .app-global-shortcuts-row-primary {
    padding-right: 4.25rem;
}

.app-global-shortcuts.is-two-line.has-overflow-pages .app-global-shortcuts-row-secondary {
    padding-right: 4.25rem;
}

.app-global-shortcuts.is-two-line.has-overflow-pages #app-global-shortcuts-left {
    top: 5px;
    right: 0;
}

.app-global-shortcuts.is-two-line.has-overflow-pages #app-global-shortcuts-right {
    top: 31px;
    right: 0;
}

.app-global-shortcuts-arrow[disabled] {
    opacity: 0;
    pointer-events: none;
}

#app-global-shortcuts-left {
    right: 28px;
}

#app-global-shortcuts-right {
    right: 0;
}

.dropdown-item[data-favoriteable="1"] {
    position: relative;
    padding-right: 2.4rem;
}

.dropdown-item[data-favoriteable="1"] .navbar-favorite-toggle {
    position: absolute;
    top: 50%;
    right: 0.6rem;
    transform: translateY(-50%);
    width: 1.2rem;
    height: 1.2rem;
    border: 0;
    background: transparent;
    color: #9aa7b1;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.dropdown-item[data-favoriteable="1"] .navbar-favorite-toggle.is-active {
    color: #FF950E;
}

.dropdown-item[data-favoriteable="1"] .navbar-favorite-toggle:hover,
.dropdown-item[data-favoriteable="1"] .navbar-favorite-toggle:focus {
    color: #FF950E;
}

@media (max-width: 576px) {
    .app-global-datetime-bar {
        font-size: 0.78rem;
    }

    .app-global-shortcuts-arrow {
        min-width: 24px;
        width: 24px;
    }

    #app-global-shortcuts-left {
        right: 24px;
    }

    .app-global-shortcut-badge {
        font-size: 0.72rem;
    }
}

.app-modal-datetime-banner,
.app-offcanvas-datetime-banner {
    font-family: 'Inter', 'Segoe UI', system-ui, sans-serif;
    font-size: 0.95rem;
    font-weight: 600;
    color: #fff;
    font-style: normal;
    background: linear-gradient(90deg, #2c3e50 0%, #39505d 50%, #2c3e50 100%);
    border-bottom: 2px solid rgba(255, 149, 14, 0.85);
    flex-shrink: 0;
}

.app-modal-datetime-banner .app-modal-datetime-time,
.app-offcanvas-datetime-banner .app-modal-datetime-time {
    color: #fff;
    font-style: normal;
}

/* Authored modal headers that are also the date banner: title | date | close. */
.modal-header.app-modal-datetime-banner {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 0.75rem;
}

.modal .modal-header.app-modal-datetime-banner h5.modal-title {
    margin-bottom: 0;
    color: #fff;
    font-size: 1rem;
    font-weight: 600;
    text-align: left;
}

.modal-header.app-modal-datetime-banner .app-modal-datetime-time {
    font-size: 0.85rem;
    font-weight: 600;
    white-space: nowrap;
}

.modal-header.app-modal-datetime-banner .btn-close {
    --bs-btn-close-opacity: 0.9;
    --bs-btn-close-hover-opacity: 1;
    --bs-btn-close-focus-opacity: 1;
    justify-self: end;
    margin: 0;
    font-size: 1.15rem;
}

.app-offcanvas-datetime-banner {
    border-bottom-width: 1px;
}
.litepicker {
    font-size: 1.08em;
}

.litepicker .container__months .month-item-header,
.litepicker .container__months .month-item-weekdays-row,
.litepicker .container__months .month-item {
    font-size: 1em;
}

.litepicker .container__days .day-item,
.litepicker .container__months .month-item-weekdays-row > div {
    font-size: 1em;
}

/* -------------------------------------------------------------------------- */
/* Sticky notes panel                                                         */
/* -------------------------------------------------------------------------- */

:root {
    --sticky-notes-dynamic-top: calc(var(--app-global-datetime-total-offset) + 12px);
}

#sticky-notes-toggle.is-active {
    color: #ff950e;
}

.sticky-notes-panel {
    position: fixed;
    top: var(--sticky-notes-dynamic-top);
    right: 16px;
    z-index: 1090;
    width: min(430px, calc(100vw - 24px));
    opacity: 0;
    pointer-events: none;
    transform: translateX(24px) scale(0.985);
    transform-origin: top right;
    transition: opacity 0.2s ease, transform 0.24s ease, width 0.24s ease;
}

.sticky-notes-panel.is-open {
    opacity: 1;
    pointer-events: auto;
    transform: translateX(0) scale(1);
}

.sticky-notes-panel.is-library-open {
    width: min(700px, calc(100vw - 24px));
}

.sticky-notes-shell {
    border-radius: 22px;
    overflow: hidden;
    background: linear-gradient(180deg, var(--sticky-paper-strong, rgba(255, 250, 234, 0.98)) 0%, var(--sticky-paper-soft, rgba(255, 246, 213, 0.98)) 100%);
    border: 1px solid rgba(157, 127, 62, 0.16);
    box-shadow: 0 24px 60px rgba(48, 40, 20, 0.24), 0 8px 18px rgba(48, 40, 20, 0.12);
    backdrop-filter: blur(16px);
}

.sticky-notes-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.85rem;
    padding: 0.9rem 1rem 0.75rem;
    background: linear-gradient(135deg, var(--sticky-header-start, rgba(255, 237, 171, 0.98)) 0%, var(--sticky-header-end, rgba(255, 220, 133, 0.98)) 100%);
    border-bottom: 1px solid rgba(153, 112, 28, 0.18);
}

.sticky-notes-header-left,
.sticky-notes-header-actions {
    display: flex;
    align-items: center;
    gap: 0.6rem;
}

.sticky-notes-header-left {
    flex: 1 1 auto;
    min-width: 0;
}

.sticky-notes-header-actions {
    flex: 0 0 auto;
    flex-shrink: 0;
}

.sticky-notes-title-wrap {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.18rem;
}

.sticky-notes-title-edit {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    min-width: 0;
    width: 100%;
}

.sticky-notes-title-input {
    width: 100%;
    max-width: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--sticky-ink, #5b4113);
    font-family: 'Manrope', 'Inter', sans-serif;
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.2;
    box-shadow: none !important;
}

.sticky-notes-title-input:focus {
    outline: none;
}

.sticky-notes-title-input[readonly] {
    cursor: default;
    user-select: none;
}

.sticky-notes-title-input::placeholder {
    color: color-mix(in srgb, var(--sticky-ink, #5b4113) 55%, transparent);
}

.sticky-notes-title-edit-btn {
    width: 28px;
    height: 28px;
    border: 0;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.36);
    color: color-mix(in srgb, var(--sticky-ink, #5b4113) 72%, transparent);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    transition: background 0.18s ease, color 0.18s ease;
}

.sticky-notes-title-edit-btn:hover,
.sticky-notes-title-edit-btn:focus {
    background: rgba(255, 255, 255, 0.75);
    color: var(--sticky-ink, #5b4113);
    outline: none;
}

.sticky-notes-save-status {
    color: color-mix(in srgb, var(--sticky-ink, #5b4113) 74%, transparent);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    text-transform: uppercase;
}

.sticky-notes-icon-btn {
    width: 34px;
    height: 34px;
    border: 0;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.45);
    color: var(--sticky-ink, #6b4d17);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.18s ease, background 0.18s ease, color 0.18s ease;
}

.sticky-notes-icon-btn:hover,
.sticky-notes-icon-btn:focus {
    background: rgba(255, 255, 255, 0.78);
    color: var(--sticky-ink, #5b4113);
    outline: none;
    transform: translateY(-1px);
}

.sticky-notes-icon-btn-accent {
    background: rgba(91, 65, 19, 0.1);
}

.sticky-notes-body {
    display: grid;
    grid-template-columns: 0 minmax(0, 1fr);
    min-height: 540px;
    max-height: min(72vh, 720px);
}

.sticky-notes-panel.is-library-open .sticky-notes-body {
    grid-template-columns: minmax(220px, 240px) minmax(0, 1fr);
}

.sticky-notes-library {
    min-width: 0;
    overflow: hidden;
    background: rgba(255, 255, 255, 0.58);
    border-right: 1px solid rgba(153, 112, 28, 0.12);
}

.sticky-notes-library-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    padding: 0.9rem 0.95rem 0.65rem;
    color: var(--sticky-ink, #5b4113);
    font-size: 0.82rem;
    font-weight: 800;
    letter-spacing: 0.02em;
    text-transform: uppercase;
}

.sticky-notes-count {
    min-width: 1.6rem;
    padding: 0.12rem 0.4rem;
    border-radius: 999px;
    background: rgba(91, 65, 19, 0.1);
    text-align: center;
}

.sticky-notes-list {
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
    padding: 0.18rem 0.7rem 0.8rem;
    max-height: calc(min(72vh, 720px) - 60px);
    overflow-y: auto;
}

.sticky-notes-list::-webkit-scrollbar,
.sticky-notes-content::-webkit-scrollbar {
    width: 10px;
}

.sticky-notes-list::-webkit-scrollbar-thumb,
.sticky-notes-content::-webkit-scrollbar-thumb {
    background: rgba(91, 65, 19, 0.18);
    border-radius: 999px;
}

.sticky-notes-list-empty {
    padding: 1rem 0.35rem;
    color: rgba(91, 65, 19, 0.72);
    font-size: 0.88rem;
    text-align: left !important;
}

.sticky-notes-list-item {
    display: block;
    width: 100%;
    position: relative;
    border: 1px solid rgba(157, 127, 62, 0.14);
    border-radius: 14px;
    background: var(--sticky-card-bg, rgba(255, 249, 229, 0.78));
    padding: 0.72rem 0.78rem 0.78rem 0.78rem;
    text-align: left;
    color: var(--sticky-card-ink, #5b4113);
    cursor: pointer;
    transition: transform 0.16s ease, box-shadow 0.16s ease, border-color 0.16s ease;
}

.sticky-notes-list-item:hover,
.sticky-notes-list-item:focus {
    transform: translateY(-1px);
    border-color: rgba(153, 112, 28, 0.3);
    box-shadow: 0 8px 18px rgba(48, 40, 20, 0.08);
    outline: none;
}

.sticky-notes-list-item.is-active {
    background: var(--sticky-card-active-bg, rgba(255, 238, 177, 0.92));
    border-color: rgba(153, 112, 28, 0.36);
    box-shadow: 0 10px 20px rgba(48, 40, 20, 0.12);
}

.sticky-notes-list-title {
    margin: 0;
    padding-right: 3.35rem;
    color: var(--sticky-card-ink, #5b4113);
    font-size: 0.92rem;
    font-weight: 800;
    text-align: left !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.sticky-notes-list-preview,
.sticky-notes-list-date {
    margin: 0;
    text-align: left !important;
}

.sticky-notes-list-preview {
    margin-top: 0.28rem;
    color: color-mix(in srgb, var(--sticky-card-ink, #5b4113) 78%, transparent);
    font-size: 0.78rem;
    line-height: 1.35;
    min-height: 2.1em;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.sticky-notes-list-date {
    color: color-mix(in srgb, var(--sticky-card-ink, #5b4113) 58%, transparent);
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
}

.sticky-notes-list-footer {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.35rem;
    margin-top: 0.45rem;
    min-height: 2.15rem;
}

.sticky-notes-list-footer .sticky-notes-list-date {
    margin-right: auto;
}

.sticky-notes-rename-btn,
.sticky-notes-delete-btn {
    position: absolute;
    top: 0.55rem;
    width: 28px;
    height: 28px;
    border: 0;
    border-radius: 9px;
    background: rgba(255, 255, 255, 0.5);
    color: rgba(91, 65, 19, 0.56);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background 0.18s ease, color 0.18s ease;
}

.sticky-notes-color-btn {
    position: relative;
    top: auto;
    right: auto;
    width: 28px;
    height: 28px;
    border: 0;
    border-radius: 9px;
    background: rgba(255, 255, 255, 0.5);
    color: rgba(91, 65, 19, 0.56);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background 0.18s ease, color 0.18s ease, transform 0.18s ease;
}

.sticky-notes-color-btn:hover,
.sticky-notes-color-btn:focus {
    background: rgba(255, 255, 255, 0.92);
    color: var(--sticky-card-ink, #5b4113);
    outline: none;
    transform: translateY(-1px);
}

.sticky-notes-rename-btn {
    right: 0.55rem;
}

.sticky-notes-delete-btn {
    position: relative;
    top: auto;
    right: auto;
}

.sticky-notes-rename-btn:hover,
.sticky-notes-rename-btn:focus,
.sticky-notes-delete-btn:hover,
.sticky-notes-delete-btn:focus {
    background: rgba(255, 221, 221, 0.92);
    outline: none;
}

.sticky-notes-rename-btn:hover,
.sticky-notes-rename-btn:focus {
    background: rgba(255, 255, 255, 0.92);
    color: #5b4113;
}

.sticky-notes-delete-btn:hover,
.sticky-notes-delete-btn:focus {
    color: #b42318;
}

.sticky-notes-inline-title-input {
    width: 100%;
    padding: 0.2rem 0.35rem;
    border: 1px solid rgba(153, 112, 28, 0.25);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.82);
    color: var(--sticky-card-ink, #5b4113);
    font-size: 0.88rem;
    font-weight: 700;
    box-shadow: none !important;
}

.sticky-notes-editor-wrap {
    padding: 1rem;
    min-width: 0;
}

.sticky-notes-paper {
    height: 100%;
    min-height: 508px;
    border-radius: 18px;
    background: linear-gradient(180deg, var(--sticky-paper-base, rgba(255, 252, 240, 0.98)) 0%, var(--sticky-paper-soft, rgba(255, 247, 211, 0.98)) 100%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7), inset 0 0 0 1px rgba(157, 127, 62, 0.1);
    position: relative;
    overflow: hidden;
}

.sticky-notes-paper::before {
    content: "";
    position: absolute;
    inset: 0;
    background: repeating-linear-gradient(
        to bottom,
        transparent 0,
        transparent 31px,
        rgba(202, 175, 106, 0.14) 31px,
        rgba(202, 175, 106, 0.14) 32px
    );
    pointer-events: none;
}

.sticky-notes-content {
    position: relative;
    z-index: 1;
    width: 100%;
    height: 100%;
    min-height: 508px;
    border: 0;
    resize: none;
    padding: 1.1rem 1.15rem 1.2rem;
    background: transparent;
    color: var(--sticky-paper-ink, #4d3a11);
    font-family: 'Manrope', 'Inter', sans-serif;
    font-size: 0.97rem;
    font-weight: 500;
    line-height: 2rem;
    text-align: left;
    box-shadow: none !important;
}

.sticky-notes-content:focus {
    outline: none;
}

.sticky-notes-content::placeholder {
    color: color-mix(in srgb, var(--sticky-paper-ink, #4d3a11) 42%, transparent);
}

.sticky-notes-color-menu {
    position: absolute;
    right: 2.2rem;
    bottom: -0.05rem;
    display: flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.38rem 0.45rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 10px 24px rgba(48, 40, 20, 0.16);
    z-index: 4;
    opacity: 0;
    pointer-events: none;
    transform: translateY(6px);
    transition: opacity 0.18s ease, transform 0.18s ease;
}

.sticky-notes-color-menu.is-open {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0);
}

.sticky-notes-color-swatch {
    width: 18px;
    height: 18px;
    border: 2px solid rgba(255, 255, 255, 0.9);
    border-radius: 999px;
    box-shadow: 0 0 0 1px rgba(57, 80, 93, 0.16);
    transition: transform 0.16s ease, box-shadow 0.16s ease;
}

.sticky-notes-color-swatch:hover,
.sticky-notes-color-swatch:focus {
    transform: scale(1.08);
    box-shadow: 0 0 0 1px rgba(57, 80, 93, 0.28);
    outline: none;
}
}

@media (max-width: 991px) {
    .sticky-notes-panel,
    .sticky-notes-panel.is-library-open {
        width: calc(100vw - 18px);
        right: 9px;
    }

    .sticky-notes-panel.is-library-open .sticky-notes-body {
        grid-template-columns: 1fr;
    }

    .sticky-notes-panel.is-library-open .sticky-notes-library {
        max-height: 220px;
        border-right: 0;
        border-bottom: 1px solid rgba(153, 112, 28, 0.12);
    }

    .sticky-notes-title-input {
        width: min(220px, 42vw);
    }
}

/* Feedback modal — live mic level while recording */
.feedback-audio-level-meter {
    display: flex;
    align-items: flex-end;
    gap: 3px;
    height: 32px;
    padding: 5px 8px;
    background: #f1f3f5;
    border: 1px solid #dee2e6;
    border-radius: 6px;
}

.feedback-audio-level-bar {
    flex: 1;
    min-width: 4px;
    max-width: 10px;
    height: 12%;
    background: #ced4da;
    border-radius: 2px;
    transition: height 0.06s ease, background-color 0.06s ease;
}

.feedback-audio-level-bar.is-active {
    background: #dc3545;
}

#doc-preview-image {
    display: block;
    max-width: 100%;
    max-height: calc(95vh - 56px);
    width: auto;
    height: auto;
    object-fit: contain;
    margin: 1rem auto;
}

#modal-doc-preview.is-image-preview .modal-body {
    overflow: auto;
}

#modal-doc-preview.is-image-preview #doc-preview-iframe {
    display: none !important;
}

.doc-preview-rich {
    width: min(920px, calc(100% - 2rem));
    height: calc(100% - 2rem);
    margin: 1rem auto;
    overflow: hidden;
    border: 1px solid #d8dee4;
    border-radius: 0.5rem;
    background: #fff;
    box-shadow: 0 0.35rem 1rem rgba(31, 45, 61, 0.12);
}

.doc-preview-rich-header {
    padding: 0.7rem 1rem;
    border-bottom: 1px solid #e4e8ec;
    background: #f5f7f9;
    color: #425466;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.doc-preview-rich-body {
    height: calc(100% - 42px);
    padding: 1.25rem 1.5rem;
    overflow: auto;
    color: #263238;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: 0.9rem;
    line-height: 1.55;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

.doc-preview-rich.is-docx .doc-preview-rich-body {
    font-family: Georgia, "Times New Roman", serif;
}

#modal-doc-preview.is-rich-preview #doc-preview-iframe,
#modal-doc-preview.is-rich-preview #doc-preview-image {
    display: none !important;
}

.feedback-dropzone {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 120px;
    padding: 1.5rem 1.25rem;
    text-align: center;
    color: #495057;
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.45;
    cursor: pointer;
}

.feedback-dropzone:focus {
    outline: 2px solid rgba(13, 110, 253, 0.35);
    outline-offset: 2px;
}

.feedback-pending-attachment--image {
    width: min(100%, 320px);
}

.feedback-pending-attachment.is-preview-selected {
    outline: 2px solid rgba(13, 110, 253, 0.55);
    outline-offset: 1px;
}

.feedback-pending-attachment--image .feedback-pending-image-preview-btn {
    display: block;
    width: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
}

.feedback-pending-attachment--image .feedback-pending-image-preview {
    display: block;
    width: 100%;
    height: 220px;
    object-fit: contain;
    background: #f1f3f5;
}

.feedback-pending-attachment--image .feedback-pending-image-preview-btn:focus-visible {
    outline: 2px solid rgba(13, 110, 253, 0.45);
    outline-offset: 2px;
}

.feedback-attachment-preview-panel {
    min-height: 420px;
    background: #f8fafc;
}

/* Feedback mode: wider than Bootstrap modal-xl (1140px) for form + preview side-by-side */
#modal-quick-create-task .modal-dialog.modal-feedback-wide {
    max-width: min(96vw, 1600px);
    width: 96vw;
}

#modal-quick-create-task.feedback-mode-active .modal-dialog.modal-feedback-wide .modal-content {
    max-height: calc(100vh - 2rem);
}

#modal-quick-create-task.feedback-mode-active .modal-dialog.modal-feedback-wide .modal-body {
    overflow-y: auto;
    max-height: calc(100vh - 9rem);
}

#modal-quick-create-task.feedback-mode-active #quick-create-task-layout {
    align-items: stretch;
    min-height: min(78vh, 820px);
}

#modal-quick-create-task.feedback-mode-active #quick-task-attachment-preview-col {
    display: flex;
    flex-direction: column;
    min-height: min(78vh, 820px);
}

#modal-quick-create-task.feedback-mode-active .feedback-attachment-preview-panel {
    flex: 1 1 auto;
    min-height: min(78vh, 820px);
    height: 100%;
}

.feedback-attachment-preview-stage {
    position: relative;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    min-height: 360px;
    padding: 0.75rem;
    background: #eef2f6;
    overflow: auto;
}

#modal-quick-create-task.feedback-mode-active .feedback-attachment-preview-stage {
    flex: 1 1 auto;
    min-height: 0;
}

.feedback-attachment-preview-empty {
    max-width: 16rem;
    margin: auto;
    font-size: 0.95rem;
    line-height: 1.4;
    align-self: center;
}

.feedback-attachment-preview-image-btn {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    width: 100%;
    height: auto;
    min-height: 0;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: zoom-in;
}

.feedback-attachment-preview-image {
    display: block;
    max-width: 100%;
    max-height: min(72vh, 760px);
    width: auto;
    height: auto;
    margin: 0 auto;
    object-fit: contain;
    object-position: top center;
    border-radius: 0.375rem;
    background: #111827;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.18);
}

.feedback-attachment-preview-toolbar .btn:disabled {
    opacity: 0.45;
}

.feedback-image-lightbox {
    position: fixed !important;
    inset: 0 !important;
    z-index: 2147483000 !important;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    padding: 1.5rem;
    background: rgba(15, 23, 32, 0.88);
}

body.appointments-with-kurik-nav #feedback-image-lightbox {
    z-index: 2147483000 !important;
}

.feedback-image-lightbox[hidden] {
    display: none !important;
}

.feedback-image-lightbox-img {
    max-width: min(96vw, 1200px);
    max-height: calc(100vh - 6rem);
    width: auto;
    height: auto;
    object-fit: contain;
    border-radius: 0.5rem;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.45);
    background: #111;
}

.feedback-image-lightbox-caption {
    max-width: min(96vw, 1200px);
    color: #f8fafc;
    font-size: 0.9rem;
    text-align: center;
    word-break: break-word;
}

.feedback-image-lightbox-close {
    position: absolute;
    top: 1rem;
    right: 1rem;
    width: 2.5rem;
    height: 2.5rem;
    border: 0;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.14);
    color: #fff;
    font-size: 1.1rem;
    cursor: pointer;
}

.feedback-image-lightbox-close:hover,
.feedback-image-lightbox-close:focus-visible {
    background: rgba(255, 255, 255, 0.28);
    outline: none;
}

body.feedback-image-lightbox-open {
    overflow: hidden;
}

tr.sms-row-old,
tr.sms-row-old > td,
tr.sms-row-old > th {
    /* Latest unanswered inbound SMS older than 13 hours */
    background-color: #fecaca !important;
}

/* Shared contact hierarchy editor. It is opened from /contacts and from
   External Orders, so its presentation cannot depend on the contacts page. */
#modal-new-contact.contact-editor-over-external-orders {
    z-index: 2070;
}

.modal-backdrop.contact-editor-stacked-backdrop {
    z-index: 2060;
}

#modal-new-contact .contact-editor-modal-dialog {
    width: calc(100vw - 2rem);
    max-width: none;
    height: calc(100vh - 2rem);
    margin: 1rem auto;
}

#modal-new-contact .contact-editor-modal-dialog .patient-demographics-modal-content {
    height: 100%;
    overflow: hidden !important;
    border-radius: 14px !important;
    background-clip: padding-box;
}

#modal-new-contact .contact-editor-modal-dialog .patient-demographics-modal-body {
    min-height: 0;
    overflow: auto;
}

#modal-new-contact .contact-editor-modal-dialog .modal-header {
    padding-left: 0.75rem;
    overflow: hidden;
    border-radius: 14px 14px 0 0;
}

#modal-new-contact .contact-editor-modal-title,
#modal-new-contact .patient-demographics-section-title {
    justify-content: flex-start;
    margin-left: 0 !important;
    text-align: left !important;
}

#modal-new-contact .contact-editor-layout {
    display: grid;
    grid-template-columns: 218px minmax(0, 1fr);
    gap: 0.75rem;
    align-items: start;
}

#modal-new-contact .contact-editor-main {
    min-width: 0;
}

#modal-new-contact .contact-kind-badge {
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    min-width: 0;
    max-width: 100%;
    padding: 0.18rem 0.42rem;
    border-radius: 999px;
    font-size: 0.63rem;
    font-weight: 700;
    line-height: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

#modal-new-contact .contact-kind-organization { color: #5d4592; background: rgba(103, 80, 164, 0.13); }
#modal-new-contact .contact-kind-location { color: #295aa3; background: rgba(61, 126, 222, 0.12); }
#modal-new-contact .contact-kind-department { color: #8a6611; background: rgba(214, 162, 34, 0.16); }
#modal-new-contact .contact-kind-provider { color: #2c6870; background: rgba(77, 161, 169, 0.12); }

#modal-new-contact .contact-editor-favorite-toggle {
    position: static;
    z-index: 4;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    flex: 0 0 auto;
    margin-left: 0.1rem;
    padding: 0;
    border: 0;
    color: #8b99a0;
    background: transparent;
    box-shadow: none;
    font-size: 1rem;
    line-height: 1;
}

#modal-new-contact .contact-editor-favorite-toggle i {
    -webkit-text-stroke: 1px #fff;
    paint-order: stroke fill;
    filter: drop-shadow(0 1px 1px rgba(255, 255, 255, 0.95));
}

#modal-new-contact .contact-editor-favorite-toggle:hover,
#modal-new-contact .contact-editor-favorite-toggle:focus,
#modal-new-contact .contact-editor-favorite-toggle.is-favorite {
    color: #e4a11b;
    background: transparent;
}

#modal-new-contact .contact-branch-navigator {
    position: sticky;
    top: -0.75rem;
    z-index: 6;
    max-height: calc(100vh - 205px);
    overflow-x: hidden;
    overflow-y: auto;
    border: 1px solid #dce5e8;
    border-radius: 10px;
    background: #f8fafb;
    scrollbar-width: thin;
}

#modal-new-contact .contact-branch-navigator-header {
    position: sticky;
    top: 0;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    padding: 0.58rem 0.65rem;
    border-bottom: 1px solid #dce5e8;
    color: #39505d;
    background: #fff;
    font-size: 0.7rem;
    font-weight: 750;
    letter-spacing: 0.025em;
    text-transform: uppercase;
}

#modal-new-contact .contact-branch-navigator-header i,
#modal-new-contact .contact-branch-empty i,
#modal-new-contact .contact-hierarchy-path-item > i {
    color: #4da1a9;
}

#modal-new-contact .contact-branch-empty {
    display: flex;
    align-items: flex-start;
    gap: 0.45rem;
    padding: 0.75rem 0.65rem;
    color: #74858d;
    font-size: 0.68rem;
    line-height: 1.35;
}

#modal-new-contact .contact-branch-organization {
    padding: 0.4rem;
}

#modal-new-contact .contact-branch-organization[hidden],
#modal-new-contact .contact-branch-children[hidden] {
    display: none !important;
}

#modal-new-contact .contact-branch-row,
#modal-new-contact .contact-branch-edit {
    display: flex;
    align-items: center;
    min-width: 0;
}

#modal-new-contact .contact-branch-edit {
    flex: 1 1 auto;
    padding: 0.18rem 0.12rem;
    border: 0;
    border-radius: 7px;
    color: #53666f;
    background: transparent;
    font-size: 0.69rem;
    line-height: 1.2;
    text-align: left;
}

#modal-new-contact .contact-branch-kind-badge {
    min-width: 0;
    max-width: 100%;
    flex: 0 1 auto;
    padding: 0.25rem 0.45rem;
    font-size: 0.6rem;
}

#modal-new-contact .contact-branch-kind-badge i {
    width: 0.72rem;
    margin-right: 0.2rem;
    text-align: center;
}

#modal-new-contact .contact-branch-edit:hover,
#modal-new-contact .contact-branch-edit:focus-visible {
    outline: 0;
}

#modal-new-contact .contact-branch-edit:hover .contact-branch-kind-badge,
#modal-new-contact .contact-branch-edit:focus-visible .contact-branch-kind-badge {
    box-shadow: 0 0 0 2px rgba(77, 161, 169, 0.28);
}

#modal-new-contact .contact-branch-edit.is-current .contact-branch-kind-badge {
    box-shadow: 0 0 0 2px #39505d;
}

#modal-new-contact .contact-branch-edit.is-selected-parent .contact-branch-kind-badge {
    box-shadow: 0 0 0 2px #4da1a9, 0 0 0 4px rgba(77, 161, 169, 0.16);
}

#modal-new-contact .contact-branch-organization-children,
#modal-new-contact .contact-branch-departments {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    margin-top: 0.2rem;
    padding-left: 0.48rem;
    border-left: 1px solid #cbdadd;
}

#modal-new-contact .contact-branch-organization.is-overview .contact-branch-organization-children {
    display: none;
}

#modal-new-contact .contact-branch-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    min-width: 2.25rem;
    padding: 0.3rem 0.22rem;
    border: 0;
    color: #84939a;
    background: transparent;
    font-size: 0.6rem;
}

#modal-new-contact .contact-hierarchy-path {
    position: sticky;
    top: -0.75rem;
    z-index: 5;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    margin-bottom: 0.65rem;
    padding: 0.5rem 0.7rem;
    border: 1px solid #dce5e8;
    border-radius: 10px;
    color: #36525d;
    background: #fff;
    font-size: 0.75rem;
    font-weight: 650;
}

#modal-new-contact .contact-hierarchy-path-item {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.24rem 0.42rem;
    border: 0;
    border-radius: 7px;
    color: inherit;
    background: transparent;
    font: inherit;
}

#modal-new-contact .contact-hierarchy-path-item.is-active {
    color: #fff;
    background: #39505d;
}

#modal-new-contact .contact-hierarchy-path-item.is-active > i {
    color: #fff;
}

#modal-new-contact .contact-hierarchy-path-item.is-skipped:not(.is-active) {
    color: #9aa5ab;
    font-weight: 500;
    text-decoration: line-through;
}

#modal-new-contact .contact-hierarchy-path-arrow {
    color: #a8b4ba;
    font-size: 0.58rem;
}

#modal-new-contact .contact-hierarchy-step {
    position: relative;
    height: auto;
    margin-bottom: 0.55rem;
    overflow: visible;
}

#modal-new-contact .contact-hierarchy-step--2 { width: calc(100% - 18px); margin-left: 18px; }
#modal-new-contact .contact-hierarchy-step--3 { width: calc(100% - 36px); margin-left: 36px; }
#modal-new-contact .contact-hierarchy-step--4 { width: calc(100% - 54px); margin-left: 54px; }

#modal-new-contact .contact-hierarchy-step--2::before,
#modal-new-contact .contact-hierarchy-step--3::before,
#modal-new-contact .contact-hierarchy-step--4::before {
    content: "";
    position: absolute;
    top: -0.56rem;
    bottom: calc(100% - 1.35rem);
    left: -12px;
    width: 9px;
    border-bottom: 2px solid #b9d4d7;
    border-left: 2px solid #b9d4d7;
    border-radius: 0 0 0 7px;
}

#modal-new-contact .contact-hierarchy-step-header {
    justify-content: space-between;
    overflow: hidden;
    border-radius: 11px 11px 0 0;
}

#modal-new-contact .contact-hierarchy-step-heading,
#modal-new-contact .contact-hierarchy-step-actions {
    display: flex;
    align-items: center;
}

#modal-new-contact .contact-hierarchy-step-heading {
    min-width: 0;
    justify-content: flex-start;
    gap: 0.42rem;
}

#modal-new-contact .contact-hierarchy-step-actions {
    gap: 0.45rem;
    margin-left: 0.75rem;
}

#modal-new-contact .contact-hierarchy-step-number {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.45rem;
    height: 1.45rem;
    flex: 0 0 1.45rem;
    border-radius: 50%;
    color: #fff;
    background: #4da1a9;
    font-size: 0.68rem;
    font-weight: 700;
}

#modal-new-contact .contact-hierarchy-step-state {
    padding: 0.18rem 0.42rem;
    border-radius: 999px;
    color: #296b70;
    background: #e7f3f4;
    font-size: 0.64rem;
    font-weight: 700;
    text-transform: uppercase;
}

#modal-new-contact .contact-step-toggle {
    display: inline-flex;
    align-items: center;
    gap: 0.28rem;
    padding: 0.15rem 0.25rem;
    color: #596b74;
    font-size: 0.7rem;
    text-decoration: none;
}

#modal-new-contact .contact-hierarchy-step.is-skipped {
    opacity: 0.78;
}

#modal-new-contact .contact-hierarchy-step.is-skipped .contact-hierarchy-step-header {
    border-bottom: 0;
    border-radius: 11px;
}

#modal-new-contact .contact-hierarchy-step.is-skipped .contact-hierarchy-step-number {
    background: #a5afb4;
}

#modal-new-contact .contact-hierarchy-step.is-skipped .contact-hierarchy-step-state {
    color: #68777f;
    background: #e9edef;
}

#modal-new-contact .contact-hierarchy-step.is-skipped .contact-hierarchy-step-body {
    display: none;
}

#modal-new-contact .contact-hierarchy-columns {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.65rem;
    align-items: stretch;
}

#modal-new-contact .contact-hierarchy-column {
    min-width: 0;
    padding: 0.6rem;
    border: 1px solid #e6ebee;
    border-radius: 9px;
    background: #fbfcfd;
}

#modal-new-contact .contact-hierarchy-column > .row > [class*="col-"] {
    flex: 0 0 100%;
    width: 100%;
    max-width: 100%;
}

#modal-new-contact .contact-photo-editor {
    display: grid;
    grid-template-columns: minmax(230px, 0.95fr) 96px minmax(180px, 1.25fr);
    gap: 0.75rem;
    align-items: center;
    padding: 0.6rem;
    border: 1px solid #e6ebee;
    border-radius: 9px;
    background: #fbfcfd;
}

#modal-new-contact .contact-photo-stage,
#modal-new-contact .contact-photo-preview-stage {
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(57, 80, 93, 0.14);
    background-color: #f5f7f8;
}

#modal-new-contact .contact-photo-stage {
    height: 118px;
    border-radius: 9px;
    cursor: grab;
    touch-action: none;
}

#modal-new-contact .contact-photo-stage img,
#modal-new-contact .contact-photo-preview-stage img {
    position: absolute;
    top: 50%;
    left: 50%;
    max-width: none;
    pointer-events: none;
    user-select: none;
}

#modal-new-contact .contact-photo-empty-state {
    position: absolute;
    inset: 0;
    display: none;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    color: #73838b;
}

#modal-new-contact .contact-photo-stage.is-empty .contact-photo-empty-state {
    display: flex;
}

#modal-new-contact .contact-photo-select-btn {
    position: absolute;
    right: 0.45rem;
    bottom: 0.45rem;
    z-index: 2;
}

#modal-new-contact .contact-photo-preview-stage {
    width: 86px;
    height: 86px;
    margin: 0 auto;
    border: 3px solid #4da1a9;
    border-radius: 50%;
    background-color: #fff;
}

#modal-new-contact .contact-photo-copy {
    display: flex;
    flex-direction: column;
    gap: 0.18rem;
    color: #64747c;
    font-size: 0.7rem;
    line-height: 1.3;
}

#modal-new-contact .contact-tags-editor .select2-container {
    width: 100% !important;
}

#modal-new-contact .contact-tags-editor .select2-selection--multiple {
    min-height: 31px;
    padding: 0.18rem 0.3rem;
    border-color: #d7e1e5;
    border-radius: 0.45rem;
    background: #fff;
}

#modal-new-contact .contact-tags-editor .select2-selection__choice {
    display: inline-flex;
    align-items: center;
    gap: 0.32rem;
    margin: 0.12rem 0.25rem 0.12rem 0;
    padding: 0.28rem 0.48rem 0.28rem 0.58rem !important;
    border: 0 !important;
    border-radius: 999px !important;
    color: #2c6870 !important;
    background: rgba(77, 161, 169, 0.12) !important;
    font-size: 0.78rem !important;
    font-weight: 700 !important;
}

#modal-new-contact .contact-tags-editor .select2-selection__choice__remove {
    position: static !important;
    order: 2;
    margin-left: 0.18rem !important;
    border: 0 !important;
    color: #dc3545 !important;
    background: transparent !important;
}

#modal-new-contact .contact-tags-editor .fa-tag,
.contact-tags-suggestions-dropdown .fa-tag {
    color: #4da1a9;
}

.contact-tags-suggestions-dropdown {
    margin-top: 0.35rem !important;
    overflow: hidden;
    border: 1px solid #d7e1e5 !important;
    border-radius: 0.5rem !important;
    background: #fff;
    box-shadow: 0 8px 22px rgba(48, 72, 82, 0.16);
}

.contact-tags-suggestions-dropdown .select2-results__option--highlighted {
    color: #2c6870 !important;
    background: rgba(77, 161, 169, 0.12) !important;
}

.contact-tags-suggestions-dropdown .select2-results__option[aria-selected="true"] {
    display: none !important;
}

@media (max-width: 991.98px) {
    #modal-new-contact .contact-editor-layout,
    #modal-new-contact .contact-hierarchy-columns {
        grid-template-columns: 1fr;
    }

    #modal-new-contact .contact-branch-navigator {
        position: static;
        max-height: 180px;
    }

    #modal-new-contact .contact-photo-editor {
        grid-template-columns: minmax(210px, 1fr) 96px;
    }

    #modal-new-contact .contact-photo-copy {
        grid-column: 1 / -1;
    }
}

@media (max-width: 767.98px) {
    #modal-new-contact .contact-hierarchy-path {
        justify-content: flex-start;
        overflow-x: auto;
        white-space: nowrap;
    }

    #modal-new-contact .contact-hierarchy-step--2,
    #modal-new-contact .contact-hierarchy-step--3,
    #modal-new-contact .contact-hierarchy-step--4 {
        width: 100%;
        margin-left: 0;
    }

    #modal-new-contact .contact-hierarchy-step--2::before,
    #modal-new-contact .contact-hierarchy-step--3::before,
    #modal-new-contact .contact-hierarchy-step--4::before {
        display: none;
    }
}

@media (max-width: 575.98px) {
    #modal-new-contact .contact-photo-editor {
        grid-template-columns: 1fr;
    }
}


#addIcdModal {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.65);
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
  z-index: 999999;
  align-items: center;
  justify-content: center;
}

#addIcdModal.active-modal {
  display: flex !important;
}

#addIcdModal .modal-dialog {
  margin: 0;
  width: 100%;
  max-width: 460px;
}

#addIcdModal .modal-content {
  border-radius: 10px;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.3);
}

#addIcdModal .modal-header {
  background: #39505d;
  color: #fff;
  border-bottom: none;
  border-radius: 10px 10px 0 0;
  padding: 16px 20px;
}

#addIcdModal .modal-title {
  color: #fff;
  font-weight: 700;
  font-size: 1.15rem;
}

#addIcdModal .btn-close {
  filter: invert(1) grayscale(100%) brightness(200%);
  opacity: 0.9;
}

#addIcdModal .btn-close:hover {
  opacity: 1;
}

#addIcdModal .modal-body {
  padding: 20px;
}

#addIcdModal .modal-footer {
  padding: 14px 20px;
  border-top: 1px solid #eee;
}

#addIcdModal #addIcdSave {
  background-color: #39505d;
  border-color: #39505d;
}

#addIcdModal #addIcdSave:hover {
  background-color: #4DA1A9;
  border-color: #4DA1A9;
}

.cpt-custom-input {
  cursor: pointer;
  background: #fff;
}
.cpt-select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%2339505d' d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 12px center;
  background-size: 12px 8px;
  padding-right: 32px;
  cursor: pointer;
}

.cpt-custom-dropdown {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  max-height: 220px;
  overflow-y: auto;
  background: #fff;
  border: 1px solid #ddd;
  border-radius: 6px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.15);
  z-index: 2000;
  margin-top: 2px;
}

.cpt-custom-dropdown .cpt-option-item {
  padding: 8px 12px;
  cursor: pointer;
  font-size: 13px;
  border-bottom: 1px solid #f0f0f0;
}

.cpt-custom-dropdown .cpt-option-item:hover {
  background: #f5f5f5;
}

.bot-pdf-download-card {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 8px;
    padding: 10px 12px;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.14);
}

.bot-pdf-download-icon {
    font-size: 22px;
    color: #ff6b6b;
}

.bot-pdf-download-info {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.bot-pdf-download-title {
    color: rgba(255, 255, 255, 0.92);
    font-size: 0.85rem;
    font-weight: 600;
}

.bot-pdf-download-btn {
    align-self: flex-start;
}

/* The shared document preview exposes a side summary pane for views that opt in
   (currently referrals incoming). Other pages retain the compact header menu. */
.doc-preview-summary-pane {
  display: none;
}

/* -------------------------------------------------------------------------- */
/* Unread internal messages count in the navbar (main_navbar.html)            */
/* -------------------------------------------------------------------------- */

/* Lives here rather than in the internal messaging page sheet because that one
   only loads on /internal-messaging, while the badge rides the navbar on every
   page. Painted by the poller in layout.js. */
.imsg-nav-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    margin-left: 6px;
    padding: 0 5px;
    border-radius: 999px;
    background-color: #c0392b;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    line-height: 1;
    vertical-align: middle;
}

/* display: inline-flex would otherwise beat the hidden attribute. */
.imsg-nav-badge[hidden] {
    display: none;
}

/* Shared by the dashboard and navbar processing document links. */
.processing-labs-indicator {
  display: inline-block;
  margin-left: 0.3rem;
  color: #dc3545;
  animation: processing-labs-pulse 1.4s ease-in-out infinite;
}

@keyframes processing-labs-pulse {
  0%, 100% { transform: scale(1); opacity: 1; }
  50% { transform: scale(1.18); opacity: 0.5; }
}

@media (prefers-reduced-motion: reduce) {
  .processing-labs-indicator { animation: none; }
}