/* CI icon classes (renamed from mockup nx-icon-*). SVG masks so glyphs do not depend on a third-party icon font. */
[class^="ci-icon-"],
[class*=" ci-icon-"] {
    display: inline-block;
    width: 1em;
    height: 1em;
    background-color: currentColor;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: contain;
    mask-size: contain;
    vertical-align: middle;
}

.ci-icon-user {
    -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' d='M12 12c2.7 0 4.8-2.1 4.8-4.8S14.7 2.4 12 2.4 7.2 4.5 7.2 7.2 9.3 12 12 12zm0 2.4c-3.2 0-9.6 1.6-9.6 4.8V22h19.2v-2.8c0-3.2-6.4-4.8-9.6-4.8z'/></svg>");
    mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' d='M12 12c2.7 0 4.8-2.1 4.8-4.8S14.7 2.4 12 2.4 7.2 4.5 7.2 7.2 9.3 12 12 12zm0 2.4c-3.2 0-9.6 1.6-9.6 4.8V22h19.2v-2.8c0-3.2-6.4-4.8-9.6-4.8z'/></svg>");
}

.ci-icon-lock {
    -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' d='M17 8h-1V6c0-2.2-1.8-4-4-4S8 3.8 8 6v2H7c-1.1 0-2 .9-2 2v10c0 1.1.9 2 2 2h10c1.1 0 2-.9 2-2V10c0-1.1-.9-2-2-2zm-7-2c0-1.1.9-2 2-2s2 .9 2 2v2h-4V6zm5 12H9v-2h6v2zm0-4H9v-2h6v2z'/></svg>");
    mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' d='M17 8h-1V6c0-2.2-1.8-4-4-4S8 3.8 8 6v2H7c-1.1 0-2 .9-2 2v10c0 1.1.9 2 2 2h10c1.1 0 2-.9 2-2V10c0-1.1-.9-2-2-2zm-7-2c0-1.1.9-2 2-2s2 .9 2 2v2h-4V6zm5 12H9v-2h6v2zm0-4H9v-2h6v2z'/></svg>");
}

.ci-icon-reports {
    -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' d='M4 20h3V10H4v10zm6.5 0h3V4h-3v16zM17 20h3v-7h-3v7z'/></svg>");
    mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' d='M4 20h3V10H4v10zm6.5 0h3V4h-3v16zM17 20h3v-7h-3v7z'/></svg>");
}

.ci-icon-feedback {
    -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' d='M20 2H4C2.9 2 2 2.9 2 4v12c0 1.1.9 2 2 2h4l4 4 4-4h4c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm-2 10H6v-2h12v2zm0-3H6V7h12v2z'/></svg>");
    mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' d='M20 2H4C2.9 2 2 2.9 2 4v12c0 1.1.9 2 2 2h4l4 4 4-4h4c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm-2 10H6v-2h12v2zm0-3H6V7h12v2z'/></svg>");
}

.ci-icon-homebuilding {
    -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' d='M12 3L2 12h3v9h6v-6h2v6h6v-9h3L12 3z'/></svg>");
    mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' d='M12 3L2 12h3v9h6v-6h2v6h6v-9h3L12 3z'/></svg>");
}

.ci-icon-tlbr-next {
    -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' d='M9.3 6.3L8 7.6l4.6 4.4L8 16.4l1.3 1.3 6-5.7z'/></svg>");
    mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' d='M9.3 6.3L8 7.6l4.6 4.4L8 16.4l1.3 1.3 6-5.7z'/></svg>");
}

.ci-icon-envelope {
    -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' d='M20 4H4C2.9 4 2 4.9 2 6v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm0 4l-8 5-8-5V6l8 5 8-5v2z'/></svg>");
    mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' d='M20 4H4C2.9 4 2 4.9 2 6v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm0 4l-8 5-8-5V6l8 5 8-5v2z'/></svg>");
}

.ci-sso-icon {
    display: inline-block;
    width: 18px;
    height: 18px;
    flex: 0 0 18px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

.ci-icon-okta {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><circle cx='12' cy='12' r='4.1' fill='%2300297A'/><circle cx='12' cy='4.3' r='2.15' fill='%2300297A'/><circle cx='18.6' cy='7.3' r='2.15' fill='%2300297A'/><circle cx='18.6' cy='16.7' r='2.15' fill='%2300297A'/><circle cx='12' cy='19.7' r='2.15' fill='%2300297A'/><circle cx='5.4' cy='16.7' r='2.15' fill='%2300297A'/><circle cx='5.4' cy='7.3' r='2.15' fill='%2300297A'/></svg>");
}

.ci-icon-entra {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 21 21'><rect x='1' y='1' width='9' height='9' fill='%23F25022'/><rect x='11' y='1' width='9' height='9' fill='%237FBA00'/><rect x='1' y='11' width='9' height='9' fill='%2300A4EF'/><rect x='11' y='11' width='9' height='9' fill='%23FFB900'/></svg>");
}
