/* Brand Bloc client portal */
.bbp {
  --p-ink: var(--bb-ink, #0a0e3f); --p-navy: var(--bb-navy, #10187a); --p-blue: var(--bb-blue, #2438e0);
  --p-amber: var(--bb-amber, #ffb81c); --p-paper: var(--bb-paper, #faf6ec); --p-paper2: var(--bb-paper-2, #f1eada);
  --p-line: var(--bb-line, #e2d9c4); --p-text: var(--bb-text, #23274a); --p-muted: var(--bb-muted, #555a78);
  --p-r: 14px;
  background: var(--p-paper); color: var(--p-text); padding: clamp(20px, 4vw, 44px) 0 clamp(40px, 6vw, 72px);
  font-size: 16px; line-height: 1.55;
}
.bbp *, .bbp *::before, .bbp *::after { box-sizing: border-box; }
.bbp [hidden] { display: none !important; }
.bbp-wrap { width: min(100% - 32px, 1180px); margin-inline: auto; }
.bbp h1 { font-size: clamp(1.7rem, 3.4vw, 2.4rem); line-height: 1.15; margin: 0; color: var(--p-ink); letter-spacing: -0.02em; }
.bbp h2 { font-size: 1.15rem; margin: 0 0 14px; color: var(--p-ink); }
.bbp h3 { font-size: 0.95rem; margin: 18px 0 8px; color: var(--p-ink); }
.bbp .bbp-h2 { font-size: 1.25rem; margin: 28px 0 12px; }
.bbp a { color: var(--p-navy); }
.bbp-muted { color: var(--p-muted); font-size: 0.92em; }
.bbp-tiny { font-size: 0.8rem; margin: 8px 0 0; }
.bbp-eyebrow { margin: 0 0 6px; font-size: 0.78rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--p-blue); }

.bbp-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 14px 24px; margin: 0 0 22px; }
.bbp-links { display: flex; flex-wrap: wrap; gap: 8px 16px; align-items: center; font-weight: 600; font-size: 0.95rem; }
.bbp-back { margin: 0 0 10px; font-weight: 600; font-size: 0.95rem; }
.bbp-back a { text-decoration: none; }

.bbp-card { background: #fff; border: 1px solid var(--p-line); border-radius: var(--p-r); padding: clamp(18px, 2.6vw, 26px); margin: 0 0 18px; box-shadow: 0 1px 2px rgba(10,14,63,.04); }
.bbp-card--action { border-color: var(--p-amber); border-left: 6px solid var(--p-amber); }
.bbp-card--internal { background: #fffbef; border-style: dashed; }
.bbp-empty { text-align: center; padding: 34px 20px; }
.bbp-narrow { max-width: 720px; }

.bbp-flash { margin: 0 0 18px; padding: 12px 16px; border-radius: 10px; background: #e7f6ec; border: 1px solid #b8e2c5; color: #14532d; font-weight: 600; }
.bbp-flash--err { background: #fdecec; border-color: #f3c0c0; color: #8a1c1c; }

/* Buttons and fields */
.bbp-btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 44px; padding: 10px 20px; border: 1.5px solid var(--p-ink); border-radius: 999px; background: var(--p-amber); color: var(--p-ink) !important; font: inherit; font-weight: 700; text-decoration: none !important; cursor: pointer; }
.bbp-btn:hover { background: var(--p-ink); color: #fff !important; }
.bbp-btn--small { min-height: 38px; padding: 6px 16px; font-size: 0.92rem; }
.bbp-btn--ghost { background: #fff; }
.bbp-linkbtn { border: 0; background: none; padding: 0; color: var(--p-muted); font: inherit; font-size: 0.85rem; text-decoration: underline; cursor: pointer; }
.bbp-field { display: block; margin: 0 0 14px; }
.bbp-field > span { display: block; margin: 0 0 5px; font-weight: 600; font-size: 0.93rem; color: var(--p-ink); }
.bbp input[type=text], .bbp input[type=email], .bbp input[type=tel], .bbp input[type=password], .bbp input[type=search], .bbp input[type=date], .bbp input[type=number], .bbp input[type=time], .bbp select, .bbp textarea {
  width: 100%; min-height: 44px; padding: 10px 12px; border: 1.5px solid var(--p-line); border-radius: 10px; background: #fff; color: var(--p-text); font: inherit; font-size: 16px;
}
.bbp textarea { min-height: 90px; resize: vertical; }
.bbp input:focus, .bbp select:focus, .bbp textarea:focus { outline: 3px solid rgba(36,56,224,.25); border-color: var(--p-blue); }
.bbp-row { display: grid; grid-template-columns: 1fr 1fr; gap: 0 14px; }
.bbp-check { display: flex; gap: 10px; align-items: center; margin: 0 0 12px; font-size: 0.95rem; }
.bbp-check input { width: 18px; height: 18px; accent-color: var(--p-navy); }
.bbp-hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.bbp-filepick { position: relative; display: flex; align-items: center; min-height: 48px; margin: 0 0 12px; padding: 10px 14px; border: 1.5px dashed var(--p-navy); border-radius: 10px; background: #f5f6ff; cursor: pointer; }
.bbp-filepick input { position: absolute; inset: 0; opacity: 0; cursor: pointer; width: 100%; }
.bbp-filepick__text { font-size: 0.92rem; font-weight: 600; color: var(--p-navy); }
.bbp-filepick.has-file { border-style: solid; background: #eef7f1; border-color: #1f8a4c; }
.bbp-filepick.has-file .bbp-filepick__text { color: #14532d; }

/* Login */
.bbp-hero { max-width: 760px; margin: 0 0 24px; }
.bbp-hero p { font-size: 1.05rem; color: var(--p-muted); }
.bbp-two { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; align-items: start; }
.bbp #bbp-login p { margin: 0 0 14px; }
.bbp #bbp-login label { display: block; margin: 0 0 5px; font-weight: 600; font-size: 0.93rem; color: var(--p-ink); }
.bbp #bbp-login .login-remember label { display: flex; gap: 8px; align-items: center; font-weight: 400; }
.bbp #bbp-login .button-primary { min-height: 44px; padding: 10px 26px; border: 1.5px solid var(--p-ink); border-radius: 999px; background: var(--p-amber); color: var(--p-ink); font-weight: 700; cursor: pointer; }

/* Pills */
.bbp-pill { display: inline-block; padding: 4px 11px; border-radius: 999px; font-size: 0.8rem; font-weight: 700; line-height: 1.3; white-space: nowrap; }
.bbp-pill--blue { background: #e6e9ff; color: #1b27a8; }
.bbp-pill--amber { background: #fff1cc; color: #7a4a00; }
.bbp-pill--navy { background: var(--p-navy); color: #fff; }
.bbp-pill--grey { background: #ececf2; color: #44475f; }
.bbp-pill--green { background: #dff3e6; color: #14532d; }

/* Dashboard */
.bbp-actionlist { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.bbp-actionlist a { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px 12px; padding: 12px 14px; border-radius: 10px; background: #fff8e6; text-decoration: none; color: var(--p-ink); }
.bbp-actionlist a span { color: #7a4a00; font-weight: 600; font-size: 0.92rem; }
.bbp-cases { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 14px; }
.bbp-case { display: block; padding: 18px; background: #fff; border: 1px solid var(--p-line); border-radius: var(--p-r); text-decoration: none; color: var(--p-text); }
.bbp-case:hover { border-color: var(--p-navy); box-shadow: 0 10px 24px -14px rgba(10,14,63,.35); }
.bbp-case__top { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; color: var(--p-ink); }
.bbp-case__meta { display: flex; flex-direction: column; gap: 2px; font-size: 0.9rem; }
.bbp-bar { height: 8px; margin: 14px 0 10px; border-radius: 99px; background: var(--p-paper2); overflow: hidden; }
.bbp-bar span { display: block; height: 100%; min-width: 8px; border-radius: 99px; background: linear-gradient(90deg, var(--p-navy), var(--p-blue)); }

/* Stepper */
.bbp-steps { list-style: none; margin: 0; padding: 0; display: flex; gap: 0; overflow-x: auto; scrollbar-width: thin; }
.bbp-steps li { position: relative; flex: 1 0 110px; padding: 30px 8px 0 0; font-size: 0.85rem; color: var(--p-muted); }
.bbp-steps li::before { content: ""; position: absolute; top: 9px; left: 0; right: 0; height: 3px; background: var(--p-line); }
.bbp-steps li:first-child::before { left: 9px; }
.bbp-steps li.is-done::before, .bbp-steps li.is-now::before { background: var(--p-navy); }
.bbp-steps__dot { position: absolute; top: 0; left: 0; width: 21px; height: 21px; border-radius: 50%; background: #fff; border: 3px solid var(--p-line); }
.bbp-steps li.is-done .bbp-steps__dot { background: var(--p-navy); border-color: var(--p-navy); }
.bbp-steps li.is-done .bbp-steps__dot::after { content: ""; position: absolute; left: 5px; top: 1px; width: 5px; height: 10px; border: solid #fff; border-width: 0 2.5px 2.5px 0; transform: rotate(45deg); }
.bbp-steps li.is-now .bbp-steps__dot { background: var(--p-amber); border-color: var(--p-ink); }
.bbp-steps li.is-now { color: var(--p-ink); font-weight: 700; }
.bbp-steps li.is-done { color: var(--p-text); }

/* Documents */
.bbp-docs { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.bbp-doc { padding: 14px; border: 1px solid var(--p-line); border-radius: 10px; background: #fff; }
.bbp-doc__head { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px 12px; align-items: center; margin: 0 0 6px; }
.bbp-doc p { margin: 0 0 8px; }
.bbp-file { display: flex; flex-wrap: wrap; gap: 4px 12px; align-items: baseline; font-weight: 600; font-size: 0.93rem; }
.bbp-upload { margin-top: 10px; }
.bbp-inline { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: 10px; }
.bbp-inline input[type=text] { flex: 1 1 180px; width: auto; min-height: 38px; padding: 6px 10px; }
.bbp-inline--rm { margin-top: 6px; }
.bbp-more { margin-top: 14px; border-top: 1px solid var(--p-line); padding-top: 12px; }
.bbp-more summary { cursor: pointer; font-weight: 700; color: var(--p-navy); }
.bbp-more[open] summary { margin-bottom: 12px; }

/* Messages */
.bbp-thread { display: flex; flex-direction: column; gap: 10px; margin: 0 0 16px; }
.bbp-msg { max-width: 85%; padding: 10px 14px; border-radius: 14px; background: var(--p-paper); border: 1px solid var(--p-line); }
.bbp-msg--bb { align-self: flex-start; background: #eef0ff; border-color: #d6dbff; }
.bbp-msg--client { align-self: flex-end; background: #fff8e6; border-color: #ffe2a1; }
.bbp-msg__meta { font-size: 0.78rem; color: var(--p-muted); margin: 0 0 3px; font-weight: 600; }
.bbp-msg__body { overflow-wrap: anywhere; }
.bbp-notes { list-style: none; margin: 0 0 14px; padding: 0; display: grid; gap: 10px; }
.bbp-notes li { padding: 10px 12px; border-radius: 10px; background: #fff; border: 1px solid #f0e2b8; overflow-wrap: anywhere; }

.bbp-activity { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; font-size: 0.93rem; max-height: 340px; overflow-y: auto; }
.bbp-plain { list-style: none; margin: 0 0 10px; padding: 0; display: grid; gap: 6px; font-size: 0.93rem; }

/* Staff */
.bbp-cols { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 18px; align-items: start; }
.bbp-side { position: sticky; top: 16px; }
.bbp-search { display: flex; gap: 8px; margin: 0 0 14px; }
.bbp-search input { flex: 1; }
.bbp-tabs { display: flex; gap: 6px; overflow-x: auto; margin: 0 0 14px; padding-bottom: 4px; scrollbar-width: none; }
.bbp-tabs::-webkit-scrollbar { display: none; }
.bbp-tabs a { flex: none; padding: 8px 14px; border-radius: 999px; border: 1px solid var(--p-line); background: #fff; text-decoration: none; font-weight: 600; font-size: 0.9rem; color: var(--p-ink); white-space: nowrap; }
.bbp-tabs a span { display: inline-block; min-width: 22px; padding: 0 6px; margin-left: 4px; border-radius: 99px; background: var(--p-paper2); font-size: 0.8rem; text-align: center; }
.bbp-tabs a[aria-current] { background: var(--p-navy); border-color: var(--p-navy); color: #fff; }
.bbp-tabs a[aria-current] span { background: var(--p-amber); color: var(--p-ink); }
.bbp-tablewrap { overflow-x: auto; background: #fff; border: 1px solid var(--p-line); border-radius: var(--p-r); }
.bbp-table { width: 100%; border-collapse: collapse; font-size: 0.93rem; min-width: 860px; }
.bbp-table th { text-align: left; padding: 12px 14px; background: var(--p-paper2); color: var(--p-ink); font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.05em; }
.bbp-table td { padding: 12px 14px; border-top: 1px solid var(--p-line); vertical-align: top; }
.bbp-table tr:hover td { background: #fbf9f3; }
.bbp-late { color: #b3261e; font-weight: 700; }
.bbp-checklist { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.bbp-tick { display: flex; gap: 10px; align-items: flex-start; width: 100%; padding: 8px 6px; border: 0; border-radius: 8px; background: none; font: inherit; font-size: 0.93rem; text-align: left; color: var(--p-text); cursor: pointer; }
.bbp-tick:hover { background: var(--p-paper); }
.bbp-tick span { flex: none; width: 20px; height: 20px; margin-top: 1px; border: 2px solid var(--p-navy); border-radius: 5px; background: #fff; }
.bbp-tick.is-on span { background: var(--p-navy); box-shadow: inset 0 0 0 3px #fff; }
.bbp-tick.is-on { color: var(--p-muted); text-decoration: line-through; }

@media (max-width: 960px) {
  .bbp-cols { grid-template-columns: minmax(0, 1fr); }
  .bbp-side { position: static; order: -1; }
}
@media (max-width: 700px) {
  .bbp-two, .bbp-row { grid-template-columns: minmax(0, 1fr); }
  .bbp-msg { max-width: 100%; }
  .bbp-cases { grid-template-columns: minmax(0, 1fr); }
  .bbp-steps li { flex-basis: 96px; }
}

/* ---------- Staff tools and back office ---------- */
.bbp-nav { display: flex; gap: 4px; overflow-x: auto; margin: 0 0 22px; padding: 6px; background: var(--p-navy); border-radius: 999px; scrollbar-width: none; }
.bbp-nav::-webkit-scrollbar { display: none; }
.bbp-nav a { flex: none; padding: 8px 16px; border-radius: 999px; color: #fff; text-decoration: none; font-weight: 600; font-size: 0.92rem; white-space: nowrap; }
.bbp-nav a:hover { background: rgba(255,255,255,.12); }
.bbp-nav a[aria-current] { background: var(--p-amber); color: var(--p-ink); }
.bbp-noticebar { display: block; margin: 0 0 10px; padding: 12px 16px; border-radius: 10px; background: #fff8e6; border: 1px solid #ffe2a1; color: var(--p-ink); text-decoration: none; }
.bbp-noticebar span { color: var(--p-muted); }
.bbp-btnrow { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-top: 8px; }
.bbp-btnrow form { margin: 0; }
.bbp-done, .bbp-done a { color: var(--p-muted); text-decoration: line-through; }
.bbp-dl { display: grid; grid-template-columns: minmax(120px, 220px) 1fr; gap: 10px 18px; margin: 0; }
.bbp-dl dt { font-weight: 700; color: var(--p-ink); font-size: 0.93rem; }
.bbp-dl dd { margin: 0; overflow-wrap: anywhere; }
.bbp-log { margin: 0 0 8px; padding: 10px 12px; border-radius: 8px; background: var(--p-paper); font-size: 0.9rem; }
.bbp-timer { display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: center; margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--p-line); }
.bbp-timer input[type=text] { flex: 1 1 200px; width: auto; min-height: 38px; }
.bbp-timer__total { font-size: 0.93rem; }
.bbp-clock p { font-size: 1.02rem; }
.bbp-mini { width: 100%; border-collapse: collapse; font-size: 0.93rem; }
.bbp-mini caption { text-align: left; font-weight: 700; color: var(--p-ink); padding: 0 0 6px; }
.bbp-mini td { padding: 8px 6px; border-top: 1px solid var(--p-line); vertical-align: top; }
.bbp-mini td:last-child { text-align: right; white-space: nowrap; }
.bbp-mini tfoot td { font-weight: 700; border-top: 2px solid var(--p-ink); }
.bbp-tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 14px; }
.bbp-tile { display: flex; flex-direction: column; gap: 6px; padding: 20px; background: #fff; border: 1px solid var(--p-line); border-top: 5px solid var(--p-navy); border-radius: var(--p-r); color: var(--p-text); text-decoration: none; }
.bbp-tile:nth-child(even) { border-top-color: var(--p-amber); }
.bbp-tile strong { color: var(--p-ink); font-size: 1.05rem; }
.bbp-tile span { color: var(--p-muted); font-size: 0.92rem; }
.bbp-tile:hover { border-color: var(--p-navy); }
.bbp-perms { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 0 18px; }
.bbp-card--note, p.bbp-card--note { padding: 10px 12px; border-radius: 8px; background: #fff8e6; font-size: 0.92rem; }
.bbp-stickies { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 14px; }
.bbp-sticky { display: flex; flex-direction: column; gap: 8px; min-height: 170px; padding: 16px; border-radius: 4px 4px 18px 4px; color: var(--p-ink); text-decoration: none; box-shadow: 0 8px 18px -12px rgba(10,14,63,.5); transform: rotate(-0.6deg); }
.bbp-sticky:nth-child(even) { transform: rotate(0.7deg); }
.bbp-sticky span { font-size: 0.93rem; overflow-wrap: anywhere; }
.bbp-sticky em { margin-top: auto; font-size: 0.8rem; color: var(--p-muted); }
.bbp-sticky--yellow { background: #fff1b8; } .bbp-sticky--blue { background: #dfe6ff; } .bbp-sticky--green { background: #d9f2df; } .bbp-sticky--pink { background: #ffdfe8; }
.bbp-article h2 a { text-decoration: none; }
.bbp-prose { color: var(--p-text); }
.bbp-cal { background: #fff; border: 1px solid var(--p-line); border-radius: var(--p-r); overflow: hidden; }
.bbp-cal__row { display: grid; grid-template-columns: repeat(7, 1fr); background: var(--p-paper2); }
.bbp-cal__row div { padding: 10px; font-size: 0.8rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: var(--p-ink); }
.bbp-cal__grid { display: grid; grid-template-columns: repeat(7, 1fr); }
.bbp-cal__day { min-height: 110px; padding: 6px; border-top: 1px solid var(--p-line); border-left: 1px solid var(--p-line); display: flex; flex-direction: column; gap: 4px; }
.bbp-cal__day:nth-child(7n+1) { border-left: 0; }
.bbp-cal__day.is-out { background: var(--p-paper); }
.bbp-cal__day.is-today { background: #fff8e6; }
.bbp-cal__n { font-weight: 700; font-size: 0.85rem; color: var(--p-ink); }
.bbp-cal__wd { display: none; }
.bbp-cal__item { display: block; padding: 3px 6px; border-radius: 6px; font-size: 0.78rem; line-height: 1.3; text-decoration: none; color: var(--p-ink); background: #e6e9ff; overflow-wrap: anywhere; }
.bbp-cal__item--task { background: #fff1cc; } .bbp-cal__item--case { background: #ffe0dc; } .bbp-cal__item--leave { background: #dff3e6; }
.bbp-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 14px; margin: 0 0 18px; }
.bbp-stats div { padding: 18px; background: #fff; border: 1px solid var(--p-line); border-radius: var(--p-r); }
.bbp-stats strong { display: block; font-size: 1.8rem; color: var(--p-navy); line-height: 1.1; }
.bbp-stats span { color: var(--p-muted); font-size: 0.9rem; }
.bbp-bars { width: 100%; border-collapse: collapse; font-size: 0.93rem; }
.bbp-bars th { text-align: left; font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.05em; color: var(--p-ink); padding: 0 8px 8px 0; }
.bbp-bars td { padding: 10px 8px 10px 0; border-top: 1px solid var(--p-line); vertical-align: top; }
.bbp-hbar { display: flex; height: 12px; margin: 3px 0 4px; border-radius: 99px; background: var(--p-paper2); overflow: hidden; min-width: 120px; }
.bbp-hbar__open { background: var(--p-amber); } .bbp-hbar__done { background: var(--p-navy); }
.bbp-table--pay { min-width: 1080px; font-size: 0.84rem; }
.bbp-table--pay th, .bbp-table--pay td { padding: 10px 8px; }
.bbp-table--pay th { font-size: 0.72rem; }
.bbp-table--pay input { min-height: 34px; padding: 4px 6px; width: 92px; font-size: 0.9rem; }
.bbp-payslip .bbp-two { margin-top: 12px; }
.bbp-net { margin: 18px 0 0; padding: 14px 16px; border-radius: 10px; background: var(--p-navy); color: #fff; font-size: 1.1rem; display: flex; justify-content: space-between; }
.bbp code { padding: 2px 6px; border-radius: 6px; background: var(--p-paper2); font-size: 0.88em; overflow-wrap: anywhere; }
@media (max-width: 760px) {
  .bbp-cal__row { display: none; }
  .bbp-cal__grid { grid-template-columns: minmax(0, 1fr); }
  .bbp-cal__day { min-height: 0; border-left: 0; }
  .bbp-cal__day.is-out, .bbp-cal__day.is-empty { display: none; }
  .bbp-cal__wd { display: inline; font-weight: 400; color: var(--p-muted); }
  .bbp-dl { grid-template-columns: minmax(0, 1fr); gap: 2px 0; }
  .bbp-dl dd { margin-bottom: 10px; }
}
@media (max-width: 700px) {
  .bbp-tablewrap:has(.bbp-table:not(.bbp-table--pay)) { overflow: visible; background: none; border: 0; }
  .bbp-table:not(.bbp-table--pay) { min-width: 0; }
  .bbp-table:not(.bbp-table--pay) thead { display: none; }
  .bbp-table:not(.bbp-table--pay), .bbp-table:not(.bbp-table--pay) tbody, .bbp-table:not(.bbp-table--pay) tr, .bbp-table:not(.bbp-table--pay) td { display: block; width: 100%; }
  .bbp-table:not(.bbp-table--pay) tr { margin: 0 0 10px; padding: 12px 14px; background: #fff; border: 1px solid var(--p-line); border-radius: var(--p-r); }
  .bbp-table:not(.bbp-table--pay) td { position: relative; padding: 4px 0 4px 100px; border: 0; background: none !important; }
  .bbp-table:not(.bbp-table--pay) td::before { content: attr(data-label); position: absolute; left: 0; top: 6px; width: 92px; font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--p-muted); }
  .bbp-table:not(.bbp-table--pay) td:first-child { padding: 0 0 8px; }
  .bbp-table:not(.bbp-table--pay) td:first-child::before { display: none; }
  .bbp-table:not(.bbp-table--pay) td:empty { display: none; }
}
@media print {
  header, footer, .wp-site-blocks > header, .wp-site-blocks > footer, .bbp-nav, .bbp-noprint, #wpadminbar, .chaty, .chaty-widget { display: none !important; }
  .bbp { background: #fff; padding: 0; }
  .bbp-card { border: 0; box-shadow: none; }
}

/* ---------- App frame (sidebar + top bar), Brand Bloc colours ---------- */
html:has(body.bb-portal-page) { margin-top: 0 !important; }
body.bb-portal-page { margin: 0; background: #f3f4fa; }
body.bb-portal-page .wp-site-blocks { padding: 0; }
.bbp.bbp-app { --p-side: #0b1150; --p-side-2: #141c6b; display: grid; grid-template-columns: 280px minmax(0, 1fr); min-height: 100vh; padding: 0; background: #f3f4fa; font-family: var(--bb-body, Inter, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif); }
.bbp h1, .bbp h2, .bbp h3 { font-family: var(--bb-display, inherit); }
.bbp-sidebar { position: sticky; top: 0; height: 100vh; display: flex; flex-direction: column; background: var(--p-side); color: rgba(255,255,255,.8); overflow-y: auto; scrollbar-width: thin; scrollbar-color: rgba(255,255,255,.2) transparent; z-index: 40; }
.bbp-brand { position: relative; display: grid; gap: 4px; padding: 22px 76px 20px 24px; border-bottom: 1px solid rgba(255,255,255,.1); }
.bbp-brand__name { color: #fff !important; font-weight: 700; font-size: 1.2rem; text-decoration: none; line-height: 1.2; }
.bbp-brand__name span { display: block; font-size: 0.72rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--p-amber); }
.bbp-brand__user { display: flex; align-items: center; gap: 8px; font-size: 0.92rem; color: rgba(255,255,255,.75); }
.bbp-dot { width: 10px; height: 10px; border-radius: 50%; background: #2ecc71; box-shadow: 0 0 0 3px rgba(46,204,113,.25); }
.bbp-brand__logo { position: absolute; top: 20px; right: 20px; width: 44px; height: 44px; border-radius: 10px; background: #fff; object-fit: contain; padding: 4px; }
.bbp-brand__logo--mark { display: grid; place-items: center; padding: 0; background: var(--p-amber); color: var(--p-ink); font-weight: 800; font-size: 1.3rem; }
.bbp-menu { display: flex; flex-direction: column; padding: 10px 0 20px; }
.bbp-menu__item { display: flex; align-items: center; gap: 14px; min-height: 52px; padding: 0 22px; color: rgba(255,255,255,.8) !important; text-decoration: none !important; font-size: 1.02rem; border-left: 4px solid transparent; cursor: pointer; list-style: none; }
.bbp-menu__item::-webkit-details-marker { display: none; }
.bbp-menu__item:hover { background: rgba(255,255,255,.06); color: #fff !important; }
.bbp-menu__item[aria-current] { background: rgba(255,184,28,.12); border-left-color: var(--p-amber); color: #fff !important; font-weight: 600; }
.bbp-menu__item .bbp-ico { flex: none; opacity: .9; }
.bbp-menu__item span { flex: 1; }
.bbp-menu__group > summary .bbp-ico:last-child { width: 16px; height: 16px; transition: transform .15s; }
.bbp-menu__group[open] > summary .bbp-ico:last-child { transform: rotate(90deg); }
.bbp-menu__sub { display: flex; flex-direction: column; padding: 2px 0 8px; }
.bbp-menu__sub a { padding: 10px 22px 10px 62px; color: rgba(255,255,255,.68) !important; text-decoration: none !important; font-size: 0.95rem; }
.bbp-menu__sub a:hover { color: #fff !important; }
.bbp-menu__sub a[aria-current] { color: var(--p-amber) !important; font-weight: 600; }
.bbp-badge { flex: none; min-width: 22px; padding: 1px 7px; border-radius: 99px; background: var(--p-amber); color: var(--p-ink); font-style: normal; font-size: 0.75rem; font-weight: 700; text-align: center; }
.bbp-badge--red { position: absolute; top: -6px; right: -8px; background: #e5484d; color: #fff; }
.bbp-sidebar__site { margin-top: auto; padding: 16px 24px; border-top: 1px solid rgba(255,255,255,.1); color: rgba(255,255,255,.6) !important; font-size: 0.85rem; text-decoration: none !important; }
.bbp-col { min-width: 0; display: flex; flex-direction: column; }
.bbp-top { position: sticky; top: 0; z-index: 30; display: flex; align-items: center; gap: 14px; min-height: 76px; padding: 0 clamp(16px, 3vw, 36px); background: #fff; border-bottom: 1px solid #e7e8f0; }
.bbp-top__menu { display: none; border: 0; background: none; padding: 8px; margin-left: -8px; color: var(--p-ink); cursor: pointer; }
.bbp-top__title { display: flex; align-items: baseline; gap: 12px; min-width: 0; }
.bbp-top__title strong { font-size: 1.35rem; color: var(--p-ink); white-space: nowrap; }
.bbp-top__title span { color: #8a8fb0; font-size: 0.92rem; white-space: nowrap; }
.bbp-top__icons { margin-left: auto; display: flex; align-items: center; gap: 4px; }
.bbp-top__icons > a, .bbp-bell > summary { position: relative; display: grid; place-items: center; width: 42px; height: 42px; border-radius: 10px; color: #4a4f72 !important; cursor: pointer; list-style: none; }
.bbp-top__icons > a:hover, .bbp-bell > summary:hover { background: #f1f2f8; color: var(--p-navy) !important; }
.bbp-top__icons .bbp-ico { width: 22px; height: 22px; }
.bbp-bell { position: relative; }
.bbp-bell > summary::-webkit-details-marker { display: none; }
.bbp-bell__list { position: absolute; right: 0; top: 50px; width: min(340px, 86vw); max-height: 70vh; overflow-y: auto; padding: 14px; background: #fff; border: 1px solid #e7e8f0; border-radius: 12px; box-shadow: 0 20px 40px -18px rgba(10,14,63,.35); z-index: 50; }
.bbp-bell__list > strong { display: block; margin: 0 0 8px; color: var(--p-ink); }
.bbp-bell__list a { display: block; padding: 10px; border-radius: 8px; color: var(--p-ink) !important; text-decoration: none !important; font-size: 0.93rem; }
.bbp-bell__list a:hover { background: #f5f6fb; }
.bbp-bell__list a span { display: block; font-size: 0.8rem; color: var(--p-muted); }
.bbp-content { padding: clamp(18px, 3vw, 36px); min-width: 0; }
.bbp-content > .bbp-flash { margin-bottom: 18px; }
.bbp .bbp-card { border-color: #e7e8f0; border-radius: 12px; box-shadow: 0 1px 2px rgba(10,14,63,.04); }
.bbp-scrim { position: fixed; inset: 0; background: rgba(10,14,63,.45); z-index: 35; }

/* Staff dashboard */
.bbp-welcome { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px 24px; margin: 0 0 22px; }
.bbp-welcome h1 { font-size: clamp(1.4rem, 2.6vw, 1.9rem); }
.bbp-welcome__clock { display: flex; align-items: center; gap: 18px; }
.bbp-welcome__clock > div:first-child { text-align: right; line-height: 1.2; }
.bbp-welcome__clock strong { display: block; font-size: 1.5rem; color: #4a4f72; }
.bbp-welcome__clock span { font-size: 0.85rem; color: var(--p-muted); }
.bbp-welcome__clock form { margin: 0; }
.bbp-dash { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); gap: 20px; align-items: start; }
.bbp-dash__col { display: grid; gap: 0; min-width: 0; }
.bbp-dash__pair { display: grid; grid-template-columns: 1fr 1.3fr; gap: 18px; }
.bbp-profile { padding: 0 !important; overflow: hidden; }
.bbp-profile__top { display: flex; gap: 22px; align-items: center; padding: 24px; border-bottom: 1px solid #e7e8f0; }
.bbp-profile__top h2 { margin: 0 0 4px; font-size: 1.3rem; }
.bbp-profile__top p { margin: 0 0 4px; color: #6b7095; }
.bbp-profile__nums { display: flex; justify-content: space-between; padding: 18px 24px; }
.bbp-profile__nums a { display: grid; gap: 6px; text-decoration: none; color: var(--p-text) !important; }
.bbp-profile__nums a:last-child { text-align: right; }
.bbp-profile__nums strong { font-size: 1.5rem; color: var(--p-ink); }
.bbp-avatar { display: block; flex: none; border-radius: 12px; object-fit: cover; }
.bbp-avatar--lg { width: 112px; height: 112px; }
.bbp-avatar--sm { width: 36px; height: 36px; border-radius: 50%; }
.bbp-avatar--ini { display: grid; place-items: center; background: linear-gradient(135deg, var(--p-navy), var(--p-blue)); color: #fff; font-weight: 700; font-size: 2rem; }
.bbp-avatar--sm.bbp-avatar--ini { font-size: 0.85rem; }
.bbp-stat .bbp-doc__head .bbp-ico { width: 34px; height: 34px; color: #7d83ad; }
.bbp-stat__nums { display: flex; gap: 22px; flex-wrap: wrap; }
.bbp-stat__nums a { display: grid; gap: 4px; text-decoration: none; color: var(--p-muted) !important; font-size: 0.92rem; }
.bbp-stat__nums strong { font-size: 1.8rem; line-height: 1; }
.is-blue { color: var(--p-blue); } .is-red { color: #d93a3f; } .is-amber { color: #c98300; }
.bbp-week { display: flex; gap: 8px; flex-wrap: wrap; margin: 4px 0 14px; }
.bbp-week span { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; border: 1px solid #e1e3ee; font-size: 0.88rem; color: #4a4f72; }
.bbp-week span.has-time { border-color: var(--p-navy); color: var(--p-navy); font-weight: 700; }
.bbp-week span.is-today { background: var(--p-amber); border-color: var(--p-amber); color: var(--p-ink); font-weight: 700; }
.bbp-week__foot { display: flex; justify-content: space-between; font-size: 0.85rem; color: var(--p-muted); }
.bbp-mini tr.is-today td { background: #fff8e6; }
.bbp-mini thead th { text-align: left; font-size: 0.78rem; text-transform: uppercase; letter-spacing: .05em; color: var(--p-muted); padding: 0 6px 8px; }

/* Login */
.bbp.bbp-auth { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); min-height: 100vh; padding: 0; background: #f3f4fa; }
.bbp-auth > .bbp-flash { position: fixed; top: 16px; left: 50%; transform: translateX(-50%); z-index: 60; width: min(92vw, 560px); }
.bbp-auth__panel { display: flex; flex-direction: column; justify-content: center; gap: 18px; padding: clamp(32px, 6vw, 80px); background: radial-gradient(circle at 85% 15%, rgba(255,184,28,.25), transparent 40%), var(--p-navy); color: rgba(255,255,255,.85); }
.bbp-auth__brand { display: flex; align-items: center; gap: 12px; color: #fff; font-weight: 700; font-size: 1.3rem; }
.bbp-auth__brand .bbp-brand__logo { position: static; }
.bbp-auth__panel h1 { color: #fff !important; font-size: clamp(2rem, 4vw, 3.2rem); }
.bbp-auth__panel h1 em { font-style: normal; color: var(--p-amber); }
.bbp-auth__panel p { font-size: 1.1rem; margin: 0; max-width: 32em; }
.bbp-auth__panel ul { margin: 6px 0 0; padding-left: 1.2em; display: grid; gap: 8px; }
.bbp-auth__site { margin-top: 18px; color: rgba(255,255,255,.7) !important; font-size: 0.92rem; }
.bbp-auth__forms { display: flex; align-items: center; justify-content: center; padding: clamp(20px, 4vw, 60px); }
.bbp-auth__card { width: min(100%, 480px); margin: 0; padding: clamp(22px, 3vw, 34px) !important; }
.bbp-auth__card h2 { font-size: 1.6rem; margin-bottom: 6px; }

@media (max-width: 1100px) {
  .bbp-dash { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 960px) {
  .bbp.bbp-app { grid-template-columns: minmax(0, 1fr); }
  .bbp-sidebar { position: fixed; left: 0; top: 0; bottom: 0; width: min(86vw, 300px); transform: translateX(-110%); transition: transform .2s ease; }
  body.bbp-menu-open .bbp-sidebar { transform: none; box-shadow: 10px 0 30px rgba(10,14,63,.3); }
  .bbp-top__menu { display: block; }
  .bbp-top__title span { display: none; }
  .bbp-top { min-height: 64px; }
  .bbp-top__icons > a, .bbp-bell > summary { width: 38px; height: 38px; }
  .bbp-top__icons > a[title="Search cases"], .bbp-top__icons > a[title="Sticky notes"] { display: none; }
  .bbp.bbp-auth { grid-template-columns: minmax(0, 1fr); }
  .bbp-auth__panel { padding: 28px 20px; gap: 10px; }
  .bbp-auth__panel ul, .bbp-auth__site { display: none; }
  .bbp-auth__panel h1 { font-size: 1.8rem; }
}
@media (max-width: 560px) {
  .bbp-dash__pair { grid-template-columns: minmax(0, 1fr); }
  .bbp-welcome { flex-direction: column; align-items: flex-start; }
  .bbp-welcome__clock { width: 100%; justify-content: space-between; }
  .bbp-welcome__clock > div:first-child { text-align: left; }
  .bbp-profile__top { gap: 16px; padding: 18px; }
  .bbp-avatar--lg { width: 84px; height: 84px; }
  .bbp-top__title strong { font-size: 1.15rem; }
}
@media print {
  .bbp-sidebar, .bbp-top { display: none !important; }
  .bbp.bbp-app { display: block; background: #fff; }
}
.bbp-app .bbp-side { top: 96px; }

/* ---------- Finance, clients, people ---------- */
.bbp-pill--red { background: #fde2e1; color: #9b1c1c; }
.bbp .is-red { color: #b42318; }
.bbp .is-green { color: #15803d; }
.bbp-num { text-align: right; white-space: nowrap; }
.bbp-sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.bbp-grid2, .bbp-grid3 { display: grid; gap: 0 16px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.bbp-grid3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.bbp-filters { flex-wrap: wrap; }
.bbp-filters select { width: auto; min-width: 160px; }
.bbp-who { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; color: inherit; line-height: 1.3; }
.bbp-who--lg { gap: 16px; }
.bbp-kv { display: grid; grid-template-columns: auto 1fr; gap: 8px 14px; margin: 0 0 14px; font-size: 0.93rem; }
.bbp-kv dt { color: var(--p-muted); }
.bbp-kv dd { margin: 0; word-break: break-word; }
.bbp-note { background: #fffbef; border: 1px dashed var(--p-line); border-radius: 10px; padding: 10px 12px; font-size: 0.92rem; }
.bbp-list li { padding: 8px 0; border-bottom: 1px solid var(--p-line); }
.bbp-list li:last-child { border-bottom: 0; }
.bbp-pager { display: flex; flex-wrap: wrap; gap: 8px 18px; align-items: center; margin: 14px 0; font-size: 0.92rem; font-weight: 600; }
.bbp-pager span { color: var(--p-muted); font-weight: 400; margin-right: auto; }
.bbp-actlist { display: grid; gap: 8px; }
.bbp-actlist form { margin: 0; }
.bbp-actlist .bbp-btn { width: 100%; justify-content: center; }
.bbp-st { min-height: 34px !important; padding: 4px 8px !important; font-size: 0.85rem !important; font-weight: 600; border-radius: 999px !important; width: auto !important; }
.bbp-st--in-progress { background: #e6e9ff; }
.bbp-st--waiting { background: #fff1cc; }
.bbp-st--done { background: #dff3e6; }

/* Invoice form */
.bbp-items { margin: 8px 0 18px; }
.bbp-items__head, .bbp-item { display: grid; grid-template-columns: minmax(0, 1fr) 90px 150px 64px 120px 32px; gap: 10px; align-items: start; }
.bbp-items__head { font-size: 0.78rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: var(--p-ink); padding: 0 0 6px; border-bottom: 2px solid var(--p-line); }
.bbp-item { padding: 12px 0; border-bottom: 1px solid var(--p-line); }
.bbp-item textarea { margin-top: 6px; min-height: 38px; font-size: 0.9rem; }
.bbp-item__tax { display: flex; justify-content: center; padding-top: 10px; }
.bbp-item__tax input { width: 20px; height: 20px; }
.bbp-item [data-amount] { padding-top: 10px; font-weight: 700; }
.bbp-item [data-bbp-rm-item] { font-size: 1.4rem; line-height: 1; padding-top: 6px; color: var(--p-muted); }
.bbp-items > .bbp-btn { margin-top: 12px; }
.bbp-invtotals { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 20px; align-items: start; margin: 0 0 18px; }
.bbp-invtotals .bbp-field { max-width: 220px; }
.bbp-invtotals dl { display: grid; grid-template-columns: 1fr auto; gap: 8px 16px; margin: 0; padding: 14px 16px; background: var(--p-paper2); border-radius: 12px; }
.bbp-invtotals dt { color: var(--p-muted); }
.bbp-invtotals dd { margin: 0; text-align: right; font-weight: 600; }
.bbp-invtotals dt:nth-last-of-type(1), .bbp-invtotals dd:last-child { font-size: 1.1rem; font-weight: 800; color: var(--p-ink); }
@media (max-width: 760px) {
  .bbp-grid2, .bbp-grid3, .bbp-invtotals { grid-template-columns: minmax(0, 1fr); }
  .bbp-items__head { display: none; }
  .bbp-item { grid-template-columns: 1fr 1fr 40px; }
  .bbp-item > label:first-child { grid-column: 1 / -1; }
  .bbp-item [data-amount] { grid-column: 1 / 3; text-align: left; }
}

/* Invoice document */
.bbp-invwrap { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 18px; align-items: start; }
.bbp-invdoc { padding: clamp(22px, 4vw, 44px); }
.bbp-invdoc__top { display: grid; grid-template-columns: auto 1fr; gap: 6px 20px; align-items: start; padding-bottom: 20px; border-bottom: 4px solid var(--p-amber); }
.bbp-invdoc__logo { max-height: 64px; width: auto; }
.bbp-invdoc__brand { font-size: 1.4rem; color: var(--p-navy); letter-spacing: 0.06em; }
.bbp-invdoc__top h1 { text-align: right; color: var(--p-navy) !important; letter-spacing: 0.1em; font-size: clamp(1.4rem, 3vw, 2rem) !important; }
.bbp-invdoc__top p { grid-column: 1 / -1; margin: 0; font-size: 0.88rem; color: var(--p-muted); }
.bbp-invdoc__meta { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 18px; margin: 22px 0; }
.bbp-invkv th { text-align: left; padding: 3px 18px 3px 0; color: var(--p-muted); font-weight: 600; font-size: 0.9rem; }
.bbp-invkv td { padding: 3px 0; font-weight: 600; }
.bbp-invdoc__to { display: flex; flex-direction: column; gap: 2px; text-align: right; font-size: 0.93rem; }
.bbp-invdoc__status { margin-top: 8px; }
.bbp-invitems { width: 100%; border-collapse: collapse; font-size: 0.93rem; }
.bbp-invitems th { background: var(--p-navy); color: #fff; text-align: left; padding: 10px 12px; font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.05em; }
.bbp-invitems th.bbp-num { text-align: right; }
.bbp-invitems td { padding: 12px; border-bottom: 1px solid var(--p-line); vertical-align: top; }
.bbp-invsum { margin: 14px 0 0 auto; border-collapse: collapse; min-width: 280px; font-size: 0.95rem; }
.bbp-invsum th { text-align: left; padding: 6px 24px 6px 0; color: var(--p-muted); font-weight: 600; }
.bbp-invsum td { text-align: right; padding: 6px 0; font-weight: 600; }
.bbp-invsum .is-total th, .bbp-invsum .is-total td { border-top: 2px solid var(--p-ink); color: var(--p-ink); font-size: 1.05rem; font-weight: 800; padding-top: 10px; }
.bbp-invsum .is-due th, .bbp-invsum .is-due td { background: var(--p-amber); color: var(--p-ink); font-weight: 800; padding: 10px; }
.bbp-invnote { margin-top: 22px; font-size: 0.9rem; }
.bbp-invnote h3 { margin: 0 0 6px !important; text-transform: uppercase; letter-spacing: 0.06em; font-size: 0.8rem !important; color: var(--p-navy) !important; }
.bbp-invnote p { margin: 0; white-space: normal; }
.bbp-invfoot { margin: 28px 0 0; padding-top: 14px; border-top: 1px solid var(--p-line); text-align: center; color: var(--p-muted); font-size: 0.88rem; }
.bbp-invside { position: sticky; top: 96px; }
@media (max-width: 980px) {
  .bbp-invwrap { grid-template-columns: minmax(0, 1fr); }
  .bbp-invside { position: static; order: -1; }
}
@media (max-width: 560px) {
  .bbp-invdoc__to { text-align: left; }
  .bbp-invitems th:nth-child(3), .bbp-invitems td:nth-child(3) { display: none; }
}
@media print {
  .bbp-invwrap { display: block; }
  .bbp-invdoc { padding: 0; }
  .bbp-invitems th { background: #10187a !important; color: #fff !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .bbp-invsum .is-due th, .bbp-invsum .is-due td { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .bbp-main-area, .bbp-app main { padding: 0 !important; }
}

/* Attendance grid */
.bbp-legend { display: flex; flex-wrap: wrap; gap: 8px 18px; font-size: 0.88rem; color: var(--p-muted); margin: 0 0 12px; }
.bbp-legend span { display: inline-flex; gap: 6px; align-items: center; }
.bbp-attwrap { overflow-x: auto; background: #fff; border: 1px solid var(--p-line); border-radius: var(--p-r); }
.bbp-attgrid { border-collapse: collapse; font-size: 0.82rem; min-width: 100%; }
.bbp-attgrid th, .bbp-attgrid td { padding: 6px 4px; text-align: center; border-bottom: 1px solid var(--p-line); }
.bbp-attgrid thead th { font-size: 0.75rem; color: var(--p-ink); background: var(--p-paper2); line-height: 1.2; }
.bbp-attgrid thead small { color: var(--p-muted); font-weight: 400; }
.bbp-attgrid tbody th { text-align: left; position: sticky; left: 0; background: #fff; padding: 8px 12px; white-space: nowrap; z-index: 1; min-width: 180px; }
.bbp-attgrid .is-we { background: #f6f6fa; }
.bbp-attgrid td[aria-current] { outline: 2px solid var(--p-amber); outline-offset: -2px; }
.bbp-att { display: inline-grid; place-items: center; width: 22px; height: 22px; border-radius: 6px; font-size: 0.8rem; }
.bbp-att.is-in { background: #dff3e6; color: #15803d; }
.bbp-att.is-half { background: #fff1cc; color: #7a4a00; }
.bbp-att.is-leave { background: #e6e9ff; color: #1b27a8; }
.bbp-att.is-hol { background: #ffe4f1; color: #9d174d; }
.bbp-att.is-out { background: #fde2e1; color: #b42318; }
.bbp-att.is-off { color: #b5b7c8; }

/* Recruit */
.bbp-hbars { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.bbp-hbars a { display: grid; grid-template-columns: 110px 1fr 36px; gap: 10px; align-items: center; text-decoration: none; color: var(--p-text) !important; font-size: 0.92rem; }
.bbp-hbars b { display: block; height: 12px; border-radius: 99px; background: linear-gradient(90deg, var(--p-navy) var(--w), #ececf2 var(--w)); }
.bbp-hbars em { font-style: normal; font-weight: 700; text-align: right; }

/* ---------- Brand Bloc logo (sidebar, login, invoices) ---------- */
.bbp-brand { gap: 6px; padding: 18px 16px; background: #10187a; }
.bbp-brand__home { display: block; text-decoration: none !important; }
.bbp-brand__img { display: block; width: 100%; max-width: 230px; height: auto; }
.bbp-brand__role { margin: 6px 0 0 6px; font-size: 0.72rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--p-amber); }
.bbp-brand__user { margin-left: 6px; }
.bbp-auth__panel { background: #10187a; }
.bbp-auth__brand { display: inline-block; align-self: flex-start; margin-bottom: 12px; text-decoration: none !important; }
.bbp-auth__logo { display: block; width: min(100%, 320px); height: auto; }
.bbp-invdoc__logo { display: block; width: min(260px, 55vw); height: auto; max-height: none; }
.bbp #bbp-login .button-primary { font: inherit; font-weight: 700; }
.bbp #bbp-login #jetpack_protect_answer { display: inline-block; width: 90px; margin-left: 6px; }
@media (max-width: 960px) {
  .bbp-auth__logo { width: 220px; }
}

/* ---------- Tidy logo, bell, mobile login (12 Oct) ---------- */
.bbp-brand { background: transparent; padding: 22px 22px 18px; }
.bbp-brand__img { max-width: 168px; }
.bbp-brand__role, .bbp-brand__user { margin-left: 0; }
.bbp-auth__logo { width: min(100%, 230px); }
.bbp-bell__head { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; margin: 0 0 8px; }
.bbp-bell__head strong { margin: 0; color: var(--p-ink); }
.bbp-bell__list a.bbp-bell__all { display: inline; padding: 0; font-size: 0.82rem; font-weight: 600; color: var(--p-navy) !important; text-decoration: underline !important; }
.bbp-auth__home { display: none; }
@media (max-width: 960px) {
  .bbp-auth__logo { width: 170px; }
  .bbp-auth__home { display: block; order: 3; margin: 0 auto 28px; padding: 12px 20px; color: var(--p-navy) !important; font-weight: 700; text-align: center; }
  .bbp.bbp-auth { display: flex; flex-direction: column; }
  .bbp-auth__forms { order: 2; }
  .bbp-auth__panel { order: 1; }
  .bbp-auth__panel .bbp-auth__brand { margin-bottom: 4px; }
}
@media (max-width: 960px) {
  .bbp-auth__panel .bbp-auth__site { display: inline-block; order: -1; margin: 0 0 6px; font-size: 0.9rem; color: rgba(255,255,255,.85) !important; text-decoration: none !important; }
}

/* ---------- In-portal pages: forms, services, account (12 Oct) ---------- */
.bbp-embed { background: #fff; border: 1px solid #e7e8f0; border-radius: 12px; overflow: hidden; }
.bbp-embed iframe { display: block; width: 100%; height: 900px; border: 0; }
.bbp-svcs { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); gap: 14px; margin: 0 0 10px; }
.bbp-svc { display: flex; flex-direction: column; gap: 6px; padding: 18px; background: #fff; border: 1px solid #e7e8f0; border-radius: 12px; }
.bbp-svc h3 { margin: 0 !important; font-size: 1rem !important; }
.bbp-svc p { margin: 0; flex: 1; font-size: 0.9rem; }
.bbp-svc__foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 8px; }
.bbp-svc__foot strong { color: var(--p-ink); font-size: 0.95rem; }
.bbp-svc[hidden], .bbp-svcgroup[hidden] { display: none !important; }
.bbp-photo { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; }
.bbp-photo form { margin: 0; flex: 1 1 200px; }
.bbp-avatar--lg { width: 96px; height: 96px; }
.bbp-svcpick { border: 0; padding: 0; margin: 0 0 14px; }
.bbp-svcpick legend { font-weight: 600; font-size: 0.93rem; color: var(--p-ink); margin: 0 0 8px; }
.bbp-svcpick .bbp-check { margin: 0 0 8px; }
.bbp-tl__day { margin: 14px 0 6px; font-size: 0.78rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--p-muted); }
.bbp-tl__day:first-of-type { margin-top: 0; }
.bbp-tl { list-style: none; margin: 0; padding: 0 0 0 4px; }
.bbp-tl li { position: relative; display: flex; gap: 12px; padding: 0 0 12px 0; }
.bbp-tl li::before { content: ""; position: absolute; left: 5px; top: 14px; bottom: 0; width: 2px; background: #e7e8f0; }
.bbp-tl li:last-child::before { display: none; }
.bbp-tl__dot { flex: none; width: 12px; height: 12px; margin-top: 5px; border-radius: 50%; background: #fff; border: 3px solid var(--p-navy); position: relative; z-index: 1; }
.bbp-tl li:first-child .bbp-tl__dot { background: var(--p-amber); border-color: var(--p-ink); }
.bbp-tl__body p { margin: 0; font-size: 0.93rem; color: var(--p-text); }
.bbp-tl__meta { font-size: 0.8rem; color: var(--p-muted); }
.bbp-appr { padding: 0 !important; }
.bbp-appr > summary { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding: 16px 20px; cursor: pointer; list-style: none; }
.bbp-appr > summary::-webkit-details-marker { display: none; }
.bbp-appr[open] > summary { border-bottom: 1px solid #e7e8f0; }
.bbp-appr__body { padding: 16px 20px 6px; }
.bbp-answers { margin: 0 0 16px; font-size: 0.9rem; }
.bbp-tpl { border: 1px solid #e7e8f0; border-radius: 10px; padding: 12px 14px 4px; margin: 0 0 12px; }
.bbp-tpl legend { padding: 0 6px; font-weight: 700; color: var(--p-ink); font-size: 0.9rem; }
.bbp-appr { padding: 0 !important; }
.bbp-appr > summary { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding: 16px 20px; cursor: pointer; list-style: none; }
.bbp-appr > summary::-webkit-details-marker { display: none; }
.bbp-appr[open] > summary { border-bottom: 1px solid #e7e8f0; }
.bbp-appr__body { padding: 16px 20px 6px; }
.bbp-answers { margin: 0 0 16px; font-size: 0.9rem; }
.bbp-tpl { border: 1px solid #e7e8f0; border-radius: 10px; padding: 12px 14px 4px; margin: 0 0 12px; }
.bbp-tpl legend { padding: 0 6px; font-weight: 700; color: var(--p-ink); font-size: 0.9rem; }

/* Typed answers to information requests */
.bbp-answer{margin:8px 0;padding:10px 14px;border-left:4px solid #ffb81c;background:#f6f7fc;border-radius:8px;white-space:normal;color:#23274a}
.bbp-rtype{border:0;padding:0;margin:0 0 10px;display:grid;gap:6px}
.bbp-rtype>span{font-weight:600}

/* Cases opened together */
.bbp-casegroup{margin:0 0 18px;padding:14px;border:1px solid #dfe3fb;border-radius:14px;background:#f8f9ff}
.bbp-casegroup__head{margin:0 0 10px}
.bbp-grouplist{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:8px}
.bbp-grouplist a{display:grid;grid-template-columns:1fr auto;gap:4px 12px;align-items:center;padding:10px 12px;border:1px solid #e3e6f3;border-radius:10px;text-decoration:none;color:inherit}
.bbp-grouplist a:hover{border-color:#10187a}
.bbp-grouplist li.is-here a{border-color:#ffb81c;background:#fffaf0}
.bbp-grouplist .bbp-bar{grid-column:1/-1}
.bbp-grouplist__meta{font-size:.9em;color:#555a78}

/* Services and stages editor */
.bbp-svcedit>summary{cursor:pointer;font-size:1.05em;padding:2px 0}
.bbp-svcedit[open]>summary{margin-bottom:12px}
.bbp-grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.bbp-stagetable{width:100%;table-layout:fixed}
.bbp-stagetable th:nth-child(1),.bbp-stagetable td:nth-child(1){width:84px}
.bbp-stagetable td:nth-child(1) input{padding-left:8px!important;padding-right:4px!important;text-align:center}
.bbp-stagetable th:nth-child(2){width:30%}
.bbp-stagetable th:nth-child(3){width:22%}
.bbp-stagetable th:nth-child(4),.bbp-stagetable td:nth-child(4){width:74px;text-align:center}
.bbp-stagetable th:nth-child(6),.bbp-stagetable td:nth-child(6){width:70px;text-align:center}
.bbp-stagetable input[type=text],.bbp-stagetable input[type=number],.bbp-stagetable textarea{width:100%;box-sizing:border-box}
.bbp-stagetable td{vertical-align:top}
.bbp-stagetable__new td{background:#fffaf0}
@media (max-width:760px){
  .bbp-grid2{grid-template-columns:1fr}
  .bbp-stagetable,.bbp-stagetable tbody,.bbp-stagetable tr,.bbp-stagetable td{display:block;width:auto!important}
  .bbp-stagetable thead{display:none}
  .bbp-stagetable tr{border:1px solid #e3e6f3;border-radius:10px;padding:8px;margin:0 0 10px}
  .bbp-stagetable td{border:0;padding:4px 0;text-align:left!important}
  .bbp-stagetable td:nth-child(1) input{width:70px}
  .bbp-stagetable td:nth-child(3)::before{content:"Waiting on";display:block;font-size:.85em;color:#555a78}
  .bbp-stagetable td:nth-child(4)::before{content:"Client reviews ";font-size:.85em;color:#555a78}
  .bbp-stagetable td:nth-child(5)::before{content:"Team checklist";display:block;font-size:.85em;color:#555a78}
  .bbp-stagetable td:nth-child(6)::before{content:"Remove ";font-size:.85em;color:#555a78}
}

/* Invoice opened from the email (no log in) */
.bbp.bbp-public{min-height:100vh;background:#f3f4fa;padding:0 16px 40px}
.bbp-public>.bbp-flash{max-width:1100px;margin:16px auto 0}
.bbp-pubinv{max-width:1100px;margin:0 auto}
.bbp-pubbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 0}
.bbp-pubbar__logo{width:190px;height:auto;display:block}
.bbp-pubportal{margin-top:18px}
@media print{.bbp.bbp-public{background:#fff;padding:0}}
.bbp-paidbox{border-left:4px solid #1d7a3a;margin-bottom:18px}
