/*
 * Speed Launch · Enterprise icon system
 * Monochrome stroke icons rendered through CSS masks so they inherit `color`
 * and look identical on the dark sidebar, light cards and dark theme.
 * Replaces generated-icons.css (soft-3D raster icons) inside the product UI.
 */

:root {
  --sli-dashboard: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='7.5' height='9' rx='1.8'/%3E%3Crect x='13.5' y='3' width='7.5' height='5.5' rx='1.8'/%3E%3Crect x='13.5' y='12' width='7.5' height='9' rx='1.8'/%3E%3Crect x='3' y='15.5' width='7.5' height='5.5' rx='1.8'/%3E%3C/svg%3E");
  --sli-landing: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='3' width='16' height='18' rx='2.2'/%3E%3Cpath d='M8 8h8M8 12h8M8 16h5'/%3E%3C/svg%3E");
  --sli-advertising: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 10.5v3a1.5 1.5 0 0 0 1.5 1.5H7l5.5 4V5L7 9H4.5A1.5 1.5 0 0 0 3 10.5Z'/%3E%3Cpath d='M15.5 9.5a3.5 3.5 0 0 1 0 5M18 7a7 7 0 0 1 0 10'/%3E%3C/svg%3E");
  --sli-orders: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5.5 8h13l-1 12h-11l-1-12Z'/%3E%3Cpath d='M9 8V6.5a3 3 0 0 1 6 0V8'/%3E%3C/svg%3E");
  --sli-integrations: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='6' cy='6.5' r='2.5'/%3E%3Ccircle cx='18' cy='6.5' r='2.5'/%3E%3Ccircle cx='12' cy='18' r='2.5'/%3E%3Cpath d='M7.8 8.3 10.7 16M16.2 8.3 13.3 16M8.5 6.5h7'/%3E%3C/svg%3E");
  --sli-team: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9.5' cy='8' r='3.5'/%3E%3Cpath d='M3.5 20v-.8a6 6 0 0 1 12 0v.8'/%3E%3Cpath d='M16 4.6a3.5 3.5 0 0 1 0 6.8M20.5 20v-.8a6 6 0 0 0-3.8-5.6'/%3E%3C/svg%3E");
  --sli-analytics: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 20v-7M11 20V5M17 20v-9M3 20h18'/%3E%3C/svg%3E");
  --sli-automation: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M13 2.5 4.5 13.5H11l-1 8 8.5-11H12l1-8Z'/%3E%3C/svg%3E");
  --sli-media: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2.2'/%3E%3Ccircle cx='9' cy='10' r='1.6'/%3E%3Cpath d='m21 16.5-5-5-8 8'/%3E%3C/svg%3E");
  --sli-design: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m12 3.5 8.5 4.5L12 12.5 3.5 8 12 3.5Z'/%3E%3Cpath d='m3.5 12.5 8.5 4.5 8.5-4.5M3.5 16.5 12 21l8.5-4.5'/%3E%3C/svg%3E");
  --sli-publish: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8.5'/%3E%3Cpath d='M3.5 12h17M12 3.5c2.6 2.4 3.9 5.3 3.9 8.5s-1.3 6.1-3.9 8.5c-2.6-2.4-3.9-5.3-3.9-8.5s1.3-6.1 3.9-8.5Z'/%3E%3C/svg%3E");
  --sli-hosting: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='6.5' rx='1.8'/%3E%3Crect x='3' y='13.5' width='18' height='6.5' rx='1.8'/%3E%3Cpath d='M7 7.25h.01M7 16.75h.01'/%3E%3C/svg%3E");
  --sli-ai: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m11 3 1.9 5.1L18 10l-5.1 1.9L11 17l-1.9-5.1L4 10l5.1-1.9L11 3Z'/%3E%3Cpath d='m18.5 15 .8 2.2 2.2.8-2.2.8-.8 2.2-.8-2.2-2.2-.8 2.2-.8.8-2.2Z'/%3E%3C/svg%3E");
  --sli-settings: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 7h9M17 7h3M4 12h3M11 12h9M4 17h11M19 17h1'/%3E%3Ccircle cx='15' cy='7' r='2'/%3E%3Ccircle cx='9' cy='12' r='2'/%3E%3Ccircle cx='17' cy='17' r='2'/%3E%3C/svg%3E");
  --sli-support: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8.5'/%3E%3Cpath d='M9.6 9.6a2.5 2.5 0 1 1 3.4 2.3c-.7.3-1 .9-1 1.6M12 16.8h.01'/%3E%3C/svg%3E");
  --sli-telegram: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m20.5 3.5-9 9M20.5 3.5 14.5 20.5l-3-8-8-3 17-6Z'/%3E%3C/svg%3E");
  --sli-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='6.5'/%3E%3Cpath d='m20 20-4.2-4.2'/%3E%3C/svg%3E");
  --sli-plus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E");
  --sli-logout: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 4H6a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h4M15 8l4 4-4 4M19 12H9'/%3E%3C/svg%3E");
  --sli-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 6 6 6-6 6'/%3E%3C/svg%3E");
  --sli-check: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7.5'/%3E%3C/svg%3E");
  --sli-help: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8.5'/%3E%3Cpath d='M9.6 9.6a2.5 2.5 0 1 1 3.4 2.3c-.7.3-1 .9-1 1.6M12 16.8h.01'/%3E%3C/svg%3E");
  --sli-close: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 6l12 12M18 6 6 18'/%3E%3C/svg%3E");
  --sli-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E");
}

