.image-source-selector{padding:1rem}.image-source-selector .options-grid{grid-template-columns:repeat(3,1fr);gap:1.5rem;margin-top:1rem;display:grid}@media screen and (max-width:768px){.image-source-selector .options-grid{grid-template-columns:1fr}}.image-source-selector .option-card{cursor:pointer;background:#fff;border:2px solid #e0e0e0;border-radius:8px;flex-direction:column;align-items:center;padding:2rem 1rem;transition:all .3s;display:flex}.image-source-selector .option-card:hover{border-color:#7f0353;transform:translateY(-2px);box-shadow:0 4px 12px #7f03531a}.image-source-selector .option-card .option-icon{color:#7f0353;width:48px;height:48px;margin-bottom:1rem}.image-source-selector .option-card .option-icon svg{width:100%;height:100%}.image-source-selector .option-card .option-title{color:#333;margin-bottom:.5rem;font-size:1.125rem;font-weight:600}.image-source-selector .option-card .option-description{color:#666;text-align:center;font-size:.875rem}
.swatch-picker{max-height:70vh;padding:1rem;overflow-y:auto}.swatch-picker .swatches-grid{grid-template-columns:repeat(3,1fr);gap:1rem;margin-bottom:1.5rem;display:grid}@media screen and (max-width:768px){.swatch-picker .swatches-grid{grid-template-columns:repeat(2,1fr)}}.swatch-picker .swatch-item{cursor:pointer;border:3px solid #0000;border-radius:8px;flex-direction:column;align-items:center;padding:.5rem;transition:all .2s;display:flex}.swatch-picker .swatch-item:hover{border-color:#e0e0e0}.swatch-picker .swatch-item.selected{background-color:#f9f9f9;border-color:#7f0353}.swatch-picker .swatch-item .swatch-preview{aspect-ratio:1;border-radius:4px;width:100%;margin-bottom:.5rem;box-shadow:0 2px 4px #0000001a}.swatch-picker .swatch-item .swatch-name{text-align:center;color:#333;font-size:.875rem}.swatch-picker .swatch-picker-actions{border-top:1px solid #e0e0e0;justify-content:flex-end;gap:.5rem;padding-top:1rem;display:flex}
.color-picker{max-height:70vh;padding:1rem;overflow-y:auto}.color-picker .colors-grid{grid-template-columns:repeat(4,1fr);gap:.75rem;margin-bottom:1.5rem;display:grid}@media screen and (max-width:768px){.color-picker .colors-grid{grid-template-columns:repeat(3,1fr)}}.color-picker .color-item{cursor:pointer;border:2px solid #0000;border-radius:8px;flex-direction:column;align-items:center;padding:.5rem;transition:all .2s;display:flex}.color-picker .color-item:hover{border-color:#e0e0e0}.color-picker .color-item.selected{background-color:#f9f9f9;border-color:#7f0353}.color-picker .color-item .color-preview{border:1px solid #ddd;border-radius:50%;width:60px;height:60px;margin-bottom:.5rem;box-shadow:0 2px 4px #0000001a}.color-picker .color-item .color-name{text-align:center;color:#333;font-size:.75rem}.color-picker .custom-color-section{background-color:#f9f9f9;border-radius:8px;margin-bottom:1.5rem;padding:1rem}.color-picker .custom-color-section label{color:#333;margin-bottom:.5rem;font-weight:500;display:block}.color-picker .custom-color-section .custom-color-input{align-items:center;gap:.5rem;display:flex}.color-picker .custom-color-section .custom-color-input input[type=color]{cursor:pointer;border:1px solid #ddd;border-radius:4px;width:60px;height:40px}.color-picker .custom-color-section .custom-color-input input[type=text]{border:1px solid #ddd;border-radius:4px;flex:1;padding:.5rem;font-family:monospace}.color-picker .color-picker-actions{border-top:1px solid #e0e0e0;justify-content:flex-end;gap:.5rem;padding-top:1rem;display:flex}
