/**
 * Apple School Manager soft status badges + context cards for visit workspace.
 * Soft pastel fills + tinted borders (same language as invoice badge-status-*).
 */

:root {
    --asm-badge-radius: 980px;
    --asm-card-radius: 12px;
    --asm-open-bg: #e8f8ef;
    --asm-open-fg: #0f7b3a;
    --asm-open-bd: #9bd4b3;
    --asm-closed-bg: #f0f2f5;
    --asm-closed-fg: #4b5563;
    --asm-closed-bd: #cfd4dc;
    --asm-cancelled-bg: #fdebec;
    --asm-cancelled-fg: #b42318;
    --asm-cancelled-bd: #f5c2c0;
    --asm-new-bg: #e8f1ff;
    --asm-new-fg: #1d4ed8;
    --asm-new-bd: #b6d0fe;
    --asm-returning-bg: #f3eefe;
    --asm-returning-fg: #5b21b6;
    --asm-returning-bd: #d4c4f7;
    --asm-stage-bg: #eef8fb;
    --asm-stage-fg: #0e7490;
    --asm-stage-bd: #a8dce8;
    --asm-patient-tile-bg: #e8f1ff;
    --asm-patient-tile-fg: #2563eb;
    --asm-visit-tile-bg: #e8f8ef;
    --asm-visit-tile-fg: #0f7b3a;
    --asm-alert-tile-bg: #fdebec;
    --asm-alert-tile-fg: #b42318;
    --asm-identity-tile-bg: #e8f1ff;
    --asm-identity-tile-fg: #2563eb;
    --asm-contacts-tile-bg: #ecfdf5;
    --asm-contacts-tile-fg: #047857;
    --asm-billing-tile-bg: #fef3c7;
    --asm-billing-tile-fg: #b45309;
    --asm-medical-tile-bg: #fce7f3;
    --asm-medical-tile-fg: #be185d;
    --asm-activity-tile-bg: #ede9fe;
    --asm-activity-tile-fg: #6d28d9;
}

/* Soft Zoho badges — override Bootstrap solid text-bg-* when used together */
.badge.badge-asm,
.invoice-panel-shell .badge.badge-asm,
.crud-context-card .badge.badge-asm {
    display: inline-flex;
    align-items: center;
    gap: 0.2rem;
    border-radius: var(--asm-badge-radius) !important;
    font-size: 0.6875rem !important;
    font-weight: 600 !important;
    letter-spacing: 0.01em;
    line-height: 1.2;
    padding: 0.28em 0.55em !important;
    border: 1px solid transparent;
    box-shadow: none;
}

.badge.badge-asm-open,
.badge.badge-asm.badge-asm-open {
    background-color: var(--asm-open-bg) !important;
    color: var(--asm-open-fg) !important;
    border-color: var(--asm-open-bd) !important;
}

.badge.badge-asm-closed,
.badge.badge-asm.badge-asm-closed {
    background-color: var(--asm-closed-bg) !important;
    color: var(--asm-closed-fg) !important;
    border-color: var(--asm-closed-bd) !important;
}

.badge.badge-asm-cancelled,
.badge.badge-asm.badge-asm-cancelled {
    background-color: var(--asm-cancelled-bg) !important;
    color: var(--asm-cancelled-fg) !important;
    border-color: var(--asm-cancelled-bd) !important;
}

.badge.badge-asm-new,
.badge.badge-asm.badge-asm-new {
    background-color: var(--asm-new-bg) !important;
    color: var(--asm-new-fg) !important;
    border-color: var(--asm-new-bd) !important;
}

.badge.badge-asm-returning,
.badge.badge-asm.badge-asm-returning {
    background-color: var(--asm-returning-bg) !important;
    color: var(--asm-returning-fg) !important;
    border-color: var(--asm-returning-bd) !important;
}

.badge.badge-asm-registered,
.badge.badge-asm.badge-asm-registered {
    background-color: #dcfce7 !important;
    color: #15803d !important;
    border-color: #86efac !important;
}

.badge.badge-asm-stage,
.badge.badge-asm.badge-asm-stage {
    background-color: var(--asm-stage-bg) !important;
    color: var(--asm-stage-fg) !important;
    border-color: var(--asm-stage-bd) !important;
}

/* Context cards — Apple School Manager module/detail style */
body.invoice-split-page .crud-context-panel {
    background: #f5f5f7;
}

body.invoice-split-page .invoice-split-pane-context {
    background: #f5f5f7;
}

body.invoice-split-page .crud-context-card {
    background: #ffffff;
    border: 1px solid #e3e8ef;
    border-radius: var(--asm-card-radius);
    padding: 0.75rem 0.8rem 0.7rem;
    box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04);
}

