/* Public front-end wrapper; the SafeOrder admin stylesheet is reused for a close UI match. */
.bos-public-demo{margin:24px auto!important;padding:0 16px 28px!important;max-width:1380px!important;box-sizing:border-box!important;color:#171827!important;font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;line-height:1.5!important}
.bos-public-demo *{box-sizing:border-box}
.bos-public-demo button,.bos-public-demo input,.bos-public-demo select,.bos-public-demo textarea{font:inherit}
.bos-public-demo .bos-demo-ribbon{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin:0 0 13px;padding:10px 14px;border:1px solid #d8d5ff;border-radius:10px;background:#f1f0ff;color:#5144ca;font-size:11px;font-weight:900;letter-spacing:.07em}
.bos-public-demo .bos-demo-dot{width:8px;height:8px;display:inline-block;border-radius:50%;background:#6d5dfc;box-shadow:0 0 0 4px rgba(109,93,252,.12)}
.bos-public-demo .bos-demo-sep{opacity:.45}
.bos-public-demo .bos-demo-version{background:rgba(255,255,255,.15);color:#fff;border-color:rgba(255,255,255,.22)}
.bos-public-demo .bos-section-layout{grid-template-columns:245px minmax(0,1fr);overflow:hidden}
.bos-public-demo .bos-section-tabs{align-content:start;grid-auto-rows:max-content}
.bos-public-demo .bos-section-tab{width:100%;border:0;background:transparent;text-align:left;cursor:pointer;font-family:inherit;line-height:1.25}
.bos-public-demo .bos-section-tab:focus{outline:2px solid #9187ff;outline-offset:2px}
.bos-public-demo .bos-section-content{min-width:0}
.bos-public-demo .bos-demo-readonly-note{display:flex;align-items:center;gap:9px;background:#f5f6ff;border:1px solid #e0e2ff;border-radius:10px;padding:11px 13px;color:#5652a3;font-size:12px;font-weight:700}
.bos-public-demo .bos-demo-readonly-note .dashicons{color:#6d5dfc}
.bos-public-demo .bos-demo-panel{display:none;min-width:0}
.bos-public-demo .bos-demo-panel.is-active{display:grid;gap:18px}
.bos-public-demo .bos-stat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px}
.bos-public-demo .bos-stat{min-width:0}
.bos-public-demo .bos-card-head{gap:14px;flex-wrap:wrap}
.bos-public-demo .bos-card-head .bos-switch-row{margin-left:auto}
.bos-public-demo .bos-table-scroll{max-width:100%;overflow-x:auto}
.bos-public-demo .bos-table{min-width:720px;border-collapse:collapse;background:#fff}
.bos-public-demo .bos-table th{white-space:nowrap}
.bos-public-demo .bos-filters{grid-template-columns:minmax(140px,1fr) 150px 150px auto}
.bos-public-demo .bos-filters input,.bos-public-demo .bos-filters select,.bos-public-demo .bos-field input,.bos-public-demo .bos-field select,.bos-public-demo .bos-field textarea{background:#f8fafc;color:#344054;opacity:1}
.bos-public-demo input:disabled,.bos-public-demo select:disabled,.bos-public-demo textarea:disabled{cursor:not-allowed;opacity:1}
.bos-public-demo .button,.bos-public-demo button.button{display:inline-flex;align-items:center;justify-content:center;min-height:34px;padding:6px 12px;border:1px solid #cbd5e1;border-radius:7px;background:#fff;color:#344054;font-size:12px;font-weight:800;line-height:1.3;box-shadow:none;cursor:not-allowed}
.bos-public-demo .button:disabled{opacity:.72}
.bos-public-demo .bos-primary{background:#6657ee!important;border-color:#6657ee!important;color:#fff!important}
.bos-public-demo .bos-chart-tabs{display:flex;gap:5px;flex-wrap:wrap}
.bos-public-demo .bos-chart-tabs .button.is-active{background:#6556ef;color:#fff;border-color:#6556ef}
.bos-public-demo .bos-chart{min-height:170px}
.bos-public-demo .bos-chart svg{max-width:100%;height:auto}
.bos-public-demo .bos-settings-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 18px}
.bos-public-demo .bos-check-field{display:flex;align-items:flex-start;gap:10px;padding:12px;border:1px solid #e7e7f0;border-radius:10px;background:#fff;min-width:0}
.bos-public-demo .bos-check-field input{margin-top:3px;accent-color:#6d5dfc}
.bos-public-demo .bos-check-field span{display:grid;gap:4px;min-width:0}
.bos-public-demo .bos-check-field strong{font-size:13px;color:#25263a}
.bos-public-demo .bos-check-field small{font-size:11px;color:#7a7d8c;line-height:1.4}
.bos-public-demo .bos-demo-panel .bos-section-title{margin:4px 0 0;color:#25263a}
.bos-public-demo .bos-code{white-space:pre-wrap;overflow-wrap:anywhere;background:#171827;color:#e8e7ff;border-radius:9px;padding:15px;font-size:12px}
.bos-public-demo .bos-details summary{cursor:pointer;font-weight:800;color:#45415f}
.bos-public-demo .bos-field-wide{grid-column:1/-1}
.bos-public-demo .bos-demo-footer{text-align:center;color:#85879a;padding:18px 0 0;font-size:12px}
.bos-public-demo .bos-demo-footer strong{color:#5145cb}
.bos-public-demo .bos-demo-footer span{padding:0 5px}
@media(max-width:1100px){.bos-public-demo .bos-section-layout{grid-template-columns:1fr}.bos-public-demo .bos-section-tabs{grid-template-columns:repeat(3,minmax(0,1fr));border-right:0;border-bottom:1px solid #e7e7f0}.bos-public-demo .bos-stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.bos-public-demo .bos-filters{grid-template-columns:1fr}.bos-public-demo .bos-grid-two,.bos-public-demo .bos-grid-blocks{grid-template-columns:1fr}}
@media(max-width:600px){.bos-public-demo{padding:0 8px 20px!important;margin:12px auto!important}.bos-public-demo .bos-page-header{padding:20px 16px;align-items:flex-start;gap:15px}.bos-public-demo .bos-page-title{align-items:flex-start;gap:12px}.bos-public-demo .bos-page-header h1{font-size:22px}.bos-public-demo .bos-page-header p{font-size:12px}.bos-public-demo .bos-brand-mark{width:44px;height:44px;min-width:44px}.bos-public-demo .bos-header-badges{justify-content:flex-start}.bos-public-demo .bos-section-tabs{grid-template-columns:repeat(2,minmax(0,1fr));padding:10px;gap:5px}.bos-public-demo .bos-section-tab{font-size:11px;padding:11px 9px;gap:7px}.bos-public-demo .bos-section-tab .dashicons{font-size:15px;width:15px;height:15px}.bos-public-demo .bos-section-content{padding:12px}.bos-public-demo .bos-stat-grid{gap:8px}.bos-public-demo .bos-stat{padding:12px}.bos-public-demo .bos-stat-value{font-size:25px}.bos-public-demo .bos-settings-grid{grid-template-columns:1fr}.bos-public-demo .bos-card-head{padding:13px 14px}.bos-public-demo .bos-card-body{padding:14px}.bos-public-demo .bos-demo-ribbon{font-size:9px;gap:6px}.bos-public-demo .bos-chart-tabs .button{padding:5px 8px;font-size:10px}}
