.bootstrap-color-picker{margin:.25rem 0;--color-picker-max-swatches:6;display:flex;flex-wrap:wrap;grid-gap:.5rem;gap:.5rem}.color-picker-category{flex:0 1 auto;margin-bottom:.25rem}.color-picker-container{display:flex;flex-wrap:wrap;grid-gap:.5rem;gap:.5rem;max-width:100%;margin-bottom:.25rem}.color-picker-container.scrollable-row{flex-wrap:nowrap;overflow-x:auto;padding:.25rem .3rem;scrollbar-width:thin;scrollbar-color:rgba(0,0,0,.2) transparent;-webkit-overflow-scrolling:touch;max-width:calc(var(--color-picker-max-swatches)*3.5rem + (var(--color-picker-max-swatches) - 1)*0.5rem)}.color-picker-container.scrollable-row::-webkit-scrollbar{height:6px}.color-picker-container.scrollable-row::-webkit-scrollbar-track{background:transparent}.color-picker-container.scrollable-row::-webkit-scrollbar-thumb{background-color:rgba(0,0,0,.2);border-radius:3px}.color-swatch{width:3rem;height:3rem;border-radius:.5rem;cursor:pointer;overflow:hidden;position:relative;transition:transform .2s ease,box-shadow .2s ease;touch-action:manipulation;border:1px solid rgba(0,0,0,.1);flex-shrink:0}.color-swatch.compact{width:2.25rem;height:2.25rem;border-radius:.375rem}@media (max-width:768px){.color-swatch{width:3.5rem;height:3.5rem}.color-swatch.compact{width:2.75rem;height:2.75rem}}.color-swatch:hover{transform:scale(1.05);z-index:1;box-shadow:0 0 0 2px rgba(0,0,0,.2)}.color-swatch.selected{transform:scale(1.05);box-shadow:0 0 0 3px #0d6efd}@media (pointer:coarse){.color-swatch:hover{transform:none;box-shadow:none}.color-swatch:active{transform:scale(.95)}}.swatch-inner{width:100%;height:100%;display:flex;align-items:center;justify-content:center}.swatch-inner.btn{border-radius:0;border:none;margin:0;padding:0}.swatch-inner[data-value^=outline-]{border:4px solid var(--swatch-base-color,#ccc);background-clip:padding-box}.swatch-inner[data-type=text-bg] span:not(.selected-checkmark),.swatch-inner[data-type=text] span:not(.selected-checkmark){font-size:1.8rem;font-weight:700;line-height:1;display:block;text-align:center}.compact .swatch-inner[data-type=text-bg] span:not(.selected-checkmark),.compact .swatch-inner[data-type=text] span:not(.selected-checkmark){font-size:1.3rem}.selected-checkmark{color:#fff;text-shadow:0 0 2px rgba(0,0,0,.6);font-size:1.25rem;font-weight:700}.compact .selected-checkmark{font-size:1rem}.bg-danger-lightened .selected-checkmark,.bg-danger-subtle .selected-checkmark,.bg-info-lightened .selected-checkmark,.bg-info-subtle .selected-checkmark,.bg-light-lightened .selected-checkmark,.bg-light-subtle .selected-checkmark,.bg-light .selected-checkmark,.bg-primary-lightened .selected-checkmark,.bg-primary-subtle .selected-checkmark,.bg-secondary-lightened .selected-checkmark,.bg-secondary-subtle .selected-checkmark,.bg-success-lightened .selected-checkmark,.bg-success-subtle .selected-checkmark,.bg-warning-lightened .selected-checkmark,.bg-warning-subtle .selected-checkmark,.bg-warning .selected-checkmark,.bg-white .selected-checkmark,.btn-light .selected-checkmark,.btn-outline-danger .selected-checkmark,.btn-outline-dark .selected-checkmark,.btn-outline-info .selected-checkmark,.btn-outline-light .selected-checkmark,.btn-outline-primary .selected-checkmark,.btn-outline-secondary .selected-checkmark,.btn-outline-success .selected-checkmark,.btn-outline-tertiary .selected-checkmark,.btn-outline-warning .selected-checkmark,.swatch-inner[data-type=text].bg-dark .selected-checkmark,.swatch-inner[data-type=text].bg-light .selected-checkmark{position:absolute;top:2px;right:2px;font-size:.8rem;padding:.1em .2em;line-height:1;border-radius:.2em;background-color:rgba(0,0,0,.5);color:#fff;text-shadow:none}.swatch-inner[data-type=text].bg-dark .selected-checkmark{background-color:hsla(0,0%,100%,.5);color:#000}.color-picker-section{width:100%;padding:.25rem 0;margin-top:.25rem;font-size:.75rem;font-weight:700;color:#6c757d;border-bottom:1px solid #dee2e6}.bootstrap-color-picker.compact .color-picker-section{font-size:.7rem;padding:.1rem 0;margin-top:.1rem}.bootstrap-color-picker.compact .color-picker-container{grid-gap:.3rem;gap:.3rem;margin-bottom:.1rem}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}