/* KAVITOR — kavitor.shield.css: ESCUDO del chrome para páginas TRANSICIONALES con Bootstrap.
   Bootstrap entra sin capa y vence a las capas kavitor en elementos compartidos (a, summary…) —
   estas reglas, también sin capa y cargadas después, restauran el chrome. Lo carga head_kavitor.php
   SOLO cuando $legacyBootstrap. Muere con el último uso de Bootstrap (R3). */

/* Bootstrap mete margin-bottom:1rem al <ul> → el flex centra la caja con margen y el texto sube 8px */
.kv-nav__links { margin: 0 auto 0 var(--sp-8); padding: 0; } /* + margin-left = aire logo→Producto (como el chrome) */

/* TIPOGRAFÍA del chrome: Bootstrap impone su fuente de sistema (Segoe, más ancha) al body y el nav
   se veía distinto entre home (Plex) y páginas Bootstrap. Plex SIEMPRE en los componentes kavitor.
   (Scoped a componentes, NO al body: el editor3d congelado también carga este escudo.) */
.kv-nav, .kv-footer, .k-dialog, #cookie-banner, .kv-tool { font-family: var(--font-ui); }

/* Enlaces del chrome: ni azul ni subrayado de Bootstrap */
.kv-nav a, .kv-menu__panel a, .kv-footer nav a { text-decoration: none; }
.kv-nav__links a { color: var(--text-secondary); }
.kv-nav__links a:hover, .kv-nav__links a.is-active { color: var(--text-primary); }
.kv-menu__panel a { color: var(--text-primary); }
.kv-banner a { color: var(--text-primary); }

/* Menús <details>: Bootstrap fuerza summary{display:list-item} y rompe el flex */
.kv-menu > summary { display: flex; align-items: center; gap: var(--sp-3); color: var(--text-secondary); list-style: none; cursor: pointer; }
.kv-menu > summary::-webkit-details-marker { display: none; }
.kv-menu > summary::marker { content: none; }
.kv-menu--user > summary, .kv-menu > summary:hover { color: var(--text-primary); }

/* k-btn GLOBAL a prueba de reboot Bootstrap (nav, sidebars, toolbars de páginas migradas):
   estructura completa, no solo color — el a{}/button{} sin capa de Bootstrap ya no manda aquí */
.k-btn { display: inline-flex; align-items: center; justify-content: center; gap: var(--sp-3); height: var(--control-md); padding-inline: var(--sp-5); font-size: var(--fs-sm); font-weight: var(--fw-medium); border-radius: var(--radius-control); text-decoration: none; cursor: pointer; }
a.k-btn, a.k-btn:hover { text-decoration: none; }
.k-btn--ghost, .k-btn--ghost:hover { color: var(--text-primary); }
.k-btn--ghost { background: transparent; border: var(--bw-1) solid var(--border); }
.k-btn--ghost:hover { border-color: var(--border-strong); background: var(--hover-bg); }
.k-btn--primary, .k-btn--primary:hover { color: var(--on-accent); }
.k-btn--primary { background: var(--action-primary-bg); border: var(--bw-1) solid transparent; }
.k-btn--primary:hover { background: var(--action-primary-hover); }
.k-btn--architect, .k-btn--architect:hover { color: var(--on-plan-architect); }
.k-btn--architect { background: var(--plan-architect); border: var(--bw-1) solid transparent; font-weight: var(--fw-semibold); }
.k-btn--architect:hover { filter: brightness(1.06); }

/* Tarjetas kv-tool fuera del nav (diálogo nuevo proyecto): el a{} de Bootstrap no las pinta */
.kv-tool, .kv-tool:hover { text-decoration: none; color: var(--text-primary); }

/* Herramientas del nav: mismos colores por rol que el chrome, a prueba del a{} Bootstrap */
.kv-nav__tool { color: var(--text-secondary); }
.kv-nav__tool:hover { color: var(--selection-indicator); }
.kv-nav__tool--studio:hover { color: var(--plan-architect); }

/* Mis proyectos sin borde también aquí (el escudo global de k-btn--ghost lo ponía) */
.kv-nav .k-btn--ghost, .kv-nav .k-btn--ghost:hover { border-color: transparent; }

/* Móvil: el botón Proyectos del cta se oculta (ya vive en la hamburguesa). El hide de la capa
   chrome pierde contra el display del propio shield (sin capa) → se re-declara aquí. */
@media (max-width: 960px) {
    .kv-nav__cta > .k-btn { display: none; }
}