/* jc-flags.css — 语言切换器的国旗图标（多语种静态站）
 *
 * 后台「多语种静态站 → 切换器国旗图标」开启时，切换器的每个语种前会插入
 * <i class="jc-flag jc-flag-{语种码}">，动态页与生成的静态页共用这一份样式。
 *
 * 四点约定，改之前先看：
 * 1. 图取自同目录的 jc-flags.svg：17 面旗纵向排成一条，靠
 *    background-size:100% 1700% + background-position 的百分比取行。
 *    百分比是 行号/(17-1)*100%，行号见 jc-flags.svg 里的注释。
 *    加旗必须加在 SVG 末尾并在这里补一条规则，否则行号错位、全体串旗。
 * 2. 关闭开关时是把 <i> 从页面里删掉（后台会就地改写已生成的静态页），
 *    不靠这里的 display:none —— 静态页缓存的是 HTML，改 CSS 管不到它们。
 * 3. !important 是必要的：主题给 .jc-header 里的 i / span 普遍写了图标字体
 *    和 display 规则，权重比这里高，不锁住会被压成 0 宽或撑成一行。
 * 4. 阿拉伯语等 RTL 页面下间距要翻到左边，见文件末尾的 [dir=rtl] 规则。
 */

.jc-flag {
	display: inline-block !important;
	width: 18px !important;
	height: 13px !important;
	margin: 0 7px 0 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 2px;
	vertical-align: -2px;
	background-image: url(jc-flags.svg?v=1);
	background-repeat: no-repeat;
	background-size: 100% 1700%;
	box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .14);
	/* 主题可能给 i 设了图标字体，空元素被伪元素填字就露馅 */
	font: 0/0 a !important;
	text-indent: -9999px;
	flex-shrink: 0;
}

.jc-flag::before,
.jc-flag::after {
	content: none !important;
}

.jc-flag-en { background-position: 0 0; }
.jc-flag-es { background-position: 0 6.25%; }
.jc-flag-de { background-position: 0 12.5%; }
.jc-flag-fr { background-position: 0 18.75%; }
.jc-flag-ru { background-position: 0 25%; }
.jc-flag-pt { background-position: 0 31.25%; }
.jc-flag-it { background-position: 0 37.5%; }
.jc-flag-nl { background-position: 0 43.75%; }
.jc-flag-pl { background-position: 0 50%; }
.jc-flag-tr { background-position: 0 56.25%; }
.jc-flag-ar { background-position: 0 62.5%; }
.jc-flag-ja { background-position: 0 68.75%; }
.jc-flag-ko { background-position: 0 75%; }
.jc-flag-vi { background-position: 0 81.25%; }
.jc-flag-th { background-position: 0 87.5%; }
.jc-flag-id { background-position: 0 93.75%; }
.jc-flag-zh { background-position: 0 100%; }

/* 按钮上那面旗贴得紧一点，下拉面板里保持 7px */
.jc-lang-dd-cur .jc-flag {
	margin-right: 5px !important;
}

[dir="rtl"] .jc-flag {
	margin: 0 0 0 7px !important;
}

[dir="rtl"] .jc-lang-dd-cur .jc-flag {
	margin-left: 5px !important;
}
