/* [smartcat_build_price]: uses the form styles of pricelist.css (.scbs-pl__*) plus the builder layout below. */
.scbs-bp { --navy: #0e2a47; --blue: #0b6fb8; --line: #d5dee8; --soft: #eef5fb; --muted: #5b6472; margin: 20px 0 40px; color: var(--navy); font-family: inherit; container-type: inline-size; }
.scbs-bp *, .scbs-bp *::before, .scbs-bp *::after { box-sizing: border-box; }
.scbs-bp .scbs-pl__panel { margin: 0 auto; }
.scbs-bp__h { margin: 0 0 10px; font-size: 26px; color: var(--navy); }
.scbs-bp__hello { margin: 0 0 6px; font-size: 16px; }
.scbs-bp__layout { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 24px; align-items: start; }
.scbs-bp__step { margin: 22px 0 10px; font-size: 14px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--blue); }
.scbs-bp__choices { display: flex; flex-wrap: wrap; gap: 10px; }
.scbs-bp__choices button { flex: 1 1 160px; padding: 12px 14px; border: 2px solid var(--line); border-radius: 8px; background: #fff; color: var(--navy); font: inherit; text-align: left; cursor: pointer; }
.scbs-bp__choices button b { display: block; font-size: 17px; }
.scbs-bp__choices button span { font-size: 13px; color: var(--muted); }
.scbs-bp__choices button[aria-pressed="true"] { border-color: var(--blue); background: var(--soft); }
.scbs-bp__std { margin: 14px 0 0; padding: 10px 14px; border: 1px solid var(--line); border-radius: 8px; background: #fff; }
.scbs-bp__std summary { cursor: pointer; font-size: 15px; font-weight: 600; line-height: 1.4; }
.scbs-bp__std ul { margin: 10px 0 0; padding: 0; list-style: none; columns: 2; column-gap: 20px; font-size: 13.5px; }
.scbs-bp__std li { padding: 3px 0; break-inside: avoid; }
.scbs-bp__std li b { color: var(--blue); margin-right: 4px; }
.scbs-bp__grp { margin: 0 0 10px; border: 1px solid var(--line); border-radius: 8px; background: #fff; overflow: hidden; }
.scbs-bp__grp h4 { margin: 0; padding: 8px 14px; background: var(--soft); font-size: 13px; letter-spacing: .1em; text-transform: uppercase; color: var(--navy); }
.scbs-bp__opt { display: grid; grid-template-columns: 28px 40px minmax(0, 1fr) auto; gap: 8px; align-items: start; margin: 0; padding: 10px 14px; border-top: 1px solid #e6ecf2; cursor: pointer; font-size: 15px; font-weight: 400; line-height: 1.4; }
.scbs-bp__opt input[type=checkbox] { width: 22px; height: 22px; margin: 0; accent-color: var(--blue); }
.scbs-bp__opt select { font: inherit; padding: 2px 4px; }
.scbs-bp__opt small { display: block; color: var(--muted); font-size: 12.5px; }
.scbs-bp__code { font-weight: 700; color: var(--blue); }
.scbs-bp__price { font-weight: 700; white-space: nowrap; }
.scbs-bp__opt.is-on { background: #f3f9fe; }
.scbs-bp__opt.is-off { cursor: not-allowed; color: #98a4b3; background: #fafbfc; }
.scbs-bp__opt.is-off .scbs-bp__code, .scbs-bp__opt.is-off .scbs-bp__price { color: #98a4b3; }
.scbs-bp__sum { position: sticky; top: 90px; padding: 18px; border: 1px solid var(--line); border-radius: 10px; background: #fff; }
.scbs-bp__sum h3 { margin: 0 0 10px; font-size: 18px; color: var(--navy); }
.scbs-bp__row { display: flex; justify-content: space-between; gap: 10px; padding: 5px 0; font-size: 15px; }
.scbs-bp__total { margin-top: 6px; padding-top: 10px; border-top: 2px solid var(--navy); font-size: 21px; font-weight: 800; }
.scbs-bp__fine { margin: 10px 0; font-size: 12.5px; line-height: 1.5; color: var(--muted); }
.scbs-bp__field { display: flex; flex-direction: column; gap: 5px; margin: 10px 0 0; font-size: 14px; font-weight: 600; }
.scbs-bp__field input, .scbs-bp__field textarea { width: 100%; padding: 9px 11px; border: 1px solid #b8c4d2; border-radius: 6px; font: inherit; font-size: 15px; font-weight: 400; color: var(--navy); background: #fff; }
.scbs-bp__done h3 { color: #0a7a3d; }
.scbs-bp__done p { font-size: 15px; line-height: 1.5; }
.scbs-bp__bar { display: none; }
/* Two columns only when the page gives the builder room (themes differ in content width). In one column the
   summary sits below the options, so a bar at the bottom of the screen keeps the price in view. */
@container (max-width: 820px) {
  .scbs-bp__layout { grid-template-columns: 1fr; } .scbs-bp__sum { position: static; scroll-margin-top: 90px; }
  .scbs-bp__bar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 9990; display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 12px 16px; background: var(--navy); color: #fff; font-size: 16px; box-shadow: 0 -2px 10px rgba(0,0,0,.2); }
  .scbs-bp__bar b { margin-left: 6px; font-size: 19px; }
  .scbs-bp__bar a { padding: 9px 14px; border-radius: 6px; background: var(--blue); color: #fff !important; font-weight: 700; text-decoration: none !important; white-space: nowrap; }
  .scbs-bp__app { padding-bottom: 70px; }
}
@media (max-width: 960px) { .scbs-bp__layout { grid-template-columns: 1fr; } .scbs-bp__sum { position: static; } }
@media (max-width: 560px) { .scbs-bp__std ul { columns: 1; } .scbs-bp__opt { grid-template-columns: 26px 34px minmax(0, 1fr); } .scbs-bp__price { grid-column: 3; } }