body.invoice-split-page .crud-context-card.is-alert {
    border-color: var(--asm-cancelled-bd);
    background: #fff8f8;
}

body.invoice-split-page .crud-context-card-head {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.6rem;
}

body.invoice-split-page .crud-context-card-icon-tile {
    flex: 0 0 auto;
    width: 1.55rem;
    height: 1.55rem;
    border-radius: 5px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--asm-patient-tile-bg);
    color: var(--asm-patient-tile-fg);
}

body.invoice-split-page .crud-context-card-icon-tile .bi {
    font-size: 0.8rem;
    line-height: 1;
    color: inherit;
}

body.invoice-split-page .crud-context-card[data-context-card="patient"] .crud-context-card-icon-tile,
body.invoice-split-page .crud-context-card[data-context-card="identity"] .crud-context-card-icon-tile {
    background: var(--asm-identity-tile-bg);
    color: var(--asm-identity-tile-fg);
}

body.invoice-split-page .crud-context-card[data-context-card="visit"] .crud-context-card-icon-tile {
    background: var(--asm-visit-tile-bg);
    color: var(--asm-visit-tile-fg);
}

body.invoice-split-page .crud-context-card[data-context-card="contacts"] .crud-context-card-icon-tile {
    background: var(--asm-contacts-tile-bg);
    color: var(--asm-contacts-tile-fg);
}

body.invoice-split-page .crud-context-card[data-context-card="billing"] .crud-context-card-icon-tile {
    background: var(--asm-billing-tile-bg);
    color: var(--asm-billing-tile-fg);
}

body.invoice-split-page .crud-context-card[data-context-card="medical"] .crud-context-card-icon-tile,
body.invoice-split-page .crud-context-card.is-alert .crud-context-card-icon-tile {
    background: var(--asm-medical-tile-bg);
    color: var(--asm-medical-tile-fg);
}

body.invoice-split-page .crud-context-card[data-context-card="activity"] .crud-context-card-icon-tile {
    background: var(--asm-activity-tile-bg);
    color: var(--asm-activity-tile-fg);
}

body.invoice-split-page .crud-context-card-head .bi:not(.crud-context-card-icon-tile .bi) {
    display: none;
}

body.invoice-split-page .crud-context-card-title {
    margin: 0;
    font-size: 0.8125rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #344054;
}

body.invoice-split-page .crud-context-card-badges .badge {
    font-size: 0.6875rem;
    font-weight: 600;
    padding: 0.28em 0.55em;
    border-radius: var(--asm-badge-radius) !important;
}

body.invoice-split-page .crud-context-card-row dt {
    color: #667085;
}

body.invoice-split-page .crud-context-card-row dd {
    color: #101828;
    font-weight: 550;
}

/* Header badges on visit form */
.invoice-panel-shell .visit-status-badge.badge-asm,
.invoice-panel-shell .visit-meta-badge.badge-asm {
    border-radius: var(--asm-badge-radius) !important;
}

/* Labeled status / patient facts inside Visit card */
body.invoice-split-page .crud-context-card-meta {
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
    margin-bottom: 0.65rem;
}

body.invoice-split-page .crud-context-meta-row {
    display: grid;
    grid-template-columns: 3.75rem minmax(0, 1fr);
    column-gap: 0.45rem;
    row-gap: 0.15rem;
    align-items: center;
}

body.invoice-split-page .crud-context-meta-label {
    font-size: 0.75rem;
    font-weight: 600;
    color: #667085;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
}

body.invoice-split-page .crud-context-meta-row .badge {
    justify-self: start;
}

body.invoice-split-page .crud-field-info {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1rem;
    height: 1rem;
    padding: 0;
    margin: 0;
    border: 0;
    background: transparent;
    color: #98a2b3;
    line-height: 1;
    cursor: help;
    vertical-align: middle;
}

/* Registration worklist — Zoho soft status badges (Twenty table) */
body.invoice-split-page .crud-list-table .badge.badge-asm,
body.invoice-split-page #patientsTable .badge.badge-asm {
    display: inline-flex;
    align-items: center;
    gap: 0.2rem;
    border-radius: var(--asm-badge-radius) !important;
    font-size: 0.6875rem !important;
    font-weight: 600 !important;
    letter-spacing: 0.01em;
    line-height: 1.2;
    padding: 0.28em 0.55em !important;
    border: 1px solid transparent;
    box-shadow: none;
    white-space: nowrap;
}

body.invoice-split-page .crud-list-table .dt-row-actions .bi,
body.invoice-split-page #patientsTable .dt-row-actions .bi {
    font-size: 0.85rem;
    line-height: 1;
}

