/*
Theme Name: Chân Trời Mới Blocks
Description: Thème block (FSE) reproduisant la mise en page Newspaper (tagDiv + WPBakery) de chantroimoimedia.com avec les seuls blocs natifs.
Author: Chân Trời Mới Media
Version: 0.2.0
Requires at least: 6.6
Tested up to: 7.1
Requires PHP: 8.1
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Tags: full-site-editing, block-patterns, news, two-columns
Text Domain: ctm
*/

/* ---------- Barre supérieure (td-header-top-menu) ---------- */
.ctm-topbar { font-family: var(--wp--preset--font-family--open-sans); font-size: 11px; line-height: 28px; }
.ctm-topbar p { margin: 0; }
.ctm-topbar a { color: #fff; }
.ctm-topbar .wp-block-social-links { gap: 14px; }
.ctm-topbar .wp-social-link svg { width: 14px; height: 14px; }

/* ---------- Menu (td-header-menu-wrap) ---------- */
.ctm-menubar { box-shadow: 0 1px 3px rgba(0, 0, 0, .12); position: relative; z-index: 20; }
.ctm-nav .wp-block-navigation-item__content.wp-block-navigation-item__content { display: block; line-height: 48px; padding: 0 14px; color: #000; }
.ctm-nav .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content:hover,
.ctm-nav .current-menu-item > .wp-block-navigation-item__content.wp-block-navigation-item__content {
	box-shadow: inset 0 -3px 0 var(--wp--preset--color--accent); text-decoration: none;
}
.ctm-nav .wp-block-navigation__submenu-container {
	border: 0 !important; box-shadow: 0 2px 6px rgba(0, 0, 0, .1); min-width: 220px !important;
	font-weight: 400; text-transform: none;
}
.ctm-nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content.wp-block-navigation-item__content { line-height: 21px; padding: 7px 20px; font-size: 13px; }
.ctm-nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover { color: var(--wp--preset--color--accent); text-decoration: none; }
.ctm-search .wp-block-search__button { background: none; color: #000; border: 0; }

/* ---------- Logo ---------- */
.ctm-logo-row { padding-top: 40px; padding-bottom: 40px; border-bottom: 1px solid var(--wp--preset--color--border); }
.ctm-logo-row .wp-block-image { margin: 0 auto; }

/* ---------- Titres de bloc (block template 1) ---------- */
.ctm-head {
	--ctm-head: var(--wp--preset--color--dark);
	margin: 0 0 10px !important; border-bottom: 2px solid var(--ctm-head);
	font-family: var(--wp--preset--font-family--roboto); font-size: 14px; font-weight: 500; line-height: 17px; text-transform: uppercase;
}
.ctm-head span { display: inline-block; padding: 7px 12px 4px; background: var(--ctm-head); color: #fff; }
.ctm-head a { color: #fff; }
.ctm-head + .ctm-q, .ctm-head + .ctm-q .wp-block-post-template { margin-top: 0 !important; } /* Pas de blockGap entre le titre et les images (10px) */

/* ---------- Modules d'articles ---------- */
.ctm-q { margin-bottom: 40px; }
.ctm-q .wp-block-post-template { gap: 24px 32px; }
.ctm-q .wp-block-post-featured-image { margin: 0 0 10px; }
.ctm-q .wp-block-post-title { margin: 0 0 6px; font-size: 17px; font-weight: 500; line-height: 1.33; }
.ctm-meta { gap: 4px 6px; margin: 0 0 8px; font-family: var(--wp--preset--font-family--open-sans); font-size: 11px; color: var(--wp--preset--color--meta); }
.ctm-meta > * + *::before { content: "- "; }
.ctm-meta .wp-block-post-author-name a { color: #000; font-weight: 700; }
.ctm-q .wp-block-post-excerpt { font-size: 13px; line-height: 21px; color: #767676; margin: 0; }
.ctm-q--recent .wp-block-post-excerpt { display: block; }

/* Étiquette de catégorie (fond noir, comme td-post-category) */
.ctm-cat { font-family: var(--wp--preset--font-family--open-sans); font-size: 10px; line-height: 1; margin: 0 0 6px; }
.ctm-cat a { display: inline-block; background: var(--wp--preset--color--dark); color: #fff; padding: 3px 6px 4px; margin-right: 4px; }
.ctm-cat .wp-block-post-terms__separator { display: none; }

/*
 * Tailles des modules Newspaper (mesurées sur l'original, conteneur 1068 px : colonne 696 px, barre latérale 324 px).
 * td_module_4 324x235, td_module_2 324x160, td_module_6 100x70, td_module_mx4 218x150 (152x104 en barre latérale).
 */
.ctm-q .wp-block-post-featured-image img { aspect-ratio: 218 / 150 !important; }
.ctm-q .wp-block-post-excerpt { display: none; }
.ctm-q--grid .wp-block-post-title, .ctm-q--aside .wp-block-post-title { font-size: 14px; line-height: 20px; }
.ctm-q--grid .wp-block-post-template { gap: 20px 24px; }
.ctm-q--aside .wp-block-post-template { gap: 16px 20px; }
.ctm-q--aside .wp-block-post-title { font-size: 13px; line-height: 18px; }
.ctm-q--grid .ctm-meta, .ctm-q--aside .ctm-meta { display: none; }

/* Petits éléments (td_module_6) : vignette 100x70 à gauche + titre + date */
.ctm-q--list li:not(:first-child), .ctm-q--block2 li:nth-child(n+3) {
	display: grid; grid-template-columns: 100px 1fr; column-gap: 12px; align-content: start;
}
.ctm-q--list li:not(:first-child) .wp-block-post-featured-image, .ctm-q--block2 li:nth-child(n+3) .wp-block-post-featured-image { grid-row: span 3; margin: 0; }
.ctm-q--list li:not(:first-child) img, .ctm-q--block2 li:nth-child(n+3) img { aspect-ratio: 10 / 7 !important; }
.ctm-q--list li:not(:first-child) .wp-block-post-title, .ctm-q--block2 li:nth-child(n+3) .wp-block-post-title { font-size: 13px; line-height: 18px; margin: 0 0 4px; }
.ctm-q--list li:not(:first-child) .ctm-cat, .ctm-q--block2 li:nth-child(n+3) .ctm-cat,
.ctm-q--list li:not(:first-child) .wp-block-post-author-name, .ctm-q--block2 li:nth-child(n+3) .wp-block-post-author-name { display: none; }
.ctm-q--list li:not(:first-child) .wp-block-post-date::before, .ctm-q--block2 li:nth-child(n+3) .wp-block-post-date::before { content: none; }

/* td_block_1 : grand article (td_module_4) à gauche, 4 petits à droite */
.ctm-q--list .wp-block-post-template { display: grid; grid-template-columns: 1fr 1fr; gap: 0 24px; align-items: start; }
.ctm-q--list li:first-child { grid-column: 1; grid-row: 1 / span 4; }
.ctm-q--list li:not(:first-child) { grid-column: 2; margin: 0 0 21px; }
.ctm-q--list li:first-child img { aspect-ratio: 324 / 235 !important; }
.ctm-q--list li:first-child .wp-block-post-title { font-size: 21px; line-height: 25px; }
.ctm-q--list li:first-child .wp-block-post-excerpt { display: block; }

/* td_block_2 : 2 articles (td_module_2) puis petits éléments sur 2 colonnes */
.ctm-q--block2 .wp-block-post-template { gap: 0 24px; }
.ctm-q--block2 li:nth-child(-n+2) { margin-bottom: 24px; }
.ctm-q--block2 li:nth-child(-n+2) img { aspect-ratio: 324 / 160 !important; }
.ctm-q--block2 li:nth-child(-n+2) .wp-block-post-title { font-size: 17px; line-height: 22px; }
.ctm-q--block2 li:nth-child(-n+2) .wp-block-post-excerpt { display: block; }
.ctm-q--block2 li:nth-child(n+3) { margin-bottom: 21px; }

/* Barre latérale de l'accueil (td_block_15 en 1/3) et « Bài mới nhất » (td_block_9) */
.ctm-q--compact .wp-block-post-template > li { border-bottom: 1px dashed var(--wp--preset--color--border); padding-bottom: 12px; }
.ctm-q--compact .wp-block-post-title { font-size: 14px; }

/* « Bài gần đây » : vignette à gauche + extrait (td_module_10) */
.ctm-q--recent .wp-block-post-template > li { display: grid; grid-template-columns: 218px 1fr; gap: 20px; }
.ctm-q--recent .wp-block-post-featured-image { margin: 0; }

/* ---------- Bandeau « Tin nóng » (td_block_trending_now) ---------- */
.ctm-ticker { margin-top: 20px; margin-bottom: 14px; gap: 12px; align-items: center; overflow: hidden; }
.ctm-ticker__label { flex-shrink: 0; margin: 0; padding: 3px 8px; background: var(--wp--preset--color--dark); color: #fff; font-family: var(--wp--preset--font-family--open-sans); font-size: 11px; font-weight: 700; text-transform: uppercase; }
.ctm-q--ticker { margin: 0; min-width: 0; height: 22px; overflow: hidden; }
.ctm-q--ticker .wp-block-post-template { display: block; gap: 0; animation: ctm-ticker 24s steps(8) infinite; }
.ctm-q--ticker .wp-block-post-template > li { height: 22px; margin: 0; }
.ctm-q--ticker .wp-block-post-title { font-size: 14px; font-weight: 400; line-height: 22px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin: 0; }
@keyframes ctm-ticker { to { transform: translateY(-176px); } }
@media (prefers-reduced-motion: reduce) { .ctm-q--ticker .wp-block-post-template { animation: none; } }

/* ---------- Grille de une (td_block_big_grid_3) ---------- */
.ctm-q--big-grid .wp-block-post-template { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 225px 160px; gap: 2px; }
.ctm-q--big-grid .wp-block-post-template > li:nth-child(1) { grid-column: 1 / 3; grid-row: 1 / 3; }
.ctm-q--big-grid .wp-block-post-template > li:nth-child(2) { grid-column: 3 / 5; }
.ctm-overlay { position: relative; height: 100%; overflow: hidden; }
.ctm-overlay .wp-block-post-featured-image { position: absolute; inset: 0; margin: 0; }
.ctm-overlay .wp-block-post-featured-image a, .ctm-overlay .wp-block-post-featured-image img { width: 100%; height: 100% !important; object-fit: cover; aspect-ratio: auto !important; }
.ctm-overlay__text { position: absolute; left: 0; right: 0; bottom: 0; padding: 60px 20px 16px; background: linear-gradient(transparent, rgba(0, 0, 0, .8)); pointer-events: none; }
.ctm-overlay__text a { pointer-events: auto; }
.ctm-overlay .wp-block-post-title a, .ctm-overlay .ctm-meta, .ctm-overlay .ctm-meta a { color: #fff; }
.ctm-q--big-grid li:nth-child(1) .wp-block-post-title { font-size: 27px; line-height: 1.25; }
.ctm-q--big-grid li:nth-child(2) .wp-block-post-title { font-size: 21px; }
.ctm-q--big-grid li:nth-child(n+3) .wp-block-post-title { font-size: 14px; }
.ctm-q--big-grid li:nth-child(n+2) .ctm-meta { display: none; }

/* ---------- Article ---------- */
.ctm-single, .ctm-archive, .ctm-page { padding-top: 30px; padding-bottom: 48px; }
.ctm-single__title { font-size: 41px; line-height: 50px; margin: 6px 0 12px; }
.ctm-meta--single { margin-bottom: 18px; }
.ctm-meta--single .wp-block-post-author-name::before { content: "Thực Hiện "; font-weight: 400; color: var(--wp--preset--color--meta); }
.ctm-share { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 20px; }
.ctm-share a { padding: 0 14px; line-height: 40px; font-family: var(--wp--preset--font-family--roboto); font-size: 11px; color: #fff; text-decoration: none; }
.ctm-share__facebook { background: #516eab; }
.ctm-share__x { background: #000; }
.ctm-share__pinterest { background: #ca212a; }
.ctm-share__email { background: #767676; }
.ctm-featured-video iframe { width: 100%; aspect-ratio: 16 / 9; height: auto; }
.ctm-single .wp-block-post-content a { text-decoration: underline; }
.ctm-tags { font-family: var(--wp--preset--font-family--open-sans); font-size: 11px; }
.ctm-tags .wp-block-post-terms__prefix { background: var(--wp--preset--color--dark); color: #fff; padding: 4px 8px; text-transform: uppercase; }
.ctm-tags a { display: inline-block; border: 1px solid var(--wp--preset--color--border); padding: 3px 8px; margin: 0 4px 4px 0; color: #111; }
.ctm-tags .wp-block-post-terms__separator { display: none; }
.ctm-prevnext { font-family: var(--wp--preset--font-family--roboto); font-size: 15px; }
.ctm-author-box { border: 1px solid var(--wp--preset--color--border); padding: 20px; gap: 20px; margin: 30px 0; font-size: 13px; }

/* ---------- Pied de page ---------- */
.ctm-footer { font-size: 13px; line-height: 21px; }
/* Texte blanc forcé : les couleurs globales des titres et paragraphes (theme.json) l'emportent sur la couleur du groupe. */
.ctm-footer :is(p, h4, a), .ctm-subfooter :is(p, a), .ctm-topbar :is(p, a) { color: #fff; }
.ctm-footer__title { font-size: 14px; font-weight: 500; text-transform: uppercase; }
.ctm-subfooter p { margin: 0; }
.ctm-subfooter__menu a { color: #fff; margin-left: 16px; }

.ctm-pagination { font-family: var(--wp--preset--font-family--open-sans); font-size: 13px; gap: 4px; }
.ctm-pagination .page-numbers { border: 1px solid #cacaca; padding: 4px 10px; color: #444; }
.ctm-pagination .page-numbers.current { background: var(--wp--preset--color--dark); border-color: var(--wp--preset--color--dark); color: #fff; }

/* ---------- Mobile ---------- */
@media (max-width: 781px) {
	.ctm-q--big-grid .wp-block-post-template { grid-template-columns: 1fr 1fr; grid-template-rows: 260px 160px 160px; }
	.ctm-q--big-grid .wp-block-post-template > li:nth-child(1) { grid-column: 1 / 3; grid-row: auto; }
	.ctm-q--big-grid .wp-block-post-template > li:nth-child(2) { grid-column: auto; }
	.ctm-q--recent .wp-block-post-template > li { grid-template-columns: 110px 1fr; gap: 12px; }
	.ctm-single__title { font-size: 28px; line-height: 1.25; }
	.ctm-q--big-grid li:nth-child(1) .wp-block-post-title { font-size: 21px; }
}

/* Une seule étiquette de catégorie sur les cartes, comme Newspaper (catégorie principale) */
.ctm-q .ctm-cat a:not(:first-of-type) { display: none; }

/* ---------- Page Liên Lạc ---------- */
.ctm-offices { gap: 20px; }
.ctm-offices .wp-block-column { border-left: 3px solid var(--wp--preset--color--accent); padding-left: 14px; }
.ctm-offices p { margin: 0; font-size: 13px; line-height: 21px; }
.ctm-contact__row { display: grid; grid-template-columns: 1fr 1fr; gap: 0 20px; }
.ctm-contact__field { margin: 0 0 16px; }
.ctm-contact__field label { display: block; margin-bottom: 4px; font-family: var(--wp--preset--font-family--open-sans); font-size: 13px; font-weight: 600; }
.ctm-contact__req { color: #dd3535; }
.ctm-contact__field input, .ctm-contact__field textarea {
	box-sizing: border-box; width: 100%; padding: 8px 10px; border: 1px solid #e1e1e1;
	font: inherit; font-size: 14px; color: var(--wp--preset--color--text); background: #fff;
}
.ctm-contact__field input:focus, .ctm-contact__field textarea:focus { border-color: var(--wp--preset--color--accent); outline: none; }
.ctm-contact__send {
	border: 0; padding: 10px 24px; cursor: pointer; background: var(--wp--preset--color--dark); color: #fff;
	font-family: var(--wp--preset--font-family--open-sans); font-size: 13px; font-weight: 700; text-transform: uppercase;
}
.ctm-contact__send:hover { background: var(--wp--preset--color--accent); }
.ctm-contact__trap { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.ctm-contact__notice { padding: 12px 16px; border-left: 4px solid; font-size: 14px; }
.ctm-contact__notice--success { border-color: #81d742; background: #f3fbec; }
.ctm-contact__notice--error { border-color: #dd3535; background: #fdf0f0; }
@media (max-width: 600px) { .ctm-contact__row { grid-template-columns: 1fr; } }

/* Titre des pages de catégorie (ex. « > Tin Nhanh ») : Oswald 600 en majuscules, style presse */
.ctm-archive-title.wp-block-query-title {
	font-family: Oswald, 'Arial Narrow', sans-serif; font-weight: 600; font-size: 30px; line-height: 30px;
	text-transform: uppercase; letter-spacing: 1px; margin: 0 0 10px;
}
/* Même hauteur (30 px) et même écart (10 px) que le titre de section de la barre latérale : les images des deux colonnes sont alignées. */
.ctm-archive-title + .ctm-q { margin-top: 0 !important; }