.value-with-icon{display:inline-flex;align-items:center;gap:6px}.size-bold{font-weight:700}.color-boxes{display:flex;flex-wrap:wrap;gap:8px;margin:0;justify-content:flex-end}.color-box{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:0!important;border:1px solid #e0e0e0;position:relative;font-size:0;transition:all .2s ease}.color-box:hover{transform:scale(1.1);border-color:#ccc}.color-box:hover::after{content:attr(data-color);position:absolute;bottom:-45px;left:50%;transform:translateX(-50%);background:#333;color:white;padding:8px 12px;border-radius:0!important;font-size:12px;white-space:nowrap;z-index:1000;border:1px solid #555;box-shadow:0 3px 8px rgba(0,0,0,.3);min-width:80px;text-align:center}.color-box:hover::before{content:"";position:absolute;bottom:-18px;left:50%;transform:translateX(-50%);width:0;height:0;border-left:8px solid transparent;border-right:8px solid transparent;border-bottom:8px solid #333;border-top:none;z-index:1001}.color-box[data-color*=black]{background-color:#6b7280}.color-box[data-color*=blue]{background-color:#93c5fd}.color-box[data-color*=white]{background-color:#f9fafb}.color-box[data-color*=yellow]{background-color:#fde68a}.color-box[data-color*=beige]{background-color:#f5f5dc}.color-box[data-color*=coffee]{background-color:#a78b71}.color-box[data-color*=green]{background-color:#a7f3d0}.color-box[data-color*=rose]{background-color:#fbcfe8}.color-box[data-color*=red]{background-color:#fca5a5}.color-box[data-color*=pink]{background-color:#fbcfe8}.color-box[data-color*=purple]{background-color:#d8b4fe}.color-box[data-color*=orange]{background-color:#fdba74}.color-box[data-color*=brown]{background-color:#d6bca6}.color-box[data-color*=gray]{background-color:#d1d5db}.color-box[data-color*=grey]{background-color:#d1d5db}.color-box[data-color*=navy]{background-color:#7c93c1}.color-box[data-color*=teal]{background-color:#99f6e4}.color-box[data-color*=cream]{background-color:#fef3c7}.color-box[data-color*=gold]{background-color:#fcd34d}.color-box[data-color*=silver]{background-color:#e5e7eb}@media (max-width:768px){.color-boxes{gap:6px;justify-content:flex-start}}