/* BusinessConnect — bloque de estilo de Pages/BusinessConnect/Componentes/ConnectSidebar.razor (verbatim). */
    .ce-sb {
        display: flex;
        flex-direction: column;
        width: 236px;
        flex-shrink: 0;
        height: 100%;
        background: #fff;
        border-right: 1px solid #e9eef6;
        transition: width .15s ease;
    }
    .ce-sb.ce-sb-colapsado { width: 64px; }
    .ce-sb.ce-sb-colapsado .ce-sb-label { display: none; }
    .ce-sb.ce-sb-colapsado .ce-sb-header { justify-content: center; }
    .ce-sb.ce-sb-colapsado .ce-sb-link,
    .ce-sb.ce-sb-colapsado .ce-sb-toggle,
    .ce-sb.ce-sb-colapsado .ce-sb-volver { justify-content: center; }

    .ce-sb-header {
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 16px 16px 14px;
        border-bottom: 1px solid #f0f4fb;
    }

    .ce-sb-logo {
        position: relative;
        width: 34px;
        height: 34px;
        border-radius: 8px;
        background: var(--em-cobalt, #185FA5);
        color: #fff;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 15px;
        flex-shrink: 0;
    }
    .ce-sb-estado {
        position: absolute;
        width: 9px;
        height: 9px;
        border-radius: 50%;
        bottom: -2px;
        right: -2px;
        border: 1.5px solid #fff;
    }
    .ce-sb-estado-ok { background: #16a34a; }
    .ce-sb-estado-off { background: #9ca3af; }

    .ce-sb-brand { display: flex; flex-direction: column; line-height: 1.15; white-space: nowrap; }
    .ce-sb-brand-top { font-size: 12.5px; color: #6b7280; font-weight: 600; }
    .ce-sb-brand-bottom { font-size: 15px; color: #1f2937; font-weight: 700; }

    .ce-sb-cerrar-movil { display: none; margin-left: auto; background: none; border: none; font-size: 16px; color: #6b7280; cursor: pointer; }

    .ce-sb-nav { flex: 1; overflow-y: auto; overflow-x: hidden; padding: 10px 10px 14px; }

    .ce-sb-seccion {
        font-size: 11px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: .03em;
        color: #9aa5b5;
        margin: 16px 10px 6px;
        white-space: nowrap;
    }
    .ce-sb-seccion:first-child { margin-top: 4px; }
    .ce-sb-colapsado .ce-sb-seccion { margin: 14px 0 6px; border-top: 1px solid #f0f4fb; padding-top: 10px; }
    .ce-sb-colapsado .ce-sb-seccion:first-child { border-top: none; padding-top: 0; }

    .ce-sb-link {
        position: relative;
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 9px 10px;
        border-radius: 8px;
        font-size: 13.5px;
        color: #374151;
        text-decoration: none;
        margin-bottom: 2px;
        white-space: nowrap;
        cursor: pointer;
    }
    .ce-sb-link i { width: 16px; text-align: center; color: #9aa5b5; font-size: 13px; flex-shrink: 0; }
    .ce-sb-link:hover { background: var(--em-cobalt-pale, #e6f1fb); }
    .ce-sb-link.active {
        background: var(--em-cobalt-pale, #e6f1fb);
        color: var(--em-cobalt, #185FA5);
        font-weight: 600;
    }
    .ce-sb-link.active i { color: var(--em-cobalt, #185FA5); }

    .ce-sb-badge {
        margin-left: auto;
        background: #d97706;
        color: #fff;
        font-size: 11px;
        font-weight: 700;
        line-height: 1;
        padding: 3px 6px;
        border-radius: 999px;
        min-width: 16px;
        text-align: center;
    }
    .ce-sb-dot {
        display: none;
        position: absolute;
        top: 6px;
        left: 24px;
        width: 7px;
        height: 7px;
        border-radius: 50%;
        background: #d97706;
        border: 1.5px solid #fff;
    }
    .ce-sb-colapsado .ce-sb-dot { display: block; }

    .ce-sb-footer { padding: 12px; border-top: 1px solid #f0f4fb; display: flex; flex-direction: column; gap: 2px; }
    .ce-sb-toggle, .ce-sb-volver {
        display: flex;
        align-items: center;
        gap: 8px;
        width: 100%;
        background: none;
        border: none;
        padding: 8px 10px;
        font-size: 13px;
        color: #6b7280;
        border-radius: 8px;
        cursor: pointer;
        white-space: nowrap;
    }
    .ce-sb-toggle:hover, .ce-sb-volver:hover { background: #f3f4f6; color: #374151; }

    .ce-sb-overlay { display: none; }

    @media (max-width: 900px) {
        .ce-sb {
            position: fixed;
            left: 0; top: 0; bottom: 0;
            z-index: 60;
            width: 236px !important;
            transform: translateX(-100%);
            transition: transform .2s ease;
            box-shadow: 2px 0 12px rgba(0,0,0,.08);
        }
        .ce-sb.ce-sb-abierto { transform: translateX(0); }
        /* En movil el colapso a solo-iconos no aplica: siempre se ve completo. */
        .ce-sb.ce-sb-colapsado .ce-sb-label { display: revert; }
        .ce-sb.ce-sb-colapsado .ce-sb-header { justify-content: flex-start; }
        .ce-sb.ce-sb-colapsado .ce-sb-link,
        .ce-sb.ce-sb-colapsado .ce-sb-toggle,
        .ce-sb.ce-sb-colapsado .ce-sb-volver { justify-content: flex-start; }
        .ce-sb.ce-sb-colapsado .ce-sb-dot { display: none; }
        .ce-sb-toggle { display: none; }
        .ce-sb-cerrar-movil { display: block; }
        .ce-sb-overlay {
            display: block;
            position: fixed;
            inset: 0;
            background: rgba(15,23,42,.35);
            z-index: 55;
        }
    }