.office-branches {
  --ob-accent: #17624b;
  --ob-ink: #18352f;
  --ob-muted: #526560;
  --ob-line: #dbe7e1;
  --ob-soft: #edf7f1;
  display: grid;
  gap: 1rem;
  min-width: 0;
}
.office-branches .ob-heading {
  align-items: center;
  background: #e7f3ec;
  border: 1px solid var(--ob-line);
  border-radius: 1rem;
  color: var(--ob-ink);
  display: flex;
  gap: 1rem;
  justify-content: space-between;
  padding: clamp(1rem, 3vw, 1.75rem);
}
.office-branches .ob-heading h2 {
  font-size: clamp(1.4rem, 3vw, 2.15rem);
  line-height: 1.35;
  margin: .15rem 0 .45rem;
}
.office-branches .ob-kicker {
  color: var(--ob-accent);
  font-size: .83rem;
  font-weight: 700;
  margin: 0;
}
.office-branches .ob-muted {
  color: var(--ob-muted);
  line-height: 1.55;
  margin: .25rem 0;
}
.ob-badge {
  align-items: center;
  background: #e6f3eb;
  border: 1px solid #b5d2c0;
  border-radius: 999px;
  color: #174d3a;
  display: inline-flex;
  flex-wrap: wrap;
  font-size: .82rem;
  font-weight: 700;
  gap: .45rem;
  padding: .3rem .65rem;
  white-space: normal;
}
.ob-badge bdi {
  font-family: ui-monospace, monospace;
  font-size: .75rem;
}
.office-branches .ob-toolbar,
.office-branches .ob-actions,
.office-branches .ob-tabs {
  align-items: end;
  display: flex;
  flex-wrap: wrap;
  gap: .55rem;
}
.office-branches .ob-toolbar {
  justify-content: space-between;
}
.office-branches .ob-tabs button[aria-pressed="true"] {
  background: var(--ob-accent);
  border-color: var(--ob-accent);
  color: #fff;
}
.office-branches .ob-toolbar .ob-field {
  min-width: min(100%, 15rem);
}
.office-branches .ob-stack,
.office-branches .ob-card,
.office-branches .ob-form {
  display: grid;
  gap: .8rem;
  min-width: 0;
}
.office-branches .ob-card {
  margin: 0;
  padding: clamp(.9rem, 2.5vw, 1.35rem);
}
.office-branches .ob-card h3,
.office-branches .ob-card h4 {
  margin: 0;
}
.office-branches .ob-grid,
.office-branches .ob-stats {
  display: grid;
  gap: .65rem;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 12rem), 1fr));
  margin: 0;
}
.office-branches .ob-stats > div {
  background: var(--ob-soft);
  border: 1px solid var(--ob-line);
  border-radius: .75rem;
  color: var(--ob-ink);
  padding: .65rem .8rem;
}
.office-branches .ob-stats dt {
  color: var(--ob-muted);
  font-size: .83rem;
}
.office-branches .ob-stats dd {
  font-size: 1.1rem;
  font-weight: 700;
  margin: .2rem 0 0;
}
.office-branches .ob-form > button,
.office-branches .ob-card > button {
  justify-self: start;
}
.office-branches .ob-field {
  display: grid;
  gap: .32rem;
  margin: 0;
}
.office-branches .ob-field label {
  margin: 0;
}
.office-branches .ob-field input,
.office-branches .ob-field select,
.office-branches .ob-field textarea {
  margin: 0;
  min-width: 0;
  width: 100%;
}
.office-branches .ob-check {
  align-items: center;
  display: flex;
  gap: .45rem;
  margin: 0;
}
.office-branches .ob-check input {
  margin: 0;
  width: auto;
}
.office-branches .ob-status {
  color: var(--ob-accent);
  font-weight: 650;
  margin: 0;
}
.office-branches .ob-status:empty {
  display: none;
}
.office-branches .ob-error {
  color: #a0282d;
}
.office-branches .ob-details {
  border: 1px solid var(--ob-line);
  border-radius: .6rem;
  padding: .55rem .7rem;
}
.office-branches .ob-details summary {
  cursor: pointer;
  font-weight: 650;
}
.office-branches .ob-details[open] summary {
  margin-block-end: .55rem;
}
.office-branches .ob-table-wrap {
  max-width: 100%;
  overflow-x: auto;
}
.office-branches .ob-table {
  border-collapse: collapse;
  font-size: .88rem;
  min-width: 100%;
  text-align: start;
}
.office-branches .ob-table th,
.office-branches .ob-table td {
  border-block-end: 1px solid var(--ob-line);
  padding: .55rem .65rem;
  text-align: start;
  vertical-align: middle;
}
.office-branches .ob-table th {
  color: var(--ob-ink);
  white-space: nowrap;
}
.office-branches .ob-table td {
  min-width: 6rem;
  overflow-wrap: anywhere;
}
.office-branches .ob-table td:has(.ob-details) {
  min-width: 10rem;
}
.office-branches .ob-table .ob-details .ob-form {
  min-width: 11rem;
}
.office-branches .ob-actions {
  align-items: center;
}
.office-branches.ob-dashboard {
  margin-block: 1.15rem 1.35rem;
}
.office-branches .ob-dashboard-title {
  color: var(--ob-ink);
  margin: .2rem 0 0;
}
.office-branches .ob-request-list {
  display: grid;
  gap: .8rem;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 22rem), 1fr));
}
.office-branches .ob-fund-selector {
  display: flex;
  justify-content: space-between;
  align-items: end;
  flex-wrap: wrap;
  gap: .75rem 1.25rem;
}
.office-branches .ob-fund-selector .ob-field {
  min-width: min(100%, 15rem);
  max-width: min(100%, 24rem);
  flex: 0 1 20rem;
}
.office-branches .ob-fund-selector [hidden] { display: none; }
.office-branches .ob-card.ob-branch-card {
  gap: 0;
  padding: 0;
  overflow: hidden;
  border: 1px solid #c3d9cf;
  box-shadow: 0 .5rem 1.5rem #18352f0d;
}
.office-branches .ob-fund-hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 1rem 2rem;
  padding: clamp(1rem, 3vw, 1.7rem);
  color: #fff;
  background: radial-gradient(ellipse at left bottom, #26765d, transparent 65%), linear-gradient(132deg, #153b35, #155441);
  border-block-end: .22rem solid #bd9e68;
}
.office-branches .ob-fund-identity {
  display: grid;
  gap: .4rem;
  justify-items: start;
}
.office-branches .ob-fund-identity h4 {
  color: inherit;
  font-size: clamp(1.3rem, 3vw, 1.9rem);
  line-height: 1.25;
  overflow-wrap: anywhere;
}
.office-branches .ob-fund-kicker {
  margin: 0;
  color: #c8e6da;
  font-size: .8rem;
  font-weight: 700;
}
.office-branches .ob-fund-hero .ob-badge {
  background: #ffffff1a;
  color: #f1fff9;
  border-color: #ffffff3d;
}
.office-branches .ob-fund-total {
  display: grid;
  gap: .16rem;
  color: #e5f5ed;
  text-align: start;
}
.office-branches .ob-fund-total bdi {
  font-weight: 800;
  font-size: clamp(1.65rem, 5vw, 2.6rem);
  line-height: 1.22;
  color: #fff;
  overflow-wrap: anywhere;
}
.office-branches .ob-fund-total small { color: #c8e6da; }
.office-branches .ob-fund-body {
  display: grid;
  gap: 1rem;
  padding: clamp(.85rem, 3vw, 1.45rem);
}
.office-branches .ob-fund-group {
  display: grid;
  gap: .6rem;
}
.office-branches .ob-fund-group + .ob-fund-group {
  border-block-start: 1px solid var(--ob-line);
  padding-block-start: .85rem;
}
.office-branches .ob-fund-group-heading {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: .5rem;
}
.office-branches .ob-fund-group-heading .ob-field { width: min(100%, 18rem); }
.office-branches .ob-fund-group h5 {
  color: var(--ob-ink);
  font-size: .98rem;
  margin: 0;
}
.office-branches .ob-fund-methods,
.office-branches .ob-fund-settlements,
.office-branches .ob-fund-bookings {
  display: grid;
  gap: .48rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.office-branches .ob-fund-methods > div { background: #e5f3ed; }
.office-branches .ob-fund-settlements > div { background: #fafbf9; }
.office-branches .ob-fund-bookings > div { background: #f4f8f6; }
.office-branches .ob-fund-body .ob-stats dd { overflow-wrap: anywhere; }
.office-branches .ob-fund-actions {
  border-block-end: 1px solid var(--ob-line);
  background: #f6faf8;
  padding: .7rem clamp(.85rem, 3vw, 1.45rem);
}
.office-branches .ob-fund-actions button { min-height: 2.65rem; }
.office-branches .ob-receipt-number {
  display: flex;
  justify-content: space-between;
  gap: .6rem;
  margin: 0;
  padding: .7rem .85rem;
  border-radius: .65rem;
  background: var(--ob-soft);
  font-weight: 750;
}
@media (min-width: 840px) {
  .office-branches .ob-fund-settlements { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .office-branches .ob-fund-bookings { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 839px) {
  .office-branches .ob-fund-settlements > div:last-child {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .45rem;
  }
}
.office-branches .ob-request {
  background: #f6faf8;
  border: 1px solid var(--ob-line);
  border-radius: .8rem;
  display: grid;
  gap: .55rem;
  min-width: 0;
  padding: .8rem;
}
.office-branches .ob-request-heading {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: .55rem;
  justify-content: space-between;
}
.office-branches .ob-request .ob-muted {
  overflow-wrap: anywhere;
}
.office-branches .ob-request-amount {
  color: var(--ob-ink);
  font-size: 1.15rem;
  font-weight: 700;
}
.office-branches .ob-statement {
  max-width: 100%;
}
.office-branches .ob-statement .ob-status {
  font-size: .82rem;
  margin-block-start: .25rem;
}
.office-branches .ob-export-dialog {
  background: #fff;
  border: 1px solid var(--ob-line);
  border-radius: 1rem;
  color: var(--ob-ink);
  max-height: min(42rem, calc(100dvh - 2rem));
  max-width: calc(100% - 2rem);
  padding: 1.2rem;
  width: 31rem;
}
.office-branches .ob-export-dialog::backdrop {
  background: #142b2570;
}
.office-branches .ob-export-dialog h3 {
  margin-block: 0 1rem;
}
.office-branches .ob-export-dialog [hidden] {
  display: none;
}
.office-branches .ob-point-bookings {
  box-shadow: 0 1.5rem 4rem #142b2533;
  max-height: calc(100dvh - 2rem);
  padding: clamp(.85rem, 2vw, 1.4rem);
  width: 64rem;
}
.office-branches .ob-point-bookings > .ob-stack {
  grid-template-columns: minmax(0, 1fr);
}
.office-branches .ob-point-booking-heading,
.office-branches .ob-point-booking-toolbar {
  align-items: center;
  display: flex;
  gap: .65rem;
  justify-content: space-between;
}
.office-branches .ob-point-booking-heading {
  border-block-end: 1px solid var(--ob-line);
  padding-block-end: .8rem;
}
.office-branches .ob-point-booking-heading h3 {
  margin: 0 0 .45rem;
}
.office-branches .ob-point-booking-filters {
  align-items: end;
  background: #f4f8f5;
  border: 1px solid var(--ob-line);
  border-radius: .75rem;
  display: flex;
  flex-wrap: wrap;
  padding: .75rem;
}
.office-branches .ob-point-booking-filters .ob-field {
  flex: 1 1 8rem;
}
.office-branches .ob-point-booking-filters .ob-field:has(input) {
  flex: 2 1 12rem;
}
.office-branches .ob-point-booking-results .ob-table-wrap {
  border: 1px solid var(--ob-line);
  border-radius: .75rem;
  max-height: min(26rem, 45dvh);
  overflow: auto;
}
.office-branches .ob-point-booking-results .ob-table th {
  background: #eaf3ed;
  position: sticky;
  top: 0;
}
.office-branches .ob-point-booking-results .ob-table td {
  min-width: 5.5rem;
}
.office-branches .ob-point-booking-results .ob-table tr:nth-child(even) {
  background: #f6f9f7;
}
.office-branches .ob-point-booking-toolbar {
  flex-wrap: wrap;
}
.office-branches .ob-point-booking-toolbar > button {
  margin-inline-start: auto;
}
.office-branches .ob-point-booking-scroll-hint {
  display: none;
  font-size: .8rem;
}
.office-booking-scope-summary h3 {
  margin: 0 0 .65rem;
}
.office-booking-source-field {
  display: grid;
  gap: .35rem;
  margin: .4rem 0 .7rem;
  max-width: 25rem;
}
.office-booking-scope-summary dl {
  display: grid;
  gap: .65rem;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 10rem), 1fr));
  margin: 0;
}
.office-booking-scope-summary dl > div {
  background: #edf6f0;
  border-radius: .7rem;
  padding: .6rem .8rem;
}
.office-booking-scope-summary dt {
  color: #536862;
  font-size: .85rem;
}
.office-booking-scope-summary dd {
  color: #18392f;
  font-weight: 700;
  margin: .2rem 0 0;
}
.booking-list-table td[data-booking-cell="source"] {
  min-width: 8rem;
}
@media (max-width: 620px) {
  .office-branches .ob-heading {
    align-items: flex-start;
    flex-direction: column;
  }
}
@media (max-width: 690px) {
  .office-branches .ob-point-booking-scroll-hint {
    display: block;
  }
  .office-branches .ob-point-booking-results .ob-table-wrap {
    max-height: 35dvh;
  }
}

.office-branch-identity{display:flex;align-items:center;gap:.45rem;flex-wrap:wrap;margin:0 0 .85rem;padding:.45rem .75rem;border:1px solid #b7d6c7;border-radius:.65rem;background:#eaf6f0;color:#164838;font-size:.82rem}