:root{--fa-icon-size:20px;--fa-gap:8px}
.fa-solid{font-style:normal}
/* ensure both specific file-* classes and generic .fa-file get the sizing/placement */
.fa-solid[class*="fa-file-"]::before,
.fa-solid.fa-file::before {
  content:'';
  display:inline-block;
  width:var(--fa-icon-size);
  height:var(--fa-icon-size);
  background-size:contain;
  background-repeat:no-repeat;
  vertical-align:middle;
  margin-right:var(--fa-gap);
}
.fa-file-pdf::before{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'><rect rx='6' width='48' height='48' fill='%23E33'/><text x='24' y='32' font-size='18' font-family='Arial,Helvetica,sans-serif' fill='%23fff' text-anchor='middle'>PDF</text></svg>");}
.fa-file-word::before{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'><rect rx='6' width='48' height='48' fill='%232B7AE4'/><text x='24' y='32' font-size='16' font-family='Arial,Helvetica,sans-serif' fill='%23fff' text-anchor='middle'>DOC</text></svg>");}
.fa-file-excel::before{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'><rect rx='6' width='48' height='48' fill='%231E9F3E'/><text x='24' y='32' font-size='14' font-family='Arial,Helvetica,sans-serif' fill='%23fff' text-anchor='middle'>XLS</text></svg>");}
.fa-file-powerpoint::before{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'><rect rx='6' width='48' height='48' fill='%23E67E22'/><text x='24' y='32' font-size='14' font-family='Arial,Helvetica,sans-serif' fill='%23fff' text-anchor='middle'>PPT</text></svg>");}
.fa-file-image::before{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'><rect rx='6' width='48' height='48' fill='%23556'/><g transform='translate(6,6)'><rect x='2' y='2' width='32' height='32' rx='4' fill='%23f5f6f7'/><path d='M6 24l6-8 8 6 6-8 4 10H6z' fill='%23d0d6dc'/><circle cx='8' cy='12' r='3' fill='%239aa'/></g></svg>");}
.fa-file-audio::before{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'><rect rx='6' width='48' height='48' fill='%236AA84F'/><path d='M18 18v12a6 6 0 0 0 12 0V18' stroke='%23fff' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round' fill='none'/></svg>");}
.fa-file-video::before{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'><rect rx='6' width='48' height='48' fill='%235AA0C3'/><rect x='12' y='14' width='20' height='12' rx='2' fill='%23fff'/><path d='M18 20l8 4-8 4V20z' fill='%232a2a2a'/></svg>");}
.fa-file-lines::before{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'><rect rx='6' width='48' height='48' fill='%239AA0AD'/><path d='M16 18h16M16 24h12M16 30h10' stroke='%23fff' stroke-width='1.6' stroke-linecap='round'/></svg>");}
.fa-file-zipper::before{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'><rect rx='6' width='48' height='48' fill='%238B6B3D'/><rect x='12' y='16' width='24' height='14' rx='2' fill='%23fff' opacity='0.12'/><path d='M18 20h12' stroke='%23fff' stroke-width='1.6' stroke-linecap='round'/></svg>");}
.fa-file::before{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'><rect rx='6' width='48' height='48' fill='%236B7785'/><path d='M14 14h20v18H14z' fill='%23fff' opacity='0.06'/></svg>");}

/* Small utility to align icon-only anchors */
.file-icon{display:inline-flex;align-items:center}