/* Style universel des barres d'onglets */
body.io-tabs-hidden :is(.io-app-nav, .io-global-nav, .pifus-tabs-wrap, #sidebar-guide, .io-kralaide-nav),
body.io-tabs-hidden #app-root > header.glass-panel {
    display: none !important;
}
.kralamour-subtabs.io-tabs-hidden { display: none !important; }
.io-global-header {
    box-shadow: none !important;
    border-bottom: 0 !important;
    overflow: visible !important;
    isolation: isolate;
}
#global-header,
#global-header .io-global-header,
.io-server-control {
    position: relative;
    z-index: 1000 !important;
}
.io-server-menu {
    z-index: 1100 !important;
}
:is(.io-app-nav, .io-global-nav, .pifus-tabs-wrap, .pifus-summary-tabs, .io-kralaide-nav) {
    min-height: 43.2px;
    border-top: 1px solid var(--io-line);
    border-bottom: 0 !important;
    background: var(--io-deep) !important;
    background-image: none !important;
    box-shadow: none !important;
    opacity: 1 !important;
    isolation: isolate;
}
body.io-unified #app-root > header.glass-panel {
    border-bottom: 0 !important;
    background: var(--io-deep) !important;
    opacity: 1 !important;
    overflow: clip;
    isolation: isolate;
}
:is(.io-app-nav-inner, .io-global-nav-inner, .pifus-tabs, .pifus-summary-tabs, .io-kralaide-nav-inner) {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    max-width: 80rem;
    margin: 0;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding: 0.35rem 0.5rem;
    overflow-x: auto;
    justify-content: flex-start;
}
.pifus-tabs-wrap {
    padding-left: 0 !important;
    padding-right: 0 !important;
}
.pifus-summary-tabs {
    min-height: 43.2px;
    box-sizing: border-box;
}
:is(.io-app-link, .io-global-nav .tab-btn, .pifus-tabs .header-nav-btn, .pifus-summary-tab, .io-kralaide-nav button) {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    min-height: 2rem;
    padding: 0 0.8rem;
    border: 1px solid transparent;
    border-radius: 8px;
    background: transparent !important;
    color: var(--io-muted) !important;
    font-size: 0.75rem;
    font-weight: 800;
    text-decoration: none;
    white-space: nowrap;
}
:is(.io-app-link svg, .io-global-nav .tab-btn svg, .pifus-tabs .header-nav-btn svg, .pifus-tabs .header-nav-btn i, .pifus-summary-tab svg, .pifus-summary-tab i, .io-kralaide-nav button svg, .io-kralaide-nav button i) {
    display: inline-flex;
    flex: 0 0 1rem;
    align-items: center;
    justify-content: center;
    width: 1rem;
    height: 1rem;
    vertical-align: middle;
}
#app-root > main #sidebar-guide {
    position: sticky !important;
    top: calc(var(--pifus-header-height, 0px) + var(--pifus-tabs-height, 44px)) !important;
    z-index: 50 !important;
    background: var(--io-deep) !important;
    isolation: isolate;
}
:is(.io-app-link, .io-global-nav .tab-btn, .pifus-tabs .header-nav-btn, .pifus-summary-tab, .io-kralaide-nav button):hover,
:is(.io-app-link.is-active, .io-global-nav .tab-btn.bg-amber-500, .pifus-tabs .header-nav-btn.is-active, .pifus-summary-tab.is-active, .io-kralaide-nav button.is-active) {
    border-color: var(--io-line);
    background: var(--io-accent-soft) !important;
    color: var(--io-ink) !important;
}

/* Présentation garde le même gabarit dans Pifus et Kral'Aide */
:is(.pifus-tabs .header-nav-btn[data-target="presentation"], .io-kralaide-nav button[data-kralaide-tab="concept"]) {
    width: 8.35rem;
    min-width: 8.35rem;
    max-width: 8.35rem;
    min-height: 2rem;
    padding-inline: 0.8rem;
}

html.io-light body.io-unified :is(.io-app-nav, .io-global-nav, .pifus-tabs-wrap, .pifus-summary-tabs, .io-kralaide-nav) {
    background: #ffffff !important;
    background-image: none !important;
    border-color: #d8e0ea !important;
    box-shadow: none !important;
}
html.io-light body.io-unified #app-root > header.glass-panel {
    background: #ffffff !important;
}
html.io-light body.io-unified :is(.io-app-link, .io-global-nav .tab-btn, .pifus-tabs .header-nav-btn, .pifus-summary-tab, .io-kralaide-nav button):hover,
html.io-light body.io-unified :is(.io-app-link.is-active, .io-global-nav .tab-btn.bg-amber-500, .pifus-tabs .header-nav-btn.is-active, .pifus-summary-tab.is-active, .io-kralaide-nav button.is-active) {
    background: #e0f2fe !important;
    border-color: #cbd5e1 !important;
    color: #0f172a !important;
}

@media (max-width: 767px) {
    :is(.io-app-link-label, .io-portal-tab-label, .io-kralaide-nav button span, .pifus-tabs .tab-label, .pifus-summary-tab .sidebar-tab-label) {
        display: none !important;
    }
    :is(.io-app-link, .io-global-nav .tab-btn, .pifus-tabs .header-nav-btn, .pifus-summary-tab, .io-kralaide-nav button) {
        min-width: 2.5rem;
        width: 2.5rem;
        height: 2rem;
        min-height: 2rem;
        padding-inline: 0 !important;
        gap: 0 !important;
    }
    :is(.pifus-tabs .header-nav-btn[data-target="presentation"], .io-kralaide-nav button[data-kralaide-tab="concept"]) {
        width: 2.5rem !important;
        min-width: 2.5rem !important;
        max-width: 2.5rem !important;
        height: 2rem !important;
        min-height: 2rem !important;
        padding-inline: 0 !important;
    }
}