@charset "UTF-8";

/*
 * 플랫폼 공용 아이콘 세트 ($Pytha).
 *
 * 컨벤션: 화면 마크업/JS 에 <svg> 태그를 인라인으로 박지 말고, 아이콘은 외부 svg 파일 + 이 스타일시트로 쓴다.
 *   사용:  <span class="svgico ic-plus"></span>
 * 이 CSS 는 공용 레이아웃(adminLayout·defaultLayout) head 에서 전역 링크되므로 개별 화면에서 따로 link 하지 않아도 된다.
 *
 * 왜 <img> 가 아니라 mask 인가:
 *   아이콘 색을 CSS 로 제어(currentColor 상속: 테마색·hover·활성/비활성 색)해야 하는데 <img> 는 색을 못 바꾼다.
 *   mask 는 svg 의 alpha(모양)만 쓰고 실제 색은 background-color: currentColor 가 결정하므로 색 상속이 유지된다.
 *
 * 크기: 기본 16px. 화면별로 다른 크기는 각 화면 CSS 에서 `.컨텍스트 .svgico { width; height }` 로 덮는다.
 * 새 아이콘 추가: static/images/icons/ 에 <name>.svg 를 두고 아래에 `.ic-<name>` 한 줄을 추가.
 * url 은 이 파일(/css/pytha/) 기준 상대경로라 컨텍스트 루트가 바뀌어도 안전하다.
 */

.svgico {
	display: inline-block;
	width: 16px; height: 16px;
	background-color: currentColor;
	-webkit-mask: var(--svgico) no-repeat center / contain;
	        mask: var(--svgico) no-repeat center / contain;
	flex-shrink: 0;
}

.ic-plus   { --svgico: url("../../images/icons/plus.svg"); }
.ic-info   { --svgico: url("../../images/icons/info.svg"); }
.ic-edit   { --svgico: url("../../images/icons/edit.svg"); }
.ic-trash  { --svgico: url("../../images/icons/trash.svg"); }
.ic-grid   { --svgico: url("../../images/icons/grid.svg"); }
.ic-close  { --svgico: url("../../images/icons/close.svg"); }
.ic-eye    { --svgico: url("../../images/icons/eye.svg"); }
.ic-eyeoff { --svgico: url("../../images/icons/eye-off.svg"); }
.ic-user   { --svgico: url("../../images/icons/user.svg"); }
.ic-download { --svgico: url("../../images/icons/download.svg"); }