﻿
/* PRE-LAUNCH D — Upload & Image UX */
.tw-upload-field{position:relative}
.tw-upload-meta{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-top:7px;color:#71817a;font-size:.76rem}
.tw-upload-meta span{display:inline-flex;align-items:center;min-height:27px;padding:4px 7px;border:1px solid #e0e8e5;border-radius:8px;background:#f8faf9}
.tw-upload-error{display:none;margin-top:7px;padding:7px 9px;border:1px solid #efcccc;border-radius:9px;background:#fff4f4;color:#8d3f3f;font-size:.78rem;line-height:1.6}
.tw-upload-field.has-error .tw-upload-error{display:block}
.tw-upload-preview{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:8px;margin-top:9px}
.tw-upload-preview-item{position:relative;overflow:hidden;border:1px solid #dfe7e4;border-radius:11px;background:#f8faf9;aspect-ratio:16/10}
.tw-upload-preview-item img{width:100%;height:100%;object-fit:cover;display:block}
.tw-upload-preview-file{display:grid;place-items:center;height:100%;padding:9px;text-align:center;color:#587068;font-size:.72rem;overflow-wrap:anywhere}
.tw-upload-progress{display:none;margin-top:10px;padding:9px 10px;border:1px solid #cfe1da;border-radius:10px;background:#f5faf8;color:#3e6156}
.tw-upload-progress.is-active{display:block}
.tw-upload-progress-head{display:flex;justify-content:space-between;gap:10px;font-size:.76rem;font-weight:800}
.tw-upload-progress-track{height:5px;margin-top:7px;overflow:hidden;border-radius:999px;background:#e3ece8}
.tw-upload-progress-bar{width:38%;height:100%;border-radius:999px;background:#266652;animation:twUploadProgress 1.15s ease-in-out infinite alternate}
@keyframes twUploadProgress{from{transform:translateX(-25%)}to{transform:translateX(185%)}}

img.tw-img-lazy{content-visibility:auto}
img.tw-img-hero{content-visibility:visible}

@media(max-width:760px){
  .tw-upload-preview{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(prefers-reduced-motion:reduce){
  .tw-upload-progress-bar{animation:none;width:100%}
}
