/* ══════════════════════════════════════════════════════════════
   liste.php — eigenstaendiges Stylesheet im Design von levanceparfum.de
   Ersetzt style.css (die weiterhin admin.php und bewertung.php bedient)
   und css/all.min.css. Hell, scharfe Ecken, Jost + Cormorant Garamond.
   ══════════════════════════════════════════════════════════════ */

@font-face{font-family:'Jost';font-style:normal;font-weight:300 700;font-display:swap;src:url('webfonts/jost-latin.woff2') format('woff2')}
@font-face{font-family:'Cormorant Garamond';font-style:normal;font-weight:300 700;font-display:swap;src:url('webfonts/cormorant-garamond-latin.woff2') format('woff2')}

:root{
  --bg:#ffffff; --surface:#ffffff; --surface-2:#faf8f4;
  --ink:#111111; --body:#555555; --muted:#6f665b;
  --line:#e3dbd0; --line-soft:#ece3d3;
  --gold:#b79a5b; --gold-deep:#8a7038;
  --main-bg:#111111; --main-ink:#ffffff;
  --sa-top:env(safe-area-inset-top,0px); --sa-bottom:env(safe-area-inset-bottom,0px);
  --sa-left:env(safe-area-inset-left,0px); --sa-right:env(safe-area-inset-right,0px);
  --touch:44px;
}
body.dark{
  --bg:#0f0d0a; --surface:rgba(255,255,255,.035); --surface-2:#141109;
  --ink:#f4efe5; --body:rgba(232,226,214,.72); --muted:rgba(232,226,214,.52);
  --line:rgba(183,154,91,.2); --line-soft:rgba(183,154,91,.26);
  --gold:#b79a5b; --gold-deep:#c9ab6a;
  --main-bg:#b79a5b; --main-ink:#14110c;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--bg);color:var(--body);
  font-family:'Jost',system-ui,-apple-system,'Segoe UI',Arial,sans-serif;
  font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
a{color:inherit;-webkit-tap-highlight-color:transparent}
button{font-family:inherit;-webkit-tap-highlight-color:transparent}
img{max-width:100%}

/* ── Icons: gleiche <i class="fas fa-x">-Markup wie vorher, nur per
      CSS-Maske aus SVG-Daten statt aus einer 210-KB-Schriftdatei. ── */
.fas,.fab,.far{
  display:inline-block;width:1em;height:1em;vertical-align:-.125em;
  background-color:currentColor;
  -webkit-mask:var(--i) no-repeat center/contain;
  mask:var(--i) no-repeat center/contain;
  flex-shrink:0;
}
@keyframes fa-spin{to{transform:rotate(360deg)}}
.fa-spin{animation:fa-spin 1.1s linear infinite}

/* ── Grundgeruest ── */
.container{
  max-width:820px;margin:0 auto;
  padding:0 calc(var(--sa-right) + 20px) calc(var(--sa-bottom) + 80px) calc(var(--sa-left) + 20px);
}

/* ── Kopf ── */
.main-header{
  display:flex;align-items:center;gap:16px;
  padding:calc(var(--sa-top) + 22px) 0 20px;
  border-bottom:1px solid var(--line);margin-bottom:26px;
}
.logo{flex:0 0 auto}
.logo a{display:block;line-height:0}
.logo img{width:52px;height:auto}
.logo-dark{display:none}
body.dark .logo-light{display:none}
body.dark .logo-dark{display:block}
.header-content{flex:1;min-width:0}
.header-content h1{
  margin:0;font-family:'Cormorant Garamond',Georgia,serif;
  font-size:clamp(1.6rem,6vw,2.3rem);font-weight:300;
  letter-spacing:.14em;text-transform:uppercase;color:var(--ink);line-height:1.1;
}
.header-content p{margin:5px 0 0;font-size:.8rem;color:var(--muted);font-weight:300}
.theme-toggle{display:flex;gap:8px;flex:0 0 auto}
.btn-icon{
  width:var(--touch);height:var(--touch);padding:0;
  background:var(--surface);border:1px solid var(--line);color:var(--muted);
  display:flex;align-items:center;justify-content:center;cursor:pointer;
  font-size:.9rem;transition:border-color .2s,color .2s;
}
.btn-icon:hover{border-color:var(--gold);color:var(--gold-deep)}

/* ── Suche + Filter ── */
.toolbar{display:flex;flex-direction:column;gap:12px;margin-bottom:22px}
.search-bar{position:relative;display:flex}
.form-control{
  width:100%;min-height:var(--touch);padding:11px 15px 11px 42px;
  border:1px solid var(--line);background:var(--surface);color:var(--ink);
  font-family:inherit;font-size:16px;outline:none;border-radius:0;
  -webkit-appearance:none;appearance:none;transition:border-color .2s;
}
.form-control:focus{border-color:var(--gold)}
.form-control::placeholder{color:var(--muted)}
.search-icon{
  position:absolute;left:15px;top:50%;transform:translateY(-50%);
  color:var(--muted);font-size:.9rem;pointer-events:none;
}
.filter-buttons{display:flex;flex-wrap:wrap;gap:7px}
.filter-tag-btn{
  display:inline-flex;align-items:center;gap:6px;
  min-height:38px;padding:0 13px;
  border:1px solid var(--line);background:var(--surface);color:var(--body);
  font-size:.78rem;font-weight:500;cursor:pointer;border-radius:0;
  transition:border-color .2s,background .2s,color .2s;
}
.filter-tag-btn .fas{font-size:.8em;color:var(--gold)}
.filter-tag-btn:hover{border-color:var(--gold)}
.filter-tag-btn.active{background:var(--main-bg);border-color:var(--main-bg);color:var(--main-ink)}
.filter-tag-btn.active .fas{color:currentColor}

/* ── Kategorie-Navigation ── */
.category-nav{
  display:flex;gap:6px;flex-wrap:wrap;
  margin-bottom:34px;padding-bottom:14px;border-bottom:1px solid var(--line);
}
.category-nav a,.category-nav button{
  display:inline-flex;align-items:center;gap:7px;
  min-height:var(--touch);padding:0 14px;
  border:1px solid transparent;background:none;color:var(--body);
  font-size:.82rem;font-weight:500;text-decoration:none;cursor:pointer;
  transition:color .2s,border-color .2s;
}
.category-nav .fas{font-size:.85em;color:var(--gold)}
.category-nav a:hover,.category-nav button:hover{color:var(--ink);border-color:var(--line)}
.category-nav a.active,.category-nav button.active{
  background:var(--main-bg);border-color:var(--main-bg);color:var(--main-ink);
}
.category-nav a.active .fas,.category-nav button.active .fas{color:currentColor}

/* ── Kategorien ── */
.category-section{margin-bottom:48px;scroll-margin-top:20px}
.category-title{
  margin:0 0 5px;font-family:'Cormorant Garamond',Georgia,serif;
  font-size:1.65rem;font-weight:600;color:var(--ink);letter-spacing:.02em;
}
.category-description{margin:0 0 20px;font-size:.86rem;color:var(--muted);font-weight:300;max-width:56ch}

/* ── Duftkarten ── */
.duftliste{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.duft-card{
  position:relative;background:var(--surface);border:1px solid var(--line);
  padding:14px 16px;cursor:pointer;transition:border-color .2s;
}
.duft-card:hover{border-color:var(--gold)}
.duft-card.open{border-color:var(--gold)}
.badge-container{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:9px}
.card-badge{
  display:inline-block;padding:3px 8px;
  font-size:.6rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
  background:var(--gold);color:#fff;
}
.card-badge.newquality-label{background:var(--surface-2);color:var(--gold-deep);border:1px solid var(--line-soft)}
.card-badge.sold-out{background:#8c2f28;color:#fff}

.duft-info{display:flex;align-items:center;gap:14px}
.duft-img{
  flex:0 0 66px;width:66px;height:66px;overflow:hidden;
  background:var(--surface-2);border:1px solid var(--line-soft);
  display:flex;align-items:center;justify-content:center;
}
.duft-img img{width:100%;height:100%;object-fit:cover;display:block}
.placeholder-icon{
  display:flex;align-items:center;justify-content:center;width:100%;height:100%;
  background:var(--surface-2);font-size:1.4rem;color:var(--muted);
}
.duft-header{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.duft-code{
  font-size:.64rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;
  color:var(--gold-deep);
}
.duft-name{
  font-family:'Cormorant Garamond',Georgia,serif;
  font-size:1.24rem;font-weight:600;color:var(--ink);line-height:1.25;
}

/* Duftstil-Farben. Nur als Variable hinterlegt — frueher stand hier ein blosses
   .tag-frisch{background:...}, das auch die Filter-Buttons traf: die bekamen die
   Farbflaeche, behielten aber die dunkle Textfarbe und das goldene Icon. */
.tag-frisch{--tc:#2f7d55}.tag-blumig{--tc:#a8437c}.tag-suess{--tc:#93551a}
.tag-holzig{--tc:#5a4229}.tag-oud{--tc:#6a43a0}.tag-wuerzigz{--tc:#a63a22}

.tag-chips{display:flex;flex-wrap:wrap;gap:4px;margin-top:3px}
.tag-chip{
  display:inline-flex;align-items:center;gap:4px;padding:2px 7px;
  font-size:.58rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase;
  background:var(--tc);color:#fff;white-space:nowrap;
}
.tag-chip .fas{font-size:.9em;color:#fff}

/* Filter-Buttons tragen ihre Duftfarbe dauerhaft — dann aber mit weisser
   Schrift und weissem Icon. Aktiv wird durch einen inneren Ring markiert. */
.filter-tag-btn.tag-frisch,.filter-tag-btn.tag-blumig,.filter-tag-btn.tag-suess,
.filter-tag-btn.tag-holzig,.filter-tag-btn.tag-oud,.filter-tag-btn.tag-wuerzigz{
  background:var(--tc);border-color:var(--tc);color:#fff;
}
.filter-tag-btn.tag-frisch .fas,.filter-tag-btn.tag-blumig .fas,.filter-tag-btn.tag-suess .fas,
.filter-tag-btn.tag-holzig .fas,.filter-tag-btn.tag-oud .fas,.filter-tag-btn.tag-wuerzigz .fas{
  color:#fff;
}
.filter-tag-btn.active{box-shadow:inset 0 0 0 2px rgba(255,255,255,.9)}
.filter-tag-btn.active::after{
  content:'';margin-left:2px;width:6px;height:6px;background:#fff;flex-shrink:0;
}

/* Bewertung */
.avg-rating{margin-top:2px}
.avg-stars{display:inline-flex;align-items:center;gap:2px}
.avg-number{font-size:.72rem;font-weight:600;color:var(--ink);margin-right:5px;font-variant-numeric:tabular-nums}
.star-svg{width:12px;height:12px;display:block}

/* ── Duftnoten ── */
.duftnoten-panel{max-height:0;overflow:hidden;transition:max-height .32s ease}
.duftnoten-panel.open{max-height:900px}
.duftnoten-titel{
  display:flex;align-items:center;gap:8px;margin:16px 0 12px;padding-top:14px;
  border-top:1px solid var(--line);
  font-size:.68rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-deep);
}
.duftnoten-grid{display:flex;flex-direction:column;gap:13px}
.duftnote-item h3{
  margin:0 0 3px;font-size:.66rem;font-weight:700;letter-spacing:.14em;
  text-transform:uppercase;color:var(--muted);
}
.duftnote-item p{margin:0;font-size:.87rem;color:var(--body);font-weight:300;line-height:1.6}

/* ── Aktionen ── */
.card-actions{display:flex;flex-wrap:wrap;gap:7px;margin-top:14px}
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:7px;
  min-height:40px;padding:0 15px;border-radius:0;cursor:pointer;
  font-family:inherit;font-size:.76rem;font-weight:500;text-decoration:none;
  border:1px solid var(--line);background:var(--surface);color:var(--ink);
  transition:border-color .2s,background .2s,color .2s;
}
.btn .fas{font-size:.9em}
.btn:hover{border-color:var(--gold)}
.duft-arrow{flex:1;min-width:130px;background:var(--main-bg);border-color:var(--main-bg);color:var(--main-ink)}
.duft-arrow:hover{border-color:var(--main-bg)}
.duft-arrow-chevron{margin-left:auto;transition:transform .3s}
.duft-card.open .duft-arrow-chevron{transform:rotate(180deg)}
.btn-outline{background:transparent;color:var(--gold-deep);border-color:var(--line)}
.btn-shop .fas{color:var(--gold)}
.btn-shop:hover .fas{color:inherit}

/* ── Merkmale im Fuss: wie auf der Startseite, ohne Kaesten ── */
.main-footer-features{
  margin-top:14px;padding-top:30px;border-top:1px solid var(--line);
  display:flex;flex-direction:column;
}
/* Raster statt Flex: das Markup hat Icon, h3 und p als drei Geschwister ohne
   Wrapper — als Flex-Zeile standen sie nebeneinander statt gestapelt. */
.feature-item{
  display:grid;grid-template-columns:22px 1fr;
  column-gap:14px;row-gap:3px;align-items:start;
  padding:18px 2px;border-top:1px solid var(--line);
}
.feature-item:first-child{border-top:none;padding-top:2px}
.feature-item > .fas{grid-column:1;grid-row:1 / span 2;font-size:1.15rem;color:var(--gold);margin-top:2px}
.feature-item > h3{
  grid-column:2;grid-row:1;margin:0;font-size:.72rem;font-weight:600;
  letter-spacing:.13em;text-transform:uppercase;color:var(--ink);line-height:1.35;
}
.feature-item > p{
  grid-column:2;grid-row:2;margin:0;
  font-size:.84rem;color:var(--body);font-weight:300;line-height:1.55;
}
/* Hervorhebung im Fliesstext bleibt Fliesstext — nicht wie eine zweite
   Ueberschrift setzen, sonst steht "EXTRAIT DE PARFUM" in Versalien daneben. */
.feature-item > p strong{font-weight:600;color:var(--ink);font-size:inherit;letter-spacing:0;text-transform:none}

/* ── Ladeanzeige ── */
.loading-overlay{
  position:fixed;inset:0;background:var(--bg);z-index:9000;
  display:flex;align-items:center;justify-content:center;
  transition:opacity .3s,visibility .3s;
}
.loading-overlay.hidden{opacity:0;visibility:hidden;pointer-events:none}
.loading-spinner{font-size:1.6rem;color:var(--gold)}

/* ── Nach oben ── */
#scrollToTopBtn{
  position:fixed;right:calc(var(--sa-right) + 16px);bottom:calc(var(--sa-bottom) + 16px);
  width:var(--touch);height:var(--touch);border:1px solid var(--line);background:var(--surface);
  color:var(--muted);cursor:pointer;display:flex;align-items:center;justify-content:center;
  opacity:0;pointer-events:none;transition:opacity .25s;z-index:50;
}
#scrollToTopBtn.visible,#scrollToTopBtn.show{opacity:1;pointer-events:auto}

/* ── Fokus ── */
a:focus-visible,button:focus-visible,input:focus-visible{outline:2px solid var(--gold);outline-offset:2px}

@media (max-width:520px){
  .container{padding-left:calc(var(--sa-left) + 14px);padding-right:calc(var(--sa-right) + 14px)}
  .main-header{gap:12px;flex-wrap:wrap}
  .logo img{width:42px}
  .header-content{order:3;flex:1 0 100%}
  .theme-toggle{margin-left:auto}
  .duft-card{padding:13px 13px}
  .duft-info{gap:12px}
  .duft-img{flex:0 0 56px;width:56px;height:56px}
  .duft-name{font-size:1.12rem}
  .card-actions .btn{flex:1;min-width:0;padding:0 10px}
  .duft-arrow{flex:1 0 100%}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}
  html{scroll-behavior:auto}
}


/* ══ Icon-Pfaddaten (aus sprites-full/, ersetzt fa-solid-900 + fa-brands-400) ══ */
.fa-arrow-up{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'%3E%3Cpath d='M342.6 81.4C330.1 68.9 309.8 68.9 297.3 81.4L137.3 241.4C124.8 253.9 124.8 274.2 137.3 286.7C149.8 299.2 170.1 299.2 182.6 286.7L288 181.3L288 552C288 569.7 302.3 584 320 584C337.7 584 352 569.7 352 552L352 181.3L457.4 286.7C469.9 299.2 490.2 299.2 502.7 286.7C515.2 274.2 515.2 253.9 502.7 241.4L342.7 81.4z'/%3E%3C/svg%3E")}
.fa-candy-cane{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'%3E%3Cpath d='M517.8 103.6C548 149.2 552.5 206.9 531.1 256L365.7 256L407.1 214.6C407.9 213.8 408.6 213 409.3 212.2L517.8 103.6zM364 166.9C363.2 167.6 362.4 168.3 361.6 169.1L333.5 197.2C308.5 222.2 268 222.2 243 197.2C218 172.2 218 131.7 243 106.7L271 78.6C325.9 23.8 410.5 17.3 472.5 58.4L364 166.9zM221.7 400L301.7 320L482.7 320L400.2 402.5L400.2 400L221.7 400zM338.7 464L237.4 565.3C212.4 590.3 171.9 590.3 146.9 565.3C121.9 540.3 121.9 499.8 146.9 474.8L157.6 464.1L338.6 464.1z'/%3E%3C/svg%3E")}
.fa-chevron-down{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'%3E%3Cpath d='M297.4 470.6C309.9 483.1 330.2 483.1 342.7 470.6L534.7 278.6C547.2 266.1 547.2 245.8 534.7 233.3C522.2 220.8 501.9 220.8 489.4 233.3L320 402.7L150.6 233.4C138.1 220.9 117.8 220.9 105.3 233.4C92.8 245.9 92.8 266.2 105.3 278.7L297.3 470.7z'/%3E%3C/svg%3E")}
.fa-circle-half-stroke{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'%3E%3Cpath d='M512 320C512 214 426 128 320 128L320 512C426 512 512 426 512 320zM64 320C64 178.6 178.6 64 320 64C461.4 64 576 178.6 576 320C576 461.4 461.4 576 320 576C178.6 576 64 461.4 64 320z'/%3E%3C/svg%3E")}
.fa-clock{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'%3E%3Cpath d='M320 64C461.4 64 576 178.6 576 320C576 461.4 461.4 576 320 576C178.6 576 64 461.4 64 320C64 178.6 178.6 64 320 64zM296 184L296 320C296 328 300 335.5 306.7 340L402.7 404C413.7 411.4 428.6 408.4 436 397.3C443.4 386.2 440.4 371.4 429.3 364L344 307.2L344 184C344 170.7 333.3 160 320 160C306.7 160 296 170.7 296 184z'/%3E%3C/svg%3E")}
.fa-dna{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'%3E%3Cpath d='M480 64C497.7 64 512 78.3 512 96C512 153.8 487.6 200.8 454.6 240.5C430.5 269.4 400.8 295.6 371 320C400.8 344.5 430.5 370.6 454.6 399.5C487.6 439.1 512 486.2 512 544C512 561.7 497.7 576 480 576C462.3 576 448 561.7 448 544L192 544C192 561.7 177.7 576 160 576C142.3 576 128 561.7 128 544C128 486.2 152.4 439.2 185.4 399.5C209.5 370.6 239.2 344.5 269 320C239.2 295.5 209.5 269.4 185.4 240.5C152.4 200.8 128 153.8 128 96C128 78.3 142.3 64 160 64C177.7 64 192 78.3 192 96L448 96C448 78.3 462.3 64 480 64zM411.5 448L228.6 448C220.4 458.5 213.5 469.1 208 480L432.2 480C426.6 469.1 419.7 458.5 411.6 448zM366 400C351.7 387 336.2 374.2 320 361C303.8 374.1 288.3 387 274 400L366 400zM228.5 192L411.4 192C419.6 181.5 426.5 170.9 432 160L207.9 160C213.5 170.9 220.4 181.5 228.5 192zM274 240C288.3 253 303.8 265.8 320 279C336.2 265.9 351.7 253 366 240L274 240z'/%3E%3C/svg%3E")}
.fa-fire{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'%3E%3Cpath d='M256.5 37.6C265.8 29.8 279.5 30.1 288.4 38.5C300.7 50.1 311.7 62.9 322.3 75.9C335.8 92.4 352 114.2 367.6 140.1C372.8 133.3 377.6 127.3 381.8 122.2C382.9 120.9 384 119.5 385.1 118.1C393 108.3 402.8 96 415.9 96C429.3 96 438.7 107.9 446.7 118.1C448 119.8 449.3 121.4 450.6 122.9C460.9 135.3 474.6 153.2 488.3 175.3C515.5 219.2 543.9 281.7 543.9 351.9C543.9 475.6 443.6 575.9 319.9 575.9C196.2 575.9 96 475.7 96 352C96 260.9 137.1 182 176.5 127C196.4 99.3 216.2 77.1 231.1 61.9C239.3 53.5 247.6 45.2 256.6 37.7zM321.7 480C347 480 369.4 473 390.5 459C432.6 429.6 443.9 370.8 418.6 324.6C414.1 315.6 402.6 315 396.1 322.6L370.9 351.9C364.3 359.5 352.4 359.3 346.2 351.4C328.9 329.3 297.1 289 280.9 268.4C275.5 261.5 265.7 260.4 259.4 266.5C241.1 284.3 207.9 323.3 207.9 370.8C207.9 439.4 258.5 480 321.6 480z'/%3E%3C/svg%3E")}
.fa-flag{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'%3E%3Cpath d='M160 96C160 78.3 145.7 64 128 64C110.3 64 96 78.3 96 96L96 544C96 561.7 110.3 576 128 576C145.7 576 160 561.7 160 544L160 422.4L222.7 403.6C264.6 391 309.8 394.9 348.9 414.5C391.6 435.9 441.4 438.5 486.1 421.7L523.2 407.8C535.7 403.1 544 391.2 544 377.8L544 130.1C544 107.1 519.8 92.1 499.2 102.4L487.4 108.3C442.5 130.8 389.6 130.8 344.6 108.3C308.2 90.1 266.3 86.5 227.4 98.2L160 118.4L160 96z'/%3E%3C/svg%3E")}
.fa-flask{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'%3E%3Cpath d='M384 64L224 64C206.3 64 192 78.3 192 96C192 113.7 206.3 128 224 128L224 279.5L103.5 490.3C98.6 499 96 508.7 96 518.7C96 550.4 121.6 576 153.3 576L486.7 576C518.3 576 544 550.4 544 518.7C544 508.7 541.4 498.9 536.5 490.3L416 279.5L416 128C433.7 128 448 113.7 448 96C448 78.3 433.7 64 416 64L384 64zM288 279.5L288 128L352 128L352 279.5C352 290.6 354.9 301.6 360.4 311.3L402 384L238 384L279.6 311.3C285.1 301.6 288 290.7 288 279.5z'/%3E%3C/svg%3E")}
.fa-image{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'%3E%3Cpath d='M160 96C124.7 96 96 124.7 96 160L96 480C96 515.3 124.7 544 160 544L480 544C515.3 544 544 515.3 544 480L544 160C544 124.7 515.3 96 480 96L160 96zM224 176C250.5 176 272 197.5 272 224C272 250.5 250.5 272 224 272C197.5 272 176 250.5 176 224C176 197.5 197.5 176 224 176zM368 288C376.4 288 384.1 292.4 388.5 299.5L476.5 443.5C481 450.9 481.2 460.2 477 467.8C472.8 475.4 464.7 480 456 480L184 480C175.1 480 166.8 475 162.7 467.1C158.6 459.2 159.2 449.6 164.3 442.3L220.3 362.3C224.8 355.9 232.1 352.1 240 352.1C247.9 352.1 255.2 355.9 259.7 362.3L286.1 400.1L347.5 299.6C351.9 292.5 359.6 288.1 368 288.1z'/%3E%3C/svg%3E")}
.fa-leaf{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'%3E%3Cpath d='M535.3 70.7C541.7 64.6 551 62.4 559.6 65.2C569.4 68.5 576 77.7 576 88L576 274.9C576 406.1 467.9 512 337.2 512C260.2 512 193.8 462.5 169.7 393.3C134.3 424.1 112 469.4 112 520C112 533.3 101.3 544 88 544C74.7 544 64 533.3 64 520C64 445.1 102.2 379.1 160.1 340.3C195.4 316.7 237.5 304 280 304L360 304C373.3 304 384 293.3 384 280C384 266.7 373.3 256 360 256L280 256C240.3 256 202.7 264.8 169 280.5C192.3 210.5 258.2 160 336 160C402.4 160 451.8 137.9 484.7 116C503.9 103.2 520.2 87.9 535.4 70.7z'/%3E%3C/svg%3E")}
.fa-mars{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'%3E%3Cpath d='M384 96C384 78.3 398.3 64 416 64L544 64C561.7 64 576 78.3 576 96L576 224C576 241.7 561.7 256 544 256C526.3 256 512 241.7 512 224L512 173.3L417 268.3C436.5 296.7 448 331 448 368.1C448 465.3 369.2 544.1 272 544.1C174.8 544.1 96 465.2 96 368C96 270.8 174.8 192 272 192C309 192 343.4 203.4 371.8 223L466.8 128L416.1 128C398.4 128 384.1 113.7 384.1 96zM272 480C333.9 480 384 429.9 384 368C384 306.1 333.9 256 272 256C210.1 256 160 306.1 160 368C160 429.9 210.1 480 272 480z'/%3E%3C/svg%3E")}
.fa-pepper-hot{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'%3E%3Cpath d='M577 129C586.4 119.6 586.4 104.4 577 95.1C567.6 85.8 552.4 85.7 543.1 95.1L510.9 127.2C484.3 107.6 451.5 96 416 96C380.9 96 348.5 107.3 322.1 126.4C306.1 138.1 316.2 160 336 160L360 160C373.3 160 384 170.7 384 184L384 264C384 277.3 394.7 288 408 288L488 288C501.3 288 512 298.7 512 312L512 336C512 355.8 533.9 365.9 545.6 349.9C564.7 323.5 576 291.1 576 256C576 220.5 564.4 187.7 544.8 161.1L577 129zM302 199.5L142.4 427.5C133.3 440.4 118.7 448 103 448L96 448C69.5 448 48 469.5 48 496C48 522.5 69.5 544 96 544L123.1 544C188.8 544 252.8 523.8 306.6 486.2L472.5 370.1C467 359.9 464 348.2 464 336L408 336C368.2 336 336 303.8 336 264L336 208C323.8 208 312.1 205 302 199.5z'/%3E%3C/svg%3E")}
.fa-search{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'%3E%3Cpath d='M480 272C480 317.9 465.1 360.3 440 394.7L566.6 521.4C579.1 533.9 579.1 554.2 566.6 566.7C554.1 579.2 533.8 579.2 521.3 566.7L394.7 440C360.3 465.1 317.9 480 272 480C157.1 480 64 386.9 64 272C64 157.1 157.1 64 272 64C386.9 64 480 157.1 480 272zM272 416C351.5 416 416 351.5 416 272C416 192.5 351.5 128 272 128C192.5 128 128 192.5 128 272C128 351.5 192.5 416 272 416z'/%3E%3C/svg%3E")}
.fa-seedling{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'%3E%3Cpath d='M576 96C576 204.1 499.4 294.3 397.6 315.4C389.7 257.3 363.6 205 325.1 164.5C365.2 104 433.9 64 512 64L544 64C561.7 64 576 78.3 576 96zM64 160C64 142.3 78.3 128 96 128L128 128C251.7 128 352 228.3 352 352L352 544C352 561.7 337.7 576 320 576C302.3 576 288 561.7 288 544L288 384C164.3 384 64 283.7 64 160z'/%3E%3C/svg%3E")}
.fa-shopping-bag{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'%3E%3Cpath d='M256 144C256 108.7 284.7 80 320 80C355.3 80 384 108.7 384 144L384 192L256 192L256 144zM208 192L144 192C117.5 192 96 213.5 96 240L96 448C96 501 139 544 192 544L448 544C501 544 544 501 544 448L544 240C544 213.5 522.5 192 496 192L432 192L432 144C432 82.1 381.9 32 320 32C258.1 32 208 82.1 208 144L208 192zM232 240C245.3 240 256 250.7 256 264C256 277.3 245.3 288 232 288C218.7 288 208 277.3 208 264C208 250.7 218.7 240 232 240zM384 264C384 250.7 394.7 240 408 240C421.3 240 432 250.7 432 264C432 277.3 421.3 288 408 288C394.7 288 384 277.3 384 264z'/%3E%3C/svg%3E")}
.fa-spinner{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'%3E%3Cpath d='M272 112C272 85.5 293.5 64 320 64C346.5 64 368 85.5 368 112C368 138.5 346.5 160 320 160C293.5 160 272 138.5 272 112zM272 528C272 501.5 293.5 480 320 480C346.5 480 368 501.5 368 528C368 554.5 346.5 576 320 576C293.5 576 272 554.5 272 528zM112 272C138.5 272 160 293.5 160 320C160 346.5 138.5 368 112 368C85.5 368 64 346.5 64 320C64 293.5 85.5 272 112 272zM480 320C480 293.5 501.5 272 528 272C554.5 272 576 293.5 576 320C576 346.5 554.5 368 528 368C501.5 368 480 346.5 480 320zM139 433.1C157.8 414.3 188.1 414.3 206.9 433.1C225.7 451.9 225.7 482.2 206.9 501C188.1 519.8 157.8 519.8 139 501C120.2 482.2 120.2 451.9 139 433.1zM139 139C157.8 120.2 188.1 120.2 206.9 139C225.7 157.8 225.7 188.1 206.9 206.9C188.1 225.7 157.8 225.7 139 206.9C120.2 188.1 120.2 157.8 139 139zM501 433.1C519.8 451.9 519.8 482.2 501 501C482.2 519.8 451.9 519.8 433.1 501C414.3 482.2 414.3 451.9 433.1 433.1C451.9 414.3 482.2 414.3 501 433.1z'/%3E%3C/svg%3E")}
.fa-star{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'%3E%3Cpath d='M341.5 45.1C337.4 37.1 329.1 32 320.1 32C311.1 32 302.8 37.1 298.7 45.1L225.1 189.3L65.2 214.7C56.3 216.1 48.9 222.4 46.1 231C43.3 239.6 45.6 249 51.9 255.4L166.3 369.9L141.1 529.8C139.7 538.7 143.4 547.7 150.7 553C158 558.3 167.6 559.1 175.7 555L320.1 481.6L464.4 555C472.4 559.1 482.1 558.3 489.4 553C496.7 547.7 500.4 538.8 499 529.8L473.7 369.9L588.1 255.4C594.5 249 596.7 239.6 593.9 231C591.1 222.4 583.8 216.1 574.8 214.7L415 189.3L341.5 45.1z'/%3E%3C/svg%3E")}
.fa-tree{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'%3E%3Cpath d='M320 32C327 32 333.7 35.1 338.3 40.5L474.3 200.5C480.4 207.6 481.7 217.6 477.8 226.1C473.9 234.6 465.4 240 456 240L431.1 240L506.3 328.5C512.4 335.6 513.7 345.6 509.8 354.1C505.9 362.6 497.4 368 488 368L449.5 368L538.3 472.5C544.4 479.6 545.7 489.6 541.8 498.1C537.9 506.6 529.4 512 520 512L352 512L352 576C352 593.7 337.7 608 320 608C302.3 608 288 593.7 288 576L288 512L120 512C110.6 512 102.1 506.6 98.2 498.1C94.3 489.6 95.6 479.6 101.7 472.5L190.5 368L152 368C142.6 368 134.1 362.6 130.2 354.1C126.3 345.6 127.6 335.6 133.7 328.5L208.9 240L184 240C174.6 240 166.1 234.6 162.2 226.1C158.3 217.6 159.6 207.6 165.7 200.5L301.7 40.5C306.3 35.1 313 32 320 32z'/%3E%3C/svg%3E")}
.fa-venus{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'%3E%3Cpath d='M208 240C208 178.1 258.1 128 320 128C381.9 128 432 178.1 432 240C432 301.9 381.9 352 320 352C258.1 352 208 301.9 208 240zM351.9 413.1C433.9 398.1 496 326.3 496 240C496 142.8 417.2 64 320 64C222.8 64 144 142.8 144 240C144 326.3 206.1 398.1 288.1 413.1C288 414.1 288 415 288 416L288 480L256 480C238.3 480 224 494.3 224 512C224 529.7 238.3 544 256 544L288 544L288 576C288 593.7 302.3 608 320 608C337.7 608 352 593.7 352 576L352 544L384 544C401.7 544 416 529.7 416 512C416 494.3 401.7 480 384 480L352 480L352 416C352 415 352 414.1 351.9 413.1z'/%3E%3C/svg%3E")}
.fa-venus-mars{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'%3E%3Cpath d='M480 0C462.3 0 448 14.3 448 32C448 49.7 462.3 64 480 64L530.7 64L474 120.7C447.7 105 416.9 96 384 96C348.6 96 315.6 106.5 288 124.5C260.4 106.5 227.4 96 192 96C94.8 96 16 174.8 16 272C16 358.3 78.1 430.1 160 445.1L160 480L128 480C110.3 480 96 494.3 96 512C96 529.7 110.3 544 128 544L160 544L160 576C160 593.7 174.3 608 192 608C209.7 608 224 593.7 224 576L224 544L256 544C273.7 544 288 529.7 288 512C288 494.3 273.7 480 256 480L224 480L224 445.1C247.3 440.8 268.9 432 288 419.5C315.6 437.5 348.6 448 384 448C481.2 448 560 369.2 560 272C560 230.9 545.9 193 522.2 163L576 109.3L576 160C576 177.7 590.3 192 608 192C625.7 192 640 177.7 640 160L640 32C640 14.3 625.7 0 608 0L480 0zM336 373.2C356.2 344.6 368 309.7 368 272C368 234.3 356.2 199.4 336 170.8C350.6 163.9 366.8 160 384 160C445.9 160 496 210.1 496 272C496 333.9 445.9 384 384 384C366.8 384 350.5 380.1 336 373.2zM288 214.3C298.2 231.2 304 250.9 304 272C304 293.1 298.2 312.9 288 329.7C277.8 312.8 272 293.1 272 272C272 250.9 277.8 231.1 288 214.3zM240 170.8C219.8 199.4 208 234.3 208 272C208 309.7 219.8 344.6 240 373.2C225.5 380.1 209.2 384 192 384C130.1 384 80 333.9 80 272C80 210.1 130.1 160 192 160C209.2 160 225.5 163.9 240 170.8z'/%3E%3C/svg%3E")}
.fa-wind{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'%3E%3Cpath d='M352 96C352 113.7 366.3 128 384 128L424 128C437.3 128 448 138.7 448 152C448 165.3 437.3 176 424 176L96 176C78.3 176 64 190.3 64 208C64 225.7 78.3 240 96 240L424 240C472.6 240 512 200.6 512 152C512 103.4 472.6 64 424 64L384 64C366.3 64 352 78.3 352 96zM416 448C416 465.7 430.3 480 448 480L480 480C533 480 576 437 576 384C576 331 533 288 480 288L96 288C78.3 288 64 302.3 64 320C64 337.7 78.3 352 96 352L480 352C497.7 352 512 366.3 512 384C512 401.7 497.7 416 480 416L448 416C430.3 416 416 430.3 416 448zM192 576L232 576C280.6 576 320 536.6 320 488C320 439.4 280.6 400 232 400L96 400C78.3 400 64 414.3 64 432C64 449.7 78.3 464 96 464L232 464C245.3 464 256 474.7 256 488C256 501.3 245.3 512 232 512L192 512C174.3 512 160 526.3 160 544C160 561.7 174.3 576 192 576z'/%3E%3C/svg%3E")}
.fa-sun{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'%3E%3Cpath d='M210.2 53.9C217.6 50.8 226 51.7 232.7 56.1L320.5 114.3L408.3 56.1C415 51.7 423.4 50.9 430.8 53.9C438.2 56.9 443.4 63.5 445 71.3L465.9 174.5L569.1 195.4C576.9 197 583.5 202.4 586.5 209.7C589.5 217 588.7 225.5 584.3 232.2L526.1 320L584.3 407.8C588.7 414.5 589.5 422.9 586.5 430.3C583.5 437.7 576.9 443.1 569.1 444.6L465.8 465.4L445 568.7C443.4 576.5 438 583.1 430.7 586.1C423.4 589.1 414.9 588.3 408.2 583.9L320.4 525.7L232.6 583.9C225.9 588.3 217.5 589.1 210.1 586.1C202.7 583.1 197.3 576.5 195.8 568.7L175 465.4L71.7 444.5C63.9 442.9 57.3 437.5 54.3 430.2C51.3 422.9 52.1 414.4 56.5 407.7L114.7 320L56.5 232.2C52.1 225.5 51.3 217.1 54.3 209.7C57.3 202.3 63.9 196.9 71.7 195.4L175 174.6L195.9 71.3C197.5 63.5 202.9 56.9 210.2 53.9zM239.6 320C239.6 275.6 275.6 239.6 320 239.6C364.4 239.6 400.4 275.6 400.4 320C400.4 364.4 364.4 400.4 320 400.4C275.6 400.4 239.6 364.4 239.6 320zM448.4 320C448.4 249.1 390.9 191.6 320 191.6C249.1 191.6 191.6 249.1 191.6 320C191.6 390.9 249.1 448.4 320 448.4C390.9 448.4 448.4 390.9 448.4 320z'/%3E%3C/svg%3E")}