/* CSS toàn cục tối thiểu mà component của UI cần, dùng chung cho mọi web.
   Nạp qua NmCoreStyles (sau CSS của web). Đường dẫn tương đối theo tệp này nên đúng cả dưới PathBase. */

/* Cờ quốc gia: Windows không có glyph cờ trong Segoe UI Emoji. unicode-range chỉ gồm dải
   Regional Indicator nên font chỉ tải khi trang có cờ. */
@font-face {
    font-family: 'Twemoji Country Flags';
    src: url('../fonts/TwemojiCountryFlags.woff2') format('woff2');
    font-display: swap;
    unicode-range: U+1F1E6-1F1FF;
}

/* Đặt cho phần tử hiện cờ khi nó (hoặc cha) có font-family riêng. */
.nm-flag {
    font-family: 'Twemoji Country Flags', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    font-style: normal;
    line-height: 1;
}

/* Mục menu đang chọn (NavItem, MenuNode). */
.nm-nav-pill-active {
    background: linear-gradient(135deg, #ea580c 0%, #f97316 100%);
    color: white !important;
    border-radius: 12px;
    box-shadow: 0 4px 12px -2px rgba(234, 88, 12, 0.3);
}
.nm-nav-pill-active svg { color: white !important; }

/* Ô biểu tượng của mục menu. */
.nm-icon-bubble {
    width: 32px;
    height: 32px;
    border-radius: 10px;
    background: #f5f3f0;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: all 0.2s ease;
}
.nm-nav-pill-active .nm-icon-bubble {
    background: rgba(255,255,255,0.2);
}