/* KB Business Portal 21.6.201 — suite-aligned, customer-first UX layer.
 * LAST stylesheet in both standalone and shortcode rendering.
 * Deliberately scoped: no WordPress admin, login screen or customer portal impacts.
 * Profession-specific design tokens still win inside declared profession modules. */
.kbbp-app {
  --kbbp-ux-navy: #0f1824;
  --kbbp-ux-panel: #172434;
  --kbbp-ux-navy-border: #344257;
  --kbbp-ux-gold: #d9b86e;
  --kbbp-ux-gold-hover: #e9c882;
  --kbbp-ux-bg: #f5f7fa;
  --kbbp-ux-surface: #fff;
  --kbbp-ux-text: #192b40;
  --kbbp-ux-secondary: #506178;
  --kbbp-ux-border: #dce3ed;
  --kbbp-ux-focus: #a46d1d;
  --kbbp-ux-radius: 16px;
  --kbbp-ux-shadow: 0 5px 21px rgba(15,24,36,.045);
  font-size: 16px;
  line-height: 1.55;
  color: var(--kbbp-ux-text);
}
.kbbp-app, .kbbp-app * { box-sizing: border-box; }
.kbbp-app .kbbp-main { background: var(--kbbp-ux-bg); min-width: 0; padding-bottom: 66px; }
.kbbp-app .kbbp-main :is(p,li,dt,dd) { line-height: 1.6; }
.kbbp-app .kbbp-section-head { gap: 16px; margin-bottom: 19px; }
.kbbp-app .kbbp-section-head h2 { font-size: clamp(24px,2.1vw,32px); line-height: 1.22; color:var(--kbbp-ux-text); letter-spacing: -.025em; }
.kbbp-app .kbbp-section-head p { font-size: 15px; color:var(--kbbp-ux-secondary); max-width: 75ch; }
.kbbp-app .kbbp-eyebrow { color: #866123; letter-spacing: .075em; font-size: 12px; }
/* Dark navigation, consistent with KB Admin Center and KB Recette Center. */
.kbbp-app .kbbp-sidebar {
  background: linear-gradient(180deg,var(--kbbp-ux-navy) 0%,#17283b 100%);
  color:#f3f5fa;
  border-right:1px solid var(--kbbp-ux-navy-border);
  box-shadow:none;
}
.kbbp-app .kbbp-brand strong { color:#fff; font-size:18px; }
.kbbp-app .kbbp-brand small,.kbbp-app .kbbp-company small { color:#b8c8d9; font-size:13px; }
.kbbp-app .kbbp-logo { background:var(--kbbp-ux-gold);color:var(--kbbp-ux-navy);box-shadow:none;border-radius:13px; }
.kbbp-app .kbbp-company { background:rgba(255,255,255,.045);border:1px solid var(--kbbp-ux-navy-border); }
.kbbp-app .kbbp-company strong { color:#fff;font-size:15px; }
.kbbp-app .kbbp-boost-sidebar { background:rgba(217,184,110,.09);border-color:rgba(217,184,110,.5);box-shadow:none;padding:13px 14px; }
.kbbp-app .kbbp-boost-sidebar strong,.kbbp-app .kbbp-boost-sidebar-action { color:#ffe2a4; }
.kbbp-app .kbbp-boost-sidebar:hover { background:rgba(217,184,110,.16);transform:none; }
.kbbp-app .kbbp-nav-section-heading { color:#d1d9e4;border-color:var(--kbbp-ux-navy-border);font-size:13px;min-height:43px; }
.kbbp-app .kbbp-nav-section[open] > .kbbp-nav-section-heading,.kbbp-app .kbbp-nav-section:has(a.active)>.kbbp-nav-section-heading { color:var(--kbbp-ux-gold); }
.kbbp-app .kbbp-nav a { color:#d8e2ec;min-height:47px;font-size:15px;border-radius:11px;line-height:1.4; }
.kbbp-app .kbbp-nav a:hover,.kbbp-app .kbbp-development-toggle:hover { background:rgba(217,184,110,.12);color:#fff; }
.kbbp-app .kbbp-nav a.active,.kbbp-app .kbbp-nav a.active:hover { background:rgba(217,184,110,.17);border:1px solid rgba(217,184,110,.65);color:#ffe0a0;box-shadow:inset 3px 0 var(--kbbp-ux-gold); }
.kbbp-app .kbbp-nav a.active svg { color:var(--kbbp-ux-gold); }
.kbbp-app .kbbp-desktop-shortcut-link { min-height:42px;font-size:14px; }
.kbbp-app .kbbp-desktop-shortcut-link.is-active { border-color:var(--kbbp-ux-gold); }
.kbbp-app .kbbp-development-toggle { font-size:15px; }
.kbbp-app .kbbp-development-link { font-size:14px;min-height:43px; }
.kbbp-app .kbbp-user strong { color:#f3f5fa; }
/* Clear task-oriented content: warm navy accents, readable white surfaces. */
.kbbp-app:not([data-kbbp-profession-theme="1"]) .kbbp-card,
.kbbp-app:not([data-kbbp-profession-theme="1"]) .kbbp-mini-stats>div,
.kbbp-app:not([data-kbbp-profession-theme="1"]) .kbbp-focus-card {
  background:var(--kbbp-ux-surface);
  border-color:var(--kbbp-ux-border);
  border-radius:var(--kbbp-ux-radius);
  box-shadow:var(--kbbp-ux-shadow);
}
.kbbp-app .kbbp-card-head { gap:12px;align-items:flex-start; }
.kbbp-app .kbbp-card-head h3 { color:var(--kbbp-ux-text);font-size:clamp(18px,1.5vw,22px);line-height:1.3; }
.kbbp-app .kbbp-card-head small { font-size:12px;letter-spacing:.045em; }
.kbbp-app .kbbp-muted,.kbbp-app .kbbp-card-head p { color:var(--kbbp-ux-secondary); }
.kbbp-app .kbbp-focus-card small,.kbbp-app .kbbp-mini-stats small { font-size:13px;color:var(--kbbp-ux-secondary); }
.kbbp-app .kbbp-focus-card > span { font-size:14px;line-height:1.45; }
.kbbp-app .kbbp-mini-stats strong { font-size:clamp(23px,2vw,30px); }
.kbbp-app .kbbp-row small,.kbbp-app .kbbp-user small { font-size:13px; }
.kbbp-app .kbbp-hero,.kbbp-app .kbbp-hero-v7 { background:linear-gradient(112deg,#0f1824 0%,#1b3146 85%);border-color:var(--kbbp-ux-navy-border);box-shadow:none; }
.kbbp-app .kbbp-hero :is(h2,h3,strong),.kbbp-app .kbbp-hero-v7 :is(h2,h3,strong) { color:#fff; }
.kbbp-app .kbbp-hero :is(p,small),.kbbp-app .kbbp-hero-v7 :is(p,small) { color:#d6e2f0; }
.kbbp-app .kbbp-topbar { border-color:var(--kbbp-ux-border); }
.kbbp-app .kbbp-topbar h1 { color:var(--kbbp-ux-text); }
.kbbp-app .kbbp-topbar:not(.kbbp-topbar-compact) { background:transparent; }
/* Primary intent is unmistakable; secondary operations stay visually subordinate. */
.kbbp-app .kbbp-btn { min-height:44px;border-radius:11px;font-size:15px;line-height:1.35;font-weight:700;transition:background .15s ease,border-color .15s ease; }
.kbbp-app .kbbp-btn.primary { background:var(--kbbp-ux-gold);border-color:#b99348;color:#151e2a!important;box-shadow:none; }
.kbbp-app .kbbp-btn.primary:hover { background:var(--kbbp-ux-gold-hover);border-color:#a78032;color:#151e2a!important; }
.kbbp-app .kbbp-btn:not(.primary) { border-color:#c8d3e0;color:#233c55; }
.kbbp-app .kbbp-btn:not(.primary):hover { background:#edf1f6;border-color:#849ab4; }
/* Forms: large targets, clear labels, explicit focus. */
.kbbp-app :is(.kbbp-field,label) { line-height:1.5; }
.kbbp-app :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),select,textarea) { min-height:43px;border-radius:9px;font-size:15px; }
.kbbp-app textarea { min-height:100px; }
.kbbp-app input::placeholder { color:#65768a;opacity:1; }
.kbbp-app :is(button,a,summary,input,select,textarea):focus-visible { outline:3px solid var(--kbbp-ux-focus)!important;outline-offset:3px!important; }
.kbbp-app :is(input[type="checkbox"],input[type="radio"]) { min-width:18px;min-height:18px;accent-color:#a37a31; }
/* Table and dossier navigation readability. */
.kbbp-app table { font-size:14px;line-height:1.5; }
.kbbp-app table :is(th,td) { padding-top:12px;padding-bottom:12px;vertical-align:middle; }
.kbbp-app table th { font-size:13px;letter-spacing:.02em; }
.kbbp-app .kbbp-dossier-tablist :is(a,button,[role="tab"]) { min-height:44px;font-size:14px; }
.kbbp-app .kbbp-empty { color:var(--kbbp-ux-secondary);font-size:15px;line-height:1.6; }
.kbbp-app .kbbp-alert { line-height:1.6; }
.kbbp-app .kbbp-dossier-timeline-card { border-color:var(--kbbp-ux-border); }
/* Navigation shortcut appears only when keyboard-focused, always on top of app. */
.kbbp-skip-link { position:fixed;z-index:100001;top:10px;left:12px;padding:11px 18px;border-radius:10px;color:#0f1824!important;background:#ffe2a0!important;font:700 15px/1.3 system-ui,sans-serif;transform:translateY(-180%);text-decoration:none;box-shadow:0 3px 15px #0004; }
.kbbp-skip-link:focus,.kbbp-skip-link:focus-visible { transform:translateY(0);outline:3px solid #0f1824;outline-offset:2px; }
/* Profession-specific cards are not recolored: the profession owns its UI. */
.kbbp-app[data-kbbp-profession-theme="1"] .kbbp-main { background:var(--kbbp-trade-bg,var(--kbbp-ux-bg)); }
@media (max-width:1100px) {
 .kbbp-app .kbbp-main { padding-inline:22px; }
 .kbbp-app .kbbp-nav a { font-size:14px; }
}
@media (max-width:980px) {
 .kbbp-app .kbbp-sidebar { padding:12px 16px!important; }
 .kbbp-app .kbbp-nav { gap:7px; }
 .kbbp-app .kbbp-nav a { min-height:44px;font-size:14px;padding:10px 13px;white-space:nowrap; }
 .kbbp-app .kbbp-main { padding:20px 18px 100px!important; }
 .kbbp-app .kbbp-mobile-dock { background:rgba(15,24,36,.97);border-color:#45536a; }
 .kbbp-app .kbbp-mobile-dock .kbbp-dock-link.is-active { background:rgba(217,184,110,.21);color:#ffe3ad;box-shadow:inset 0 0 0 1px #b99960; }
 .kbbp-app .kbbp-dock-more-panel { background:#fff;border-color:var(--kbbp-ux-border);color:var(--kbbp-ux-text); }
 .kbbp-app .kbbp-dock-more-panel a[aria-current="page"] { background:#223951;color:#ffe1aa; }
 .kbbp-app .kbbp-dock-more-title { color:#42566e; }
 .kbbp-app .kbbp-dock-more-panel a { min-height:44px;font-size:14px; }
}
@media (max-width:650px) {
 .kbbp-app .kbbp-main { padding:17px 12px 116px!important; }
 .kbbp-app .kbbp-card { padding:18px; }
 .kbbp-app .kbbp-section-head h2 { font-size:clamp(22px,5.5vw,27px); }
 .kbbp-app .kbbp-btn { min-height:46px; }
 .kbbp-app .kbbp-section-head { flex-wrap:wrap; }
 .kbbp-app .kbbp-card-head { flex-wrap:wrap; }
 .kbbp-app .kbbp-card:has(>table) { overflow-x:auto; }
 .kbbp-app table { min-width: min(560px, 100%); }
 .kbbp-app .kbbp-focus-card { min-height:105px; }
 .kbbp-app .kbbp-mobile-dock .kbbp-dock-link { min-height:54px;font-size:11px; }
}
@media (max-width:370px) {
 .kbbp-app .kbbp-main { padding:14px 10px 116px!important; }
 .kbbp-app .kbbp-card { padding:14px; }
}
@media (prefers-reduced-motion:reduce) {
 .kbbp-app :is(.kbbp-btn,.kbbp-nav a,.kbbp-focus-card) { transition:none!important;transform:none!important; }
}