@charset "UTF-8";
/* =====================================================================
   icons.css — 선(stroke) 아이콘 세트

   구현 방식 : CSS mask + background-color:currentColor
     · 글자색을 따라간다 → 버튼 hover 로 색이 바뀌면 아이콘도 같이 바뀐다
     · 요청 0건(data URI), JS 0줄 → CSP(script-src 'self') 와 무관
     · img-src 'self' data: 안에서 동작한다(mask-image 는 img-src 가 관장)
   도형은 24×24 그리드에 stroke-width 2, 둥근 끝 — 한 세트로 보이게 통일했다.

   쓰는 법 : <span class="ic ic-search"></span>
             크기는 .ic-sm(13) / 기본(15) / .ic-lg(18)
   ===================================================================== */

.ic{
	display:inline-block; flex:none;
	width:15px; height:15px;
	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:-2px;
}
.ic-sm{ width:13px; height:13px; vertical-align:-1px; }
.ic-lg{ width:18px; height:18px; vertical-align:-3px; }
.ic-xl{ width:20px; height:20px; }

/* 버튼 안에서 글자와의 간격 */
.la-button .ic{ margin-right:5px; }

/* ── 조회·검색 ── */
.ic-search{ -webkit-mask-image:var(--i-search); mask-image:var(--i-search); }
.ic-filter{ -webkit-mask-image:var(--i-filter); mask-image:var(--i-filter); }

/* ── 편집 ── */
.ic-plus  { -webkit-mask-image:var(--i-plus);   mask-image:var(--i-plus); }
.ic-save  { -webkit-mask-image:var(--i-save);   mask-image:var(--i-save); }
.ic-check { -webkit-mask-image:var(--i-check);  mask-image:var(--i-check); }
.ic-trash { -webkit-mask-image:var(--i-trash);  mask-image:var(--i-trash); }
.ic-undo  { -webkit-mask-image:var(--i-undo);   mask-image:var(--i-undo); }
.ic-x     { -webkit-mask-image:var(--i-x);      mask-image:var(--i-x); }

/* ── 파일 ── */
.ic-upload  { -webkit-mask-image:var(--i-upload);   mask-image:var(--i-upload); }
.ic-download{ -webkit-mask-image:var(--i-download); mask-image:var(--i-download); }
.ic-file    { -webkit-mask-image:var(--i-file);     mask-image:var(--i-file); }
.ic-folder  { -webkit-mask-image:var(--i-folder);   mask-image:var(--i-folder); }
.ic-list    { -webkit-mask-image:var(--i-list);     mask-image:var(--i-list); }

/* ── 보안 ── */
.ic-unlock{ -webkit-mask-image:var(--i-unlock); mask-image:var(--i-unlock); }
.ic-key   { -webkit-mask-image:var(--i-key);    mask-image:var(--i-key); }

/* ── 모듈(레일) ── */
.ic-cart    { -webkit-mask-image:var(--i-cart);     mask-image:var(--i-cart); }
.ic-database{ -webkit-mask-image:var(--i-database); mask-image:var(--i-database); }
.ic-settings{ -webkit-mask-image:var(--i-settings); mask-image:var(--i-settings); }
.ic-users   { -webkit-mask-image:var(--i-users);    mask-image:var(--i-users); }
.ic-grid    { -webkit-mask-image:var(--i-grid);     mask-image:var(--i-grid); }
.ic-shield  { -webkit-mask-image:var(--i-shield);   mask-image:var(--i-shield); }
.ic-sliders { -webkit-mask-image:var(--i-sliders);  mask-image:var(--i-sliders); }
.ic-tag     { -webkit-mask-image:var(--i-tag);      mask-image:var(--i-tag); }
.ic-building{ -webkit-mask-image:var(--i-building); mask-image:var(--i-building); }
.ic-bell    { -webkit-mask-image:var(--i-bell);     mask-image:var(--i-bell); }


/* ── 도형 정의 (한 곳에 모아 둔다 — 아이콘 교체 시 여기만 고친다) ──
   stroke='%23000' = 검정. mask 는 알파만 보므로 색은 의미 없고 불투명이면 된다. */
