/**
 * Theme Name: Astra Child
 * Author: Brainstorm Force
 * Author URI: http://wpastra.com/about/
 * Description: Astra is the fastest, fully customizable & beautiful theme suitable for blogs, personal portfolios and business websites. It is very lightweight (less than 50KB on frontend) and offers unparalleled speed. Built with SEO in mind, Astra comes with schema.org code integrated so search engines will love your site. Astra offers plenty of sidebar options and widget areas giving you a full control for customizations. Furthermore, we have included special features and templates so feel free to choose any of your favorite page builder plugin to create pages flexibly. Some of the other features: # WooCommerce Ready # Responsive # Compatible with major plugins # Translation Ready # Extendible with premium addons # Regularly updated # Designed, Developed, Maintained & Supported by Brainstorm Force. Looking for a perfect base theme? Look no further. Astra is fast, fully customizable and beautiful theme!
 * Version: 1.0.0
 * License: GNU General Public License v2 or later
 * License URI: http://www.gnu.org/licenses/gpl-2.0.html
 * Text Domain: astra-child
 * Template: astra
 */

/*
 * Font toàn site: Montserrat (Google Fonts).
 *
 * Đặt SAU khối header của theme để WordPress luôn đọc được header; @import vẫn
 * hợp lệ vì nó đứng trước mọi rule CSS khác.
 * Muốn đổi font: sửa dòng @import dưới đây và biến --ez-site-font.
 */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');

:root {
	--ez-site-font: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

/*
 * Font Montserrat cho phần chữ.
 *
 * CÁCH LÀM AN TOÀN: không dùng `body *`, và **KHÔNG nhắm vào `span` / `a`**.
 *
 * Lý do: WordPress vẽ icon thanh admin bar bằng
 *   #wpadminbar .ab-icon { font: normal 20px/1 dashicons }   ← KHÔNG có !important
 * rồi các rule khác chỉ đặt `content` cho `.ab-icon:before`; pseudo-element đó
 * THỪA HƯỞNG font từ chính <span class="ab-icon">. Chỉ cần theme đặt
 * `span { font-family: Montserrat !important }` là khai báo !important thắng rule
 * không-!important của WordPress (cascade xét !important TRƯỚC specificity), font
 * icon bị thay và icon thành ô vuông □. Mọi font icon khác (WooCommerce dùng font
 * "WooCommerce", Rank Math) cũng vẽ trên pseudo-element nên cùng rủi ro.
 *
 * Chữ trong <span>/<a> vẫn là Montserrat nhờ thừa hưởng từ body/p/li... nên bỏ hai
 * thẻ này khỏi danh sách không đổi giao diện chữ. Khối "BẢO VỆ ICON" ở cuối file
 * trả lại font icon cho thanh admin bar (hiện cả ở front-end khi đã đăng nhập).
 *
 * Danh sách đầu tiên bao ĐÚNG các nhóm mà Astra tự set font trong CSS động:
 *   body, button, input, select, textarea, .ast-button, .ast-custom-button
 */
body,
button, input, select, textarea, optgroup,
.ast-button, .ast-custom-button,
h1, h2, h3, h4, h5, h6,
p, li, strong, em, small, label, legend,
td, th, caption, blockquote, figcaption,
address, dt, dd, summary,
.entry-title, .entry-content, .site-title, .site-description,
.widget, .widget-title, .menu-item, .nav-link,
.ez-hd, .ez-ft, .ez-bestsellers, .ez-pcat, .ez-bn {
	font-family: var(--ez-site-font) !important;
}

/* ---------------------------------------------------------------------------
 * BẢO VỆ ICON - đừng xoá khối này
 *
 * Trả lại font DASHICONS cho mọi chỗ WordPress/WooCommerce vẽ icon, để không rule
 * font-family !important nào của theme biến icon thành ô vuông.
 * ------------------------------------------------------------------------ */
#wpadminbar .ab-icon,
#wpadminbar .ab-icon:before,
#wpadminbar .ab-item:before,
#wpadminbar #adminbarsearch:before,
#wpadminbar .wp-admin-bar-arrow,
#wpadminbar .wp-admin-bar-arrow:before,
#wpadminbar .dashicons,
#wpadminbar .dashicons-before:before,
body .dashicons,
body .dashicons-before:before,
body [class^="dashicons-"]:before,
body [class*=" dashicons-"]:before {
	font-family: dashicons !important;
}

/* ---------------------------------------------------------------------------
 * BỀ RỘNG KHUNG NỘI DUNG (.ast-container) TRÊN MÁY TÍNH - 1300px
 *
 * Đo thật trước khi sửa: Astra đặt `.ast-container { max-width: 1490px }` nên ở màn
 * 1440px khung nội dung kéo hết 1440px, chữ dàn quá rộng. Ghim lại **1300px** từ
 * **922px trở lên**; dưới 922px Astra tự để `max-width: 100%` (điện thoại, iPad dọc)
 * nên khối này KHÔNG đụng tới.
 *
 * Vì sao để ở `style.css` (file này) chứ không phải `ez-shop.css`:
 *   - `style.css` được nạp ở **mọi** trang, kể cả **giỏ hàng / thanh toán / tài khoản**
 *     - đó là các trang ảo của WooCommerce nên `ezchild_enqueue_shop_assets()` không
 *     nạp `ez-shop.css`;
 *   - nó nạp **sau** CSS của Astra (cha) nên cùng specificity (1 class) là thắng.
 *
 * Trang **bài viết** (`single-post`) đã có rule riêng y hệt ở `ez-shop.css`
 * (`.single-post.ast-separate-container .site-content .ast-container`) - rule đó
 * specificity cao hơn nên vẫn thắng, kết quả không đổi.
 *
 * Muốn đổi bề rộng: sửa đúng MỘT số `1300px` dưới đây.
 * ------------------------------------------------------------------------ */
@media (min-width: 922px) {
	.ast-container {
		max-width: 1300px;
	}
}