body.invoice-split-page .crud-list-table .crud-row-start-visit .bi,
body.invoice-split-page #patientsTable .crud-row-start-visit .bi,
body.invoice-split-page .crud-list-table .crud-row-record-vitals .bi,
body.invoice-split-page #patientsTable .crud-row-record-vitals .bi {
    font-size: 0.8rem;
    color: inherit;
}

body.invoice-split-page .crud-list-table .crud-row-action-btn .bi,
body.invoice-split-page #patientsTable .crud-row-action-btn .bi {
    font-size: 0.95rem;
    /* stroke color owned by apple-skin.css (per-action muted colors) */
}

body.invoice-split-page .crud-list-table .dropdown-item .bi,
body.invoice-split-page #patientsTable .dropdown-item .bi {
    font-size: 0.875rem;
    width: 1rem;
    text-align: center;
    /* stroke color owned by apple-skin.css */
}

body.invoice-split-page .crud-list-table .dropdown-item.text-danger .bi,
body.invoice-split-page #patientsTable .dropdown-item.text-danger .bi {
    color: inherit;
}

body.invoice-split-page .crud-field-info:hover,
body.invoice-split-page .crud-field-info:focus {
    color: #667085;
    outline: none;
}

body.invoice-split-page .form-label .crud-field-info {
    margin-left: 0.2rem;
}

body.invoice-split-page .crud-context-card-row dt {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
}

body.invoice-split-page .crud-context-journey-label {
    display: flex;
    align-items: center;
    gap: 0.3rem;
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #667085;
    margin-bottom: 0.55rem;
}

/* Journey — vertical stepper (fits narrow context pane) */
body.invoice-split-page .crud-context-journey {
    margin: 0 0 0.75rem;
    padding: 0.55rem 0.65rem 0.55rem;
    background: #f8fafc;
    border: 1px solid #e3e8ef;
    border-radius: 6px;
}

body.invoice-split-page .visit-journey-bubbles {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    overflow: visible;
}

body.invoice-split-page .visit-journey-bubble {
    position: relative;
    flex: 0 0 auto;
    min-width: 0;
    display: grid;
    grid-template-columns: 0.85rem minmax(0, 1fr);
    column-gap: 0.55rem;
    align-items: start;
    text-align: left;
    padding: 0 0 0.85rem;
}

body.invoice-split-page .visit-journey-bubble:last-child {
    padding-bottom: 0;
}

body.invoice-split-page .visit-journey-bubble:not(:last-child)::after {
    content: "";
    position: absolute;
    top: 0.85rem;
    left: 0.35rem;
    width: 2px;
    bottom: 0;
    height: auto;
    right: auto;
    background: #d0d5dd;
    z-index: 0;
}

body.invoice-split-page .visit-journey-bubble.is-done:not(:last-child)::after,
body.invoice-split-page .visit-journey-bubble.is-current:not(:last-child)::after {
    background: #9bd4b3;
}

body.invoice-split-page .visit-journey-bubble-dot {
    position: relative;
    z-index: 1;
    width: 0.85rem;
    height: 0.85rem;
    margin-top: 0.1rem;
    border-radius: 50%;
    border: 2px solid #cfd4dc;
    background: #ffffff;
    box-sizing: border-box;
    flex-shrink: 0;
}

body.invoice-split-page .visit-journey-bubble.is-done .visit-journey-bubble-dot {
    background: #0f7b3a;
    border-color: #0f7b3a;
}

body.invoice-split-page .visit-journey-bubble.is-current .visit-journey-bubble-dot {
    background: #ffffff;
    border-color: #0f7b3a;
    box-shadow: 0 0 0 3px rgba(15, 123, 58, 0.18);
}

body.invoice-split-page .visit-journey-bubble.is-upcoming .visit-journey-bubble-dot {
    background: #ffffff;
    border-color: #d0d5dd;
    box-shadow: none;
}

body.invoice-split-page .visit-journey-bubble-label {
    margin: 0;
    padding-top: 0.05rem;
    font-size: 0.75rem;
    font-weight: 500;
    line-height: 1.3;
    color: #98a2b3;
    max-width: none;
    overflow: visible;
    text-overflow: unset;
    white-space: normal;
    word-break: break-word;
}

body.invoice-split-page .visit-journey-bubble.is-done .visit-journey-bubble-label {
    color: #344054;
}

body.invoice-split-page .visit-journey-bubble.is-current .visit-journey-bubble-label {
    color: #0f7b3a;
    font-weight: 700;
}

/* Visit summary under patient strip (2-pane) */
body.invoice-split-page .visit-context-below,
body.invoice-split-page .visit-context-above {
    flex: 0 0 auto;
    margin: 0 0 0.75rem;
    padding: 0;
}

