@import url(https://fonts.googleapis.com/css2?family=Gilda+Display&family=Quicksand:wght@300..700&display=swap);@import url(https://fonts.googleapis.com/css2?family=Libre+Franklin:ital,wght@0,100..900;1,100..900&display=swap);body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;margin:0}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}:root{--background-color:#fcfcfc}.App{align-items:center;align-self:center;background-color:#fcfcfc;background-color:var(--background-color);height:100vh;position:relative;text-align:center}.content{padding:2%;text-align:left}.App-header,.content{font-family:Libre Franklin,sans-serif}.App-header{align-items:center;align-self:center;background-color:#fcfcfc;background-color:var(--background-color);border-bottom:solid;border-bottom-width:10px;color:#141414;display:inline-flex;font-size:calc(10px + 2vmin);font-style:italic;height:7.5vh;justify-content:left}footer{background-color:#141414;bottom:0;color:#fcfcfc;color:var(--background-color);font-family:Libre Franklin,serif;position:fixed;text-align:left;width:100%}.App-link{color:#61dafb}form{border:#141414;justify-content:center;margin-left:10px;margin-right:10px;margin-top:20px}.Cascader,.submit,form{border-radius:0;font-family:Gilda Display,serif}.submit{background-color:#9c9c9c;color:#141414}.ant-select-selector{background-color:#552020;border-radius:0;color:#141414}.container{display:flex;font-size:24px;height:auto;margin:25px;width:auto}.card,.container{font-family:Gilda Display,serif}.card{background-color:#fff;margin:0 auto;outline:auto;width:250px}@keyframes colorchange{0%{background-color:#736b1e}25%{background-color:#736356}50%{background-color:#211626}75%{background-color:#080924}to{background-color:#0a0a0b}}@keyframes gallery{0%{background-image:url(https://cdn.tag-walk.com/custom,fit_cover,height_480,width_320/saint-laurent-aw20-0001-fa4d5e.jpg)}25%{background-image:url(https://cdn.tag-walk.com/custom,fit_cover,height_480,width_320/saint-laurent-aw20-0005-23e81d.jpg)}50%{background-image:url(https://cdn.tag-walk.com/custom,fit_cover,height_480,width_320/saint-laurent-aw20-0015-6d00cc.jpg)}75%{background-image:url(https://cdn.tag-walk.com/custom,fit_cover,height_480,width_320/saint-laurent-aw20-0027-ca4165.jpg)}to{background-image:url(https://cdn.tag-walk.com/custom,fit_cover,height_480,width_320/saint-laurent-aw20-0038-1cdbe9.jpg)}}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}h2{color:#333;font-family:Libre Franklin,sans-serif;font-size:24px;margin-bottom:20px;text-align:center}:root{--orange-accent:#bf7c2a;--green-accent:#736b1e;--blue-accent:#3b4b69;--red-accent:#ad1d1d}.HorizontalDiv{flex-direction:row;width:100%}.Color,.HorizontalDiv{align-content:center;display:flex;justify-content:center}.Color{align-items:center;animation-direction:alternate;animation-duration:2s;animation-iteration-count:infinite;animation-name:colorchange;animation-play-state:paused;font-family:Libre Franklin,sans-serif;height:calc(60vh - 100px);width:50%}.Color:hover{animation-play-state:running}.Image{height:calc(60vh - 100px);overflow:hidden;position:relative;width:50%}.Image:before{animation-direction:alternate;animation-duration:1s;animation-iteration-count:infinite;animation-name:gallery;animation-play-state:paused;background-position:center-top;background-repeat:no-repeat;background-size:cover;bottom:0;content:"";left:0;opacity:.8;position:absolute;right:0;top:0;z-index:1}.Image:hover:before{animation-play-state:running}.Image-overlay{align-items:center;bottom:0;display:flex;justify-content:center;left:0;position:absolute;right:0;top:0;z-index:2}.text{color:#fff;font-family:Libre Franklin,sans-serif;font-size:24px;font-weight:900;margin:0;z-index:3}.search-container{background-color:#f9f9f9;border-radius:16px;box-shadow:0 4px 20px #00000014;margin:0 auto;max-width:800px;padding:30px}.back-button{background-color:initial;border:none;border-radius:50%;color:#736b1e;color:var(--green-accent);cursor:pointer;font-size:24px;margin-bottom:10px;padding:8px;transition:all .3s ease}.back-button:hover{background-color:#736b1e1a;transform:translateX(-2px)}.color-search-form{margin-top:20px}.section-title{border-bottom:2px solid #736b1e33;color:#333;font-family:Libre Franklin,sans-serif;font-size:18px;font-weight:600;margin-bottom:15px;padding-bottom:8px}.color-picker-container{align-items:center;display:flex;gap:20px;margin-bottom:20px}.color-display{align-items:center;display:flex;flex-direction:column;gap:8px}.selected-color-preview{border:2px solid #fff;border-radius:12px;box-shadow:0 4px 12px #0000001a;height:80px;outline:1px solid #e0e0e0;width:80px}.color-info{align-items:center;display:flex;flex-direction:column;font-family:Libre Franklin,sans-serif}.color-hex{color:#333;font-weight:600}.color-rgb{color:#666;font-size:12px}.color-input{border:none;border-radius:8px;cursor:pointer;height:60px;width:60px}.preset-colors{margin-bottom:25px}.preset-title{color:#666;font-family:Libre Franklin,sans-serif;font-size:14px;font-weight:500;margin-bottom:10px}.preset-grid{grid-gap:8px;display:grid;gap:8px;grid-template-columns:repeat(10,1fr);margin-bottom:20px}.preset-color{border:2px solid #fff;border-radius:6px;cursor:pointer;height:24px;outline:none;transition:all .2s ease;width:24px}.preset-color:hover{box-shadow:0 2px 8px #0003;transform:scale(1.1)}.preset-color.selected{box-shadow:0 0 0 2px #fff,0 0 0 4px #736b1e;box-shadow:0 0 0 2px #fff,0 0 0 4px var(--green-accent);transform:scale(1.15)}.search-button{align-items:center;background:linear-gradient(135deg,#736b1e,#8b9f1e);background:linear-gradient(135deg,var(--green-accent) 0,#8b9f1e 100%);border:none;border-radius:8px;color:#fff;cursor:pointer;display:flex;font-family:Libre Franklin,sans-serif;font-size:16px;font-weight:600;gap:8px;justify-content:center;margin-bottom:20px;padding:12px 24px;transition:all .3s ease;width:100%}.search-button:hover:not(:disabled){background:linear-gradient(135deg,#8b9f1e,#736b1e);background:linear-gradient(135deg,#8b9f1e 0,var(--green-accent) 100%);box-shadow:0 8px 16px #736b1e4d;transform:translateY(-2px)}.search-button:disabled{background:#ccc;box-shadow:none;cursor:not-allowed;transform:none}.error-message{align-items:center;background-color:#ffebee;border-radius:8px;color:#d32f2f;display:flex;font-family:Libre Franklin,sans-serif;font-size:14px;gap:8px;margin-bottom:20px;padding:12px}.search-results{animation:fadeIn .5s ease;margin-top:30px}.result-card{background-color:#fff;border-radius:12px;box-shadow:0 4px 12px #00000014;padding:20px}.result-colors{margin-bottom:20px}.color-comparison{align-items:center;display:flex;gap:20px;justify-content:center}.comparison-item{align-items:center;display:flex;flex-direction:column;gap:8px}.color-swatch{border:2px solid #fff;border-radius:8px;box-shadow:0 4px 8px #0000001a;height:60px;width:60px}.color-label{color:#666;font-family:Libre Franklin,sans-serif;font-size:14px}.comparison-arrow{color:#736b1e;color:var(--green-accent);font-size:24px;margin:0 10px}.result-details{text-align:center}.result-name{color:#333;font-size:18px;font-weight:600;margin-bottom:4px}.result-brand,.result-name{font-family:Libre Franklin,sans-serif}.result-brand{color:#666;font-size:14px;margin-bottom:15px}.swatch-image{border-radius:8px;box-shadow:0 4px 12px #0000001a;margin-top:15px;max-height:200px;max-width:100%}.color-grid{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));padding:20px}.color-box{border-radius:8px;cursor:pointer;height:150px;transition:transform .2s}.color-box:hover{transform:scale(1.05)}.image-form{background-color:#fff;border-radius:16px;box-shadow:0 8px 32px #0000001a;margin:0 auto;max-width:800px;padding:30px}.image-grid-container{grid-gap:30px;align-items:start;display:grid;gap:30px;grid-template-columns:1fr 1fr}.image-group{align-items:center;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:12px;cursor:pointer;display:flex;justify-content:center;min-height:250px;min-width:250px;overflow:hidden;position:relative;transition:transform .3s ease,box-shadow .3s ease}.image-group:hover{box-shadow:0 12px 24px #00000026;transform:translateY(-2px)}.image-inputs{display:flex;flex-direction:column;gap:20px}.file-input{display:none}.file-input-label{align-items:center;display:flex;justify-content:center;overflow:hidden}.file-input-label,.preview-image{border-radius:12px;height:100%;width:100%}.preview-image{object-fit:cover;transition:transform .3s ease}.preview-image:hover{transform:scale(1.05)}.file-input-text{align-items:center;color:#fff;display:flex;flex-direction:column;font-family:Libre Franklin,sans-serif;font-size:16px;font-weight:500;gap:10px;text-align:center}.file-input-text:before{content:"📷";font-size:48px;opacity:.8}.color-selection-section{display:flex;flex-direction:column;gap:15px}.color-selection-title{color:#333;font-family:Libre Franklin,sans-serif;font-size:18px;font-weight:600;margin:0}.color-number-group{align-items:center;display:flex;gap:10px}.color-button-label{cursor:pointer;display:block;position:relative}.color-button-label span{align-items:center;background:#fff;border:2px solid #e0e0e0;border-radius:12px;color:#666;display:flex;font-family:Libre Franklin,sans-serif;font-size:16px;font-weight:600;height:50px;justify-content:center;transition:all .3s ease;width:50px}.color-button-label:hover span{border-color:#736b1e;border-color:var(--green-accent);transform:translateY(-1px)}.color-button{display:none}.color-button:checked+span{background:#736b1e;background:var(--green-accent);border-color:#736b1e;border-color:var(--green-accent);color:#fff;transform:scale(1.05)}.number-input-section{display:flex;flex-direction:column;gap:10px}.number-input-label{color:#666;font-size:14px;font-weight:500}.number-input,.number-input-label{font-family:Libre Franklin,sans-serif}.number-input{background:#fff;border:2px solid #e0e0e0;border-radius:8px;font-size:16px;padding:12px 16px;transition:border-color .3s ease}.number-input:focus{border-color:#736b1e;border-color:var(--green-accent);outline:none}.number-input:disabled{background-color:#f5f5f5;color:#999;cursor:not-allowed}.submit-button{background:linear-gradient(135deg,#736b1e,#8b9f1e);background:linear-gradient(135deg,var(--green-accent) 0,#8b9f1e 100%);border:none;border-radius:8px;color:#fff;cursor:pointer;font-family:Libre Franklin,sans-serif;font-size:16px;font-weight:600;margin-top:10px;padding:14px 24px;transition:all .3s ease}.submit-button:hover:not(:disabled){background:linear-gradient(135deg,#8b9f1e,#736b1e);background:linear-gradient(135deg,#8b9f1e 0,var(--green-accent) 100%);box-shadow:0 8px 16px #736b1e4d;transform:translateY(-2px)}.submit-button:disabled{background:#ccc;box-shadow:none;cursor:not-allowed;transform:none}@media (max-width:768px){.image-grid-container{gap:20px;grid-template-columns:1fr}.preset-grid{grid-template-columns:repeat(5,1fr)}.color-picker-container{align-items:flex-start;flex-direction:column}.color-comparison{flex-direction:column;gap:15px}.comparison-arrow{margin:10px 0;transform:rotate(90deg)}}@media (min-width:1024px){.Color,.Image{width:25%}}
/*# sourceMappingURL=main.6f766aca.css.map*/