/* Base: any element carrying data-sl-icon becomes a monochrome icon box. */
[data-sl-icon],
[data-sl-section-icon]::before,
.sli {
  --sl-icon: none;
  display: inline-grid;
  place-items: center;
  flex: 0 0 auto;
  width: 20px;
  height: 20px;
  color: currentColor;
  font-size: 0;
  line-height: 0;
  overflow: visible;
}

[data-sl-icon] > :is(svg, img) { display: none; }

[data-sl-icon]::before,
.sli::before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  background-color: currentColor;
  -webkit-mask: var(--sl-icon) center / contain no-repeat;
  mask: var(--sl-icon) center / contain no-repeat;
}

[data-sl-icon="dashboard"] { --sl-icon: var(--sli-dashboard); }
[data-sl-icon="landing"] { --sl-icon: var(--sli-landing); }
[data-sl-icon="advertising"] { --sl-icon: var(--sli-advertising); }
[data-sl-icon="orders"] { --sl-icon: var(--sli-orders); }
[data-sl-icon="integrations"] { --sl-icon: var(--sli-integrations); }
[data-sl-icon="team"] { --sl-icon: var(--sli-team); }
[data-sl-icon="analytics"] { --sl-icon: var(--sli-analytics); }
[data-sl-icon="automation"] { --sl-icon: var(--sli-automation); }
[data-sl-icon="media"] { --sl-icon: var(--sli-media); }
[data-sl-icon="design"] { --sl-icon: var(--sli-design); }
[data-sl-icon="publish"] { --sl-icon: var(--sli-publish); }
[data-sl-icon="hosting"] { --sl-icon: var(--sli-hosting); }
[data-sl-icon="ai"] { --sl-icon: var(--sli-ai); }
[data-sl-icon="settings"] { --sl-icon: var(--sli-settings); }
[data-sl-icon="support"] { --sl-icon: var(--sli-support); }
[data-sl-icon="telegram"] { --sl-icon: var(--sli-telegram); }

/* Section intro icons are pseudo-elements: keep the same masks. */
[data-sl-section-icon="advertising"]::before { --sl-icon: var(--sli-advertising); }
[data-sl-section-icon="orders"]::before { --sl-icon: var(--sli-orders); }
[data-sl-section-icon="team"]::before { --sl-icon: var(--sli-team); }
[data-sl-section-icon="landing"]::before { --sl-icon: var(--sli-landing); }
[data-sl-section-icon="integrations"]::before { --sl-icon: var(--sli-integrations); }
[data-sl-section-icon]::before {
  content: "";
  background-color: currentColor;
  -webkit-mask: var(--sl-icon) center / contain no-repeat;
  mask: var(--sl-icon) center / contain no-repeat;
}

/* Utility icon glyphs for the enterprise shell (search, plus, logout …). */
.sli-search { --sl-icon: var(--sli-search); }
.sli-plus { --sl-icon: var(--sli-plus); }
.sli-logout { --sl-icon: var(--sli-logout); }
.sli-chevron { --sl-icon: var(--sli-chevron); }
.sli-check { --sl-icon: var(--sli-check); }
.sli-help { --sl-icon: var(--sli-help); }
.sli-close { --sl-icon: var(--sli-close); }
.sli-arrow { --sl-icon: var(--sli-arrow); }
