/**
 * Lynk — typography & màu cơ bản toàn theme (chỉnh tại đây).
 * Tokens màu + font giờ nằm trong lynk-tokens.css — file này chỉ giữ
 * layout/typography selectors + backward-compat aliases.
 *
 * Body: Quicksand
 * Tiêu đề lớn: Plus Jakarta Sans + Quicksand
 */

:root {
	/*
	 * Backward-compat: các file CSS cũ dùng --lynk-color-* và --lynk-font-*
	 * vẫn hoạt động vì lynk-tokens.css đã define chúng.
	 * Chỉ giữ lại token RIÊNG của typography (header height).
	 */

	/*
	 * Khoảng từ đỉnh viewport xuống nội dung — tránh header [lynk_navbar] fixed đè tiêu đề.
	 * Desktop: thanh cao hơn; tablet/mobile: shell nhỏ hơn nhưng vẫn chừa safe-area.
	 */
	--lynk-content-below-header: clamp(5rem, 9vh, 6.5rem);
}

@media (max-width: 1023px) {
	:root {
		--lynk-content-below-header: clamp(4.75rem, 8.5vh, 6rem);
	}
}

html {
	scroll-padding-top: var(--lynk-content-below-header);
}

/* ── Navbar fixed → push Elementor page content xuống ──────────
   Áp cho tất cả Elementor pages — navbar fixed không đè nội dung. */
body.elementor-page > .elementor,
body[class*="elementor-page-"] > .elementor {
	padding-top: var(--lynk-content-below-header);
}

/* ── Các trang shortcode Lynk tự quản lý spacing — reset Elementor padding ──
   Shortcode wrapper tự có padding-top riêng → không cộng đôi. */
body.elementor-page:has(.lynk-song-detail-page) > .elementor,
body.elementor-page:has(.lynk-song-list-page) > .elementor,
body.elementor-page:has(.lynk-music-page) > .elementor,
body.elementor-page:has(#lynk-music-section) > .elementor,
body.elementor-page:has(.lynk-video-page) > .elementor,
body.elementor-page:has(.lynk-news-page) > .elementor,
body.elementor-page:has(.lynk-gallery-page) > .elementor,
body.elementor-page:has(.lynk-home-new) > .elementor,
body.elementor-page:has(.lynk-ve-toi-page) > .elementor,
body.elementor-page:has(.lynk-lien-he-page) > .elementor {
	padding-top: 0;
}

/* Toàn site: font body */
body {
	font-family: var(--lynk-font-body);
	color: var(--lynk-color-text);
}

button,
input,
select,
textarea,
.lynk-navbar-menu,
.lynk-navbar-mobile {
	font-family: inherit;
}

/* Elementor: phần lớn widget kế thừa body; heading widget vẫn có thể set riêng trong editor */
.elementor-widget-text-editor,
.elementor-widget-text-editor p {
	font-family: var(--lynk-font-body);
}

/* Tiêu đề Elementor mặc định: Quicksand; gắn .lynk-display-heading cho tiêu đề lớn kiểu display */
.elementor-widget-heading .elementor-heading-title {
	font-family: var(--lynk-font-body);
}

/* —— Tiêu đề lớn = font giống “Danh sách bài hát” (chỉ font + tracking; size/weight/gradient để từng file quyết) —— */
.lynk-display-heading,
.anlie-video-hero-title,
.lynk-hero-title,
.lynk-home-block-head-text h1,
.lynk-music-page-title,
.news-tier-title,
.lynk-search-results-title,
.lynk-about-main-title,
.lynk-song-list-header h1,
.lynk-song-detail-head h1,
.anlie-video-detail-head h1,
.anlie-video-explore-detail__title,
.lynk-gallery-album-head h1,
.elementor-widget-heading .elementor-heading-title.lynk-display-heading {
	font-family: var(--lynk-font-display);
	letter-spacing: -0.03em;
}

/* —— Viền focus (tím/xanh mặc định): bỏ khi dùng chuột / focus script —— */
/* Elementor thường gọi .focus() trên section/widget có tabindex=-1 → viền quanh cả khối */
[tabindex="-1"]:focus:not(:focus-visible) {
	outline: none !important;
	box-shadow: none !important;
}

.elementor-element:focus:not(:focus-visible),
.e-con:focus:not(:focus-visible),
.elementor-widget:focus:not(:focus-visible),
.elementor-widget-container:focus:not(:focus-visible),
.elementor-section:focus:not(:focus-visible) {
	outline: none !important;
	box-shadow: none !important;
}

/*
 * Chuột: không viền trên link/nút (JS navbar: html.lynk-nav-keyboard khi gõ Tab).
 * Input/search không nằm trong rule này.
 */
html:not(.lynk-nav-keyboard) a:focus,
html:not(.lynk-nav-keyboard) a:focus-visible,
html:not(.lynk-nav-keyboard) button:focus,
html:not(.lynk-nav-keyboard) button:focus-visible {
	outline: none !important;
}

html.lynk-nav-keyboard a:focus-visible,
html.lynk-nav-keyboard button:focus-visible {
	outline: 2px solid rgba(var(--lynk-neon-rgb), 0.45);
	outline-offset: 2px;
}

/* Tránh nháy viền/transition lúc load (kết hợp wp_head + lynk-focus-keyboard-mode.js) */
html.lynk-ui-prepping .lynk-song-row,
html.lynk-ui-prepping .lynk-song-list-filters button,
html.lynk-ui-prepping .lynk-song-list-table-head,
html.lynk-ui-prepping .lynk-song-list-toolbar {
	transition: none !important;
}