/* File attachments widget — Hairline house style. Self-contained: every token has a
   fallback so it also works on a page that doesn't load board.css. Classes are fuf-*. */

.fuf{--fuf-line:var(--line,#F3F1F3);--fuf-sunken:var(--sunken,#F3F1F3);--fuf-ink:var(--ink,#000);
     --fuf-muted:var(--muted,#292829);--fuf-blue:var(--blue,#4759FC);--fuf-err:var(--overdue,#D63D52);
     --fuf-r:var(--r,8px);--fuf-r-chip:var(--r-chip,4px);
     font-family:var(--font,'Colfax',-apple-system,'Helvetica Neue',Helvetica,sans-serif);
     color:var(--fuf-ink);font-size:var(--t-body,17px);min-width:0}
.fuf *{box-sizing:border-box}

/* ---------- drop zone ---------- */
.fuf-drop{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;
          padding:18px 16px;border:1.5px dashed var(--line-strong,#E6E2E7);border-radius:var(--r-card,12px);
          background:var(--lane,#FBFAFB);text-align:center;transition:background .12s,border-color .12s}
.fuf-drop.is-over{border-color:var(--fuf-blue);background:#EEF0FE}
.fuf-drop-text{font-size:var(--t-label,15px);line-height:1.35;color:var(--fuf-muted)}
.fuf-drop-text strong{color:var(--fuf-ink);font-weight:500}
.fuf-actions{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
.fuf-btn{height:36px;padding:0 14px;border:0;border-radius:var(--fuf-r);cursor:pointer;white-space:nowrap;
         background:var(--fuf-sunken);color:var(--fuf-ink);font-family:inherit;font-weight:500;font-size:var(--t-label,15px);line-height:1;
         display:inline-flex;align-items:center;gap:6px}
.fuf-btn:not(:disabled):active{transform:scale(.98)}
.fuf-btn:focus-visible,.fuf-tile:focus-visible,.fuf-row a:focus-visible,.fuf-lb button:focus-visible{outline:2px solid var(--fuf-blue);outline-offset:2px}
.fuf-btn:disabled{opacity:.5;cursor:not-allowed}
.fuf-camera{display:none}
@media (pointer:coarse){.fuf-camera{display:inline-flex}}
.fuf-input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.fuf-caption{height:32px;width:100%;max-width:340px;padding:0 10px;border:0;border-radius:var(--r-field,6px);
             background:var(--fuf-sunken);font-family:inherit;font-weight:400;font-size:var(--t-label,15px);color:var(--fuf-ink)}
.fuf-caption::placeholder{color:var(--placeholder,#77717B)}
.fuf-caption:focus{outline:2px solid var(--fuf-blue);outline-offset:1px}

/* ---------- progress + messages ---------- */
.fuf-progress{margin-top:10px}
.fuf-progress-label{display:flex;justify-content:space-between;font-size:var(--t-meta,12px);color:var(--fuf-muted);margin-bottom:5px}
.fuf-bar{height:4px;border-radius:2px;background:var(--fuf-sunken);overflow:hidden}
.fuf-bar > i{display:block;height:100%;width:0;background:var(--fuf-ink);transition:width .15s}
.fuf-msg{margin-top:10px;font-size:var(--t-label,15px);line-height:1.35;color:var(--fuf-muted)}
.fuf-msg.is-error{color:var(--fuf-err)}

/* ---------- photos ---------- */
.fuf-head{display:flex;align-items:baseline;justify-content:space-between;margin:18px 0 8px;
          font-size:var(--t-label,15px);font-weight:500}
.fuf-head span{font-size:var(--t-meta,12px);font-weight:400;color:var(--fuf-muted)}
.fuf-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:6px}
.fuf-tile{position:relative;display:block;aspect-ratio:1/1;border:0;padding:0;border-radius:var(--fuf-r);overflow:hidden;
          background:var(--fuf-sunken);cursor:zoom-in}
.fuf-tile img{width:100%;height:100%;object-fit:cover;display:block}
.fuf-tile .fuf-tile-tag{position:absolute;left:4px;bottom:4px;max-width:calc(100% - 8px);padding:2px 5px;border-radius:var(--fuf-r-chip);
          background:rgba(0,0,0,.62);color:#fff;font-size:11px;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fuf-tile.is-broken{cursor:pointer;display:flex;align-items:center;justify-content:center;padding:8px;
          font-size:var(--t-meta,12px);color:var(--fuf-muted);word-break:break-all;text-align:center}

/* ---------- other files: one line each ---------- */
.fuf-list{list-style:none;margin:0;padding:0}
.fuf-row{display:flex;align-items:center;gap:12px;min-height:48px;padding:8px 0;border-bottom:1px solid var(--fuf-line)}
.fuf-row:last-child{border-bottom:0}
.fuf-ico{flex:0 0 32px;width:32px;height:32px;border-radius:6px;display:flex;align-items:center;justify-content:center;
         color:#fff;font-size:10px;font-weight:700;letter-spacing:.02em;background:#476988}
.fuf-ico.k-pdf{background:#E76C7A}
.fuf-ico.k-doc{background:#5C6094}
.fuf-ico.k-sheet{background:#078D5C}
.fuf-ico.k-email{background:#8162A4}
.fuf-ico.k-audio{background:#EB9174}
.fuf-ico.k-image{background:#5C6094}
.fuf-main{flex:1;min-width:0}
.fuf-name{display:block;font-size:var(--t-label,15px);font-weight:500;color:var(--fuf-ink);text-decoration:none;
          white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fuf-name:hover{text-decoration:underline}
.fuf-meta{display:block;font-size:var(--t-meta,12px);color:var(--fuf-muted);margin-top:3px;
          white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fuf-tag{flex:0 1 auto;max-width:140px;height:22px;line-height:22px;display:block;padding:0 7px;border-radius:var(--fuf-r-chip);
         background:var(--choice-rest,#F4F6F8);color:var(--choice-rest-ink,#51728F);font-size:var(--t-meta,12px);font-weight:500;
         white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* width:0 + min-width:100% — a long name ellipsises instead of widening the host page */
.fuf-name,.fuf-meta{width:0;min-width:100%}
.fuf-audio{display:block;width:100%;height:36px;margin-top:6px}
.fuf-empty{font-size:var(--t-label,15px);color:var(--fuf-muted);margin:14px 0 0}

/* ---------- pending mode: chosen but not uploaded yet, one line each ---------- */
.fuf-drop-compact{flex-direction:row;flex-wrap:wrap;gap:8px 12px;padding:12px 14px}
.fuf-drop-compact .fuf-drop-text{flex:1 1 180px;text-align:left}
.fuf-pend-list{list-style:none;margin:8px 0 0;padding:0}
.fuf-pend{display:flex;align-items:center;gap:10px;min-height:44px;padding:4px 0;border-bottom:1px solid var(--fuf-line)}
.fuf-pend:last-child{border-bottom:0}
.fuf-pend-thumb{flex:0 0 32px;width:32px;height:32px;border-radius:6px;object-fit:cover;background:var(--fuf-sunken);display:block}
.fuf-pend-name{flex:1;min-width:0;width:0;font-size:var(--t-label,15px);font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fuf-pend-size{flex:0 0 auto;font-size:var(--t-meta,12px);color:var(--fuf-muted);font-variant-numeric:tabular-nums}
.fuf-pend-x{flex:0 0 36px;width:36px;height:36px;border:0;border-radius:var(--fuf-r);background:transparent;color:var(--fuf-muted);
            cursor:pointer;display:inline-flex;align-items:center;justify-content:center}
.fuf-pend-x:hover{background:var(--fuf-sunken);color:var(--fuf-ink)}
.fuf-pend-x:focus-visible{outline:2px solid var(--fuf-blue);outline-offset:1px}
.fuf-pend-x:disabled{opacity:.4;cursor:default}

/* ---------- lightbox ---------- */
.fuf-lb{position:fixed;inset:0;z-index:70;background:rgba(0,0,0,.88);display:flex;flex-direction:column;
        font-family:var(--font,'Colfax',-apple-system,'Helvetica Neue',Helvetica,sans-serif);color:#fff}
.fuf-lb-bar{display:flex;align-items:center;gap:12px;padding:10px 12px 10px 16px;min-height:56px}
.fuf-lb-title{flex:1;min-width:0}
.fuf-lb-title b{display:block;font-size:var(--t-label,15px);font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fuf-lb-title span{display:block;font-size:var(--t-meta,12px);opacity:.8;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fuf-lb button{width:44px;height:44px;flex:0 0 44px;border:0;border-radius:var(--fuf-r);background:rgba(255,255,255,.12);
               color:#fff;cursor:pointer;display:inline-flex;align-items:center;justify-content:center}
.fuf-lb button:disabled{opacity:.3;cursor:default}
.fuf-lb a.fuf-lb-open{color:#fff;font-size:var(--t-meta,12px);text-decoration:underline;white-space:nowrap}
.fuf-lb-stage{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;gap:8px;padding:0 8px 16px}
.fuf-lb-stage img{max-width:100%;max-height:100%;object-fit:contain;border-radius:4px;min-width:0}
.fuf-lb-count{font-size:var(--t-meta,12px);opacity:.8;text-align:center;padding-bottom:14px}
@media (max-width:520px){
  .fuf-lb-stage{position:relative;padding:0 0 12px}
  .fuf-lb-stage .fuf-lb-prev,.fuf-lb-stage .fuf-lb-next{position:absolute;top:50%;transform:translateY(-50%);background:rgba(0,0,0,.45)}
  .fuf-lb-stage .fuf-lb-prev{left:6px} .fuf-lb-stage .fuf-lb-next{right:6px}
}
body.fuf-lb-open{overflow:hidden}
.fuf [hidden],.fuf-lb [hidden]{display:none !important}
