.image-upload-container{background-color:#fff;border-radius:13px;flex-direction:column;justify-content:flex-start;align-items:center;gap:15px;width:220px;height:318px;padding:13px 10px;font-family:Inter,sans-serif;display:inline-flex;box-shadow:0 4px 20px rgba(0,0,0,.1)}.image-upload-container.search-mode{width:100%;height:-moz-fit-content;height:fit-content;max-height:80vh;overflow-y:auto}@media (max-width:768px){.image-upload-container.search-mode{width:90vw;height:70vh}}@media (max-width:991px){.image-upload-container{gap:12px;width:200px;height:290px;padding:12px 8px}}@media (max-width:640px){.image-upload-container{gap:15px;width:280px;height:320px;padding:15px 12px}}.image-upload-content{flex-direction:column;align-self:stretch;align-items:center;gap:15px;display:flex;position:relative}.image-upload-header{flex-wrap:wrap;place-content:center space-between;align-self:stretch;align-items:center;row-gap:8px;padding:0 8px;display:flex;position:relative}.image-upload-container:not(.search-mode) .image-upload-header{padding:0}@media (max-width:640px){.image-upload-header{flex-direction:row;justify-content:space-between}}.image-upload-header-text{border-radius:8px;flex-wrap:wrap;align-content:center;align-items:center;display:flex;position:relative}.image-upload-title{color:#1c1c1c;font:700 12px Inter,-apple-system,Roboto,Helvetica,sans-serif;position:relative}.image-upload-close-button{cursor:pointer;color:#1c1c1c;background:0 0;border:none;border-radius:8px;flex-wrap:wrap;align-content:center;align-items:center;display:flex;position:relative}.image-upload-close-button:hover{opacity:.7}.image-upload-body,.image-upload-preview-container{flex-direction:column;align-self:stretch;align-items:flex-start;gap:10px;display:flex;position:relative}.image-upload-preview{background-color:#f3f3f3;border:1px solid #0085fe;border-radius:4px;flex-direction:column;align-items:flex-start;gap:10px;width:100%;padding:24px 1px;display:flex;position:relative}.image-upload-preview-img{aspect-ratio:198/125.19;object-fit:cover;flex-shrink:0;width:198px;height:125px}@media (max-width:991px){.image-upload-preview-img{width:180px;height:110px}}@media (max-width:640px){.image-upload-preview-img{width:250px;height:140px}}.image-upload-generate-button{cursor:pointer;background-color:rgba(0,133,254,.07);border:none;border-radius:8px;flex:1 0 0;justify-content:center;align-items:center;gap:5px;width:100%;height:30px;padding:4px 10px;display:flex;position:relative}.image-upload-generate-button:hover{background-color:rgba(0,133,254,.12)}.image-upload-ai-icon{aspect-ratio:1;width:20px;height:20px;position:relative}.image-upload-generate-text{color:#0085fe;font:700 12px Inter,-apple-system,Roboto,Helvetica,sans-serif;position:relative}.image-upload-field{justify-content:space-between;align-self:stretch;align-items:center;display:flex;position:relative}@media (max-width:640px){.image-upload-field{flex-direction:column;align-items:flex-start;gap:8px}}.image-upload-field-label{border-radius:8px;flex-wrap:wrap;align-content:center;align-items:center;gap:12px;height:20px;display:flex;position:relative}.alt-text-label{color:#8f8f8f;font:400 12px Inter,-apple-system,Roboto,Helvetica,sans-serif;position:relative}.image-upload-field-input{background-color:#f3f3f3;border-radius:8px;flex-wrap:wrap;align-content:center;align-items:center;gap:5px;width:140px;height:34px;padding:7px 10px;display:flex;position:relative}@media (max-width:991px){.image-upload-field-input{width:120px;height:32px;padding:6px 8px}}@media (max-width:640px){.image-upload-field-input{width:100%;height:36px;padding:8px 10px}}.alt-text-input{color:#1c1c1c;text-overflow:ellipsis;white-space:nowrap;background:0 0;border:none;outline:none;flex:1 0 0;width:100%;font:400 12px Inter,-apple-system,Roboto,Helvetica,sans-serif;position:relative;overflow:hidden}.alt-text-input::placeholder{color:#1c1c1c}.image-search-content{flex-direction:column;flex:1;align-self:stretch;gap:12px;width:100%;padding:0 8px;display:flex}.image-tabs{border-bottom:1px solid #e5e7eb;margin-bottom:12px;display:flex}.image-tab{cursor:pointer;color:#6b7280;background:0 0;border:none;border-bottom:2px solid transparent;flex:1;padding:8px 12px;font-size:12px;font-weight:500;transition:all .2s}.image-tab:hover{color:#374151;background-color:#f9fafb}.image-tab.active{color:#0085fe;background-color:#f0f9ff;border-bottom-color:#0085fe}.image-search-input-container{align-items:center;gap:8px;display:flex}.image-search-input{border:1px solid #d1d5db;border-radius:6px;outline:none;flex:1;padding:10px 12px;font-size:12px;transition:border-color .2s}.image-search-input:focus{border-color:#0085fe;box-shadow:0 0 0 2px rgba(0,133,254,.1)}.image-search-input::placeholder{color:#9ca3af}.image-search-button{color:#fff;cursor:pointer;background:#0085fe;border:none;border-radius:6px;justify-content:center;align-items:center;min-width:40px;padding:10px 12px;transition:background-color .2s;display:flex}.image-search-button:hover:not(:disabled){background:#0070d9}.image-search-button:disabled{opacity:.5;cursor:not-allowed}.search-spinner{border:2px solid transparent;border-top-color:#fff;border-radius:50%;width:18px;height:18px;animation:1s linear infinite spin}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.image-search-results{flex-direction:column;gap:12px;width:100%;display:flex}.image-grid{scrollbar-width:thin;scrollbar-color:#cbd5e0 #f7fafc;grid-template-columns:repeat(3,1fr);gap:10px;max-height:380px;padding:0;display:grid;overflow-y:auto}.image-grid::-webkit-scrollbar{width:6px}.image-grid::-webkit-scrollbar-track{background:#f7fafc;border-radius:3px}.image-grid::-webkit-scrollbar-thumb{background:#cbd5e0;border-radius:3px}.image-grid::-webkit-scrollbar-thumb:hover{background:#a0aec0}@media (max-width:768px){.image-grid{grid-template-columns:repeat(2,1fr);gap:18px;max-height:400px}}.image-item{cursor:pointer;aspect-ratio:1;border:2px solid transparent;border-radius:6px;height:120px;transition:transform .2s,box-shadow .2s;position:relative;overflow:hidden}.image-item:hover{transform:translateY(-2px);box-shadow:0 4px 12px rgba(0,0,0,.1)}.image-item.selected{border-color:#0085fe;box-shadow:0 0 0 2px rgba(0,133,254,.2)}.image-thumbnail{object-fit:cover;width:100%;height:100%;display:block}.image-search-actions{border-top:1px solid #e5e7eb;justify-content:center;margin-top:8px;padding:16px 0 8px;display:flex}.choose-button{color:#fff;cursor:pointer;background:#0085fe;border:none;border-radius:6px;padding:10px 32px;font-size:13px;font-weight:600;transition:all .2s;box-shadow:0 2px 4px rgba(0,133,254,.2)}.choose-button:hover{background:#0070d9;transform:translateY(-1px);box-shadow:0 4px 8px rgba(0,133,254,.3)}.choose-button:active{transform:translateY(0)}.image-upload-tab-content{flex-direction:column;gap:16px;width:100%;min-width:300px;max-width:500px;display:flex}.image-upload-area{width:100%;position:relative}.image-file-input{opacity:0;width:0;height:0;position:absolute;overflow:hidden}.image-upload-label{cursor:pointer;border:2px dashed #d1d5db;border-radius:8px;width:100%;min-height:200px;transition:all .2s;display:block;position:relative;overflow:hidden}.image-upload-label:hover{background-color:#f0f9ff;border-color:#0085fe}.image-upload-placeholder{color:#6b7280;flex-direction:column;justify-content:center;align-items:center;gap:12px;height:200px;display:flex}.image-upload-icon{color:#9ca3af;background-color:#f3f4f6;border-radius:50%;justify-content:center;align-items:center;width:48px;height:48px;display:flex}.image-upload-text{text-align:center}.image-upload-text p{margin:0;font-size:14px;font-weight:500}.image-upload-text .image-upload-hint{color:#9ca3af;margin-top:4px;font-size:12px}.image-upload-label .image-upload-preview{border-radius:6px;width:100%;position:relative;overflow:hidden}.image-upload-label .image-upload-preview-img{object-fit:cover;width:100%;height:100%;display:block}.image-upload-overlay{opacity:0;background-color:rgba(0,0,0,.5);justify-content:center;align-items:center;transition:opacity .2s;display:flex;position:absolute;top:0;bottom:0;left:0;right:0}.image-upload-overlay span{color:#fff;font-size:14px;font-weight:500}.image-upload-label:hover .image-upload-overlay{opacity:1}.image-upload-actions{justify-content:center;padding:16px 0;display:flex}.image-upload-confirm-button{color:#fff;cursor:pointer;background:#0085fe;border:none;border-radius:6px;padding:10px 24px;font-size:14px;font-weight:600;transition:all .2s}.image-upload-confirm-button:hover{background:#0070d9;transform:translateY(-1px)}.image-upload-confirm-button:active{transform:translateY(0)}
