/* ================================================================
   ShaDey Inc. Shared Icons
   SVG-based icon system replacing Unicode/emoji pseudo-element icons.
   Uses CSS mask-image so icons inherit currentColor.
   ================================================================ */

/* ---------- Icon Data URIs ---------- */
:root {
  --ico-check: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23000' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 8.5L6.5 12 13 4'/%3E%3C/svg%3E");
  --ico-cross: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23000' stroke-width='2.5' stroke-linecap='round'%3E%3Cpath d='M4 4L12 12M12 4L4 12'/%3E%3C/svg%3E");
  --ico-warn: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23000' stroke-width='1.5' stroke-linejoin='round'%3E%3Cpath d='M8 1.5L14.5 13.5H1.5Z'/%3E%3Cpath d='M8 6v3.5' stroke-linecap='round'/%3E%3Ccircle cx='8' cy='11.5' r='.75' fill='%23000' stroke='none'/%3E%3C/svg%3E");
  --ico-arrow-r: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 8h12M10 4l4 4-4 4'/%3E%3C/svg%3E");
  --ico-arrow-l: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 8H2M6 4L2 8l4 4'/%3E%3C/svg%3E");
  --ico-chevron-r: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23000' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 3l5 5-5 5'/%3E%3C/svg%3E");
  --ico-chevron-d: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23000' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6l5 5 5-5'/%3E%3C/svg%3E");
  --ico-chart: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M4 13V8M8 13V4M12 13V6'/%3E%3C/svg%3E");
  --ico-dot: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='3' fill='%23000'/%3E%3C/svg%3E");
}

/* ---------- Inline SVG icon base ---------- */
.ico-i {
  display: inline-block;
  width: 1em;
  height: 1em;
  vertical-align: -0.125em;
  flex-shrink: 0;
  fill: none;
  stroke: currentColor;
}

/* ---------- CSS mask-icon helper ----------
   Used by pseudo-elements. Apply this pattern:

   .some-list li::before {
     content: '';
     display: inline-block;
     width: 0.75em; height: 0.75em;
     background: currentColor;
     -webkit-mask: var(--ico-check) no-repeat center / contain;
             mask: var(--ico-check) no-repeat center / contain;
   }
   ----------------------------------------- */

/* ---------- Badge separator dot ---------- */
.badge-sep {
  display: inline-block;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: currentColor;
  opacity: 0.5;
  vertical-align: middle;
  margin: 0 6px;
}