body.invoice-split-page .crud-context-stack.is-above-form {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.5rem;
}

body.invoice-split-page .crud-context-stack.is-above-form.is-single {
    grid-template-columns: 1fr;
}

body.invoice-split-page .crud-context-stack.is-above-form .crud-context-card {
    padding: 0.6rem 0.7rem 0.55rem;
    box-shadow: none;
}

body.invoice-split-page .crud-context-stack.is-above-form .crud-context-card-head {
    margin-bottom: 0.45rem;
    gap: 0.35rem;
}

body.invoice-split-page .crud-context-stack.is-above-form .crud-context-card-icon-tile {
    width: 1.35rem;
    height: 1.35rem;
    font-size: 0.7rem;
}

body.invoice-split-page .crud-context-stack.is-above-form .crud-context-card-title {
    font-size: 0.65rem;
}

/* Labeled facts — Status | Patient type | Fee */
body.invoice-split-page .crud-context-stack.is-above-form .crud-context-card-meta {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.4rem 0.65rem;
    margin-bottom: 0.55rem;
    flex-direction: unset;
    flex-wrap: unset;
}

body.invoice-split-page .crud-context-stack.is-above-form .crud-context-meta-row {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.2rem;
    grid-template-columns: none;
}

body.invoice-split-page .crud-context-stack.is-above-form .crud-context-meta-label {
    font-size: 0.625rem;
}

body.invoice-split-page .crud-context-stack.is-above-form .crud-context-meta-value {
    font-size: 0.8125rem;
    font-weight: 600;
    color: #101828;
    line-height: 1.25;
}

body.invoice-split-page .crud-context-stack.is-above-form .crud-context-meta-value.is-fee {
    font-size: 1.05rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: #0b4a28;
}

body.invoice-split-page .crud-context-stack.is-above-form .crud-context-meta-row[data-meta="fee"] {
    padding: 0.2rem 0.45rem 0.25rem;
    margin: -0.2rem -0.15rem 0;
    border-radius: 6px;
    background: #f0faf4;
    border: 1px solid #d8f0e2;
}

body.invoice-split-page .crud-context-stack.is-above-form .crud-context-meta-row[data-meta="fee"] .crud-context-meta-label {
    color: #0f7b3a;
    font-weight: 700;
}

body.invoice-split-page .crud-context-stack.is-above-form .crud-context-meta-value.is-next {
    color: #0f7b3a;
}

body.invoice-split-page .crud-context-stack.is-above-form .crud-context-card-rows {
    gap: 0.25rem;
}

body.invoice-split-page .crud-context-stack.is-above-form .crud-context-card-row {
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.25rem 0.45rem;
}

body.invoice-split-page .crud-context-stack.is-above-form .crud-context-card-row dt,
body.invoice-split-page .crud-context-stack.is-above-form .crud-context-card-row dd {
    font-size: 0.7rem;
}

/* Bare journey: stage names only, no Now/Next caption */
body.invoice-split-page .crud-context-stack.is-above-form .crud-context-journey {
    margin: 0;
    padding: 0.5rem 0 0.1rem;
    background: transparent;
    border: 0;
    border-radius: 0;
    border-top: 1px solid #eef2f6;
}

body.invoice-split-page .crud-context-stack.is-above-form .crud-context-journey-label {
    display: none;
}

body.invoice-split-page .visit-journey-bubbles.is-horizontal {
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 0;
    max-width: 16rem;
}

body.invoice-split-page .visit-journey-bubbles.is-horizontal .visit-journey-bubble {
    display: flex;
    flex-direction: column;
    align-items: center;
    grid-template-columns: none;
    flex: 1 1 0;
    min-width: 4.5rem;
    max-width: 7rem;
    padding: 0 0.35rem 0;
    text-align: center;
}

body.invoice-split-page .visit-journey-bubbles.is-horizontal .visit-journey-bubble:not(:last-child)::after {
    top: 0.35rem;
    left: calc(50% + 0.5rem);
    right: calc(-50% + 0.5rem);
    width: auto;
    height: 2px;
    bottom: auto;
}

body.invoice-split-page .visit-journey-bubbles.is-horizontal .visit-journey-bubble-dot {
    margin-top: 0;
}

body.invoice-split-page .visit-journey-bubbles.is-horizontal .visit-journey-bubble-label {
    padding-top: 0.3rem;
    font-size: 0.6875rem;
    line-height: 1.2;
    text-align: center;
    max-width: 100%;
}

@media (max-width: 575.98px) {
    body.invoice-split-page .crud-context-stack.is-above-form {
        grid-template-columns: 1fr;
    }

    body.invoice-split-page .crud-context-stack.is-above-form .crud-context-card-meta {
        grid-template-columns: 1fr;
    }
}