/* Matches the reference's black title bar, white country grid and scrollable regional groups. */
.header__icon-list .yxc-country-trigger {
    display: inline-flex; align-items: center; justify-content: center;
    width: 40px; height: 40px; padding: 8px; margin: 0;
    border: 0; border-radius: 4px; background: transparent; cursor: pointer;
}
.header__icon-list .yxc-country-trigger:hover { background: rgba(128,128,128,.16); }
.header__icon-list .yxc-country-trigger:focus-visible { outline: 2px solid #5584d8; outline-offset: 2px; }
.yxc-country-flag { display: block; flex: 0 0 24px; width: 24px; height: 18px; background-repeat: no-repeat; background-size: 384px 288px; border-radius: 2px; box-shadow: 0 0 0 1px rgba(128,128,128,.3); }
.yxc-country-modal.ui-dialog { padding: 0; border: 1px solid #d2d7df; border-radius: 3px; background: #fff; color: #27374b; max-width: calc(100vw - 32px); font-family: "Inter", "Segoe UI", Roboto, Helvetica, Arial, sans-serif; }
.yxc-country-modal .ui-dialog-titlebar { background: #000; color: #fff; border: 0; border-radius: 0; padding: 10px 14px; font-size: 14px; line-height: 22px; }
.yxc-country-modal .ui-dialog-titlebar-close { display: flex; align-items: center; justify-content: center; width: 24px; height: 24px; right: 8px; margin-top: -12px; background: #fff; color: #27374b; border: 0; text-decoration: none; text-indent: 0; font-size: 0; line-height: 0; }
.yxc-country-modal .ui-dialog-titlebar-close > span { display: none; }
.yxc-country-modal .ui-dialog-titlebar-close::before { content: "\00d7"; font: 22px/24px Arial, sans-serif; }
.yxc-country-modal .ui-dialog-content { padding: 16px 20px; overflow: hidden; }
.yxc-country-list { max-height: min(62vh, 560px); overflow-y: auto; overscroll-behavior: contain; scrollbar-gutter: stable; }
.yxc-country-group + .yxc-country-group { margin-top: 22px; }
.yxc-country-group h3 { margin: 0 0 6px; padding: 0 0 8px; border-bottom: 1px solid #dce2e9; font-size: 15px; line-height: 1.4; color: #142d46; }
.yxc-country-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 0 12px; }
.yxc-country-option { display: block; box-sizing: border-box; width: 100%; min-width: 0; border: 0; border-radius: 3px; margin: 0; padding: 6px 0; text-align: left; font: inherit; font-size: 13px; line-height: 1.4; white-space: normal; overflow-wrap: anywhere; color: #33445c; background: transparent; cursor: pointer; text-decoration: none; }
.yxc-country-option:hover, .yxc-country-option:focus-visible { background: #eef3fa; color: #1456a1; text-decoration: underline; }
.yxc-country-option.is-selected { color: #1456a1; font-weight: 700; }
.yxc-country-retry { margin-top: 12px; padding: 8px 14px; border: 1px solid #c4ccd8; background: #fff; border-radius: 3px; cursor: pointer; }
@media (max-width: 1100px) {
    .yxc-header .header-inner { position: relative; }
    .header-inner > .header__icon-list { display: flex; position: absolute; right: 10px; top: 0; height: 100%; margin: 0; }
    .header__icon-list > ul > li:not(.yxc-country-item) { display: none; }
}
@media (max-width: 640px) {
    .yxc-country-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0 10px; }
    .yxc-country-modal .ui-dialog-content { padding: 14px; }
    .yxc-country-option { min-height: 40px; padding: 9px 3px; }
}

.yxc-country-flag { background-image: url("https://static.yuxincode.com/yuxincode.com/assets/english-20261025-c971dc52/images/country-flags.feaf39bb5ab267c1.png"); background-position: -288px -252px; }