Translate content: data-layout-item styling hooks

es/customize/custom-scripts.mdx

@@ -397,6 +397,29 @@ Pueden aparecer múltiples instancias de estos hooks en una página. La lista in
     - `toc-item[data-active]`—Elemento activo de la tabla de contenidos.
     - `toc-item[data-active-deepest]`—Elemento más profundo activo de la tabla de contenidos. Solo presente en el encabezado exacto actualmente visible, a diferencia de `data-active` que también se establece en sus encabezados padres.
 
+    Regiones de diseño (`data-layout-item`):
+
+    Usa `data-layout-item` para apuntar a las regiones principales de tu sitio con un único selector que funciona igual en todos los temas. Los ID de algunas regiones difieren entre temas. Por ejemplo, `#sidebar-content` es la barra lateral externa en algunos temas y el área de desplazamiento interna en otros, mientras que `[data-layout-item="sidebar"]` siempre es la barra lateral externa.
+
+    - `[data-layout-item="banner"]`—Banner de anuncios.
+    - `[data-layout-item="topbar"]`—Barra de navegación superior.
+    - `[data-layout-item="mobile-nav"]`—Panel de navegación en móvil.
+    - `[data-layout-item="sidebar"]`—Panel de navegación de la barra lateral externa.
+    - `[data-layout-item="content"]`—Área de contenido principal.
+    - `[data-layout-item="page-header"]`—Encabezado de página con el título y la descripción.
+    - `[data-layout-item="side-panel"]`—Panel lateral derecho que contiene la tabla de contenidos.
+    - `[data-layout-item="toc"]`—Tabla de contenidos.
+    - `[data-layout-item="pagination"]`—Enlaces a la página anterior y siguiente en la parte inferior de una página.
+    - `[data-layout-item="footer"]`—Pie de página.
+    - `[data-layout-item="search-entry"]`—Barra de búsqueda o botón que abre la búsqueda, en escritorio y móvil.
+    - `[data-layout-item="assistant-entry"]`—Botón que abre el asistente de IA, en escritorio y móvil.
+
+    ```css style.css
+    [data-layout-item="sidebar"] {
+      border-right: 1px solid #e5e7eb;
+    }
+    ```
+
     Nombre de componente (`data-component-name`):
 
     Usa `data-component-name` para apuntar a componentes de interfaz específicos con un selector estable que persiste si los nombres de clases internos cambian.

fr/customize/custom-scripts.mdx

@@ -397,6 +397,29 @@ Plusieurs instances de ces hooks peuvent apparaître sur une page. La liste donn
     - `toc-item[data-active]`—Élément actif de la table des matières.
     - `toc-item[data-active-deepest]`—Élément le plus profond actif de la table des matières. Uniquement présent sur le titre exactement visible, contrairement à `data-active` qui est également défini sur ses titres parents.
 
+    Régions de mise en page (`data-layout-item`) :
+
+    Utilisez `data-layout-item` pour cibler les principales régions de votre site avec un seul sélecteur qui fonctionne de la même manière dans tous les thèmes. Les ID de certaines régions diffèrent d'un thème à l'autre. Par exemple, `#sidebar-content` correspond à la barre latérale externe dans certains thèmes et à la zone de défilement interne dans d'autres, tandis que `[data-layout-item="sidebar"]` correspond toujours à la barre latérale externe.
+
+    - `[data-layout-item="banner"]`—Bannière d'annonce.
+    - `[data-layout-item="topbar"]`—Barre de navigation supérieure.
+    - `[data-layout-item="mobile-nav"]`—Tiroir de navigation sur mobile.
+    - `[data-layout-item="sidebar"]`—Panneau de navigation de la barre latérale externe.
+    - `[data-layout-item="content"]`—Zone de contenu principale.
+    - `[data-layout-item="page-header"]`—En-tête de page avec le titre et la description.
+    - `[data-layout-item="side-panel"]`—Panneau latéral droit qui contient la table des matières.
+    - `[data-layout-item="toc"]`—Table des matières.
+    - `[data-layout-item="pagination"]`—Liens vers la page précédente et la page suivante en bas d'une page.
+    - `[data-layout-item="footer"]`—Pied de page.
+    - `[data-layout-item="search-entry"]`—Barre de recherche ou bouton qui ouvre la recherche, sur ordinateur et sur mobile.
+    - `[data-layout-item="assistant-entry"]`—Bouton qui ouvre l'assistant IA, sur ordinateur et sur mobile.
+
+    ```css style.css
+    [data-layout-item="sidebar"] {
+      border-right: 1px solid #e5e7eb;
+    }
+    ```
+
     Nom de composant (`data-component-name`) :
 
     Utilisez `data-component-name` pour cibler des composants d'interface spécifiques avec un sélecteur stable qui persiste même si les noms de classes internes changent.

zh/customize/custom-scripts.mdx

@@ -397,6 +397,29 @@ CSS 定位钩子使用不同的语法：
     - `toc-item[data-active]`—激活的目录项。
     - `toc-item[data-active-deepest]`—最深层激活的目录项。仅出现在当前可见的确切标题上，与 `data-active` 不同，后者也会设置在其父级标题上。
 
+    布局区域 (`data-layout-item`)：
+
+    使用 `data-layout-item` 通过一个在所有主题中行为一致的选择器来定位站点的主要区域。某些区域的 ID 因主题而异。例如，`#sidebar-content` 在某些主题中是外层侧边栏，在另一些主题中则是内部滚动区域，而 `[data-layout-item="sidebar"]` 始终表示外层侧边栏。
+
+    - `[data-layout-item="banner"]`—公告横幅。
+    - `[data-layout-item="topbar"]`—顶部导航栏。
+    - `[data-layout-item="mobile-nav"]`—移动端导航抽屉。
+    - `[data-layout-item="sidebar"]`—外层侧边栏导航面板。
+    - `[data-layout-item="content"]`—主要内容区域。
+    - `[data-layout-item="page-header"]`—包含标题和描述的页面头部。
+    - `[data-layout-item="side-panel"]`—包含目录的右侧面板。
+    - `[data-layout-item="toc"]`—目录。
+    - `[data-layout-item="pagination"]`—页面底部的上一页和下一页链接。
+    - `[data-layout-item="footer"]`—页面页脚。
+    - `[data-layout-item="search-entry"]`—在桌面端和移动端打开搜索的搜索栏或按钮。
+    - `[data-layout-item="assistant-entry"]`—在桌面端和移动端打开 AI 助手的按钮。
+
+    ```css style.css
+    [data-layout-item="sidebar"] {
+      border-right: 1px solid #e5e7eb;
+    }
+    ```
+
     组件名称 (`data-component-name`)：
 
     使用 `data-component-name` 来定位特定的 UI 组件，该选择器在内部类名更改后仍然有效。