:root{
	--i-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='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20.5 20.5l-4.2-4.2'/%3E%3C/svg%3E");
	--i-filter:  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='M3 5h18l-7 8v6l-4 2v-8z'/%3E%3C/svg%3E");
	--i-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");
	--i-save:    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='M19 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h11l5 5v11a2 2 0 0 1-2 2z'/%3E%3Cpath d='M17 21v-8H7v8'/%3E%3Cpath d='M7 3v5h7'/%3E%3C/svg%3E");
	--i-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='M20 6L9 17l-5-5'/%3E%3C/svg%3E");
	--i-trash:   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='M4 7h16M9.5 7V4h5v3M6.5 7l1 13h9l1-13'/%3E%3C/svg%3E");
	--i-undo:    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='M4 5v6h6'/%3E%3Cpath d='M4.5 11a8 8 0 1 1 1.2 6.5'/%3E%3C/svg%3E");
	--i-x:       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'%3E%3Cpath d='M18 6L6 18M6 6l12 12'/%3E%3C/svg%3E");
	--i-upload:  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 16V4M7 9l5-5 5 5M4 20h16'/%3E%3C/svg%3E");
	--i-download: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 4v12M7 11l5 5 5-5M4 20h16'/%3E%3C/svg%3E");
	--i-file:    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='M14 3H7a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V8z'/%3E%3Cpath d='M14 3v5h5'/%3E%3C/svg%3E");
	--i-folder:  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='M3 7a2 2 0 0 1 2-2h4l2 2h8a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z'/%3E%3C/svg%3E");
	--i-list:    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='M8 6h13M8 12h13M8 18h13M3.5 6h.01M3.5 12h.01M3.5 18h.01'/%3E%3C/svg%3E");
	--i-unlock:  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%3Crect x='4' y='11' width='16' height='10' rx='2'/%3E%3Cpath d='M8 11V7a4 4 0 0 1 7.5-2'/%3E%3C/svg%3E");
	--i-key:     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%3Ccircle cx='8' cy='16' r='4'/%3E%3Cpath d='M11 13l9-9M17.5 6.5l2 2M15 9l2 2'/%3E%3C/svg%3E");
	--i-cart:    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%3Ccircle cx='9' cy='20' r='1.4'/%3E%3Ccircle cx='18' cy='20' r='1.4'/%3E%3Cpath d='M2.5 3.5H5l2.6 11.5h11L21 7.5H6'/%3E%3C/svg%3E");
	--i-database: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%3Cellipse cx='12' cy='5.5' rx='8' ry='3'/%3E%3Cpath d='M4 5.5v6c0 1.7 3.6 3 8 3s8-1.3 8-3v-6'/%3E%3Cpath d='M4 11.5v7c0 1.7 3.6 3 8 3s8-1.3 8-3v-7'/%3E%3C/svg%3E");
	--i-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='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3Cpath d='M12 2v3M12 19v3M2 12h3M19 12h3M4.9 4.9l2.1 2.1M16.9 16.9l2.2 2.2M19.1 4.9L17 7M7 17l-2.1 2.1'/%3E%3C/svg%3E");
	--i-users:   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%3Ccircle cx='9' cy='8' r='3.5'/%3E%3Cpath d='M2.5 20a6.5 6.5 0 0 1 13 0'/%3E%3Cpath d='M16 5.2a3.5 3.5 0 0 1 0 5.6M17.5 14.5A6.5 6.5 0 0 1 21.5 20'/%3E%3C/svg%3E");
	--i-grid:    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%3Crect x='3' y='4' width='18' height='16' rx='2'/%3E%3Cpath d='M3 9h18M9 9v11'/%3E%3C/svg%3E");
	--i-shield:  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 2.5l8 3v6c0 5-3.4 8.9-8 10-4.6-1.1-8-5-8-10v-6z'/%3E%3Cpath d='M9 12l2 2 4-4'/%3E%3C/svg%3E");
	--i-sliders: 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='M4 7h16M4 12h16M4 17h16'/%3E%3Ccircle cx='9' cy='7' r='2'/%3E%3Ccircle cx='15' cy='12' r='2'/%3E%3Ccircle cx='8' cy='17' r='2'/%3E%3C/svg%3E");
	--i-tag:     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='M3 12.5V4h8.5L21 13.5 13.5 21z'/%3E%3Ccircle cx='7.5' cy='8' r='1.4'/%3E%3C/svg%3E");
	--i-building: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='M4 21V5a2 2 0 0 1 2-2h7a2 2 0 0 1 2 2v16'/%3E%3Cpath d='M15 9h3a2 2 0 0 1 2 2v10'/%3E%3Cpath d='M8 7h3M8 11h3M8 15h3M2.5 21h19'/%3E%3C/svg%3E");
	--i-bell:url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27 fill=%27none%27 stroke=%27%23000%27 stroke-width=%272%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27%3E%3Cpath d=%27M18 8a6 6 0 0 0-12 0c0 7-3 9-3 9h18s-3-2-3-9%27/%3E%3Cpath d=%27M13.7 21a2 2 0 0 1-3.4 0%27/%3E%3C/svg%3E");
}
