/* Case-specific layout. Shell, banner, panels and buttons use shared app styles. */
.case-card-page { gap: 10px; --case-gap: 10px; --case-accent: var(--sa-color-blue); --legal-card-radius: var(--sa-radius); }
.case-card-page [hidden] { display: none !important; }
.case-card-page .service-page-banner { min-height: 154px; }
.case-card-page .service-page-banner__content { padding: 16px var(--sa-space-page) 20px; }
.case-card-page .service-page-banner__description { max-width: 570px; font: 600 14px/1.45 var(--sa-font-main); }
.case-card-page .legal-banner-quote { position: absolute; top: 48px; left: 43%; font-size: 10px; }
.case-symbols { position: absolute; width: 0; height: 0; overflow: hidden; }
.case-icon { width: 20px; height: 20px; flex: 0 0 20px; }
.case-summary-row, .case-workspace { display: grid; grid-template-columns: minmax(0, 1fr) 310px; gap: var(--case-gap); }
.case-summary-row { position: relative; scroll-margin-top: 72px; }
.case-summary--compact { position: relative; }
.case-summary--compact .case-facts { grid-template-columns: 1fr 1fr 1.2fr 1.2fr 1.5fr; row-gap: 0; }
.case-summary--compact .case-fact:nth-child(n) { border-top: 0; padding: 0 18px; }
.case-summary--compact .case-fact:first-child { padding-left: 0; }
.case-summary--compact .case-fact + .case-fact { border-left: 1px solid var(--sa-color-border); }
.case-summary--compact .case-fact dd { font-weight: 600; }
.case-summary--compact small { display: block; margin-top: 3px; color: var(--sa-color-muted); font-size: 10px; font-weight: 400; }
.case-card-page[data-case-view="documents"] .service-page-banner__title,
.case-card-page[data-case-view="calendar"] .service-page-banner__title { display: inline; font-size: clamp(28px, 2.6vw, 44px); }
.case-banner-status { margin: 0 0 8px 14px; vertical-align: middle; }
.case-card-page[data-case-view="documents"] .legal-banner-quote,
.case-card-page[data-case-view="calendar"] .legal-banner-quote { left: 51%; }
.case-summary { display: flex; align-items: center; gap: 18px; padding: 16px; }
.case-facts { display: grid; grid-template-columns: 1.05fr 1.15fr 1.1fr 1fr; flex: 1; margin: 0; min-width: 0; row-gap: 12px; }
.case-fact { min-width: 0; padding: 0 14px; border-left: 1px solid var(--sa-color-border); }
.case-fact:nth-child(4n + 1) { padding-left: 0; border-left: 0; }
.case-fact:nth-child(n + 5) { padding-top: 10px; border-top: 1px solid var(--sa-color-border); }
.case-fact--court { grid-column: span 2; }
.case-fact dt { margin-bottom: 5px; font-size: 10px; color: var(--sa-color-muted); }
.case-fact dd { display: flex; align-items: center; gap: 10px; min-height: 25px; margin: 0; font-size: 12px; font-weight: 500; line-height: 1.4; overflow-wrap: anywhere; }
.case-fact dd .case-icon { color: var(--case-accent); }
.case-fact--number dd { font-size: clamp(17px, 1.5vw, 23px); font-weight: 750; white-space: nowrap; }
.case-avatar { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; flex: 0 0 28px; border-radius: 50%; object-fit: cover; background: #e8f0fc; color: var(--case-accent); font-size: 12px; font-weight: 600; }
.case-flags { display: flex; flex-direction: column; align-items: flex-start; gap: 7px; border-left: 1px solid var(--sa-color-border); padding-left: 18px; }
.case-badge { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 5px 12px; border-radius: 7px; font-size: 10px; line-height: 1.25; white-space: nowrap; text-decoration: none; }
.case-badge .case-icon { width: 15px; height: 15px; flex-basis: 15px; }
.case-badge--green { color: #12643b; background: #e1f5eb; }
.case-badge--amber { color: #a15c10; background: #fff2dd; }
.case-badge--red { color: #bf2734; background: #ffe6e8; }
.case-badge--blue { color: var(--case-accent); background: #e8f1ff; }
.case-badge--gray { color: #536881; background: #e4ebf4; }
.case-actions { display: flex; flex-direction: column; justify-content: center; gap: 10px; padding: 13px; }
.case-actions > .sa-button { width: 100%; }
.case-actions > div { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.case-actions__chevron { margin-left: auto; }
.case-actions .sa-button--ghost, .case-quick-links .sa-button--ghost { color: var(--case-accent); }
.case-main, .case-aside { display: flex; flex-direction: column; min-width: 0; gap: var(--case-gap); }
.case-tabs { display: flex; overflow-x: auto; padding: 4px; border-radius: 9px; scroll-margin-top: 72px; }
.case-tabs a { position: relative; display: flex; flex: 1 0 auto; align-items: center; justify-content: center; gap: 10px; min-height: 32px; padding: 6px 12px; border-radius: 6px; text-decoration: none; color: var(--sa-color-navy); font-size: 11px; font-weight: 600; }
.case-tabs a + a::before { content: ''; position: absolute; left: -1px; height: 14px; border-left: 1px solid var(--sa-color-border); }
.case-tabs .is-active { background: linear-gradient(105deg, #f7e7c9, #e8c58e); }
.case-tabs a:hover { background-color: var(--sa-color-blue-soft); }
.case-tabs .case-icon { width: 17px; height: 17px; flex-basis: 17px; }
.case-detail-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--case-gap); }
.case-panel { padding: 12px 14px; border-radius: 9px; scroll-margin-top: 72px; }
.case-panel .legal-panel__head { gap: 8px; align-items: center; margin-bottom: 7px; }
.case-heading { display: flex; align-items: center; gap: 10px; min-width: 0; }
.case-heading__icon { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 32px; width: 32px; height: 32px; border-radius: 50%; color: #8b561f; background: #fcf3e4; }
.case-heading h2 { font-size: 14px; font-weight: 700; line-height: 1.35; }
.case-text-button { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; gap: 5px; padding: 5px 0; border: 0; background: transparent; color: var(--case-accent); font-size: 10px; line-height: 1.4; text-decoration: none; cursor: pointer; }
.case-text-button:hover { text-decoration: underline; }
.case-text-button .case-icon { width: 13px; height: 13px; flex-basis: 13px; }
.case-story { margin: 8px 2px 12px; max-width: 58ch; color: var(--sa-color-text); font-size: 12px; line-height: 1.6; }
.case-tags { display: flex; flex-wrap: wrap; gap: 5px; margin: 0 2px; padding: 0; list-style: none; }
.case-tags li { padding: 5px 12px; border: 1px solid #dbe6f6; border-radius: 5px; background: #f7faff; color: var(--case-accent); font-size: 10px; }
.case-documents { display: grid; gap: 3px; list-style: none; margin: 0; padding: 0; }
.case-document { display: flex; align-items: center; min-width: 0; gap: 9px; padding: 6px 7px; border-radius: 7px; background: linear-gradient(100deg, #f7f9fc, #f0f5fb); }
.case-document__copy { flex: 1; min-width: 0; color: var(--sa-color-navy); font-size: 11px; line-height: 1.3; overflow-wrap: anywhere; }
.case-document__copy small { display: block; margin-top: 3px; color: var(--sa-color-muted); font-size: 10px; }
.case-file-icon { position: relative; display: inline-flex; justify-content: center; align-items: center; flex: 0 0 29px; width: 29px; height: 29px; border-radius: 7px; background: #e8f1ff; color: var(--case-accent); }
.case-file-icon small { position: absolute; top: 13px; left: 8px; padding: 0 1px; background: #e8f1ff; font-size: 4px; font-weight: 800; }
.case-file-icon--pdf { background: #ffefec; color: #e34e53; }
.case-file-icon--pdf small { background: #ffefec; }
.case-file-icon--zip { background: #fff0d8; color: #dd8a15; }
.case-file-icon--zip small { background: #fff0d8; }
.case-more { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 22px; width: 22px; min-height: 28px; padding: 0; border: 0; border-radius: 4px; background: transparent; color: var(--case-accent); cursor: pointer; }
.case-more:hover { background: #e1eaf8; }
.case-more .case-icon { width: 14px; height: 14px; flex-basis: 14px; }
.case-bottom-grid { display: grid; grid-template-columns: 1.25fr 1.1fr .8fr 1fr; gap: 6px; }
.case-panel--compact { padding: 10px; }
.case-panel--compact .case-heading { gap: 7px; }
.case-panel--compact .case-heading__icon { flex-basis: 27px; width: 27px; height: 27px; }
.case-panel--compact .case-heading__icon .case-icon { width: 17px; height: 17px; flex-basis: 17px; }
.case-panel--compact h2 { font-size: 11px; }
.case-panel--compact .case-text-button { font-size: 9px; }
.case-events, .case-people, .case-tasks, .case-deadlines { margin: 0; padding: 0; list-style: none; }
.case-events { display: grid; gap: 6px; }
.case-events li { display: flex; align-items: flex-start; gap: 7px; }
.case-date { display: flex; align-items: center; flex-direction: column; flex: 0 0 30px; padding: 5px 3px; border-radius: 6px; background: #eaf3ff; color: var(--case-accent); font-size: 8px; }
.case-date strong { font-size: 14px; line-height: 1.1; }
.case-date--amber { color: #c07518; background: #fff3e2; }
.case-event-time { flex: 0 0 62px; padding-top: 8px; font-size: 9px; color: var(--sa-color-muted); white-space: nowrap; }
.case-events li > div { min-width: 0; padding: 7px 0 3px 8px; border-left: 1px solid var(--sa-color-border); }
.case-events li > div > strong { display: block; font-size: 9px; line-height: 1.4; }
.case-events small { display: block; color: var(--sa-color-muted); font-size: 8px; line-height: 1.5; }
.case-events .case-event-alert { width: fit-content; padding: 0 4px; border-radius: 4px; color: #c83947; background: #ffe8eb; }
.case-events[data-calendar-overview] .case-event-time { white-space: normal; overflow-wrap: anywhere; }
.case-events[data-calendar-overview] .case-event-title { padding: 0; text-align: left; font: inherit; font-weight: 600; overflow-wrap: anywhere; }
.case-events[data-calendar-overview] small { overflow-wrap: anywhere; }
.case-payments { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }
.case-payments > div { position: relative; display: flex; flex-direction: column; align-items: center; padding: 12px 5px; border-radius: 8px; background: #eff9f3; }
.case-payments > div + div { background: #fff7e9; }
.case-payments .case-icon { width: 16px; height: 16px; color: #278958; margin-bottom: 5px; }
.case-payments strong { color: #12643b; font-size: 14px; white-space: nowrap; }
.case-payments > div + div strong, .case-payments > div + div .case-icon { color: #ba6e14; }
.case-payments b { margin-top: 5px; font-size: 9px; font-weight: 600; }
.case-payments small { margin-top: 4px; color: var(--sa-color-muted); font-size: 8px; }
.case-documents--act { margin-top: 9px; }
.case-documents--act .case-document { gap: 5px; padding: 5px; flex-wrap: wrap; }
.case-documents--act .case-document__copy { font-size: 9px; }
.case-documents--act .case-document__copy small { font-size: 8px; }
.case-documents--act .case-badge { padding: 4px 7px; font-size: 8px; }
.case-people { display: grid; gap: 6px; }
.case-people li { display: flex; align-items: center; gap: 7px; }
.case-people li > div { flex: 1; min-width: 0; }
.case-people strong { display: block; font-size: 9px; font-weight: 600; }
.case-people small { display: block; margin-top: 2px; color: var(--sa-color-muted); font-size: 8px; }
.case-people .case-more { flex-basis: 16px; width: 16px; font-size: 16px; }
.case-tasks { display: grid; gap: 6px; }
.case-tasks label { display: flex; align-items: flex-start; gap: 7px; font-size: 8px; line-height: 1.45; cursor: pointer; }
.case-tasks input { flex: 0 0 13px; width: 13px; height: 13px; margin: 0; accent-color: var(--case-accent); }
.case-tasks input:checked + span { text-decoration: line-through; color: var(--sa-color-muted); }
.case-tasks small { display: block; color: #c83947; font-size: 8px; }
.case-note { display: flex; align-items: flex-start; gap: 7px; margin: 8px 0 0; color: var(--sa-color-muted); font-size: 8px; line-height: 1.5; }
.case-note .case-heading__icon { width: 21px; height: 23px; flex-basis: 21px; border-radius: 5px; }
.case-note small { display: block; margin-top: 3px; font-size: 8px; }
.case-timeline { display: grid; gap: 0; margin: 5px 0 3px 15px; padding: 0; list-style: none; }
.case-timeline li { position: relative; padding: 2px 0 20px 32px; border-left: 2px solid #d8e0ee; color: var(--sa-color-text); font-size: 12px; line-height: 1.4; }
.case-timeline li:last-child { padding-bottom: 0; border-color: transparent; }
.case-timeline strong { display: block; font-size: 12px; font-weight: 500; }
.case-timeline small { display: block; margin-top: 3px; color: var(--sa-color-muted); font-size: 11px; }
.case-timeline__dot { position: absolute; top: 1px; left: -9px; display: grid; place-items: center; width: 16px; height: 16px; border: 4px solid #b6c2d5; border-radius: 50%; background: white; }
.case-timeline .is-complete { border-color: #4175cc; }
.case-timeline .is-complete .case-timeline__dot { left: -11px; width: 20px; height: 20px; background: var(--case-accent); border-color: var(--case-accent); color: white; font-size: 11px; }
.case-timeline .is-current { color: var(--case-accent); }
.case-timeline .is-current .case-timeline__dot { left: -11px; width: 20px; height: 20px; border-color: var(--case-accent); }
.case-deadlines li { display: grid; grid-template-columns: 30px 73px minmax(0, 1fr); align-items: center; gap: 9px; padding: 8px 0; color: var(--case-accent); }
.case-deadlines li + li { border-top: 1px solid var(--sa-color-border); }
.case-deadline-icon { display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 32px; border-radius: 6px; background: #eaf2fd; }
.case-deadlines time { padding-right: 8px; border-right: 1px solid currentColor; font-size: 9px; white-space: nowrap; }
.case-deadlines time small { color: inherit; }
.case-deadlines strong { display: block; color: var(--sa-color-navy); font-size: 10px; font-weight: 600; line-height: 1.4; }
.case-deadlines small { display: block; margin-top: 3px; color: var(--sa-color-muted); font-size: 10px; line-height: 1.4; }
.case-deadlines .case-deadline--red { color: #ce3b48; }
.case-deadline--red .case-deadline-icon { background: #fff0ee; }
.case-deadlines .case-deadline--amber { color: #be751a; }
.case-deadline--amber .case-deadline-icon { background: #fff5e4; }
.case-quick-links { display: grid; gap: 8px; margin-top: 10px; }
.case-quick-links .sa-button { justify-content: flex-start; padding: 0 10px; font-size: 11px; font-weight: 500; }
.case-quick-links .case-icon:last-child { margin-left: auto; width: 16px; height: 16px; flex-basis: 16px; }
.case-demo-caption { margin: 0; padding: 0 2px; color: var(--sa-color-muted); font-size: 10px; }
.case-toast { position: fixed; right: 24px; bottom: 24px; z-index: 50; display: flex; align-items: center; gap: 16px; width: min(440px, calc(100vw - 32px)); padding: 16px; border: 1px solid var(--sa-color-border); border-radius: var(--sa-radius); background: white; box-shadow: 0 8px 32px #142d4826; color: var(--sa-color-text); font-size: 13px; line-height: 1.5; }
.case-toast[hidden] { display: none; }
.case-toast button { padding: 0 7px; border: 0; background: transparent; color: var(--sa-color-muted); font-size: 24px; cursor: pointer; }

@media (max-width: 1450px) {
    .case-summary-row, .case-workspace { grid-template-columns: minmax(0, 1fr) 280px; }
    .case-summary { flex-wrap: wrap; gap: 12px; }
    .case-facts { flex-basis: 100%; }
    .case-flags { flex-direction: row; flex-wrap: wrap; border-left: 0; border-top: 1px solid var(--sa-color-border); width: 100%; padding: 10px 0 0; }
    .case-bottom-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--case-gap); }
    .case-panel--compact h2 { font-size: 12px; }
    .case-panel--compact .case-text-button { font-size: 10px; }
    .case-events li > div > strong, .case-people strong { font-size: 11px; }
    .case-events small, .case-people small, .case-tasks label, .case-note { font-size: 10px; }
    .case-note small, .case-tasks small { font-size: 9px; }
    .case-document { flex-wrap: wrap; }
    .case-document .case-badge { margin-left: 38px; order: 1; }
    .case-documents--act .case-document .case-badge { margin-left: 0; order: 0; }
}
@media (max-width: 1100px) {
    .case-summary--compact .case-facts { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px 0; }
    .case-summary--compact .case-fact:nth-child(4) { border-left: 0; padding-left: 0; }
    .case-summary-row { grid-template-columns: minmax(0, 1fr); }
    .case-actions { flex-direction: row; justify-content: flex-start; }
    .case-actions > .sa-button { width: auto; }
    .case-actions > div { display: flex; }
    .case-workspace { grid-template-columns: minmax(0, 1fr); }
    .case-aside { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: start; }
    .case-aside .legal-panel__head { flex-wrap: wrap; }
    .case-bottom-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .case-document { flex-wrap: nowrap; }
    .case-document .case-badge { margin-left: 0; order: 0; }
}
@media (max-width: 760px) {
    .case-summary--compact .case-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .case-summary--compact .case-fact:nth-child(n) { padding: 5px 10px; border: 0; }
    .case-summary--compact .case-fact:nth-child(2n) { border-left: 1px solid var(--sa-color-border); }
    .case-card-page .service-page-banner__content { width: 100%; }
    .case-card-page .service-page-banner__description { font-size: 12px; }
    .case-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .case-fact--court { grid-column: auto; }
    .case-fact:nth-child(n) { padding: 8px 10px; border: 0; }
    .case-fact:nth-child(2n) { border-left: 1px solid var(--sa-color-border); }
    .case-fact:last-child { grid-column: 1 / -1; }
    .case-aside { grid-template-columns: 1fr; }
    .case-tabs { display: flex; overflow-x: auto; }
    .case-tabs a { flex: 0 0 auto; min-width: 110px; }
    .case-detail-grid { grid-template-columns: minmax(0, 1fr); }
    .case-panel { padding: 12px; }
    .case-story { font-size: 13px; }
    .case-timeline { margin-top: 12px; }
    .case-document__copy { font-size: 12px; }
    .case-tasks label { font-size: 11px; }
}
@media (max-width: 480px) {
    .case-summary { padding: 8px; }
    .case-facts { gap: 2px; }
    .case-fact dd { font-size: 11px; gap: 6px; }
    .case-fact--number dd { font-size: 17px; }
    .case-flags { gap: 5px; }
    .case-actions { flex-direction: column; }
    .case-actions > div { display: grid; }
    .case-bottom-grid { grid-template-columns: minmax(0, 1fr); }
    .case-document { flex-wrap: wrap; }
    .case-document .case-badge { order: 1; margin-left: 38px; }
    .case-heading h2 { font-size: 13px; }
    .case-panel--compact h2 { font-size: 13px; }
    .case-toast { right: 16px; bottom: 16px; }
}