/**
 * Custom Icons — editor and front-end display styles.
 *
 * Icons use background-image so full-colour SVGs render correctly.
 *
 * To add a new icon:
 *   1. Drop its .svg into icons/
 *   2. Register it at Configuration → Content authoring → Custom Icons
 *   3. Add a rule below
 *   No JS rebuild needed.
 */

/* ── Base styles ─────────────────────────────────────────────────────────── */
.custom-icon {
  display: inline-block;
  width: 1em;
  height: 1em;
  min-width: 16px;
  min-height: 16px;
  vertical-align: middle;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

/* ── Editor-only: outline so authors can see/select the icon widget ──────── */
.ck-content .custom-icon {
  outline: 1px dashed #aaa;
  outline-offset: 1px;
}

/* ── Per-icon rules ──────────────────────────────────────────────────────── */

.custom-icon--arrow_right {
  background-image: url('../icons/arrow-right.svg');
}

.custom-icon--arrow_left {
  background-image: url('../icons/arrow-left.svg');
}

.custom-icon--star {
  background-image: url('../icons/star.svg');
}

.custom-icon--checkmark {
  background-image: url('../icons/checkmark.svg');
}

.custom-icon--info {
  background-image: url('../icons/info.svg');
}

.custom-icon--warning {
  background-image: url('../icons/warning.svg');
}

.custom-icon--standards {
  background-image: url('../icons/standards.svg');
}

.custom-icon--options {
  background-image: url('../icons/options.svg');
}

.custom-icon--square {
  background-image: url('../icons/square.svg');
}
