.filedrop{gap:.55rem;display:grid}.filedrop-label{color:var(--ink);font-size:.85rem;font-weight:600}.filedrop-zone{--mark:#b9ab88;text-align:center;cursor:pointer;background:linear-gradient(var(--mark), var(--mark)) left 8px top 8px / 16px 1.5px no-repeat, linear-gradient(var(--mark), var(--mark)) left 8px top 8px / 1.5px 16px no-repeat, linear-gradient(var(--mark), var(--mark)) right 8px top 8px / 16px 1.5px no-repeat, linear-gradient(var(--mark), var(--mark)) right 8px top 8px / 1.5px 16px no-repeat, linear-gradient(var(--mark), var(--mark)) left 8px bottom 8px / 16px 1.5px no-repeat, linear-gradient(var(--mark), var(--mark)) left 8px bottom 8px / 1.5px 16px no-repeat, linear-gradient(var(--mark), var(--mark)) right 8px bottom 8px / 16px 1.5px no-repeat, linear-gradient(var(--mark), var(--mark)) right 8px bottom 8px / 1.5px 16px no-repeat, #fff;transition:border-color .16s var(--ease), background-color .16s var(--ease), box-shadow .16s var(--ease);border:1px dashed #d6cab0;border-radius:6px;justify-items:center;gap:.35rem;padding:1.6rem 1.25rem 1.4rem;display:grid;position:relative}.filedrop-zone:hover,.filedrop-zone.is-over{--mark:var(--red);border-color:var(--red);background-color:#fff8f4}.filedrop-zone:has(.filedrop-input:focus-visible){border-color:var(--red);box-shadow:0 0 0 3px #c11a2e4d}.filedrop-zone:active{transform:scale(.995)}.filedrop-zone.is-waiting{--mark:var(--red);border-style:solid}.filedrop-zone.is-waiting .filedrop-meta:after{content:" — pričekajte da se datoteke učitaju…";color:var(--red)}.filedrop-icon{width:28px;height:28px;color:var(--red);transition:transform .22s cubic-bezier(.34,1.4,.5,1)}.filedrop-zone:hover .filedrop-icon,.filedrop-zone.is-over .filedrop-icon{transform:translateY(-3px)}.filedrop-text{color:var(--ink);font-size:.95rem}.filedrop-text u{text-decoration-color:var(--red);text-underline-offset:3px}.filedrop-meta{font-family:var(--font-tag);letter-spacing:.02em;color:var(--ink-soft);font-size:.7rem}.filedrop-input{opacity:0;pointer-events:none;width:1px;height:1px;position:absolute}.filedrop-hint{color:var(--ink-soft);margin:0;font-size:.8rem;line-height:1.5}.filedrop-list{gap:.45rem;margin:0;padding:0;list-style:none;display:grid}.filedrop-list:empty{display:none}.filedrop-item{background:#fff;border:1px solid #e6ddc8;border-radius:10px;grid-template-columns:40px minmax(0,1fr) auto 32px;align-items:center;gap:.75rem;padding:.45rem .5rem .45rem .45rem;animation:.26s cubic-bezier(.34,1.3,.5,1) both filedrop-in;display:grid}@keyframes filedrop-in{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}.filedrop-item.is-note{grid-template-columns:minmax(0,1fr) 32px;padding-left:.85rem}.filedrop-thumb{background:var(--paper-dim);width:40px;height:40px;color:var(--ink-soft);font-family:var(--font-tag);border-radius:7px;place-items:center;font-size:.62rem;font-weight:600;display:grid;overflow:hidden}.filedrop-thumb img{object-fit:cover;width:100%;height:100%}.filedrop-name{min-width:0;color:var(--ink);text-overflow:ellipsis;white-space:nowrap;font-size:.86rem;font-weight:500;overflow:hidden}.filedrop-name small{font-family:var(--font-tag);color:var(--ink-soft);font-size:.68rem;font-weight:500;display:block}.filedrop-state{font-family:var(--font-tag);text-transform:uppercase;letter-spacing:.04em;color:var(--ink-soft);font-size:.68rem}.filedrop-item.is-done .filedrop-state{color:#2f6b34}.filedrop-item.is-done .filedrop-state:before{content:"✓ "}.filedrop-item.is-error{background:#fff7f6;border-color:#c11a2e66}.filedrop-item.is-error .filedrop-state{color:var(--red);text-transform:none;letter-spacing:0;font-family:var(--font-body);font-size:.78rem}.filedrop-bar{background:var(--paper-dim);border-radius:4px;width:72px;height:4px;display:block;overflow:hidden}.filedrop-bar i{background:var(--red);transform-origin:0;height:100%;transition:transform .16s linear;display:block;transform:scaleX(.04)}.filedrop-remove{width:32px;height:32px;color:var(--ink-soft);cursor:pointer;transition:background-color .14s var(--ease), color .14s var(--ease), transform .14s var(--ease);background:0 0;border:0;border-radius:8px;font-size:1.3rem;line-height:1}.filedrop-remove:hover{background:var(--paper-dim);color:var(--red)}.filedrop-remove:active{transform:scale(.92)}.filedrop-remove:focus-visible{outline:none;box-shadow:0 0 0 3px #c11a2e4d}@media (width<=480px){.filedrop-item{grid-template-columns:36px minmax(0,1fr) 32px}.filedrop-item .filedrop-state{grid-area:2/2}.filedrop-thumb{width:36px;height:36px}}@media (prefers-reduced-motion:reduce){.filedrop-item{animation:none}.filedrop-icon,.filedrop-zone{transition:none}}
