/* Performance & goals (module 34): progress bars, assessment forms, the goal tree, the appreciation wall, inline forms. */
.pf-bar { display: inline-block; width: 70px; height: 7px; border-radius: 6px; background: #e6edf5; vertical-align: middle; overflow: hidden; }
.pf-bar i { display: block; height: 100%; border-radius: 6px; background: #13b985; }
.pf-bar.warn i { background: #f5a524; }
.pf-bar.bad i { background: #ef5927; }
.pf-cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 16px; }
.pf-cols > div { min-width: 0; }
.pf-scale { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.pf-scale li { display: flex; gap: 10px; align-items: flex-start; min-width: 0; }
.pf-scale li > b { width: 26px; height: 26px; border-radius: 50%; background: #eaf4ff; display: grid; place-items: center; flex: none; }
.pf-scale li span { display: flex; flex-direction: column; min-width: 0; }
.pf-scale small { color: #6b7a8c; overflow-wrap: anywhere; }
.pf-list { margin: 0; padding-left: 18px; display: grid; gap: 6px; }
.pf-list li { overflow-wrap: anywhere; }
.pf-sec td { background: #f6f8fb; font-weight: 700; font-size: 12px; text-transform: uppercase; letter-spacing: .03em; color: #4b5b6e; }
.pf-qa { border-top: 1px solid #e3e9f1; padding: 10px 0 0; margin-top: 10px; }
.pf-qa p { margin: 4px 0 0; overflow-wrap: anywhere; line-height: 1.5; }
.pf-items { display: grid; gap: 10px; margin-bottom: 8px; }
.pf-item { border: 1px solid #e3e9f1; border-radius: 10px; padding: 10px 12px; margin: 0; min-width: 0; }
.pf-item legend { padding: 0 4px; }
.pf-self { margin: 2px 0 6px; color: #4b5b6e; font-style: italic; overflow-wrap: anywhere; }
.pf-rate { display: flex; gap: 6px; flex-wrap: wrap; margin: 6px 0; }
.pf-rate label { display: inline-flex; align-items: center; gap: 4px; border: 1px solid #d9e2ec; border-radius: 8px; padding: 4px 10px; cursor: pointer; }
.pf-rate label:has(input:checked) { border-color: #2083ee; background: #eaf4ff; }
.pf-lab { display: block; font-size: 12px; color: #4b5b6e; margin: 4px 0 2px; }
.pf-buttons { display: flex; gap: 10px; flex-wrap: wrap; }
.pf-inline { display: flex; gap: 6px; align-items: flex-end; flex-wrap: wrap; }
.pf-inline .pf-lab { margin: 0; }
.pf-inline .ct-input { min-width: 0; max-width: 220px; }
.pf-chain { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.pf-chain li { padding: 6px 10px; border-left: 3px solid #d9e2ec; overflow-wrap: anywhere; }
.pf-chain li.on { border-left-color: #2083ee; background: #f3f8fe; }
.pf-lvl { display: inline-block; font-size: 11px; font-weight: 700; text-transform: uppercase; color: #0c8ec6; margin-right: 4px; }
.pf-tree { list-style: none; margin: 4px 0 0; padding-left: 16px; border-left: 1px dashed #c9d5e2; display: grid; gap: 6px; }
.pf-tree li { overflow-wrap: anywhere; }
.pf-filter { flex-wrap: wrap; }
.pf-wall { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; }
.pf-card { border: 1px solid #e3e9f1; border-radius: 12px; padding: 14px; background: #fff; display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.pf-card header { display: flex; gap: 10px; align-items: center; min-width: 0; }
.pf-card header > div { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.pf-card header small { color: #111111; overflow-wrap: anywhere; }
.pf-card p { margin: 0; line-height: 1.5; overflow-wrap: anywhere; }
.pf-card footer { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin-top: auto; }
.pf-av { width: 36px; height: 36px; border-radius: 50%; background: #1d4f8f; color: #fff; display: grid; place-items: center; font-weight: 700; flex: none; }
.pf-award { font-size: 12px; font-weight: 700; color: #e08a00; white-space: nowrap; }
@media (max-width: 560px) { .pf-inline .ct-input { max-width: 100%; } .pf-wall { grid-template-columns: 1fr; } }


/* Pinnacle Premier Bank: black navigation with restrained gold selection accents. */
.ct-top,header.top,.ct-modbar,.topnav,.ct-navtitle,.navtitle,.navbar.bg-primary,.nav-menu.bg-primary,.sidebar.bg-primary{background:#000!important;background-image:none!important;border-color:#252525!important;color:#fff!important}
.ct-top-title,.ct-top-title b,.ct-session,.ct-modbar a,.topnav a,.topnav button,.ct-navtitle span,.navtitle span{color:#fff!important}
.ct-modbar a:hover,.ct-modbar a.on,.topnav a:hover,.topnav a.on,.topnav button:hover,.topnav button.on{background:#242424!important;color:#fff!important}
.ct-sidebar,.shell>.sidebar{background:#f2f2f2!important;border-color:#d3d3d3!important}
.ct-navitem,.navitem{color:#171717!important;background:linear-gradient(#fff,#f3f3f3)!important;border-color:#d0d0d0!important}
.ct-navitem i,.navitem svg{color:#171717!important}
.ct-navitem:hover,.ct-navitem.on,.navitem:hover,.navitem.on,.nav-link.active,.sidebar .nav-link.active{color:#fff!important;background:#111!important;box-shadow:inset 3px 0 0 #c8a34a!important}
.ct-navitem:hover i,.ct-navitem.on i,.navitem:hover svg,.navitem.on svg{color:#e3c375!important}
.ct-navtitle span,.navtitle span{background:#292929!important}
.ct-topbtn,.ct-command,.ct-command input,.ct-top .ct-avatar{background:#171717!important;border-color:#454545!important;color:#fff!important}
.ct-menu .drop a:hover,.ct-menu .drop button:hover{background:#111!important;color:#fff!important}