/* Styles for fragments shown by the React admin and the Flask admin alike. */
/* width: 100% plus padding pushed the admin content past the right edge. */
.b44-admin-shell .b44-admin-main { box-sizing: border-box; }
.b44-admin-shell .live-workspace {
  container: admin-live / inline-size;
  min-width: 0;
  color: #2b2430;
  font-size: 1rem;
  line-height: 1.6;
}
.b44-admin-shell .live-workspace > * + *,
.b44-admin-shell .live-workspace [data-admin-panel] > * + * {
  margin-top: 1.5rem;
}
.b44-admin-shell .live-workspace section {
  padding: clamp(1.25rem, 2.5vw, 2rem);
  border-radius: 1rem;
}
.b44-admin-shell .live-workspace :is(th, td, p, label, small) { overflow-wrap: anywhere; }
.b44-admin-shell .live-workspace :is(.overflow-x-auto, .admin-table-wrap) {
  max-width: 100%;
  min-width: 0;
  overflow-x: auto;
}
.b44-admin-shell .live-workspace table { min-width: 40rem; font-size: 0.9375rem; line-height: 1.6; }
.b44-admin-shell .live-workspace table:has(th:nth-child(5)) { min-width: 58rem; }
.b44-admin-shell .live-workspace th {
  background: #f3f0ea;
  color: #403746;
  font-size: 0.875rem;
  text-transform: none;
  letter-spacing: 0.02em;
}
.b44-admin-shell .live-workspace :is(th, td) { padding: 1rem; vertical-align: top; }
.b44-admin-shell .live-workspace td:has(form) { min-width: 15rem; }
.b44-admin-shell .live-workspace tbody tr:nth-child(even) { background: #fcf8f0; }
.b44-admin-shell .live-workspace :is(small, .admin-muted, .admin-status) { font-size: 0.875rem; line-height: 1.5; }
.b44-admin-shell .live-workspace td form { display: grid; grid-template-columns: 1fr; gap: 0.75rem; }
.b44-admin-shell .live-workspace form label { display: grid; gap: 0.5rem; min-width: 0; }
.b44-admin-shell .live-workspace form :is(input, select, textarea, button) { font: inherit; }
.b44-admin-shell .live-workspace button { min-height: 2.75rem; height: auto; white-space: normal; }

/* The assessment overview is not dependent on utility classes from Flask. */
:is(.b44-admin-shell .live-workspace, body.admin-shell .admin-portal-content) .admin-assessment-summary__heading {
  position: static;
  display: block;
  margin: 0 0 1.5rem;
  padding: 0;
  background: none;
  border: 0;
  box-shadow: none;
}
:is(.b44-admin-shell .live-workspace, body.admin-shell .admin-portal-content) .admin-assessment-summary__eyebrow {
  margin: 0 0 0.4rem;
  color: #a0803c;
  font-size: 0.8125rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
:is(.b44-admin-shell .live-workspace, body.admin-shell .admin-portal-content) .admin-assessment-summary__heading h2 {
  margin: 0;
  color: #2b2430;
  font-size: 1.875rem;
}
:is(.b44-admin-shell .live-workspace, body.admin-shell .admin-portal-content) .admin-assessment-summary__heading > p:last-child {
  max-width: 70ch;
  margin: 0.75rem 0 0;
  color: #59515e;
  font-size: 0.9375rem;
  line-height: 1.65;
}
:is(.b44-admin-shell .live-workspace, body.admin-shell .admin-portal-content) .admin-assessment-summary__metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
  margin: 0;
}
:is(.b44-admin-shell .live-workspace, body.admin-shell .admin-portal-content) .admin-assessment-summary__metric {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  min-width: 0;
  padding: 1.25rem;
  background: #fcf8f0;
  border: 1px solid #e8e2da;
  border-radius: 0.85rem;
}
:is(.b44-admin-shell .live-workspace, body.admin-shell .admin-portal-content) .admin-assessment-summary__metric dt {
  margin: 0;
  color: #514958;
  font-size: 0.875rem;
  font-weight: 600;
}
:is(.b44-admin-shell .live-workspace, body.admin-shell .admin-portal-content) .admin-assessment-summary__metric dd {
  margin: auto 0 0;
  color: #2b2430;
  font-size: 2rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  line-height: 1.3;
}
:is(.b44-admin-shell .live-workspace, body.admin-shell .admin-portal-content) .admin-assessment-summary__metric > span {
  color: #59515e;
  font-size: 0.8125rem;
}
:is(.b44-admin-shell .live-workspace, body.admin-shell .admin-portal-content) .admin-assessment-summary__metric--featured {
  background: #f7efdd;
  border-color: #c8ae4d;
}
:is(.b44-admin-shell .live-workspace, body.admin-shell .admin-portal-content) .admin-assessment-summary__steps-heading {
  margin: 1.75rem 0 1rem;
  padding-top: 1.5rem;
  border-top: 1px solid #e8e2da;
}
:is(.b44-admin-shell .live-workspace, body.admin-shell .admin-portal-content) .admin-assessment-summary__steps-heading h3 {
  margin: 0;
  font-size: 1.25rem;
}
:is(.b44-admin-shell .live-workspace, body.admin-shell .admin-portal-content) .admin-assessment-summary__steps-heading p {
  margin: 0.4rem 0 0;
  color: #59515e;
  font-size: 0.875rem;
}
:is(.b44-admin-shell .live-workspace, body.admin-shell .admin-portal-content) .admin-assessment-summary__steps {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 0.75rem;
  list-style: none;
  margin: 0;
  padding: 0;
}
:is(.b44-admin-shell .live-workspace, body.admin-shell .admin-portal-content) .admin-assessment-summary__steps li {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  align-items: center;
  padding: 1rem;
  background: #fff;
  border: 1px solid #e8e2da;
  border-radius: 0.75rem;
}
:is(.b44-admin-shell .live-workspace, body.admin-shell .admin-portal-content) .admin-assessment-summary__steps span { color: #59515e; font-size: 0.875rem; }
:is(.b44-admin-shell .live-workspace, body.admin-shell .admin-portal-content) .admin-assessment-summary__steps strong { color: #2b2430; font-size: 1.5rem; font-variant-numeric: tabular-nums; }
:is(.b44-admin-shell .live-workspace, body.admin-shell .admin-portal-content) #scoring-settings > form { margin-top: 1.5rem; }
:is(.b44-admin-shell .live-workspace, body.admin-shell .admin-portal-content) #scoring-settings form > .grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.25rem;
}
:is(.b44-admin-shell .live-workspace, body.admin-shell .admin-portal-content) #scoring-settings label {
  display: grid;
  align-content: start;
  gap: 0.6rem;
  padding: 1rem;
  background: #fcf8f0;
  border: 1px solid #e8e2da;
  border-radius: 0.75rem;
}
:is(.b44-admin-shell .live-workspace, body.admin-shell .admin-portal-content) #scoring-settings .subscription-label {
  color: #514958;
  font-size: 0.875rem;
  font-weight: 600;
  text-transform: none;
  letter-spacing: normal;
}
:is(.b44-admin-shell .live-workspace, body.admin-shell .admin-portal-content) #scoring-settings button {
  justify-self: start;
  max-width: 100%;
  margin-top: 0.5rem;
}
/* Container queries follow the space left beside the menu. */
@container admin-live (max-width: 60rem) {
  body .b44-admin-shell .live-workspace .admin-assessment-summary__metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body .b44-admin-shell .live-workspace .admin-assessment-summary__steps { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  body .b44-admin-shell .live-workspace #scoring-settings form > .grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@container admin-content (max-width: 60rem) {
  body.admin-shell .admin-portal-content .admin-assessment-summary__metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.admin-shell .admin-portal-content .admin-assessment-summary__steps { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  body.admin-shell .admin-portal-content #scoring-settings form > .grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@container admin-live (max-width: 36rem) {
  body .b44-admin-shell .live-workspace .admin-assessment-summary__metrics,
  body .b44-admin-shell .live-workspace #scoring-settings form > .grid { grid-template-columns: minmax(0, 1fr); }
  body .b44-admin-shell .live-workspace .admin-assessment-summary__steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@container admin-content (max-width: 36rem) {
  body.admin-shell .admin-portal-content .admin-assessment-summary__metrics,
  body.admin-shell .admin-portal-content #scoring-settings form > .grid { grid-template-columns: minmax(0, 1fr); }
  body.admin-shell .admin-portal-content .admin-assessment-summary__steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Icons inside Flask fragments: the public stylesheet that defines them is not loaded in the React admin. */
.b44-admin-shell .live-workspace .icon {
  display: inline-block;
  flex: 0 0 auto;
  width: 1.25rem;
  height: 1.25rem;
  vertical-align: middle;
  background-color: currentColor;
  -webkit-mask: center / contain no-repeat;
  mask: center / contain no-repeat;
}
.b44-admin-shell .live-workspace .icon-bullseye { -webkit-mask-image: url("../images/icons/bullseye.svg"); mask-image: url("../images/icons/bullseye.svg"); }
.b44-admin-shell .live-workspace .icon-chat-text { -webkit-mask-image: url("../images/icons/chat-text.svg"); mask-image: url("../images/icons/chat-text.svg"); }
.b44-admin-shell .live-workspace .icon-clipboard-check { -webkit-mask-image: url("../images/icons/clipboard-check.svg"); mask-image: url("../images/icons/clipboard-check.svg"); }
.b44-admin-shell .live-workspace .icon-clipboard-data { -webkit-mask-image: url("../images/icons/clipboard-data.svg"); mask-image: url("../images/icons/clipboard-data.svg"); }
.b44-admin-shell .live-workspace .icon-clock { -webkit-mask-image: url("../images/icons/clock.svg"); mask-image: url("../images/icons/clock.svg"); }
.b44-admin-shell .live-workspace .icon-currency-dollar { -webkit-mask-image: url("../images/icons/currency-dollar.svg"); mask-image: url("../images/icons/currency-dollar.svg"); }
.b44-admin-shell .live-workspace .icon-envelope { -webkit-mask-image: url("../images/icons/envelope.svg"); mask-image: url("../images/icons/envelope.svg"); }
.b44-admin-shell .live-workspace .icon-file-earmark-arrow-up { -webkit-mask-image: url("../images/icons/file-earmark-arrow-up.svg"); mask-image: url("../images/icons/file-earmark-arrow-up.svg"); }
.b44-admin-shell .live-workspace .icon-lightning-charge { -webkit-mask-image: url("../images/icons/lightning-charge.svg"); mask-image: url("../images/icons/lightning-charge.svg"); }
.b44-admin-shell .live-workspace .icon-patch-check { -webkit-mask-image: url("../images/icons/patch-check.svg"); mask-image: url("../images/icons/patch-check.svg"); }
.b44-admin-shell .live-workspace .icon-pencil-square { -webkit-mask-image: url("../images/icons/pencil-square.svg"); mask-image: url("../images/icons/pencil-square.svg"); }
.b44-admin-shell .live-workspace .icon-people { -webkit-mask-image: url("../images/icons/people.svg"); mask-image: url("../images/icons/people.svg"); }
.b44-admin-shell .live-workspace .icon-person { -webkit-mask-image: url("../images/icons/person.svg"); mask-image: url("../images/icons/person.svg"); }
.b44-admin-shell .live-workspace .icon-shield-check { -webkit-mask-image: url("../images/icons/shield-check.svg"); mask-image: url("../images/icons/shield-check.svg"); }
.b44-admin-shell .live-workspace .icon-signpost { -webkit-mask-image: url("../images/icons/signpost.svg"); mask-image: url("../images/icons/signpost.svg"); }
.b44-admin-shell .live-workspace .icon-stars { -webkit-mask-image: url("../images/icons/stars.svg"); mask-image: url("../images/icons/stars.svg"); }

/* Dashboard key figures: large numbers and a clear label, like the other summary cards. */
.b44-admin-shell .live-workspace #metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.875rem; }
.b44-admin-shell .live-workspace #metrics > article {
  display: flex;
  flex-direction: column;
  padding: 1.1rem 1.25rem;
  background: #fff;
  border: 1px solid #e8e2da;
  border-radius: 0.875rem;
}
.b44-admin-shell .live-workspace #metrics > article > p { margin: 0; }
.b44-admin-shell .live-workspace #metrics > article > p:first-child {
  color: #a0803c;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.b44-admin-shell .live-workspace #metrics > article > p:nth-child(2) {
  margin: 0.5rem 0 0.25rem;
  color: #2b2430;
  font-size: 2rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  line-height: 1.2;
}
.b44-admin-shell .live-workspace #metrics > article > p:last-child { color: #59515e; font-size: 0.875rem; line-height: 1.45; }

/* Care summary above the match queue. */
.b44-admin-shell .live-workspace .admin-kpi-grid > article {
  display: grid;
  gap: 0.35rem;
  padding: 1.1rem 1.25rem;
  background: #fcf8f0;
  border: 1px solid #e8e2da;
  border-radius: 0.875rem;
}
.b44-admin-shell .live-workspace .admin-kpi-grid > article > .icon { color: #a0803c; }
.b44-admin-shell .live-workspace .admin-kpi-grid > article > strong { color: #2b2430; font-size: 1.75rem; font-variant-numeric: tabular-nums; line-height: 1.2; }
.b44-admin-shell .live-workspace .admin-kpi-grid > article > small { color: #59515e; font-size: 0.875rem; }

@container admin-live (max-width: 48rem) {
  body .b44-admin-shell .live-workspace #metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@container admin-live (max-width: 34rem) {
  body .b44-admin-shell .live-workspace #metrics > article > p:nth-child(2) { font-size: 1.6rem; }
}
@container admin-live (max-width: 20rem) {
  body .b44-admin-shell .live-workspace #metrics { grid-template-columns: minmax(0, 1fr); }
}

/* Flask sections use Tailwind-style utilities that the React admin does not load: map the recurring ones. */
.b44-admin-shell .live-workspace p.uppercase {
  margin: 0 0 0.35rem;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  line-height: 1.4;
  text-transform: uppercase;
}
.b44-admin-shell .live-workspace section > div > div > p.uppercase:first-child,
.b44-admin-shell .live-workspace section > div > p.uppercase:first-child { font-size: 0.8125rem; }
.b44-admin-shell .live-workspace .text-gold { color: #a0803c; }
.b44-admin-shell .live-workspace .text-neutral-500 { color: #6b6370; }
.b44-admin-shell .live-workspace .text-neutral-600,
.b44-admin-shell .live-workspace .text-neutral-700 { color: #59515e; }
.b44-admin-shell .live-workspace .text-red-700 { color: #a2352a; }
.b44-admin-shell .live-workspace .text-red-800 { color: #85291f; }
.b44-admin-shell .live-workspace .text-amber-700 { color: #8a5a12; }
.b44-admin-shell .live-workspace .text-amber-800 { color: #6f470c; }
.b44-admin-shell .live-workspace .text-emerald-700 { color: #1f6b4f; }
.b44-admin-shell .live-workspace .text-emerald-800 { color: #17563f; }
.b44-admin-shell .live-workspace .text-blue-700 { color: #2c5a95; }
.b44-admin-shell .live-workspace .text-blue-800 { color: #224877; }
.b44-admin-shell .live-workspace :is(.text-2xl, .text-3xl, .text-4xl) { font-weight: 700; font-variant-numeric: tabular-nums; line-height: 1.2; }
.b44-admin-shell .live-workspace p.text-2xl { font-size: 1.5rem; }
.b44-admin-shell .live-workspace p.text-3xl { font-size: 1.875rem; }
.b44-admin-shell .live-workspace p.text-4xl { font-size: 2rem; }
.b44-admin-shell .live-workspace h2.text-2xl { font-size: 1.65rem; font-weight: 500; }
.b44-admin-shell .live-workspace .max-w-3xl { max-width: 70ch; }

/* Section header: text on the left, the small target box on the right. */
.b44-admin-shell .live-workspace section > .flex.justify-between {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem 2rem;
}
.b44-admin-shell .live-workspace section > .flex.justify-between > div:first-child { flex: 1 1 28rem; min-width: 0; }
.b44-admin-shell .live-workspace section > .flex.justify-between > div:not(:first-child) {
  flex: 0 0 auto;
  padding: 0.85rem 1.1rem;
  background: #fcf8f0;
  border: 1px solid #e8e2da;
  border-radius: 0.875rem;
}
.b44-admin-shell .live-workspace section > .flex.justify-between > div:not(:first-child) p { margin: 0; }
.b44-admin-shell .live-workspace section > .flex.justify-between > div:not(:first-child) p + p { margin-top: 0.2rem; }

/* Small stat cards: coloured by state, numbers first. */
.b44-admin-shell .live-workspace article.bg-stone-50 { background: #fcf8f0; border-color: #e8e2da; }
.b44-admin-shell .live-workspace article.bg-red-50 { background: #fdf3f2; border-color: #efc9c4; }
.b44-admin-shell .live-workspace article.bg-amber-50 { background: #fdf7ec; border-color: #ecd9b3; }
.b44-admin-shell .live-workspace article.bg-emerald-50 { background: #eff8f3; border-color: #bfe0cf; }
.b44-admin-shell .live-workspace article.bg-blue-50 { background: #f0f5fc; border-color: #c4d6ef; }
.b44-admin-shell .live-workspace article:is(.bg-stone-50, .bg-red-50, .bg-amber-50, .bg-emerald-50, .bg-blue-50) { border-radius: 0.875rem; }
.b44-admin-shell .live-workspace article:is(.bg-stone-50, .bg-red-50, .bg-amber-50, .bg-emerald-50, .bg-blue-50) > p { margin: 0; }
.b44-admin-shell .live-workspace article:is(.bg-stone-50, .bg-red-50, .bg-amber-50, .bg-emerald-50, .bg-blue-50) > p + p { margin-top: 0.4rem; }
.b44-admin-shell .live-workspace section > .grid { margin-top: 1.25rem; }
.b44-admin-shell .live-workspace section > :is(.mt-4, .mt-5, .mt-6, .mt-8) { margin-top: 1.5rem; }

/* Actions: navy ink buttons, as in the Base44 admin. */
.b44-admin-shell .live-workspace button[type=submit] {
  color: #fff;
  font-weight: 600;
  background: #232e3e;
  border-color: #232e3e;
}
.b44-admin-shell .live-workspace button[type=submit]:hover { background: #1c2532; border-color: #1c2532; }
@container admin-live (max-width: 34rem) {
  body .b44-admin-shell .live-workspace section > .grid:has(> article) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
