/* ======================================================= */
 /* CSS OPTIMIZADO - UTILIDADES DE INTERFAZ (TOOLTIPS) */
 /* ======================================================= */

 /* TOOLTIP CONTROLADO Y ACCESIBLE CON VARIABLES CSS */
 @media (min-width: 769px) {

     /* CONTENEDORES BASE (Usando el selector más específico para que no interfiera en móvil) */
     .layout.has-sidebar .tab-toolbar,
     .layout.has-sidebar .entry-header .entry-meta [aria-label] {
         position: relative;
         overflow: visible;
     }

     /* OCULTAR TOOLTIP POR DEFECTO */
     .layout.has-sidebar [aria-label]::before,
     .layout.has-sidebar [aria-label]::after {
         opacity: 0;
         visibility: hidden;
         transition: opacity 0.2s ease-in-out, visibility 0.2s ease-in-out;
     }

     /* ===== TOOLTIPS PARA TABS ===== */
     .layout.has-sidebar .tab-toolbar [aria-label]:hover::before {
         content: attr(aria-label);
         visibility: visible;
         opacity: 1;
         position: absolute;
         top: -51px;
         left: 50%;
         transform: translateX(-50%);

         /* Colores adaptados */
         background-color: var(--color-bg-sidebar-alt);
         color: var(--color-text-main);

         /* Variables adaptadas */
         font-size: var(--tooltip-font-size-tablet);
         font-weight: var(--tooltip-font-weight);
         white-space: nowrap;
         padding: var(--tooltip-padding-tablet);
         border-radius: var(--tooltip-radius);
         z-index: var(--tooltip-z-index);
         border: solid 1px var(--color-bg-header);
     }

     .layout.has-sidebar .tab-toolbar [aria-label]:hover::after {
         content: '';
         visibility: visible;
         opacity: 1;
         position: absolute;
         top: -20px;
         left: 50%;
         transform: translateX(-50%);
         border-style: solid;
         border-width: 6px 6px 0 6px;
         border-color: var(--color-bg-sidebar-alt) transparent transparent transparent;
         z-index: var(--tooltip-z-index);
     }

     /* ===== TOOLTIPS PARA METADATOS ===== */
     .layout.has-sidebar .entry-header .entry-meta [aria-label]:hover::before {
         content: attr(aria-label);
         visibility: visible;
         opacity: 1;
         position: absolute;
         top: -45px;
         left: 50%;
         transform: translateX(-50%);

         /* Colores adaptados */
         background-color: var(--color-bg-sidebar-alt);
         color: var(--color-text-main);

         /* Variables adaptadas */
         font-size: var(--tooltip-font-size-tablet);
         font-weight: var(--tooltip-font-weight);
         white-space: nowrap;
         padding: var(--tooltip-padding-tablet);
         border-radius: var(--tooltip-radius);
         border: solid 1px var(--color-bg-header);
     }

     .layout.has-sidebar .entry-header .entry-meta [aria-label]:hover::after {
         content: '';
         visibility: visible;
         opacity: 1;
         position: absolute;
         top: -13px;
         left: 50%;
         transform: translateX(-50%);
         border-style: solid;
         border-width: 6px 6px 0 6px;
         border-color: var(--color-bg-sidebar-alt) transparent transparent transparent;
         z-index: var(--tooltip-z-index);
     }




 }

 /* DESKTOP (min-width: 1025px) - Ajustes de Tooltip */
 @media (min-width: 1025px) {

     /* Tooltip desktop */
     .layout.has-sidebar .tab-toolbar [aria-label]:hover::before,
     .layout.has-sidebar .entry-header .entry-meta [aria-label]:hover::before {
         font-size: var(--tooltip-font-size-desktop);
         padding: var(--tooltip-padding-desktop);
     }

     .layout.has-sidebar .tab-toolbar [aria-label]:hover::after,
     .layout.has-sidebar .entry-header .entry-meta [aria-label]:hover::after {
         border-width: 8px 8px 0 8px;
     }
 }